Browse Source

Pique: Update styles for buttons; see #434.

Laurel Fulford 6 years ago
parent
commit
7da99877f3
2 changed files with 27 additions and 33 deletions
  1. 18 9
      pique/assets/css/blocks.css
  2. 9 24
      pique/assets/css/editor-blocks.css

+ 18 - 9
pique/assets/css/blocks.css

@@ -382,14 +382,8 @@ body.home .wp-block-table.alignwide .wp-block-table.alignfull {
 
 /* Buttons */
 
-.wp-block-button__link {
-	background-color: #83b6cc;
-	color: #eff6f9;
-}
-
 .wp-block-button .wp-block-button__link {
 	border: 2px solid transparent;
-	border-radius: 2em;
 	display: inline-block;
 	font-family: Karla, Arial, sans-serif;
 	font-size: 15.2px;
@@ -404,14 +398,29 @@ body.home .wp-block-table.alignwide .wp-block-table.alignfull {
 	-webkit-appearance: none;
 }
 
-.wp-block-button__link:hover {
+.wp-block-button__link {
+	background-color: #83b6cc;
+	border-radius: 2em;
+	color: #eff6f9;
+}
+
+.is-style-outline .wp-block-button__link {
+	border-color: currentColor;
+	background: transparent;
+}
+
+.is-style-outline .wp-block-button__link:not(.has-text-color) {
+	color: #83b6cc;
+}
+
+.wp-block-button .wp-block-button__link:hover {
 	background-color: transparent;
 	border-color: currentColor;
 	color: #83b6cc;
 }
 
-.wp-block-button__link:focus,
-.wp-block-button__link:active {
+.wp-block-button .wp-block-button__link:focus,
+.wp-block-button .wp-block-button__link:active {
 	background-color: #4488a5;
 	border-color: currentColor;
 	color: #83b6cc;

+ 9 - 24
pique/assets/css/editor-blocks.css

@@ -326,20 +326,6 @@ p.has-drop-cap:not(:focus)::first-letter {
 	-webkit-appearance: none;
 }
 
-.wp-block-file .wp-block-file__button:hover {
-	background-color: transparent;
-	border-color: currentColor;
-	color: #83b6cc;
-}
-
-.wp-block-file .wp-block-file__button:focus,
-.wp-block-file .wp-block-file__button:active {
-	background-color: #4488a5;
-	border-color: currentColor;
-	color: #83b6cc;
-}
-
-
 /*--------------------------------------------------------------
 4.0 Blocks - Formatting
 --------------------------------------------------------------*/
@@ -436,10 +422,7 @@ p.has-drop-cap:not(:focus)::first-letter {
 }
 
 .wp-block-button .wp-block-button__link {
-	background-color: #83b6cc;
 	border: 2px solid transparent;
-	border-radius: 2em;
-	color: #eff6f9;
 	display: inline-block;
 	font-family: Karla, Arial, sans-serif;
 	font-size: 15.2px;
@@ -454,16 +437,18 @@ p.has-drop-cap:not(:focus)::first-letter {
 	-webkit-appearance: none;
 }
 
-.wp-block-button__link:hover {
-	background-color: transparent;
-	border-color: currentColor;
-	color: #83b6cc;
+.wp-block-button__link {
+	background-color: #83b6cc;
+	border-radius: 2em;
+	color: #eff6f9;
 }
 
-.wp-block-button__link:focus,
-.wp-block-button__link:active {
-	background-color: #4488a5;
+.is-style-outline .wp-block-button__link {
 	border-color: currentColor;
+	background: transparent;
+}
+
+.is-style-outline .wp-block-button__link:not(.has-text-color) {
 	color: #83b6cc;
 }