浏览代码

Style the navigation menu in the footer editor

Copons 5 年之前
父节点
当前提交
66cc7d62a7
共有 3 个文件被更改,包括 59 次插入5 次删除
  1. 28 4
      maywood/sass/_full-site-editing-editor.scss
  2. 31 0
      maywood/style-editor.css
  3. 0 1
      maywood/style-rtl.css

+ 28 - 4
maywood/sass/_full-site-editing-editor.scss

@@ -12,11 +12,35 @@
 		text-align: center;
 	}
 
-	.main-navigation ul {
-		justify-content: center;
+	.main-navigation {
+		text-align: center;
+		ul {
+			justify-content: center;
+			a {
+				font-size: 20px;
+				text-decoration: none;
+			}
+		}
+	}
+}
+
+.site-footer {
+	.main-navigation .footer-menu {
+		justify-content: flex-start;
+		
+		@include media(mobile) {
+			justify-content: center;
+		}
+		@include media(tablet) {
+			justify-content: flex-end;
+		}
+
 		a {
-			font-size: 20px;
+			font-size: 16.6px;
 			text-decoration: none;
+			@include media(mobile-only) {
+				font-size: 13.8px;
+			}
 		}
 	}
-}
+}

+ 31 - 0
maywood/style-editor.css

@@ -1493,6 +1493,10 @@ body {
 	text-align: center;
 }
 
+.site-header .main-navigation {
+	text-align: center;
+}
+
 .site-header .main-navigation ul {
 	justify-content: center;
 }
@@ -1501,3 +1505,30 @@ body {
 	font-size: 20px;
 	text-decoration: none;
 }
+
+.site-footer .main-navigation .footer-menu {
+	justify-content: flex-start;
+}
+
+@media only screen and (min-width: 560px) {
+	.site-footer .main-navigation .footer-menu {
+		justify-content: center;
+	}
+}
+
+@media only screen and (min-width: 640px) {
+	.site-footer .main-navigation .footer-menu {
+		justify-content: flex-end;
+	}
+}
+
+.site-footer .main-navigation .footer-menu a {
+	font-size: 16.6px;
+	text-decoration: none;
+}
+
+@media only screen and (max-width: 559px) {
+	.site-footer .main-navigation .footer-menu a {
+		font-size: 13.8px;
+	}
+}

+ 0 - 1
maywood/style-rtl.css

@@ -2332,7 +2332,6 @@ table th,
 }
 
 .main-navigation #toggle-menu {
-	background-color: red;
 	display: inline-block;
 	margin: 0;
 }