From c92736acc0593bc55d3bf8f6e4d2eef0a502604d Mon Sep 17 00:00:00 2001 From: simurai Date: Mon, 24 Feb 2020 20:53:29 +0900 Subject: [PATCH 01/13] Update .UnderlineNav --- src/navigation/underline-nav.scss | 34 +++++++++++-------------------- 1 file changed, 12 insertions(+), 22 deletions(-) diff --git a/src/navigation/underline-nav.scss b/src/navigation/underline-nav.scss index 248ed0b9b2..96f3a1e166 100644 --- a/src/navigation/underline-nav.scss +++ b/src/navigation/underline-nav.scss @@ -2,7 +2,7 @@ display: flex; overflow-x: auto; overflow-y: hidden; - border-bottom: $border; + box-shadow: inset 0 -1px 0 $border-color; justify-content: space-between; } @@ -11,50 +11,35 @@ } .UnderlineNav-item { - padding: $spacer-3 $spacer-2; - margin-right: $spacer-3; + padding: $spacer-3; font-size: $body-font-size; line-height: $lh-default; - color: $text-gray; + color: $text-black; text-align: center; + background-color: transparent; border: 0; // stylelint-disable-next-line primer/borders border-bottom: 2px $border-style transparent; + transition: border-bottom-color 0.36s ease-in; &:hover, &:focus { - color: $text-gray-dark; text-decoration: none; border-bottom-color: $border-gray-dark; - transition: 0.2s ease; - - .UnderlineNav-octicon { - color: $text-gray-light; - } + transition: border-bottom-color 0.12s ease-out; } &.selected, &[role=tab][aria-selected=true], &[aria-current] { - font-weight: $font-weight-bold; - color: $text-gray-dark; // stylelint-disable-next-line primer/borders - border-bottom-color: $orange-600; - - .UnderlineNav-octicon { - color: $text-gray-light; - } + border-bottom-color: $orange-500; } } .UnderlineNav--right { justify-content: flex-end; - .UnderlineNav-item { - margin-right: 0; - margin-left: $spacer-3; - } - .UnderlineNav-actions { flex: 1 1 auto; } @@ -69,10 +54,15 @@ } .UnderlineNav-octicon { + margin-right: $spacer-1; // stylelint-disable-next-line primer/colors color: $gray-400; } +.UnderlineNav .Counter { + margin-left: $spacer-1; +} + .UnderlineNav-container { display: flex; justify-content: space-between; From a6107245e7d214d4d80d236c915df80336274160 Mon Sep 17 00:00:00 2001 From: simurai Date: Mon, 24 Feb 2020 22:03:23 +0900 Subject: [PATCH 02/13] Update menu --- src/navigation/menu.scss | 72 ++++++++++++++++------------------------ 1 file changed, 28 insertions(+), 44 deletions(-) diff --git a/src/navigation/menu.scss b/src/navigation/menu.scss index cc7e858f24..fc20b2b883 100644 --- a/src/navigation/menu.scss +++ b/src/navigation/menu.scss @@ -3,54 +3,47 @@ // A menu on the side of a page, defaults to left side. e.g. github.com/about .menu { - // stylelint-disable-next-line primer/spacing - margin-bottom: 15px; + margin-bottom: $spacer-3; list-style: none; background-color: $bg-white; - border: $border-width $border-style $border-gray-dark; + border: $border; border-radius: $border-radius; } .menu-item { position: relative; display: block; - padding: $spacer-2 10px; - border-bottom: $border; + padding: $spacer-1 $spacer-3; + line-height: 23px; + color: $text-black; + border-bottom: $border-width $border-style $border-gray-light; &:first-child { border-top: 0; - // stylelint-disable-next-line primer/borders - border-top-left-radius: 2px; - // stylelint-disable-next-line primer/borders - border-top-right-radius: 2px; + border-top-left-radius: $border-radius; + border-top-right-radius: $border-radius; - // stylelint-disable-next-line primer/borders - &::before { border-top-left-radius: 2px; } + &::before { border-top-left-radius: $border-radius; } } &:last-child { border-bottom: 0; - // stylelint-disable-next-line primer/borders - border-bottom-right-radius: 2px; - // stylelint-disable-next-line primer/borders - border-bottom-left-radius: 2px; + border-bottom-right-radius: $border-radius; + border-bottom-left-radius: $border-radius; - // stylelint-disable-next-line primer/borders - &::before { border-bottom-left-radius: 2px; } + &::before { border-bottom-left-radius: $border-radius; } } &:hover { text-decoration: none; - background-color: $bg-gray; + background-color: $gray-100; } &.selected, &[aria-selected=true], &[aria-current] { - font-weight: $font-weight-bold; - color: $text-gray-dark; cursor: default; - background-color: $bg-white; + background-color: $orange-000; &::before { position: absolute; @@ -60,22 +53,20 @@ width: 2px; content: ""; // stylelint-disable-next-line primer/colors - background-color: $orange-600; + background-color: $orange-500; } } .octicon { width: 16px; - // stylelint-disable-next-line primer/spacing - margin-right: 5px; - color: $text-gray-dark; + margin-right: $spacer-2; + color: $gray-400; text-align: center; } .Counter { float: right; - // stylelint-disable-next-line primer/spacing - margin-left: 5px; + margin-left: $spacer-1; } .menu-warning { @@ -87,7 +78,7 @@ .avatar { float: left; // stylelint-disable-next-line primer/spacing - margin-right: 5px; + margin-right: $spacer-1; } &.alert { @@ -99,35 +90,28 @@ .menu-heading { display: block; - padding: $spacer-2 10px; margin-top: 0; margin-bottom: 0; + padding: $spacer-1 $spacer-3; + line-height: 23px; // stylelint-disable-next-line primer/typography - font-size: 13px; - font-weight: $font-weight-bold; + font-weight: 500; // stylelint-disable-next-line primer/typography - line-height: 20px; - color: $text-gray; - // stylelint-disable-next-line primer/colors - background-color: darken($gray-100, 1%); - border-bottom: $border; + color: $text-black; + border-bottom: $border-width $border-style $border-gray-light; &:hover { text-decoration: none; } &:first-child { - // stylelint-disable-next-line primer/borders - border-top-left-radius: 2px; - // stylelint-disable-next-line primer/borders - border-top-right-radius: 2px; + border-top-left-radius: $border-radius; + border-top-right-radius: $border-radius; } &:last-child { border-bottom: 0; - // stylelint-disable-next-line primer/borders - border-bottom-right-radius: 2px; - // stylelint-disable-next-line primer/borders - border-bottom-left-radius: 2px; + border-bottom-right-radius: $border-radius; + border-bottom-left-radius: $border-radius; } } From cd76c84b8251f8d45183568d1412def455957a93 Mon Sep 17 00:00:00 2001 From: simurai Date: Mon, 24 Feb 2020 22:47:41 +0900 Subject: [PATCH 03/13] Update subnav --- docs/content/components/navigation.md | 58 +++------------------------ src/navigation/subnav.scss | 19 +++++---- 2 files changed, 14 insertions(+), 63 deletions(-) diff --git a/docs/content/components/navigation.md b/docs/content/components/navigation.md index 090b9e390b..2bb8268b22 100644 --- a/docs/content/components/navigation.md +++ b/docs/content/components/navigation.md @@ -436,18 +436,7 @@ You can have `subnav-search` in the subnav bar.
- +
``` @@ -462,53 +451,16 @@ You can also use a `subnav-search-context` to display search help in a select me Item 3 -
- -
- +
``` diff --git a/src/navigation/subnav.scss b/src/navigation/subnav.scss index f268a89f4b..c3aa9c2f20 100644 --- a/src/navigation/subnav.scss +++ b/src/navigation/subnav.scss @@ -20,12 +20,12 @@ .subnav-item { position: relative; float: left; - // stylelint-disable-next-line primer/spacing - padding: 6px 14px; - font-weight: $font-weight-bold; + padding: 6px $spacer-3; + // stylelint-disable-next-line primer/typography + font-weight: 500; // stylelint-disable-next-line primer/typography line-height: 20px; - color: $text-gray; + color: $text-gray-dark; border: $border; + .subnav-item { @@ -46,7 +46,7 @@ color: $text-white; background-color: $bg-blue; // stylelint-disable-next-line primer/borders - border-color: $blue; + border-color: $blue-600; } &:first-child { @@ -63,13 +63,12 @@ .subnav-search { position: relative; // stylelint-disable-next-line primer/spacing - margin-left: 10px; + margin-left: 12px; } .subnav-search-input { width: 320px; - // stylelint-disable-next-line primer/spacing - padding-left: 30px; + padding-left: $spacer-5; color: $text-gray; } @@ -83,7 +82,7 @@ left: 8px; display: block; // stylelint-disable-next-line primer/colors - color: darken($gray-300, 4%); + color: $gray-400; text-align: center; pointer-events: none; } @@ -128,5 +127,5 @@ .subnav-spacer-right { // stylelint-disable-next-line primer/spacing - padding-right: 10px; + padding-right: 12px; } From 5dfd933c3a1ef0d5008977ae350cd7674b3a7fe3 Mon Sep 17 00:00:00 2001 From: simurai Date: Mon, 24 Feb 2020 23:01:39 +0900 Subject: [PATCH 04/13] Update filter-list --- src/navigation/filter-list.scss | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/src/navigation/filter-list.scss b/src/navigation/filter-list.scss index 2d09947211..5888777315 100644 --- a/src/navigation/filter-list.scss +++ b/src/navigation/filter-list.scss @@ -5,9 +5,8 @@ list-style-type: none; &.small .filter-item { - padding: $spacer-1 10px; // stylelint-disable-next-line primer/spacing - margin: 0 0 2px; + padding: 6px 12px; font-size: $font-size-small; } @@ -25,9 +24,8 @@ .filter-item { position: relative; display: block; - padding: $spacer-2 10px; - // stylelint-disable-next-line primer/spacing - margin-bottom: 5px; + padding: $spacer-2 $spacer-3; + margin-bottom: $spacer-1; overflow: hidden; font-size: $h5-size; color: $text-gray; @@ -39,8 +37,7 @@ &:hover { text-decoration: none; - // stylelint-disable-next-line primer/colors - background-color: lighten($gray-200, 3%); + background-color: $bg-gray; } &.selected, From bf0d1d1f316e25552162a4d74f3f63c5ac383c69 Mon Sep 17 00:00:00 2001 From: simurai Date: Tue, 25 Feb 2020 14:03:44 +0900 Subject: [PATCH 05/13] Update tabnav --- docs/content/components/navigation.md | 32 +++++++++++++++++++++ src/navigation/tabnav.scss | 41 +++++++++++++++------------ 2 files changed, 55 insertions(+), 18 deletions(-) diff --git a/docs/content/components/navigation.md b/docs/content/components/navigation.md index 2bb8268b22..d96e44598a 100644 --- a/docs/content/components/navigation.md +++ b/docs/content/components/navigation.md @@ -349,6 +349,38 @@ When you need to toggle between different views, consider using a tabnav. It'll ``` +Tabs can also contain icons and counters. + +```html live +
+ +
+``` + Use `.float-right` to align additional elements in the `.tabnav`: ```html live title="tabnav with buttons" diff --git a/src/navigation/tabnav.scss b/src/navigation/tabnav.scss index fd90406168..c3b8a2569f 100644 --- a/src/navigation/tabnav.scss +++ b/src/navigation/tabnav.scss @@ -2,14 +2,8 @@ // stylelint-disable selector-max-type .tabnav { margin-top: 0; - // stylelint-disable-next-line primer/spacing - margin-bottom: 15px; - border-bottom: $border-width $border-style $border-gray-dark; - - .Counter { - // stylelint-disable-next-line primer/spacing - margin-left: 5px; - } + margin-bottom: $spacer-3; + border-bottom: $border-width $border-style $border-gray; } .tabnav-tabs { @@ -19,11 +13,11 @@ .tabnav-tab { display: inline-block; - padding: $spacer-2 12px; + padding: $spacer-2 $spacer-3; font-size: $h5-size; // stylelint-disable-next-line primer/typography - line-height: 20px; - color: $text-gray; + line-height: 23px; + color: $text-gray-dark; text-decoration: none; background-color: transparent; border: $border-width $border-style transparent; @@ -32,16 +26,29 @@ &.selected, &[aria-selected=true], &[aria-current] { - color: $text-gray-dark; background-color: $bg-white; - border-color: $border-gray-dark; + border-color: $border-gray; border-radius: $border-radius $border-radius 0 0; } &:hover, &:focus { - color: $text-gray-dark; text-decoration: none; + color: $text-gray; + } + + &:active { + color: $text-gray-light; + } + + .octicon { + margin-right: $spacer-1; + // stylelint-disable-next-line primer/colors + color: $gray-400; + } + + .Counter { + margin-left: $spacer-1; } } @@ -66,12 +73,11 @@ } // When tabnav-extra are anchors -// stylelint-disable selector-no-qualifying-type +// stylelint-disable-next-line selector-no-qualifying-type a.tabnav-extra:hover { color: $text-blue; text-decoration: none; } -// stylelint-enable selector-no-qualifying-type // Tabnav buttons // @@ -79,6 +85,5 @@ a.tabnav-extra:hover { // the buttons to be floated or inline-block. .tabnav-btn { - // stylelint-disable-next-line primer/spacing - margin-left: 10px; + margin-left: $spacer-2; } From 7bd8f34a430e7b1d949d33c3ed5a38189eff4588 Mon Sep 17 00:00:00 2001 From: simurai Date: Tue, 25 Feb 2020 14:50:42 +0900 Subject: [PATCH 06/13] Update SideNav --- docs/content/components/navigation.md | 47 ++++++--------------------- src/navigation/menu.scss | 9 +++-- src/navigation/sidenav.scss | 26 +++++---------- 3 files changed, 26 insertions(+), 56 deletions(-) diff --git a/docs/content/components/navigation.md b/docs/content/components/navigation.md index d96e44598a..0ce2cd3210 100644 --- a/docs/content/components/navigation.md +++ b/docs/content/components/navigation.md @@ -237,20 +237,8 @@ Different kind of content can be added inside a Side Nav item. Use utility class With an avatar - - + + With an icon @@ -271,7 +259,7 @@ Different kind of content can be added inside a Side Nav item. Use utility class With a label label - With a counter 16 + With a counter 16
With a heading
@@ -299,38 +287,23 @@ Or also appear nested, as a sub navigation. Use margin/padding utility classes t ```html live ``` @@ -142,7 +142,7 @@ Use `.UnderlineNav--right` to right align the navigation. ```html live title="UnderlineNav--right with actions" diff --git a/src/labels/counters.scss b/src/labels/counters.scss index 753d6d84c6..d16add47f7 100644 --- a/src/labels/counters.scss +++ b/src/labels/counters.scss @@ -1,8 +1,9 @@ // Counters are rounded-corner badges for numbers .Counter { display: inline-block; - min-width: 24px; // makes sure it's a circle with just one digit - padding: $spacer-1 $spacer-2; + min-width: 20px; // makes sure it's a circle with just one digit + // stylelint-disable-next-line primer/spacing + padding: 2px 6px; font-size: $font-size-small; // stylelint-disable-next-line primer/typography font-weight: 500; @@ -33,11 +34,3 @@ // stylelint-disable-next-line primer/colors background-color: $gray-500; } - -// Small - -.Counter--small { - min-width: 20px; // makes sure it's a circle with just one digit - // stylelint-disable-next-line primer/spacing - padding: 2px 6px; -} diff --git a/src/navigation/underline-nav.scss b/src/navigation/underline-nav.scss index 96f3a1e166..4112cf2549 100644 --- a/src/navigation/underline-nav.scss +++ b/src/navigation/underline-nav.scss @@ -11,9 +11,9 @@ } .UnderlineNav-item { - padding: $spacer-3; + padding: $spacer-2 $spacer-3; font-size: $body-font-size; - line-height: $lh-default; + line-height: 30px; color: $text-black; text-align: center; background-color: transparent; From ebd820cb99093e8821bf6b24f017e8876d1f5f01 Mon Sep 17 00:00:00 2001 From: simurai Date: Tue, 25 Feb 2020 17:30:59 +0900 Subject: [PATCH 09/13] Lint --- docs/content/components/navigation-refresh.md | 150 ++++++++++++++++++ src/navigation/menu.scss | 9 +- src/navigation/sidenav.scss | 3 + src/navigation/subnav.scss | 1 + src/navigation/tabnav.scss | 2 +- src/navigation/underline-nav.scss | 2 + src/pagination/pagination.scss | 8 +- 7 files changed, 169 insertions(+), 6 deletions(-) create mode 100644 docs/content/components/navigation-refresh.md diff --git a/docs/content/components/navigation-refresh.md b/docs/content/components/navigation-refresh.md new file mode 100644 index 0000000000..08c18f8645 --- /dev/null +++ b/docs/content/components/navigation-refresh.md @@ -0,0 +1,150 @@ +--- +title: Navigation +path: components/navigation +status: Stable +source: 'https://github.com/primer/css/tree/master/src/navigation' +bundle: navigation +--- + + + +```html live + + + + +
+ +
+ + + +
+ + +
+ +
+
+ + + +
+
+ + + + + +``` diff --git a/src/navigation/menu.scss b/src/navigation/menu.scss index c4c05a5597..080926d4b3 100644 --- a/src/navigation/menu.scss +++ b/src/navigation/menu.scss @@ -13,6 +13,7 @@ .menu-item { position: relative; display: block; + // stylelint-disable-next-line primer/spacing padding: 12px $spacer-3; color: $text-black; border-bottom: $border-width $border-style $border-gray-light; @@ -36,6 +37,7 @@ &:focus, &:hover { text-decoration: none; + // stylelint-disable-next-line primer/colors background-color: $gray-100; outline: none; } @@ -48,6 +50,7 @@ &[aria-selected=true], &[aria-current] { cursor: default; + // stylelint-disable-next-line primer/colors background-color: $orange-000; &::before { @@ -65,6 +68,7 @@ .octicon { width: 16px; margin-right: $spacer-2; + // stylelint-disable-next-line primer/colors color: $gray-400; text-align: center; } @@ -95,13 +99,14 @@ .menu-heading { display: block; + padding: $spacer-1 $spacer-3; margin-top: 0; margin-bottom: 0; - padding: $spacer-1 $spacer-3; - line-height: 23px; // stylelint-disable-next-line primer/typography font-weight: 500; // stylelint-disable-next-line primer/typography + line-height: 23px; + // stylelint-disable-next-line primer/typography color: $text-black; border-bottom: $border-width $border-style $border-gray-light; diff --git a/src/navigation/sidenav.scss b/src/navigation/sidenav.scss index 8762af465b..91b339a61a 100644 --- a/src/navigation/sidenav.scss +++ b/src/navigation/sidenav.scss @@ -10,6 +10,7 @@ position: relative; display: block; width: 100%; + // stylelint-disable-next-line primer/spacing padding: 12px $spacer-3; color: $text-black; text-align: left; @@ -45,6 +46,7 @@ .SideNav-item:hover, .SideNav-item:focus { text-decoration: none; + // stylelint-disable-next-line primer/colors background-color: $gray-100; outline: none; } @@ -55,6 +57,7 @@ .SideNav-item[aria-current="page"], .SideNav-item[aria-selected="true"] { + // stylelint-disable-next-line primer/colors background-color: $orange-000; // Bar on the left diff --git a/src/navigation/subnav.scss b/src/navigation/subnav.scss index c3aa9c2f20..0fb93856c8 100644 --- a/src/navigation/subnav.scss +++ b/src/navigation/subnav.scss @@ -20,6 +20,7 @@ .subnav-item { position: relative; float: left; + // stylelint-disable-next-line primer/spacing padding: 6px $spacer-3; // stylelint-disable-next-line primer/typography font-weight: 500; diff --git a/src/navigation/tabnav.scss b/src/navigation/tabnav.scss index c3b8a2569f..828443c5b1 100644 --- a/src/navigation/tabnav.scss +++ b/src/navigation/tabnav.scss @@ -33,8 +33,8 @@ &:hover, &:focus { - text-decoration: none; color: $text-gray; + text-decoration: none; } &:active { diff --git a/src/navigation/underline-nav.scss b/src/navigation/underline-nav.scss index 4112cf2549..f8f0c97bef 100644 --- a/src/navigation/underline-nav.scss +++ b/src/navigation/underline-nav.scss @@ -2,6 +2,7 @@ display: flex; overflow-x: auto; overflow-y: hidden; + // stylelint-disable-next-line primer/box-shadow box-shadow: inset 0 -1px 0 $border-color; justify-content: space-between; } @@ -13,6 +14,7 @@ .UnderlineNav-item { padding: $spacer-2 $spacer-3; font-size: $body-font-size; + // stylelint-disable-next-line primer/typography line-height: 30px; color: $text-black; text-align: center; diff --git a/src/pagination/pagination.scss b/src/pagination/pagination.scss index 9ae9e96c2a..8d69207040 100644 --- a/src/pagination/pagination.scss +++ b/src/pagination/pagination.scss @@ -6,18 +6,19 @@ em { display: inline-block; padding: $spacer-1 12px; - color: $text-black; font-style: normal; + color: $text-black; white-space: nowrap; vertical-align: middle; cursor: pointer; user-select: none; + // stylelint-disable-next-line primer/borders border-bottom: 2px $border-style transparent; &:hover, &:focus { - text-decoration: none; color: $text-gray-dark; + text-decoration: none; outline: 0; } @@ -30,6 +31,7 @@ .current:hover, [aria-current], [aria-current]:hover { + // stylelint-disable-next-line primer/borders border-color: $orange-500; } @@ -39,8 +41,8 @@ .gap:hover, .disabled:hover, [aria-disabled=true]:hover { - cursor: default; color: $text-gray-light; + cursor: default; border-color: transparent; } } From 32d26f4ad427793145f6de3e2f4fd07ff5d8404e Mon Sep 17 00:00:00 2001 From: simurai Date: Tue, 25 Feb 2020 17:35:10 +0900 Subject: [PATCH 10/13] Lint "--report-needless-disables" --- src/navigation/menu.scss | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/navigation/menu.scss b/src/navigation/menu.scss index 080926d4b3..3548a193c9 100644 --- a/src/navigation/menu.scss +++ b/src/navigation/menu.scss @@ -86,7 +86,6 @@ .avatar { float: left; - // stylelint-disable-next-line primer/spacing margin-right: $spacer-1; } @@ -106,7 +105,6 @@ font-weight: 500; // stylelint-disable-next-line primer/typography line-height: 23px; - // stylelint-disable-next-line primer/typography color: $text-black; border-bottom: $border-width $border-style $border-gray-light; From 11883eb580475b3d4199f1942986412da2bf645c Mon Sep 17 00:00:00 2001 From: simurai Date: Wed, 26 Feb 2020 21:45:31 +0900 Subject: [PATCH 11/13] Use $border shorthand --- src/navigation/tabnav.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/navigation/tabnav.scss b/src/navigation/tabnav.scss index 828443c5b1..6a2a9bf99b 100644 --- a/src/navigation/tabnav.scss +++ b/src/navigation/tabnav.scss @@ -3,7 +3,7 @@ .tabnav { margin-top: 0; margin-bottom: $spacer-3; - border-bottom: $border-width $border-style $border-gray; + border-bottom: $border; } .tabnav-tabs { From 902846e2804083b1f57b6c423fb6fc63c66125e5 Mon Sep 17 00:00:00 2001 From: simurai Date: Wed, 26 Feb 2020 21:46:07 +0900 Subject: [PATCH 12/13] Delete navigation-refresh.md --- docs/content/components/navigation-refresh.md | 150 ------------------ 1 file changed, 150 deletions(-) delete mode 100644 docs/content/components/navigation-refresh.md diff --git a/docs/content/components/navigation-refresh.md b/docs/content/components/navigation-refresh.md deleted file mode 100644 index 08c18f8645..0000000000 --- a/docs/content/components/navigation-refresh.md +++ /dev/null @@ -1,150 +0,0 @@ ---- -title: Navigation -path: components/navigation -status: Stable -source: 'https://github.com/primer/css/tree/master/src/navigation' -bundle: navigation ---- - - - -```html live - - - - -
- -
- - - -
- - -
- -
-
- - - -
-
- - - - - -``` From e85d6c79a2480a56f687ac227631fc22930d8de2 Mon Sep 17 00:00:00 2001 From: simurai Date: Wed, 26 Feb 2020 21:49:20 +0900 Subject: [PATCH 13/13] Use white background for SideNav --- src/navigation/sidenav.scss | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/navigation/sidenav.scss b/src/navigation/sidenav.scss index 91b339a61a..bdc3b2b193 100644 --- a/src/navigation/sidenav.scss +++ b/src/navigation/sidenav.scss @@ -57,8 +57,7 @@ .SideNav-item[aria-current="page"], .SideNav-item[aria-selected="true"] { - // stylelint-disable-next-line primer/colors - background-color: $orange-000; + background-color: $bg-white; // Bar on the left &::before {