Browse Source

Toujours: Update styles for buttons; see #434.

Laurel Fulford 6 years ago
parent
commit
8a1a10d42b
2 changed files with 10 additions and 41 deletions
  1. 7 11
      toujours/blocks.css
  2. 3 30
      toujours/editor-blocks.css

+ 7 - 11
toujours/blocks.css

@@ -257,8 +257,6 @@ p.has-drop-cap:not(:focus)::first-letter {
 /* Buttons */
 
 .wp-block-button .wp-block-button__link {
-	border-radius: 0;
-	border: 0;
 	font-family: "Alegreya Sans", "Helvetica Neue", Helvetica, sans-serif;
 	font-size: 14px;
 	font-weight: 500;
@@ -276,17 +274,15 @@ p.has-drop-cap:not(:focus)::first-letter {
 	background-color: #2590ec;
 }
 
-.wp-block-button__link:active,
-.wp-block-button__link:focus,
-.wp-block-button__link:hover {
-	background-color: #444;
-	color: #fff;
+.is-style-outline .wp-block-button__link:not(.has-text-color) {
+	color: #2590ec;
 }
 
-.wp-block-button__link.has-background:active,
-.wp-block-button__link.has-background:focus,
-.wp-block-button__link.has-background:hover {
-	opacity: 0.8;
+.wp-block-button .wp-block-button__link:active,
+.wp-block-button .wp-block-button__link:focus,
+.wp-block-button .wp-block-button__link:hover {
+	background-color: #444;
+	color: #fff;
 }
 
 .wp-block-button.alignleft {

+ 3 - 30
toujours/editor-blocks.css

@@ -542,12 +542,6 @@
 	transition: background-color 0.2s;
 }
 
-.wp-block-file .wp-block-file__button:hover,
-.wp-block-file .wp-block-file__button:focus,
-.wp-block-file .wp-block-file__button:active {
-	background-color: #444;
-}
-
 .wp-block-button .editor-rich-text__tinymce.mce-content-body {
 	line-height: 1;
 }
@@ -746,8 +740,6 @@
 
 /* Buttons */
 .wp-block-button .wp-block-button__link {
-	border-radius: 0;
-	border: 0;
 	font-family: "Alegreya Sans", "Helvetica Neue", Helvetica, sans-serif;
 	font-size: 14px;
 	font-weight: 500;
@@ -755,34 +747,15 @@
 	line-height: 1;
 	padding: 15px 30px;
 	text-transform: uppercase;
-	-webkit-transition: background-color 0.2s;
-	   -moz-transition: background-color 0.2s;
-	        transition: background-color 0.2s;
-}
-
-.wp-block-button .wp-block-button__link:active,
-.wp-block-button .wp-block-button__link:hover,
-.wp-block-button .wp-block-button__link:focus {
 }
 
-.wp-block-button__link:not(.has-background) {
+.wp-block-button__link {
 	background-color: #2590ec;
-}
-
-.wp-block-button__link:not(.has-text-color) {
-	color: #fff;
-}
-
-.wp-block-button__link:not(.has-text-color):active,
-.wp-block-button__link:not(.has-text-color):focus,
-.wp-block-button__link:not(.has-text-color):hover {
 	color: #fff;
 }
 
-.wp-block-button__link:not(.has-background):active,
-.wp-block-button__link:not(.has-background):focus,
-.wp-block-button__link:not(.has-background):hover {
-	background-color: #444;
+.is-style-outline .wp-block-button__link:not(.has-text-color) {
+	color: #2590ec;
 }
 
 .wp-block-button.alignleft {