diff --git a/lib/selectors/selectorPlaceholders.scss b/lib/selectors/selectorPlaceholders.scss index fa3736f7c..ce5c04d4b 100644 --- a/lib/selectors/selectorPlaceholders.scss +++ b/lib/selectors/selectorPlaceholders.scss @@ -1382,15 +1382,6 @@ .disabled-2G98Nl { @extend %tabBarItemDisabled !optional; } -.header-2F5_LB { - @extend %tabBarHeader !optional; -} -.separator-2N511j { - @extend %tabBarSeparator !optional; -} -.tabBar-3DfKkN { - @extend %headerBarTabBar !optional; -} .premiumLabel-3HPvdB { @extend %premiumLabel !optional; } @@ -3571,6 +3562,15 @@ pre { .selectedBackground-1t6xXq { @extend %settingsSidebarScrollerSelectedBackground !optional; } +.header-2F5_LB { + @extend %settingsHeader !optional; +} +.headerText-10ez_d { + @extend %settingsHeaderText !optional; +} +.separator-2N511j { + @extend %settingsSeparator !optional; +} .socialLinks-3ywLUf { @extend %settingsSocialLinks !optional; } diff --git a/src/settings/channelSettings.scss b/src/settings/channelSettings.scss index 24768ecdc..ff1ee9ebc 100644 --- a/src/settings/channelSettings.scss +++ b/src/settings/channelSettings.scss @@ -1,5 +1,48 @@ /* CHANNEL SETTINGS */ +// HEADER +%settingsSidebar { + %settingsHeader { + &:has(.category-CysNYv) { + display: grid; + grid-template-columns: 1fr auto 1fr; + grid-template-rows: .5fr .5fr; + padding: 20px 0; + } + &::before { + grid-column: 1 / 2; + grid-row: 2 / 3; + } + &:after { + grid-column: 3 / 4; + grid-row: 2 / 3; + } + } +} +%settingsHeaderText { + &:has(.category-CysNYv) { + grid-column: 2 / 3; + grid-row: 1 / 3; + display: grid; + grid-template-columns: min-content 1fr; + grid-template-rows: 1.5fr 1fr; + column-gap: 2px; + justify-items: center; + } +} +.category-CysNYv { + color: $main-color !important; + margin: 0; + grid-column: 1 / 3; + grid-row: 1 / 2; + &::before { + content: '< '; + } + &:after { + content: ' >'; + } +} + // PERMISSIONS .group-LWHoGI { border: 1px solid hsla(0, 0%, 100%, 0.07); diff --git a/src/settings/sidebar.scss b/src/settings/sidebar.scss index 9167f3e10..aca1acf4d 100644 --- a/src/settings/sidebar.scss +++ b/src/settings/sidebar.scss @@ -22,16 +22,19 @@ } %settingsSide { padding: 30px 0; - %tabBarHeader { + %settingsHeader { color: $main-color; font-weight: 700; } - %tabBarSeparator { + %settingsSeparator { background: hsla(0, 0%, 100%, 0.07); + &:has(+ %settingsHeader) { + display: none; + } } } %settingsSidebar { - %tabBarHeader { + %settingsHeader { padding-top: 20px; display: flex; align-items: center; @@ -56,15 +59,6 @@ text-overflow: ellipsis; } } - %tabBarItem { - &:nth-child(6), - &:nth-child(13), - &:nth-child(25) { - +%tabBarSeparator { - display: none; - } - } - } } %standardSidebarView { %settingsSidebar {