From 1201927a588330271ae9b97c4c4cdb36208a8e53 Mon Sep 17 00:00:00 2001 From: MANOHARI Date: Wed, 12 Nov 2025 12:08:22 +0530 Subject: [PATCH] fix: update announcement banner to use theme colors - Replace plain white background with theme-based gradient - Use primary color (#ff914d) and primary-light for attractive gradient - Add proper text color (white) for better contrast and visibility - Add border-bottom using primary-dark for visual separation - Support both light and dark themes - Style links within banner for consistency - Make banner more noticeable and consistent with site design --- src/css/custom.css | 38 ++++++++++++++++++++++++++------------ 1 file changed, 26 insertions(+), 12 deletions(-) diff --git a/src/css/custom.css b/src/css/custom.css index b40fda1aa..8e03bb3c9 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -689,20 +689,34 @@ td img { } div[class^="announcementBar_"] { - --site-announcement-bar-stripe-color1: hsl( - var(--site-primary-hue-saturation) 88% - ); - --site-announcement-bar-stripe-color2: hsl( - var(--site-primary-hue-saturation) 95% - ); - background: repeating-linear-gradient( - 35deg, - var(--site-announcement-bar-stripe-color1), - var(--site-announcement-bar-stripe-color1) 20px, - var(--site-announcement-bar-stripe-color2) 10px, - var(--site-announcement-bar-stripe-color2) 40px + background: linear-gradient( + 135deg, + var(--ifm-color-primary) 0%, + var(--ifm-color-primary-light) 100% ); + color: #ffffff; font-weight: bold; + border-bottom: 2px solid var(--ifm-color-primary-dark); +} + +div[class^="announcementBar_"] a { + color: #ffffff; + text-decoration: underline; +} + +div[class^="announcementBar_"] a:hover { + color: var(--ifm-color-primary-lightest); + text-decoration: underline; +} + +html[data-theme="dark"] div[class^="announcementBar_"] { + background: linear-gradient( + 135deg, + var(--ifm-color-primary) 0%, + var(--ifm-color-primary-dark) 100% + ); + color: #ffffff; + border-bottom: 2px solid var(--ifm-color-primary-darker); } .list-disc > a {