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.
This commit is contained in:
parent
e76bd5d824
commit
23d1bd7f75
2 changed files with 106 additions and 17 deletions
|
@ -134,10 +134,8 @@ p.has-drop-cap:not(:focus)::first-letter {
|
|||
/* Button */
|
||||
|
||||
.wp-block-button .wp-block-button__link {
|
||||
background: #3863c1;
|
||||
border: 2px solid #3863c1;
|
||||
border-radius: 0;
|
||||
color: #fff;
|
||||
border: 2px solid #3863c1;
|
||||
font-family: Lato, sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
|
@ -146,14 +144,24 @@ p.has-drop-cap:not(:focus)::first-letter {
|
|||
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;
|
||||
color: #3863c1;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.wp-block-button__link.has-background.has-text-color {
|
||||
border-color: currentColor;
|
||||
}
|
||||
|
||||
/* Seperator */
|
||||
|
||||
.wp-block-separator:not(.is-style-wide) {
|
||||
|
@ -218,42 +226,82 @@ p.has-drop-cap:not(:focus)::first-letter {
|
|||
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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.has-white-color {
|
||||
.has-white-color,
|
||||
.has-white-color:hover,
|
||||
.has-white-color:focus,
|
||||
.has-white-color:active,
|
||||
.has-white-color:visited {
|
||||
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;
|
||||
}
|
||||
|
|
|
@ -43,7 +43,7 @@ Description: Used to style Gutenberg Blocks in the editor.
|
|||
.editor-post-title__block .editor-post-title__input {
|
||||
font-family: "Lato", sans-serif;
|
||||
font-size: 39px;
|
||||
font-weight: bold;
|
||||
font-weight: 900;
|
||||
line-height: 1.54;
|
||||
}
|
||||
|
||||
|
@ -498,6 +498,14 @@ p.has-drop-cap:not(:focus)::first-letter {
|
|||
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 */
|
||||
|
||||
.wp-block-separator {
|
||||
|
@ -510,9 +518,42 @@ p.has-drop-cap:not(:focus)::first-letter {
|
|||
6.0 Blocks - Widgets
|
||||
--------------------------------------------------------------*/
|
||||
|
||||
/* Archives, Categories & Latest Posts */
|
||||
|
||||
.editor-styles-wrapper .wp-block-archives ul,
|
||||
.editor-styles-wrapper .wp-block-categories ul,
|
||||
.editor-styles-wrapper .wp-block-categories ul ul,
|
||||
.editor-styles-wrapper .wp-block-latest-posts ul {
|
||||
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;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue