Sfoglia il codice sorgente

Radcliffe 2: Update styles for buttons; see #434.

Laurel Fulford 6 anni fa
parent
commit
063d2ff555

+ 15 - 0
radcliffe-2/assets/css/blocks-vintage.css

@@ -122,6 +122,21 @@ Description: Used to style Gutenberg Blocks.
 4.0 Blocks - Formatting
 --------------------------------------------------------------*/
 
+/* Button */
+
+.style-pack-vintage .wp-block-button__link {
+	border: 3px double #c7c4b4;
+}
+
+.style-pack-vintage .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-text-color) {
+	color: #fff;
+}
+
+.style-pack-vintage .wp-block-button .wp-block-button__link:focus,
+.style-pack-vintage .wp-block-button .wp-block-button__link:hover {
+	background-color: #2b6e9d;
+}
+
 /* Pullquote */
 
 .style-pack-vintage .wp-block-pullquote {

+ 65 - 11
radcliffe-2/assets/css/blocks.css

@@ -340,7 +340,6 @@ ul.wp-block-gallery li {
 /* Buttons */
 
 .wp-block-button .wp-block-button__link {
-	border-radius: 3px;
 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
 	font-size: 1.4rem;
 	font-size: 14px;
@@ -348,24 +347,20 @@ ul.wp-block-gallery li {
 	padding: 9px 18px;
 }
 
-.style-pack-colorful .wp-block-file .wp-block-file__button,
-.style-pack-modern .wp-block-file .wp-block-file__button {
-	font-family: inherit;
-}
-
 .wp-block-button__link {
 	background: #222;
 	color: #fff;
 }
 
-.wp-block-button__link:hover,
-.wp-block-button__link:focus {
-	opacity: 1.0;
+.is-style-outline .wp-block-button__link:not(.has-text-color) {
+	color: #222;
 }
 
-.wp-block-button__link:not(.has-background):hover,
-.wp-block-button__link:not(.has-background):focus {
+.entry-content .wp-block-button .wp-block-button__link:hover,
+.entry-content .wp-block-button .wp-block-button__link:focus {
 	background: #ca2017;
+	color: #fff;
+	text-decoration: none;
 }
 
 .wp-block-button.alignwide,
@@ -727,3 +722,62 @@ ul.wp-block-gallery li {
 .has-colorful-orange-background-color:visited {
 	background-color: #d97059
 }
+
+/* Vintage */
+
+.has-vintage-off-white-color,
+.has-vintage-off-white-color:hover,
+.has-vintage-off-white-color:active,
+.has-vintage-off-white-color:focus,
+.has-vintage-off-white-color:visited {
+	color: #fff;
+}
+
+.has-vintage-off-white-background-color,
+.has-vintage-off-white-background-color:hover,
+.has-vintage-off-white-background-color:active,
+.has-vintage-off-white-background-color:focus,
+.has-vintage-off-white-background-color:visited {
+	background-color: #fff;
+}
+
+.has-vintage-light-brown-color,
+.has-vintage-light-brown-color:hover,
+.has-vintage-light-brown-color:active,
+.has-vintage-light-brown-color:focus,
+.has-vintage-light-brown-color:visited {
+	color: #c7c4b4;
+}
+
+.has-vintage-light-brown-background-color,
+.has-vintage-light-brown-background-color:hover,
+.has-vintage-light-brown-background-color:active,
+.has-vintage-light-brown-background-color:focus,
+.has-vintage-light-brown-background-color:visited {
+	background-color: #c7c4b4;
+}
+
+.has-vintage-light-gray-color {
+	color: #666;
+}
+
+.has-vintage-light-gray-background-color {
+	background-color: #666;
+}
+
+.has-vintage-dark-gray-color {
+	color: #222;
+}
+
+.has-vintage-dark-gray-background-color {
+	background-color: #222;
+}
+
+.has-vintage-blue-color {
+	color: #2b6e9d;
+}
+
+.has-vintage-blue-background-color {
+	background-color: #2b6e9d;
+}
+

+ 0 - 9
radcliffe-2/assets/css/editor-style-modern.css

@@ -92,21 +92,12 @@ Description: Used to style Gutenberg Blocks in the editor.
 	color: #aaa;
 }
 
-.wp-block-file .wp-block-file__button:hover,
-.wp-block-file .wp-block-file__button:focus {
-	background-color: #aaa;
-}
-
 /*--------------------------------------------------------------
 4.0 Blocks - Formatting
 --------------------------------------------------------------*/
 
 /* Buttons */
 
-.wp-block-button__link:hover,
-.wp-block-button__link:focus {
-	background-color: #aaa;
-}
 
 /*--------------------------------------------------------------
 5.0 Blocks - Widgets

+ 0 - 7
radcliffe-2/assets/css/editor-style-vintage.css

@@ -221,16 +221,9 @@ Description: Used to style Gutenberg Blocks in the editor.
 
 .wp-block-button .wp-block-button__link {
 	border: 3px double #c7c4b4;
-	border-radius: 0;
 	font-family: 'Libre Baskerville', 'Helvetica Neue', Helvetica, arial, sans-serif;
 }
 
-.wp-block-button .wp-block-button__link:hover,
-.wp-block-button .wp-block-button__link:focus {
-	background-color: #2b6e9d;
-}
-
-
 .wp-block-pullquote,
 .wp-block-pullquote p,
 .wp-block-pullquote cite {

+ 0 - 13
radcliffe-2/assets/css/editor-style.css

@@ -481,12 +481,6 @@ p.has-drop-cap:not(:focus)::first-letter {
 	padding: 9px 18px;
 }
 
-.wp-block-file .wp-block-file__button:hover,
-.wp-block-file .wp-block-file__button:focus {
-	background: #ca2017;
-	opacity: 1.0;
-}
-
 /*--------------------------------------------------------------
 4.0 Blocks - Formatting
 --------------------------------------------------------------*/
@@ -617,8 +611,6 @@ p.has-drop-cap:not(:focus)::first-letter {
 /* Buttons */
 
 .wp-block-button .wp-block-button__link {
-	border: 0;
-	border-radius: 3px;
 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
 	font-size: 14px;
 	line-height: 1.25;
@@ -630,11 +622,6 @@ p.has-drop-cap:not(:focus)::first-letter {
 	background-color: #222;
 }
 
-.wp-block-button__link:hover,
-.wp-block-button__link:focus {
-	background-color: #ca2017;
-}
-
 .wp-block-button .wp-block-button__link[data-align="wide"],
 .wp-block-button .wp-block-button__link[data-align="full"],
 .wp-block-button.alignwide,

+ 1 - 1
radcliffe-2/functions.php

@@ -89,7 +89,7 @@ function radcliffe_2_setup() {
 			array(
 				'name'  => esc_html__( 'Vintage Off-White', 'radcliffe-2' ),
 				'slug'  => 'vintage-off-white',
-				'color' => '#3e69dc',
+				'color' => '#fff',
 			),
 			array(
 				'name'  => esc_html__( 'Vintage Light Brown', 'radcliffe-2' ),

+ 7 - 3
radcliffe-2/styles/colorful.css

@@ -139,24 +139,28 @@ a:visited,
 	color: #222;
 }
 
+.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-text-color) {
+	color: #fff;
+}
+
 button:hover,
 .button:hover,
 input[type="button"]:hover,
 input[type="reset"]:hover,
 input[type="submit"]:hover,
-.wp-block-button .wp-block-button__link:hover,
+.entry-content .wp-block-button .wp-block-button__link:hover,
 button:focus,
 .button:focus,
 input[type="button"]:focus,
 input[type="reset"]:focus,
 input[type="submit"]:focus,
-.wp-block-button .wp-block-button__link:focus,
+.entry-content .wp-block-button .wp-block-button__link:focus,
 button:active,
 .button:active,
 input[type="button"]:active,
 input[type="reset"]:active,
 input[type="submit"]:active,
-.wp-block-button .wp-block-button__link:active,
+.entry-content .wp-block-button .wp-block-button__link:active,
 .bypostauthor .by-post-author {
 	background-color: #d97059;
 }

+ 7 - 3
radcliffe-2/styles/modern.css

@@ -88,24 +88,28 @@ a:visited,
 	color: #aaa;
 }
 
+.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-text-color) {
+	color: #fff;
+}
+
 button:hover,
 .button:hover,
 input[type="button"]:hover,
 input[type="reset"]:hover,
 input[type="submit"]:hover,
-.wp-block-button .wp-block-button__link:hover,
+.entry-content .wp-block-button .wp-block-button__link:hover,
 button:focus,
 .button:focus,
 input[type="button"]:focus,
 input[type="reset"]:focus,
 input[type="submit"]:focus,
-.wp-block-button .wp-block-button__link:focus,
+.entry-content .wp-block-button .wp-block-button__link:focus,
 button:active,
 .button:active,
 input[type="button"]:active,
 input[type="reset"]:active,
 input[type="submit"]:active,
-.wp-block-button .wp-block-button__link:active,
+.entry-content .wp-block-button .wp-block-button__link:active,
 .bypostauthor .by-post-author,
 #infinite-handle span:hover {
 	background-color: #aaa;

+ 1 - 5
radcliffe-2/styles/vintage.css

@@ -21,9 +21,7 @@ button,
 .button,
 input[type="button"],
 input[type="reset"],
-input[type="submit"],
-.wp-block-button .wp-block-button__link,
-.wp-block-button a:not([style]) {
+input[type="submit"] {
 	border-radius: 0;
 	border: 3px double #c7c4b4;
 }
@@ -38,8 +36,6 @@ input[type="reset"]:hover,
 input[type="reset"]:focus,
 input[type="submit"]:hover,
 input[type="submit"]:focus,
-.wp-block-button .wp-block-button__link:hover,
-.wp-block-button .wp-block-button__link:focus,
 #infinite-handle span:hover,
 .bypostauthor .by-post-author {
 	background-color: #2b6e9d;