diff --git a/.eleventy.js b/.eleventy.js index 50dd79832f..e4314b5837 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -738,13 +738,13 @@ module.exports = function(eleventyConfig) { if (!showCloud && !showSelfHosted) return ''; let html = `
`; if (showCloud) { - html += `
`; + html += `
`; html += `Cloud`; html += `${cloudLabel}`; html += `
`; } if (showSelfHosted) { - html += `
`; + html += `
`; html += `Self-Hosted`; html += `${selfHostedLabel}`; html += `
`; diff --git a/src/_includes/components/tier-badges.njk b/src/_includes/components/tier-badges.njk index c8ca413437..65b36b175a 100644 --- a/src/_includes/components/tier-badges.njk +++ b/src/_includes/components/tier-badges.njk @@ -3,13 +3,13 @@ {% if showTierCloud or showTierSelfHosted %}
{% if showTierCloud %} -
+
Cloud {{ tierCloud }}
{% endif %} {% if showTierSelfHosted %} -
+
Self-Hosted {{ tierSelfHosted }}
diff --git a/src/css/style.css b/src/css/style.css index 644ff10d69..0470acb493 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -1674,6 +1674,18 @@ h4:hover .header-anchor::before { line-height: 1rem; } +.ff-tier-badge.ff-tooltip:hover:after, +.ff-tier-badge.ff-tooltip:hover:before { + transition-delay: 0.5s; +} + +.ff-tier-badge.ff-tooltip:hover:after { + font-size: 0.75rem; + min-width: auto; + white-space: nowrap; + padding: 4px 8px; +} + .ff-tier-badge__label { @apply px-2.5 py-0.5 text-gray-500 font-medium bg-gray-100 border border-r-0 border-gray-200 rounded-l; }