mirror of
https://github.com/yu-i-i/overleaf-cep.git
synced 2026-05-23 17:19:37 +02:00
Add dark mode for cookie-banner (#30559)
* feat: adding dark mode for cookie-banner * feat: move most relevant cookie-banner styles to footer * fix: consistent naming for css vars, and scoping dark mode to only applicable pages for cookie Banner * fix: swapping to themed border var GitOrigin-RevId: 7de36cdeae6802a96a6983c739ab6fc95dee7e28
This commit is contained in:
committed by
Copybot
parent
2b39beab80
commit
a204f30d0f
@@ -3,6 +3,33 @@
|
||||
// Max width of the sidebar
|
||||
$footer-width-delta: 320px;
|
||||
|
||||
@mixin cookie-banner-light {
|
||||
--cookie-banner-background: var(--bg-light-primary);
|
||||
--cookie-banner-content: var(--content-primary);
|
||||
--cookie-banner-link: var(--link-ui);
|
||||
}
|
||||
|
||||
@mixin cookie-banner-dark {
|
||||
--cookie-banner-background: var(--bg-dark-secondary);
|
||||
--cookie-banner-content: var(--content-primary-dark);
|
||||
--cookie-banner-link: var(--link-ui-dark);
|
||||
}
|
||||
|
||||
:root {
|
||||
.cookie-banner {
|
||||
@include cookie-banner-light;
|
||||
}
|
||||
|
||||
@include theme('default') {
|
||||
.ide-redesign-main,
|
||||
.project-ds-nav-page {
|
||||
.cookie-banner {
|
||||
@include cookie-banner-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin footer-container-up($bp) {
|
||||
$size: map.get($grid-breakpoints, $bp);
|
||||
|
||||
@@ -373,9 +400,10 @@ footer.site-footer {
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 100;
|
||||
color: var(--content-secondary);
|
||||
background: var(--bg-light-secondary);
|
||||
box-shadow: 0 -5px 8px 0 #0000001a;
|
||||
background-color: var(--cookie-banner-background);
|
||||
color: var(--cookie-banner-content);
|
||||
|
||||
.cookie-banner-actions {
|
||||
padding-top: var(--spacing-04);
|
||||
@@ -398,7 +426,7 @@ footer.site-footer {
|
||||
|
||||
.cookie-banner-content a,
|
||||
.cookie-banner-actions .btn-link {
|
||||
color: var(--link-ui);
|
||||
color: var(--cookie-banner-link);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -281,7 +281,7 @@ body {
|
||||
|
||||
> * {
|
||||
@include media-breakpoint-up(md) {
|
||||
border-left: 1px solid var(--border-divider);
|
||||
border-left: 1px solid var(--border-divider-themed);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -299,7 +299,6 @@ body {
|
||||
|
||||
.cookie-banner {
|
||||
position: static;
|
||||
background-color: var(--bg-light-primary);
|
||||
|
||||
// Remove the parts of the shadow that stick out of the sides
|
||||
clip-path: inset(-13px 0 0 0);
|
||||
|
||||
Reference in New Issue
Block a user