Changeset 9430

Timestamp:

01/28/2020 07:17:59 PM (5 years ago)

Author:

coffee2code

Message:

Breathe theme: Improve handbook sidebar menu design.

• Eliminate per-item top/bottom borders
• Use WCAG-compliant color (as used for links) for left border
• Increase thickness of left border for menu sub-items
• Reduce padding-left to align widget title with leftmost text within widget
• Decrease padding-right for menu items which do not have subchildren
• Embolden the name of the current page in the menu

Props rilwis, felipeloureirosantos, dufresnesteven, coffee2code.
Fixes #4901, #4467.

File:

• sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-breathe/style.css (modified) (5 diffs)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-breathe/style.css

@@ -395 +395 @@
     letter-spacing: 1px;
     background-color: transparent;
-    padding: 1rem 12px;
+    padding: 1rem 12px 1rem 8px;
     margin-bottom: 0;
     color: inherit;
@@ -1295 +1295 @@
 }
 #secondary .menu-table-of-contents-container ul li {
-  border-top: 1px solid rgba(0,0,0,0.05);
+  margin: 1px 0;
   padding: 0;
   position: relative;
@@ -1301 +1301 @@
 #secondary .menu-table-of-contents-container ul ul {
     margin-left: 12px;
-    border-left: 1px solid rgba(0,0,0,0.05);
+    border-left: 2px solid #21759b;
 }
 .menu-table-of-contents-container ul li .expandable {
@@ -1343 +1343 @@
   display: block;
   width: 100%;
-  padding: 8px 40px 8px 8px;
+  padding: 8px 8px 8px 13px;
   text-decoration: none;
+}
+.menu-table-of-contents-container ul li.menu-item-has-children > .expandable > a {
+    padding-right: 40px;
 }
 .menu-table-of-contents-container ul a:hover,
@@ -1360 +1363 @@
   color: #555;
   background-color: #fff;
-}
-.menu-table-of-contents-container > ul > li:last-child {
-  border-bottom: 1px solid rgba(0,0,0,0.05);
-}
-.menu-table-of-contents-container > ul > li .children > li > a {
-  padding-left: 13px;
-}
-.menu-table-of-contents-container > ul > li .children > li > ul > li > a {
-  padding-left: 8px;
+  font-weight: bold;
 }