浏览代码

Skatepark: Increase menu spacing & style current menu item (#4966)

* Increase menu spacing using block gap
* Add underline to current menu item
Sarah Norris 3 年之前
父节点
当前提交
6736dcea4c
共有 3 个文件被更改,包括 17 次插入2 次删除
  1. 7 0
      skatepark/assets/theme.css
  2. 2 2
      skatepark/block-template-parts/header.html
  3. 8 0
      skatepark/sass/blocks/_navigation.scss

+ 7 - 0
skatepark/assets/theme.css

@@ -130,6 +130,13 @@
 	font-size: var(--wp--preset--font-size--small);
 }
 
+.wp-block-navigation .wp-block-navigation-item.current-menu-item > a {
+	-webkit-text-decoration-line: underline;
+	        text-decoration-line: underline;
+	text-decoration-thickness: 0.2em;
+	text-underline-offset: 0.35em;
+}
+
 .wp-block-post-comments .reply a {
 	text-decoration-thickness: 0.07em;
 	text-underline-offset: 0.46ex;

+ 2 - 2
skatepark/block-template-parts/header.html

@@ -9,8 +9,8 @@
 
 <!-- wp:group {"className":"nav-links"} -->
 <div class="wp-block-group nav-links">
-	<!-- wp:navigation {"className":"is-style-blockbase-navigation-improved-responsive","orientation":"horizontal","itemsJustification":"right","isResponsive":true,"__unstableLocation":"primary","style":{"typography":{"fontStyle":"normal","fontWeight":"900","textTransform":"uppercase"}},"__unstableSocialLinks":"social"} /-->
+	<!-- wp:navigation {"className":"is-style-blockbase-navigation-improved-responsive","orientation":"horizontal","itemsJustification":"right","isResponsive":true,"__unstableLocation":"primary","style":{"typography":{"fontStyle":"normal","fontWeight":"900","textTransform":"uppercase"},"spacing":{"blockGap":"40px"}},"__unstableSocialLinks":"social"} /-->
 </div>
 <!-- /wp:group -->
 </div>
-<!-- /wp:group -->
+<!-- /wp:group -->

+ 8 - 0
skatepark/sass/blocks/_navigation.scss

@@ -2,4 +2,12 @@
 //preventing mobile menu items (and sub-menu items) from having a different size value
 .wp-block-navigation {
 	font-size: var(--wp--preset--font-size--small);
+
+	.wp-block-navigation-item {
+		&.current-menu-item > a {
+			text-decoration-line: underline;
+			text-decoration-thickness: 0.2em;
+			text-underline-offset: 0.35em;
+		}
+	}
 }