Fix Nav Buttons Size

Currently Nav buttons to expand the menu are a bit small and do not match the link text. This makes the buttons match the size of the link text and deduplicates some of the style rules.
readthedocs · Mar 3, 2021 · 4b324a9 · 4b324a9
1 parent 8ba9c8a
commit 4b324a9
Showing 1 changed file with 7 additions and 10 deletions.
diff --git a/src/sass/_theme_layout.sass b/src/sass/_theme_layout.sass
@@ -27,6 +27,12 @@ html
     line-height: $base-font-size * 2
     padding: 0 $base-font-size
 
+%menu-vertical-btn
+  @extend .fa
+  @extend .fa-plus-square-o
+  display: block
+  line-height: 18px
+
 .wy-menu-vertical
   width: $nav-desktop-width
 
@@ -65,13 +71,9 @@ html
       padding-right: 0
     // Expand links
     span.toctree-expand
-      display: block
+      @extend %menu-vertical-btn
       float: left
       margin-left: -1.2em
-      @extend .fa
-      @extend .fa-plus-square-o
-      font-size: .8em
-      line-height: 1.6em
       color: darken($menu-link-medium, 20%)
 
   // On state for the first level
@@ -89,11 +91,6 @@ html
       span.toctree-expand
         color: $menu-link-medium
     span.toctree-expand
-      @extend .fa
-      @extend .fa-minus-square-o
-      display: block
-      font-size: .8em
-      line-height: 1.6em
       color: darken($menu-link-medium, 30%)
 
   li.toctree-l1.current > a