Sfoglia il codice sorgente

Gazette: Minor fixes to Gutenberg styles, including:
* Updating button styles to account for the border.
* Making colour style selectors more specific.
* Fix comment widget styles in the editor.

Laurel Fulford 6 anni fa
parent
commit
23d1bd7f75
2 ha cambiato i file con 106 aggiunte e 17 eliminazioni
  1. 64 16
      gazette/css/blocks.css
  2. 42 1
      gazette/css/editor-blocks.css

+ 64 - 16
gazette/css/blocks.css

@@ -134,10 +134,8 @@ p.has-drop-cap:not(:focus)::first-letter {
 /* Button */
 /* Button */
 
 
 .wp-block-button .wp-block-button__link {
 .wp-block-button .wp-block-button__link {
-	background: #3863c1;
-	border: 2px solid #3863c1;
 	border-radius: 0;
 	border-radius: 0;
-	color: #fff;
+	border: 2px solid #3863c1;
 	font-family: Lato, sans-serif;
 	font-family: Lato, sans-serif;
 	font-size: 16px;
 	font-size: 16px;
 	font-weight: bold;
 	font-weight: bold;
@@ -146,14 +144,24 @@ p.has-drop-cap:not(:focus)::first-letter {
 	text-transform: uppercase;
 	text-transform: uppercase;
 }
 }
 
 
-.wp-block-button .wp-block-button__link:active,
-.wp-block-button .wp-block-button__link:focus,
-.wp-block-button .wp-block-button__link:hover {
+.wp-block-button__link,
+.wp-block-button__link:visited {
+	background: #3863c1;
+	color: #fff;
+}
+
+.wp-block-button__link:active,
+.wp-block-button__link:focus,
+.wp-block-button__link:hover {
 	background: #fff;
 	background: #fff;
 	color: #3863c1;
 	color: #3863c1;
 	outline: none;
 	outline: none;
 }
 }
 
 
+.wp-block-button__link.has-background.has-text-color {
+	border-color: currentColor;
+}
+
 /* Seperator */
 /* Seperator */
 
 
 .wp-block-separator:not(.is-style-wide) {
 .wp-block-separator:not(.is-style-wide) {
@@ -218,42 +226,82 @@ p.has-drop-cap:not(:focus)::first-letter {
 6.0 Blocks - Colors
 6.0 Blocks - Colors
 --------------------------------------------------------------*/
 --------------------------------------------------------------*/
 
 
-.has-blue-color {
+.has-blue-color,
+.has-blue-color:hover,
+.has-blue-color:focus,
+.has-blue-color:active,
+.has-blue-color:visited {
 	color: #3863c1;
 	color: #3863c1;
 }
 }
 
 
-.has-blue-background-color {
+.has-blue-background-color,
+.has-blue-background-color:hover,
+.has-blue-background-color:focus,
+.has-blue-background-color:active,
+.has-blue-background-color:visited {
 	background-color: #3863c1;
 	background-color: #3863c1;
 }
 }
 
 
-.has-dark-gray-color {
+.has-dark-gray-color,
+.has-dark-gray-color:hover,
+.has-dark-gray-color:focus,
+.has-dark-gray-color:active,
+.has-dark-gray-color:visited {
 	color: #222;
 	color: #222;
 }
 }
 
 
-.has-dark-gray-background-color {
+.has-dark-gray-background-color,
+.has-dark-gray-background-color:hover,
+.has-dark-gray-background-color:focus,
+.has-dark-gray-background-color:active,
+.has-dark-gray-background-color:visited {
 	background-color: #222;
 	background-color: #222;
 }
 }
 
 
-.has-medium-gray-color {
+.has-medium-gray-color,
+.has-medium-gray-color:hover,
+.has-medium-gray-color:focus,
+.has-medium-gray-color:active,
+.has-medium-gray-color:visited {
 	color: #777;
 	color: #777;
 }
 }
 
 
-.has-medium-gray-background-color {
+.has-medium-gray-background-color,
+.has-medium-gray-background-color:hover,
+.has-medium-gray-background-color:focus,
+.has-medium-gray-background-color:active,
+.has-medium-gray-background-color:visited {
 	background-color: #777;
 	background-color: #777;
 }
 }
 
 
-.has-light-gray-color {
+.has-light-gray-color,
+.has-light-gray-color:hover,
+.has-light-gray-color:focus,
+.has-light-gray-color:active,
+.has-light-gray-color:visited {
 	color: #ddd;
 	color: #ddd;
 }
 }
 
 
-.has-light-gray-background-color {
+.has-light-gray-background-color,
+.has-light-gray-background-color:hover,
+.has-light-gray-background-color:focus,
+.has-light-gray-background-color:active,
+.has-light-gray-background-color:visited {
 	background-color: #ddd;
 	background-color: #ddd;
 }
 }
 
 
-.has-white-color {
+.has-white-color,
+.has-white-color:hover,
+.has-white-color:focus,
+.has-white-color:active,
+.has-white-color:visited {
 	color: #fff;
 	color: #fff;
 }
 }
 
 
-.has-white-background-color {
+.has-white-background-color,
+.has-white-background-color:hover,
+.has-white-background-color:focus,
+.has-white-background-color:active,
+.has-white-background-color:visited {
 	background-color: #fff;
 	background-color: #fff;
 }
 }

+ 42 - 1
gazette/css/editor-blocks.css

@@ -43,7 +43,7 @@ Description: Used to style Gutenberg Blocks in the editor.
 .editor-post-title__block .editor-post-title__input {
 .editor-post-title__block .editor-post-title__input {
 	font-family: "Lato", sans-serif;
 	font-family: "Lato", sans-serif;
 	font-size: 39px;
 	font-size: 39px;
-	font-weight: bold;
+	font-weight: 900;
 	line-height: 1.54;
 	line-height: 1.54;
 }
 }
 
 
@@ -498,6 +498,14 @@ p.has-drop-cap:not(:focus)::first-letter {
 	outline: none;
 	outline: none;
 }
 }
 
 
+.wp-block-button__link.has-background.has-text-color {
+	border-color: currentColor;
+}
+
+.wp-block-button .editor-rich-text__tinymce.mce-content-body {
+	line-height: 30px;
+}
+
 /* Seperator */
 /* Seperator */
 
 
 .wp-block-separator {
 .wp-block-separator {
@@ -510,9 +518,42 @@ p.has-drop-cap:not(:focus)::first-letter {
 6.0 Blocks - Widgets
 6.0 Blocks - Widgets
 --------------------------------------------------------------*/
 --------------------------------------------------------------*/
 
 
+/* Archives, Categories & Latest Posts */
+
 .editor-styles-wrapper .wp-block-archives ul,
 .editor-styles-wrapper .wp-block-archives ul,
 .editor-styles-wrapper .wp-block-categories ul,
 .editor-styles-wrapper .wp-block-categories ul,
 .editor-styles-wrapper .wp-block-categories ul ul,
 .editor-styles-wrapper .wp-block-categories ul ul,
 .editor-styles-wrapper .wp-block-latest-posts ul {
 .editor-styles-wrapper .wp-block-latest-posts ul {
 	list-style: square inside;
 	list-style: square inside;
 }
 }
+
+/* Latest Comments */
+
+.wp-block-latest-comments__comment,
+.edit-post-visual-editor .editor-block-list__block .wp-block-latest-comments__comment-excerpt p {
+	font-size: 16px;
+}
+
+.wp-block-latest-comments__comment:not(:last-child) {
+	border-bottom: 1px solid #eee;
+	margin-bottom: 30px;
+	padding-bottom: 10px;
+}
+
+.wp-block-latest-comments__comment-meta,
+.wp-block-latest-comments__comment-date {
+	font-family: "Lato", sans-serif;
+}
+
+.wp-block-latest-comments__comment-meta a {
+	font-weight: bold;
+}
+
+.wp-block-latest-comments__comment-date {
+	color: #777;
+	font-size: 13px;
+	font-weight: bold;
+	margin-top: 0.5em;
+	text-transform: uppercase;
+}
+