Merge pull request #2807 from Automattic/fix/brompton-header-circle

fixed z-index of header semicircle

brompton/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "brompton",
-  "version": "1.3.10",
+  "version": "1.3.11",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

brompton/package.json

@@ -1,6 +1,6 @@
 {
   "name": "brompton",
-  "version": "1.3.10",
+  "version": "1.3.11",
   "description": "Brompton",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

brompton/sass/_extra-child-theme.scss

@@ -3,26 +3,6 @@
  */
 // @import "";
 
-// Pgae
-#page {
-	position: relative;
-
-	&:before {
-		background: #{map-deep-get($config-global, "color", "foreground", "default")};
-		border-top-left-radius: 200px;
-		border-top-right-radius: 200px;
-		content: "";
-		display: block;
-		height: 100px;
-		left: 50%;
-		margin-left: -100px;
-		position: absolute;
-		top: -#{map-deep-get($config-global, "spacing", "vertical") + 5px};
-		width: 200px;
-		z-index: 1;
-	}
-}
-
 // Header
 #masthead {
 	align-content: center;
@@ -40,7 +20,7 @@
 	position: relative;
 	z-index: 2;
 
-	&:before {
+	&:after {
 		background: #{map-deep-get($config-global, "color", "foreground", "default")};
 		border-bottom-left-radius: 200px;
 		border-bottom-right-radius: 200px;
@@ -54,6 +34,20 @@
 		width: 200px;
 	}
 
+	&:before {
+		background: #{map-deep-get($config-global, "color", "foreground", "default")};
+		border-top-left-radius: 200px;
+		border-top-right-radius: 200px;
+		content: "";
+		display: block;
+		height: 100px;
+		left: 50%;
+		margin-left: -100px;
+		position: absolute;
+		top: -#{map-deep-get($config-global, "spacing", "vertical") + 5px};
+		width: 200px;
+	}
+
 	a {
 		text-decoration: none;
 	}

brompton/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Running a business is no small task. But with the right tools and support, creating a website doesn’t have to be another chore on your to-do list: enter Brompton, a simple yet powerful theme for small-business owners and entrepreneurs.
 Requires at least: WordPress 4.9.6
-Version: 1.3.9
+Version: 1.3.11
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

brompton/style-rtl.css

@@ -6,7 +6,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Running a business is no small task. But with the right tools and support, creating a website doesn’t have to be another chore on your to-do list: enter Brompton, a simple yet powerful theme for small-business owners and entrepreneurs.
 Requires at least: WordPress 4.9.6
-Version: 1.3.10
+Version: 1.3.11
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia
@@ -3989,25 +3989,6 @@ body.admin-bar .widget_eu_cookie_law_widget.widget.top {
 /**
  * Extra Child Theme Styles
  */
-#page {
-	position: relative;
-}
-
-#page:before {
-	background: #252E36;
-	border-top-right-radius: 200px;
-	border-top-left-radius: 200px;
-	content: "";
-	display: block;
-	height: 100px;
-	right: 50%;
-	margin-right: -100px;
-	position: absolute;
-	top: -37px;
-	width: 200px;
-	z-index: 1;
-}
-
 #masthead {
 	align-content: center;
 	align-items: center;
@@ -4025,7 +4006,7 @@ body.admin-bar .widget_eu_cookie_law_widget.widget.top {
 	z-index: 2;
 }
 
-#masthead:before {
+#masthead:after {
 	background: #252E36;
 	border-bottom-right-radius: 200px;
 	border-bottom-left-radius: 200px;
@@ -4039,6 +4020,20 @@ body.admin-bar .widget_eu_cookie_law_widget.widget.top {
 	width: 200px;
 }
 
+#masthead:before {
+	background: #252E36;
+	border-top-right-radius: 200px;
+	border-top-left-radius: 200px;
+	content: "";
+	display: block;
+	height: 100px;
+	right: 50%;
+	margin-right: -100px;
+	position: absolute;
+	top: -37px;
+	width: 200px;
+}
+
 #masthead a {
 	text-decoration: none;
 }

brompton/style.css

@@ -6,7 +6,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Running a business is no small task. But with the right tools and support, creating a website doesn’t have to be another chore on your to-do list: enter Brompton, a simple yet powerful theme for small-business owners and entrepreneurs.
 Requires at least: WordPress 4.9.6
-Version: 1.3.10
+Version: 1.3.11
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia
@@ -4018,25 +4018,6 @@ body.admin-bar .widget_eu_cookie_law_widget.widget.top {
 /**
  * Extra Child Theme Styles
  */
-#page {
-	position: relative;
-}
-
-#page:before {
-	background: #252E36;
-	border-top-left-radius: 200px;
-	border-top-right-radius: 200px;
-	content: "";
-	display: block;
-	height: 100px;
-	left: 50%;
-	margin-left: -100px;
-	position: absolute;
-	top: -37px;
-	width: 200px;
-	z-index: 1;
-}
-
 #masthead {
 	align-content: center;
 	align-items: center;
@@ -4054,7 +4035,7 @@ body.admin-bar .widget_eu_cookie_law_widget.widget.top {
 	z-index: 2;
 }
 
-#masthead:before {
+#masthead:after {
 	background: #252E36;
 	border-bottom-left-radius: 200px;
 	border-bottom-right-radius: 200px;
@@ -4068,6 +4049,20 @@ body.admin-bar .widget_eu_cookie_law_widget.widget.top {
 	width: 200px;
 }
 
+#masthead:before {
+	background: #252E36;
+	border-top-left-radius: 200px;
+	border-top-right-radius: 200px;
+	content: "";
+	display: block;
+	height: 100px;
+	left: 50%;
+	margin-left: -100px;
+	position: absolute;
+	top: -37px;
+	width: 200px;
+}
+
 #masthead a {
 	text-decoration: none;
 }