diff --git a/scss/_patterns_side-navigation.scss b/scss/_patterns_side-navigation.scss
index 55a65ea16e..4e2ecf9215 100644
--- a/scss/_patterns_side-navigation.scss
+++ b/scss/_patterns_side-navigation.scss
@@ -28,11 +28,6 @@
display: block;
padding: $spv-inner--x-small $sph-inner--small $spv-inner--x-small $sph-inner;
- &.is-active,
- &.is-selected {
- font-weight: $font-weight-bold;
- }
-
// nested 2 or 3 levels
.p-side-navigation__item .p-side-navigation__item & {
padding-left: 2 * $sph-inner;
@@ -76,25 +71,16 @@
background: $color-sidenav-list-border;
}
- .p-side-navigation__text.is-selected {
- color: $color-sidenav-text-active;
- }
-
.p-side-navigation__link {
&,
&:visited {
color: $color-sidenav-text-default;
}
- &:hover,
- &.is-active,
- &.is-selected {
- color: $color-sidenav-text-active;
- }
-
&:hover,
&.is-active {
background: $color-sidenav-item-background-highlight;
+ color: $color-sidenav-text-active;
}
&.is-active {
diff --git a/templates/docs/examples/patterns/side-navigation/default.html b/templates/docs/examples/patterns/side-navigation/default.html
index 581d21df01..072d07eb93 100644
--- a/templates/docs/examples/patterns/side-navigation/default.html
+++ b/templates/docs/examples/patterns/side-navigation/default.html
@@ -13,7 +13,7 @@
First level link
- Selected link
+ Link with children
-
Second level link
@@ -22,7 +22,7 @@
Second level text
-
- Second level selected link
+ Second level link with children
-
Third level text
@@ -52,7 +52,7 @@
First level text
-
- Selected text item
+ Text item with children
-
Second level link
@@ -61,7 +61,7 @@
Second level text
-
- Second level selected text item
+ Second level text with children
-
Third level text
diff --git a/templates/docs/examples/patterns/side-navigation/docs.html b/templates/docs/examples/patterns/side-navigation/docs.html
index 23bedb5e70..9d2350ca9a 100644
--- a/templates/docs/examples/patterns/side-navigation/docs.html
+++ b/templates/docs/examples/patterns/side-navigation/docs.html
@@ -27,7 +27,7 @@
Commission machines
-
- Testing
+ Testing
-
Hardware testings
diff --git a/templates/docs/patterns/navigation.md b/templates/docs/patterns/navigation.md
index 168ceea28a..c0369cbc51 100644
--- a/templates/docs/patterns/navigation.md
+++ b/templates/docs/patterns/navigation.md
@@ -65,14 +65,11 @@ View example of the sub-navigation pattern
New
-Side navigation pattern can be used to provide more detailed navigation alongside your content.
+The side navigation pattern can be used to provide more detailed navigation alongside your content.
-It provides grouping of the links and nesting them up to three levels.
+It allows grouping the links into navigation sections and nesting them up to three levels.
-Current page in the side navigation should be highlighted by adding `is-active` class to
-`p-side-navigation__link` element. If current active page is nested in the navigation
-all relevant parent `p-side-navigation__link` or `p-side-navigation__text` elements
-should be highlighted using `is-selected` class to give a better view on the hierarchy.
+Current page in the side navigation should be highlighted by adding `is-active` class to the corresponding `p-side-navigation__link` element.
View example of the side navigation pattern