agw/overleaf-cep
1
0
Fork 0
mirror of https://github.com/yu-i-i/overleaf-cep.git synced 2026-11-12 13:13:45 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #24260 from overleaf/mj-ide-rail-selected-states

Browse Source 
[web] Editor redesign: Update selected state for rail tabs

GitOrigin-RevId: 4ce868c62a53355f8271db32884db0b2ed985d60
This commit is contained in:
Mathias Jakobsen
2025-03-14 09:05:00 +00:00
committed by Copybot
parent 971c63a636
commit e6371ec197
1 changed files with 10 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
services/web/frontend/stylesheets/bootstrap-5/pages/editor/rail.scss
+10 -10
View File
@@ -2,8 +2,8 @@
--ide-rail-background: var(--bg-dark-primary); --ide-rail-background: var(--bg-dark-primary);
--ide-rail-color: var(--content-primary-dark); --ide-rail-color: var(--content-primary-dark);
--ide-rail-link-background: var(--bg-dark-primary); --ide-rail-link-background: var(--bg-dark-primary);
--ide-rail-link-active-background: var(--bg-dark-secondary); --ide-rail-link-active-color: var(--green-10);
--ide-rail-link-active-indicator-background: var(--white); --ide-rail-link-active-background: var(--green-70);
--ide-rail-border-colour: var(--border-divider-dark); --ide-rail-border-colour: var(--border-divider-dark);
--ide-rail-header-subdued-button-color: var(--content-primary-dark); --ide-rail-header-subdued-button-color: var(--content-primary-dark);
--ide-rail-header-subdued-button-hover-background: var(--bg-dark-tertiary); --ide-rail-header-subdued-button-hover-background: var(--bg-dark-tertiary);
@@ -11,10 +11,10 @@
@include theme('light') { @include theme('light') {
--ide-rail-background: #fff; --ide-rail-background: #fff;
--ide-rail-color: var(--neutral-90); --ide-rail-color: var(--content-primary);
--ide-rail-link-background: #fff; --ide-rail-link-background: #fff;
--ide-rail-link-active-background: var(--neutral-10); --ide-rail-link-active-color: var(--green-70);
--ide-rail-link-active-indicator-background: var(--neutral-90); --ide-rail-link-active-background: var(--bg-accent-03);
--ide-rail-border-colour: var(--border-divider); --ide-rail-border-colour: var(--border-divider);
--ide-rail-header-subdued-button-color: var(--content-primary); --ide-rail-header-subdued-button-color: var(--content-primary);
--ide-rail-header-subdued-button-hover-background: var(--bg-light-tertiary); --ide-rail-header-subdued-button-hover-background: var(--bg-light-tertiary);
@@ -64,7 +64,8 @@
overflow-y: hidden; overflow-y: hidden;
&:hover, &:hover,
&:visited { &:visited,
&:focus {
color: var(--ide-rail-color); color: var(--ide-rail-color);
} }
@@ -74,7 +75,7 @@
} }
&.open-rail { &.open-rail {
color: var(--ide-rail-color); color: var(--ide-rail-link-active-color);
background-color: var(--ide-rail-link-active-background); background-color: var(--ide-rail-link-active-background);
&::after { &::after {
@@ -88,9 +89,8 @@
box-sizing: border-box; box-sizing: border-box;
width: 24px; width: 24px;
height: $indicator-height * 2; height: $indicator-height * 2;
border: $indicator-height solid border: $indicator-height solid var(--ide-rail-link-active-color);
var(--ide-rail-link-active-indicator-background); background-color: var(--ide-rail-link-active-color);
background-color: var(--ide-rail-link-active-indicator-background);
} }
} }