Scratchpad: Align quote icon to right when text is right aligned. See #594.

This commit is contained in:
Laurel Fulford 2019-02-15 17:02:43 -08:00
parent 9e1c08720e
commit e8368bffa8
2 changed files with 43 additions and 21 deletions

View file

@ -79,7 +79,8 @@ p.has-drop-cap:not(:focus)::first-letter {
/* Quote */
.wp-block-quote.is-large,
.wp-block-quote.is-style-large {
.wp-block-quote.is-style-large,
.rtl .wp-block-quote[style*="text-align:left"] {
padding-left: 70px;
padding-right: 0;
}
@ -101,11 +102,24 @@ p.has-drop-cap:not(:focus)::first-letter {
}
.rtl .wp-block-quote.is-large,
.rtl .wp-block-quote.is-style-large {
.rtl .wp-block-quote.is-style-large,
.wp-block-quote[style*="text-align:right"],
.wp-block-quote.is-large[style*="text-align:right"],
.wp-block-quote.is-style-large[style*="text-align:right"] {
padding-right: 70px;
padding-left: 0;
}
.wp-block-quote[style*="text-align:right"]::before {
left: auto;
right: 0;
}
.rtl .wp-block-quote[style*="text-align:left"]::before {
left: 0;
right: auto;
}
/* Audio */
.wp-block-audio {

View file

@ -296,21 +296,27 @@
/* Quote */
.editor-block-list__block .wp-block-quote:before {
.wp-block-quote:before {
background: url("images/icon-sprites.svg") 0 -408px no-repeat;
background-size: 100%;
content: "";
display: block;
height: 39px;
left: 0;
opacity: 0.2;
position: absolute;
top: 0;
width: 50px;
}
.editor-block-list__block .wp-block-quote:not(.is-large):not(.is-style-large),
.editor-block-list__block .wp-block-quote {
.wp-block-quote:before,
.rtl .wp-block-quote[style*="text-align:left"]:before,
.rtl .wp-block-quote[style*="text-align: left"]:before {
left: 0;
right: auto;
}
.wp-block-quote:not(.is-large):not(.is-style-large),
.wp-block-quote {
border: 0;
color: #aaa;
font-size: 22px;
@ -320,7 +326,9 @@
position: relative;
}
.rtl .editor-block-list__block .wp-block-quote:before {
.rtl .wp-block-quote:before,
.wp-block-quote[style*="text-align:right"]:before,
.wp-block-quote[style*="text-align: right"]:before {
left: auto;
right: 0;
}
@ -332,14 +340,26 @@
}
}
.rtl .editor-block-list__block .wp-block-quote:not(.is-large):not(.is-style-large),
.rtl .editor-block-list__block .wp-block-quote {
.rtl .wp-block-quote:not(.is-large):not(.is-style-large),
.rtl .wp-block-quote,
.wp-block-quote:not(.is-large):not(.is-style-large)[style*="text-align:right"],
.wp-block-quote:not(.is-large):not(.is-style-large)[style*="text-align: right"],
.wp-block-quote[style*="text-align:right"],
.wp-block-quote[style*="text-align: right"] {
border: 0;
margin: 0;
padding-left: 0;
padding-right: 70px;
}
.rtl .wp-block-quote:not(.is-large):not(.is-style-large)[style*="text-align:left"],
.rtl .wp-block-quote:not(.is-large):not(.is-style-large)[style*="text-align: left"],
.rtl .wp-block-quote[style*="text-align:left"],
.rtl .wp-block-quote[style*="text-align: left"] {
padding-left: 70px;
padding-right: 0;
}
.edit-post-visual-editor .editor-block-list__block blockquote p {
color: #aaa;
font-size: 22px;
@ -362,18 +382,6 @@
margin-bottom: 0;
}
.editor-block-list__block .wp-block-quote.alignleft {
margin: .75em 1.5em .75em 0;
}
.editor-block-list__block .wp-block-quote.alignright {
margin: .75em 0 .75em 1.5em;
}
.editor-block-list__block .wp-block-quote.aligncenter {
margin-bottom: .75em;
}
.wp-block-quote.is-large,
.wp-block-quote.is-style-large {
font-size: 32px;