Merge pull request #5522 from pat270/clay-5512

fix(@clayui/css): Mixins clay-nav-nested should apply to .btn as well
liferay · May 12, 2023 · 97c6dd6 · 97c6dd6
2 parents 69c20e3 + 429876a
commit 97c6dd6
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 5 deletions.
diff --git a/packages/clay-css/src/scss/components/_navs.scss b/packages/clay-css/src/scss/components/_navs.scss
@@ -118,7 +118,11 @@
  flex-direction: column;
  flex-wrap: nowrap;
 
- @include clay-nav-nested($nav-nested-spacer-x);
+ @include clay-nav-nested(
+ $nav-nested-spacer-x,
+ $nav-nested-nest-level,
+ $nav-nested-nav-class
+ );
 }
 
 .nav-nested-margins {

diff --git a/packages/clay-css/src/scss/mixins/_nav-nested.scss b/packages/clay-css/src/scss/mixins/_nav-nested.scss
@@ -17,17 +17,24 @@
  $nav-class: '.nav',
  $i: 1
 ) {
+ $_nav-class-next: '#{$nav-class}';
+
  @for $i from (1) through $nest-level {
- #{$nav-class} > li {
- > a {
+ #{$_nav-class-next} > li {
+ > a,
+ > .btn {
  padding-left: calc(#{$indent} * #{$i + 1});
+
+ .c-inner {
+ margin-left: calc(#{$indent} * -#{$i + 1});
+ }
  }
 
  > .nav-equal-height-heading {
  padding-left: calc(#{$indent} * #{$i});
  }
  }
 
- $nav-class: '#{$nav-class} .nav';
+ $_nav-class-next: '#{$nav-class} #{$_nav-class-next}';
  }
 }
diff --git a/packages/clay-css/src/scss/variables/_navs.scss b/packages/clay-css/src/scss/variables/_navs.scss
@@ -346,9 +346,14 @@ $nav-unstyled: map-deep-merge(
  $nav-unstyled
 );
 
-// Nav Nested
+// Nav Nested Margins
 
 $nav-nested-margins-spacer-x: $nav-link-padding-x !default;
+
+// Nav Nested
+
+$nav-nested-nav-class: '.nav' !default;
+$nav-nested-nest-level: 7 !default;
 $nav-nested-spacer-x: $nav-link-padding-x !default;
 
 // Nav Tabs