Button 2: Fix button styles; see #434.

This commit is contained in:
Laurel Fulford 2019-02-06 15:37:28 -08:00
parent 4007e950f7
commit c161dc981b

View file

@ -306,6 +306,37 @@ p.has-drop-cap:not(:focus)::first-letter {
display: inline-block;
}
/* File */
.wp-block-file .wp-block-file__button {
background: #bbb;
border-radius: 0;
border: 1px dashed white;
box-shadow: none;
color: #fff;
font-size: 14px;
font-weight: bold;
line-height: 1;
margin: 5px;
outline: 5px solid #bbb;
padding: .75em 1em;
text-shadow: none;
text-transform: uppercase;
transition: .3s;
}
.wp-block-file .wp-block-file__button:active,
.wp-block-file .wp-block-file__button:focus,
.wp-block-file .wp-block-file__button:hover {
background: #f78769;
outline: 5px solid #f78769;
box-shadow: none;
}
.wp-block-file .wp-block-file__button {
margin-left: 17px;
}
/*--------------------------------------------------------------
3.0 Blocks - Formatting
--------------------------------------------------------------*/
@ -331,28 +362,35 @@ p.has-drop-cap:not(:focus)::first-letter {
/* Buttons */
.wp-block-file .wp-block-file__button,
.wp-block-button .wp-block-button__link {
border-radius: 0;
border: 1px dashed white;
box-shadow: none;
font-size: 14px;
font-weight: bold;
line-height: 1;
margin: 5px;
position: relative;
padding: .75em 1em;
text-shadow: none;
text-transform: uppercase;
transition: .3s;
}
.wp-block-file .wp-block-file__button,
.wp-block-button__link:not(.has-background) {
.wp-block-button__link {
background: #bbb;
outline: 5px solid #bbb;
color: #fff;
}
.wp-block-button__link:not(.has-background) {
border: 1px dashed #fff;
box-shadow: 0 0 0 5px #bbb;
margin: 0 5px;
}
.wp-block-button__link.has-background,
.wp-block-button.is-style-outline .wp-block-button__link {
box-shadow: none;
margin: 0;
padding: calc( .75em + 5px ) calc( 1em + 5px );
}
.wp-block-file .wp-block-file__button,
a.wp-block-button__link:not(.has-text-color),
a.wp-block-button__link:not(.has-text-color):active,
a.wp-block-button__link:not(.has-text-color):focus,
@ -360,19 +398,27 @@ a.wp-block-button__link:not(.has-text-color):hover {
color: #fff;
}
.wp-block-file .wp-block-file__button:active,
.wp-block-file .wp-block-file__button:focus,
.wp-block-file .wp-block-file__button:hover,
.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: #f78769;
outline: 5px solid #f78769;
box-shadow: none;
.wp-block-button.is-style-outline .wp-block-button__link {
border-color: currentColor;
border-style: dashed;
border-width: 1px;
}
.wp-block-file .wp-block-file__button {
margin-left: 17px;
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color) {
color: #bbb;
}
.entry-content .wp-block-button .wp-block-button__link:active,
.entry-content .wp-block-button .wp-block-button__link:focus,
.entry-content .wp-block-button .wp-block-button__link:hover {
background: #f78769;
color: #fff;
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):active,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):focus,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background):hover {
box-shadow: 0 0 0 5px #f78769;
}
/* Seperator */
@ -424,6 +470,7 @@ hr.wp-block-separator {
.wp-block-latest-posts.is-grid {
margin: 0;
}
/*--------------------------------------------------------------
6.0 Blocks - Colors
--------------------------------------------------------------*/