Преглед изворни кода

Lodestar: Update styles for buttons; see #434.

Laurel Fulford пре 6 година
родитељ
комит
5f207a760f
2 измењених фајлова са 23 додато и 25 уклоњено
  1. 15 11
      lodestar/assets/css/blocks.css
  2. 8 14
      lodestar/assets/css/editor-blocks.css

+ 15 - 11
lodestar/assets/css/blocks.css

@@ -254,9 +254,8 @@ body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-
 /* Buttons */
 
 .wp-block-button .wp-block-button__link {
-	border: 0;
-	border-radius: 0;
 	box-shadow: none;
+	border: 0;
 	font-size: 14px;
 	font-size: 0.875rem;
 	letter-spacing: 0.05em;
@@ -267,21 +266,26 @@ body.lodestar-front-page:not(.has-sidebar) .lodestar-panel:not(.two-column) .wp-
 	transition: background 0.2s;
 }
 
-.wp-block-button__link {
+.wp-block-button__link,
+.wp-block-button__link:visited {
 	background: #29292a;
 	color: #fff;
 }
 
-.wp-block-button__link:hover,
-.wp-block-button__link:focus,
-.wp-block-button__link:active {
-	background: #555;
+.wp-block-button.is-style-outline .wp-block-button__link {
+	border: 2px solid currentColor;
 }
 
-.wp-block-button__link.has-background:hover,
-.wp-block-button__link.has-background:focus,
-.wp-block-button__link.has-background:active {
-	opacity: 0.8;
+.is-style-outline .wp-block-button__link:not(.has-text-color) {
+	color: #29292a;
+}
+
+.wp-block-button .wp-block-button__link:hover,
+.wp-block-button .wp-block-button__link:focus,
+.wp-block-button .wp-block-button__link:active {
+	background: #555;
+	color: #fff;
+	box-shadow: none;
 }
 
 /* Separator */

+ 8 - 14
lodestar/assets/css/editor-blocks.css

@@ -42,7 +42,7 @@ Description: Used to style Gutenberg Blocks in the editor.
 	font-size: 34px;
 	font-weight: 800;
 	letter-spacing: 0.1em;
-	line-height: 1.25;	
+	line-height: 1.25;
 }
 
 /* Headings */
@@ -322,12 +322,6 @@ p.has-drop-cap:not(:focus)::first-letter {
 	transition: background 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: #555;
-}
-
 /*--------------------------------------------------------------
 4.0 Blocks - Formatting
 --------------------------------------------------------------*/
@@ -409,8 +403,6 @@ p.has-drop-cap:not(:focus)::first-letter {
 
 .wp-block-button .wp-block-button__link {
 	background: #29292a;
-	border: 0;
-	border-radius: 0;
 	box-shadow: none;
 	color: #fff;
 	font-size: 14px;
@@ -418,15 +410,17 @@ p.has-drop-cap:not(:focus)::first-letter {
 	letter-spacing: 0.05em;
 	line-height: 1;
 	padding: 1em 1.5em;
-	text-shadow: none;
 	text-transform: uppercase;
 	transition: background 0.2s;
 }
 
-.wp-block-button__link:hover,
-.wp-block-button__link:focus,
-.wp-block-button__link:active {
-	background: #555;
+.wp-block-button.is-style-outline .wp-block-button__link {
+	border: 2px solid currentColor;
+	background: transparent;
+}
+
+.wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color) {
+	color: #29292a;
 }
 
 /* Separator */