From bf2f18f023586379c85d5a8535f88618810e8755 Mon Sep 17 00:00:00 2001 From: poorvasingh1610 Date: Thu, 21 May 2026 16:15:08 +0530 Subject: [PATCH 1/3] fix: change TOC link color to #B1E2C5 for issue #1593 --- src/css/custom.css | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/src/css/custom.css b/src/css/custom.css index 8eb629ca..e09edf06 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -2040,3 +2040,16 @@ html[data-theme="dark"] { scrollbar-width: thin !important; scrollbar-color: #334155 transparent !important; } + +/* ===== SECTION 15: TABLE OF CONTENTS COLOR ===== */ +/* Issue #1593: Change TOC link color to match theme */ +.table-of-contents__link:hover, +.table-of-contents__link--active, +.table-of-contents__link--active:hover { + color: #B1E2C5; +} + +[data-theme="dark"] .table-of-contents__link:hover, +[data-theme="dark"] .table-of-contents__link--active { + color: #B1E2C5; +} \ No newline at end of file From 80a60e6fd6184f829631ea6f7f9595cc9049cde0 Mon Sep 17 00:00:00 2001 From: poorvasingh1610 Date: Fri, 22 May 2026 15:44:54 +0530 Subject: [PATCH 2/3] fix: apply #B1E2C5 color to blog author names for issue #1593 --- src/css/custom.css | 172 +++++++++++++++++++++++++++------------------ 1 file changed, 105 insertions(+), 67 deletions(-) diff --git a/src/css/custom.css b/src/css/custom.css index e09edf06..baba3a8c 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -121,7 +121,7 @@ a.menu__link.menu__link--active div span:first-child { /* ================= SECTION 4: CUSTOM SIDEBAR CATEGORY THEMES ================= */ /* GitHub theme */ -.custom-sidebar-github>.menu__list-item-collapsible>.menu__link { +.custom-sidebar-github > .menu__list-item-collapsible > .menu__link { background: linear-gradient(135deg, #24292e, #586069); color: white; border-radius: 8px; @@ -130,7 +130,7 @@ a.menu__link.menu__link--active div span:first-child { } /* Python theme */ -.custom-sidebar-python>.menu__list-item-collapsible>.menu__link { +.custom-sidebar-python > .menu__list-item-collapsible > .menu__link { background: linear-gradient(135deg, #3776ab, #ffd43b); color: white; border-radius: 8px; @@ -139,7 +139,7 @@ a.menu__link.menu__link--active div span:first-child { } /* SQL theme */ -.custom-sidebar-sql>.menu__list-item-collapsible>.menu__link { +.custom-sidebar-sql > .menu__list-item-collapsible > .menu__link { background: linear-gradient(135deg, #336791, #4479a1); color: white; border-radius: 8px; @@ -148,7 +148,7 @@ a.menu__link.menu__link--active div span:first-child { } /* Technical theme */ -.custom-sidebar-technical>.menu__list-item-collapsible>.menu__link { +.custom-sidebar-technical > .menu__list-item-collapsible > .menu__link { background: linear-gradient(135deg, #ff6b6b, #ee5a24); color: white; border-radius: 8px; @@ -157,9 +157,9 @@ a.menu__link.menu__link--active div span:first-child { } /* Custom subcategory styling */ -.custom-sidebar-setup>.menu__list-item-collapsible>.menu__link, -.custom-sidebar-basics>.menu__list-item-collapsible>.menu__link, -.custom-sidebar-maintainer>.menu__list-item-collapsible>.menu__link { +.custom-sidebar-setup > .menu__list-item-collapsible > .menu__link, +.custom-sidebar-basics > .menu__list-item-collapsible > .menu__link, +.custom-sidebar-maintainer > .menu__list-item-collapsible > .menu__link { background: rgba(36, 41, 46, 0.1); border-left: 3px solid #24292e; padding-left: 16px; @@ -167,12 +167,12 @@ a.menu__link.menu__link--active div span:first-child { } /* Hover effects for all custom categories */ -.custom-sidebar-github>.menu__list-item-collapsible>.menu__link:hover, -.custom-sidebar-python>.menu__list-item-collapsible>.menu__link:hover, -.custom-sidebar-sql>.menu__list-item-collapsible>.menu__link:hover, -.custom-sidebar-nextjs>.menu__list-item-collapsible>.menu__link:hover, -.custom-sidebar-gsa>.menu__list-item-collapsible>.menu__link:hover, -.custom-sidebar-technical>.menu__list-item-collapsible>.menu__link:hover { +.custom-sidebar-github > .menu__list-item-collapsible > .menu__link:hover, +.custom-sidebar-python > .menu__list-item-collapsible > .menu__link:hover, +.custom-sidebar-sql > .menu__list-item-collapsible > .menu__link:hover, +.custom-sidebar-nextjs > .menu__list-item-collapsible > .menu__link:hover, +.custom-sidebar-gsa > .menu__list-item-collapsible > .menu__link:hover, +.custom-sidebar-technical > .menu__list-item-collapsible > .menu__link:hover { transform: translateX(4px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); transition: all 0.3s ease; @@ -251,7 +251,7 @@ html[data-theme="dark"] .menu__link--active::after { } /* ======== SECTION 7 : Adjust individual navbar items ==========*/ -.navbar__items>.navbar__item { +.navbar__items > .navbar__item { padding: 0.2rem 0.3rem !important; margin: 0 !important; } @@ -282,7 +282,6 @@ html[data-theme="dark"] .menu__link--active::after { /* Ensure dropdowns are visible on big screens */ @media (min-width: 1300px) { - .navbar__item.dropdown, .navbar__item:has(.dropdown-content) { position: relative !important; @@ -457,7 +456,6 @@ body { /* ===== SECTION 10: DESKTOP NAVBAR ENHANCEMENTS ===== */ @media (min-width: 1300px) { - /* Better spacing for desktop navbar */ .navbar__inner { max-width: 1400px; @@ -482,7 +480,10 @@ body { * Hide all navbar items on small screens except the toggle, brand, * and the Clerk auth control. */ - .navbar__items .navbar__item:not(.navbar__toggle):not(.navbar__brand):not( :has(#firebase-auth-github-navbar)) { + .navbar__items + .navbar__item:not(.navbar__toggle):not(.navbar__brand):not( + :has(#firebase-auth-github-navbar) + ) { display: none !important; } @@ -687,8 +688,8 @@ body { } /* Prevent grid content from forcing overflow in the dropdown rows */ -.dropdown__menu .grid>.col-span-2, -.dropdown-content .grid>.col-span-2 { +.dropdown__menu .grid > .col-span-2, +.dropdown-content .grid > .col-span-2 { min-width: 0 !important; /* allow the icon column to shrink inside the 3-col grid */ } @@ -711,8 +712,8 @@ body { } /* Add breathing room between the left label and the vertical separator */ -.dropdown__menu .grid>.border-r.col-span-1, -.dropdown-content .grid>.border-r.col-span-1 { +.dropdown__menu .grid > .border-r.col-span-1, +.dropdown-content .grid > .border-r.col-span-1 { padding-right: 0.5rem !important; } @@ -873,9 +874,11 @@ html.theme-light .text-gray-900 { /* Ensure the specific block is forced light in light mode */ html[data-theme="light"] .interview-prep-page .technical-outer { - background-image: linear-gradient(135deg, - #eff6ff 0%, - #f8fafc 100%) !important; + background-image: linear-gradient( + 135deg, + #eff6ff 0%, + #f8fafc 100% + ) !important; background-color: #ffffff !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; @@ -886,9 +889,11 @@ html[data-theme="light"] .interview-prep-page .technical-outer { /* Companies tab: use white gradients in light mode and remove overlays */ [data-theme="light"] .company-outer { - background-image: linear-gradient(135deg, - #ffffff 0%, - #f8fafc 100%) !important; + background-image: linear-gradient( + 135deg, + #ffffff 0%, + #f8fafc 100% + ) !important; background-color: #ffffff !important; color: #0f172a !important; isolation: isolate !important; @@ -898,7 +903,7 @@ html[data-theme="light"] .interview-prep-page .technical-outer { } /* hide the subtle pattern overlay added inside the component */ -[data-theme="light"] .company-outer>.absolute.inset-0, +[data-theme="light"] .company-outer > .absolute.inset-0, [data-theme="light"] .company-outer .absolute.inset-0.opacity-5 { display: none !important; background: none !important; @@ -982,12 +987,14 @@ html { /* ===== FOOTER BACKGROUND PROTECTION ===== */ /* Ensure footer maintains its gradient background in dark mode */ [data-theme="dark"] .enhanced-footer { - background: linear-gradient(135deg, - #0f0f23 0%, - #1a1a2e 25%, - #16213e 50%, - #0f3460 75%, - #533483 100%) !important; + background: linear-gradient( + 135deg, + #0f0f23 0%, + #1a1a2e 25%, + #16213e 50%, + #0f3460 75%, + #533483 100% + ) !important; color: #e2e8f0 !important; } @@ -1003,17 +1010,22 @@ html { /* ===== STEP 6: MAXIMUM SPECIFICITY PROTECTION ===== */ /* Override the exact problematic global rule with same specificity */ -[data-theme="dark"] body:not(:has(.community-page)) .enhanced-footer .container { +[data-theme="dark"] + body:not(:has(.community-page)) + .enhanced-footer + .container { background-color: transparent !important; } [data-theme="dark"] body:not(:has(.community-page)) .enhanced-footer { - background: linear-gradient(135deg, - #0f0f23 0%, - #1a1a2e 25%, - #16213e 50%, - #0f3460 75%, - #533483 100%) !important; + background: linear-gradient( + 135deg, + #0f0f23 0%, + #1a1a2e 25%, + #16213e 50%, + #0f3460 75%, + #533483 100% + ) !important; color: #e2e8f0 !important; } @@ -1035,14 +1047,15 @@ html { /* ===== REMOVE THEME TOGGLE FROM MOBILE SIDEBAR AS THERE IS ONE ON THE NAVBAR ===== */ @media (max-width: 1200px) { - /* Aggressively hide theme toggle in mobile sidebar */ - .navbar-sidebar__brand button:not(.navbar-sidebar__close):not([class*="close"]), + .navbar-sidebar__brand + button:not(.navbar-sidebar__close):not([class*="close"]), .navbar-sidebar__brand .colorModeToggle, .navbar-sidebar .colorModeToggle, .navbar-sidebar__brand button[class*="colorModeToggle"], .navbar-sidebar button[class*="colorModeToggle"], - .navbar-sidebar__brand .clean-btn[class*="toggle"]:not(.navbar-sidebar__close), + .navbar-sidebar__brand + .clean-btn[class*="toggle"]:not(.navbar-sidebar__close), .navbar-sidebar .clean-btn[class*="toggle"]:not(.navbar-sidebar__close), .navbar-sidebar__brand [class*="toggle_"]:not(.navbar-sidebar__close), .navbar-sidebar [class*="toggle_"]:not(.navbar-sidebar__close), @@ -1114,7 +1127,6 @@ html { /* Mobile-only visibility & spacing fixes for Tutorials icons (320–768px) */ @media screen and (max-width: 768px) { - /* Ensure the label + icons row inside Docs dropdown uses the full width */ .navbar-sidebar .grid, .navbar-sidebar .dropdown__menu .grid, @@ -1127,12 +1139,12 @@ html { } /* So the icon column doesn't get clipped in the 3-col layout */ - .navbar-sidebar .grid>.col-span-2 { + .navbar-sidebar .grid > .col-span-2 { min-width: 0 !important; } /* Tighten label space and drop the border on very small screens */ - .navbar-sidebar .grid>.border-r.col-span-1 { + .navbar-sidebar .grid > .border-r.col-span-1 { border-right: 0 !important; padding-right: 0.25rem !important; font-weight: 600; @@ -1177,7 +1189,7 @@ html { } /* Add vertical space between Tutorials, Courses, Interview Prep blocks */ - .navbar-sidebar .dropdown__menu>.grid { + .navbar-sidebar .dropdown__menu > .grid { padding: 1rem 0 !important; margin: 1rem 0 !important; } @@ -1511,7 +1523,7 @@ html { flex-shrink: 0; } -.algolia-sitesearch-navbar .sitesearch-button .keyboard-shortcut>* { +.algolia-sitesearch-navbar .sitesearch-button .keyboard-shortcut > * { min-width: 0 !important; height: auto !important; padding: 0 !important; @@ -1652,8 +1664,8 @@ html { padding-right: var(--ifm-navbar-padding-horizontal) !important; } -.navbar>.container, -.navbar>.container-fluid { +.navbar > .container, +.navbar > .container-fluid { max-width: none !important; width: 100% !important; padding: 0 !important; @@ -1699,12 +1711,16 @@ main { right: 0; bottom: 0; background: - radial-gradient(circle at 20% 30%, + radial-gradient( + circle at 20% 30%, rgba(99, 102, 241, 0.08) 0%, - transparent 40%), - radial-gradient(circle at 80% 70%, + transparent 40% + ), + radial-gradient( + circle at 80% 70%, rgba(168, 85, 247, 0.06) 0%, - transparent 45%); + transparent 45% + ); pointer-events: none; } @@ -1756,7 +1772,7 @@ a { /* ================= MISCELLANEOUS ================= */ /* Fix Home icon alignment with text in breadcrumbs [Docs] */ -.theme-doc-breadcrumbs a.breadcrumbs__link>svg { +.theme-doc-breadcrumbs a.breadcrumbs__link > svg { display: inline-block; } @@ -1871,9 +1887,11 @@ html[data-theme="light"] .bg-gradient-to-r.from-blue-50.to-purple-50 { /* Companies: force white/near-white surface in light mode for .company-outer */ html[data-theme="light"] .company-outer { - background-image: linear-gradient(135deg, - #ffffff 0%, - #f8fafc 100%) !important; + background-image: linear-gradient( + 135deg, + #ffffff 0%, + #f8fafc 100% + ) !important; background-color: #ffffff !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; @@ -1917,9 +1935,11 @@ html[data-theme="light"] a.company-tab-link { /* If any Tailwind gradient utility still applies, remove it for these containers in light mode */ html[data-theme="light"] .company-outer.bg-gradient-to-br, html[data-theme="light"] [data-slot="card-header"].bg-gradient-to-br { - background-image: linear-gradient(135deg, - #ffffff 0%, - #f8fafc 100%) !important; + background-image: linear-gradient( + 135deg, + #ffffff 0%, + #f8fafc 100% + ) !important; background-color: #ffffff !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; @@ -1954,7 +1974,7 @@ html[data-theme="light"] [data-slot="card-header"].bg-gradient-to-br { /* Issue #980: Fix inconsistent padding and margins across sections */ /* Standard section spacing: 2rem vertical, 1.5rem horizontal on smaller screens */ -main>div:not(.m-0) { +main > div:not(.m-0) { margin-top: 2rem; margin-bottom: 2rem; } @@ -1966,7 +1986,7 @@ main>div:not(.m-0) { /* Responsive: reduce spacing on mobile devices */ @media (max-width: 768px) { - main>div:not(.m-0) { + main > div:not(.m-0) { margin-top: 1.5rem; margin-bottom: 1.5rem; } @@ -2046,10 +2066,28 @@ html[data-theme="dark"] { .table-of-contents__link:hover, .table-of-contents__link--active, .table-of-contents__link--active:hover { - color: #B1E2C5; + color: #b1e2c5; } [data-theme="dark"] .table-of-contents__link:hover, [data-theme="dark"] .table-of-contents__link--active { - color: #B1E2C5; -} \ No newline at end of file + color: #b1e2c5; +} + +/* ===== SECTION 16: BLOG AUTHOR NAME COLOR ===== */ +/* Issue #1593: Change blog author name color to match theme */ +.avatar__intro .avatar__name a, +.authorDetails_1V9A .avatar__name a { + color: #b1e2c5; +} + +.avatar__intro .avatar__name a:hover, +.authorDetails_1V9A .avatar__name a:hover { + color: #b1e2c5; + opacity: 0.85; +} + +[data-theme="dark"] .avatar__intro .avatar__name a, +[data-theme="dark"] .authorDetails_1V9A .avatar__name a { + color: #b1e2c5; +} From 17e4f69a396dbc819017f7fdddcc41c0d431b6b7 Mon Sep 17 00:00:00 2001 From: poorvasingh1610 Date: Sun, 24 May 2026 00:23:47 +0530 Subject: [PATCH 3/3] fix: update TOC hover/active and author name color to #2e8555 for issue #1593 --- src/css/custom.css | 23 ++++++++++------------- 1 file changed, 10 insertions(+), 13 deletions(-) diff --git a/src/css/custom.css b/src/css/custom.css index baba3a8c..0418c21a 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -2062,32 +2062,29 @@ html[data-theme="dark"] { } /* ===== SECTION 15: TABLE OF CONTENTS COLOR ===== */ -/* Issue #1593: Change TOC link color to match theme */ +/* Issue #1593: Change TOC link color on hover/active */ .table-of-contents__link:hover, .table-of-contents__link--active, .table-of-contents__link--active:hover { - color: #b1e2c5; + color: #2e8555; + font-weight: normal; + text-decoration: none; } [data-theme="dark"] .table-of-contents__link:hover, [data-theme="dark"] .table-of-contents__link--active { - color: #b1e2c5; + color: #2e8555; + font-weight: normal; + text-decoration: none; } - /* ===== SECTION 16: BLOG AUTHOR NAME COLOR ===== */ -/* Issue #1593: Change blog author name color to match theme */ +/* Issue #1593: Change blog author name color to #2e8555 */ .avatar__intro .avatar__name a, .authorDetails_1V9A .avatar__name a { - color: #b1e2c5; -} - -.avatar__intro .avatar__name a:hover, -.authorDetails_1V9A .avatar__name a:hover { - color: #b1e2c5; - opacity: 0.85; + color: #2e8555; } [data-theme="dark"] .avatar__intro .avatar__name a, [data-theme="dark"] .authorDetails_1V9A .avatar__name a { - color: #b1e2c5; + color: #2e8555; }