Parcourir la source

Hever: Tweak menu dropdown

Thomas Guillot il y a 6 ans
Parent
commit
b15d5d07ad
3 fichiers modifiés avec 42 ajouts et 6 suppressions
  1. 13 3
      hever/sass/_extra-child-theme.scss
  2. 16 3
      hever/style-rtl.css
  3. 13 0
      hever/style.css

+ 13 - 3
hever/sass/_extra-child-theme.scss

@@ -117,14 +117,24 @@ a {
 			& > div > ul > li.current-menu-item {
 
 				& > a {
-					//box-shadow: 0 2px 0 0 #{map-deep-get($config-global, "color", "primary", "default")};
-					//color: #{map-deep-get($config-global, "color", "background")};
 					text-decoration: underline;
 				}
 
 				& > ul {
 					box-shadow: none;
+					margin-left: #{0.5 * map-deep-get($config-global, "spacing", "unit")};
 					overflow: hidden;
+					padding-top: #{0.5 * map-deep-get($config-global, "spacing", "unit")};
+
+					&:before {
+						border-bottom: #{0.5 * map-deep-get($config-global, "spacing", "unit")} solid;
+						border-left: #{0.5 * map-deep-get($config-global, "spacing", "unit")} solid transparent;
+						border-right: #{0.5 * map-deep-get($config-global, "spacing", "unit")} solid transparent;
+						content: "";
+						display: block;
+						margin-left: #{map-deep-get($config-global, "spacing", "unit")};
+						width: #{map-deep-get($config-global, "spacing", "unit")};
+					}
 				}
 
 				& li {
@@ -262,7 +272,7 @@ article .entry-header .entry-title,
       display: none;
     }
   }
-	
+
   @include media(laptop) {
 		display: grid;
 		grid-template-columns: repeat(2, 1fr);

+ 16 - 3
hever/style-rtl.css

@@ -3307,7 +3307,20 @@ p:not(.site-title) a:hover {
 	.site-header .main-navigation > div > ul > li.focus > ul,
 	.site-header .main-navigation > div > ul > li.current-menu-item > ul {
 		box-shadow: none;
+		margin-right: 8px;
 		overflow: hidden;
+		padding-top: 8px;
+	}
+	.site-header .main-navigation > div > ul > li:hover > ul:before,
+	.site-header .main-navigation > div > ul > li.focus > ul:before,
+	.site-header .main-navigation > div > ul > li.current-menu-item > ul:before {
+		border-bottom: 8px solid;
+		border-right: 8px solid transparent;
+		border-left: 8px solid transparent;
+		content: "";
+		display: block;
+		margin-right: 16px;
+		width: 16px;
 	}
 	.site-header .main-navigation > div > ul > li:hover li > a,
 	.site-header .main-navigation > div > ul > li.focus li > a,
@@ -3462,12 +3475,12 @@ article .entry-header .entry-title a:active, article .entry-header .entry-title
 }
 
 @media only screen and (min-width: 1024px) {
+	.widget-area {
+		grid-template-columns: repeat(3, 1fr);
+	}
 	.widget-area > *:nth-child(3) {
 		margin-top: 0;
 	}
-	.widget-area .widget {
-		flex: 0 0 calc(33.3333% - 16px);
-	}
 }
 
 .widget_calendar caption,

+ 13 - 0
hever/style.css

@@ -3312,7 +3312,20 @@ p:not(.site-title) a:hover {
 	.site-header .main-navigation > div > ul > li.focus > ul,
 	.site-header .main-navigation > div > ul > li.current-menu-item > ul {
 		box-shadow: none;
+		margin-left: 8px;
 		overflow: hidden;
+		padding-top: 8px;
+	}
+	.site-header .main-navigation > div > ul > li:hover > ul:before,
+	.site-header .main-navigation > div > ul > li.focus > ul:before,
+	.site-header .main-navigation > div > ul > li.current-menu-item > ul:before {
+		border-bottom: 8px solid;
+		border-left: 8px solid transparent;
+		border-right: 8px solid transparent;
+		content: "";
+		display: block;
+		margin-left: 16px;
+		width: 16px;
 	}
 	.site-header .main-navigation > div > ul > li:hover li > a,
 	.site-header .main-navigation > div > ul > li.focus li > a,