WordPress.org
Get WordPress

Make WordPress Core

Ticket #45045: 45045.1.diff

File 45045.1.diff, 30.0 KB (added by ianbelanger, 6 years ago)

Adds some Wide and Full Alignment support, definitely not complete but does add to the original patch

  • src/wp-content/themes/twentyseventeen/assets/css/blocks.css

     
     1/*
     2Theme Name: Twenty Seventeen
     3Description: Used to style Gutenberg Blocks.
     4*/
     5
     6/*--------------------------------------------------------------
     7>>> TABLE OF CONTENTS:
     8----------------------------------------------------------------
     91.0 Blocks - Common Blocks
     102.0 Blocks - Formatting
     113.0 Blocks - Layout Elements
     124.0 Blocks - Widgets
     135.0 Blocks - Embeds
     146.0 Blocks - Wide Alignments
     15--------------------------------------------------------------*/
     16
     17/*--------------------------------------------------------------
     181.0 Blocks - Common Blocks
     19--------------------------------------------------------------*/
     20
     21/* Paragraph */
     22
     23p.has-drop-cap:not(:focus)::first-letter {
     24        font-size: 5em;
     25        line-height: 0.68;
     26        margin: 0.05em 0.1em 0 0;
     27        text-transform: uppercase;
     28        font-style: normal;
     29}
     30
     31/* Image */
     32
     33.wp-block-image figure {
     34        margin-bottom: 0;
     35        margin-top: 0;
     36}
     37
     38/* Quote */
     39
     40.wp-block-quote.alignleft p:last-of-type,
     41.wp-block-quote.alignright p:last-of-type {
     42        margin-bottom: 0;
     43}
     44
     45/* Audio */
     46
     47.wp-block-audio audio {
     48        display: block;
     49        width: 100%;
     50}
     51
     52/* File */
     53
     54.wp-block-file .wp-block-file__button {
     55        background-color: #222;
     56        -webkit-border-radius: 2px;
     57        border-radius: 2px;
     58        -webkit-box-shadow: none;
     59        box-shadow: none;
     60        color: #fff;
     61        display: inline-block;
     62        font-size: 14px;
     63        font-size: 0.875rem;
     64        font-weight: 800;
     65        margin-top: 2em;
     66        padding: 0.7em 2em;
     67        -webkit-transition: background-color 0.2s ease-in-out;
     68        transition: background-color 0.2s ease-in-out;
     69        white-space: nowrap;
     70}
     71
     72.wp-block-file .wp-block-file__button:hover,
     73.wp-block-file .wp-block-file__button:focus {
     74        background-color: #767676;
     75        -webkit-box-shadow: none;
     76        box-shadow: none;
     77}
     78
     79/* Cover Image */
     80
     81.wp-block-cover-image.alignright,
     82.wp-block-cover-image.alignleft,
     83.wp-block-cover-image.aligncenter {
     84    display: flex;
     85}
     86
     87/* Gallery */
     88
     89.wp-block-gallery.aligncenter {
     90    display: flex;
     91    margin: 0 -8px;
     92}
     93
     94/*--------------------------------------------------------------
     952.0 Blocks - Formatting
     96--------------------------------------------------------------*/
     97
     98/* Code */
     99
     100.wp-block-code {
     101        background: transparent;
     102        padding: 0;
     103}
     104
     105/*--------------------------------------------------------------
     1063.0 Blocks - Layout Elements
     107--------------------------------------------------------------*/
     108
     109/* Separator */
     110
     111.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
     112    max-width: 100px;
     113}
     114
     115/* Buttons */
     116
     117.wp-block-button .wp-block-button__link {
     118        background-color: #222;
     119        -webkit-border-radius: 2px;
     120        border-radius: 2px;
     121        -webkit-box-shadow: none;
     122        box-shadow: none;
     123        color: #fff;
     124        display: inline-block;
     125        font-size: 14px;
     126        font-size: 0.875rem;
     127        font-weight: 800;
     128        line-height: 1.66;
     129        margin-top: 2em;
     130        padding: 0.7em 2em;
     131        -webkit-transition: background-color 0.2s ease-in-out;
     132        transition: background-color 0.2s ease-in-out;
     133        white-space: nowrap;
     134}
     135
     136.wp-block-button .wp-block-button__link:hover,
     137.wp-block-button .wp-block-button__link:focus {
     138        background-color: #767676;
     139        -webkit-box-shadow: none;
     140        box-shadow: none;
     141}
     142
     143/*--------------------------------------------------------------
     1444.0 Blocks - Widgets
     145--------------------------------------------------------------*/
     146
     147/* Comments */
     148
     149.wp-block-latest-comments article {
     150        margin-bottom: 4em;
     151}
     152
     153.blog:not(.has-sidebar) #primary .wp-block-latest-comments article,
     154.archive:not(.page-one-column):not(.has-sidebar) #primary .wp-block-latest-comments article,
     155.search:not(.has-sidebar) #primary .wp-block-latest-comments article {
     156        float: none;
     157        width: 100%;
     158}
     159
     160.wp-block-latest-comments .avatar,
     161.wp-block-latest-comments__comment-avatar {
     162        border-radius: 0;
     163}
     164
     165.wp-block-latest-comments a {
     166        -webkit-box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1);
     167        box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1);
     168
     169}
     170
     171.wp-block-latest-comments__comment-meta {
     172        font-size: 16px;
     173        font-size: 1rem;
     174        margin-bottom: 0.4em;
     175}
     176
     177.wp-block-latest-comments__comment-author,
     178.wp-block-latest-comments__comment-link {
     179        font-weight: 700;
     180        text-decoration: none;
     181}
     182
     183.wp-block-latest-comments__comment-date {
     184        color: #767676;
     185        font-size: 10px;
     186        font-size: 0.625rem;
     187        font-weight: 800;
     188        letter-spacing: 0.1818em;
     189        margin-top: 0.4em;
     190        text-transform: uppercase;
     191}
     192
     193.editor-block-list__block .wp-block-latest-comments__comment-excerpt p {
     194        font-size: 14px;
     195        font-size: 0.875rem;
     196}
     197
     198/*--------------------------------------------------------------
     1995.0 Blocks - Embeds
     200--------------------------------------------------------------*/
     201
     202/*--------------------------------------------------------------
     2036.0 Blocks - Wide Alignments
     204--------------------------------------------------------------*/
     205
     206/* Wide and Full Alignments */
     207body:not(.has-sidebar):not(.blog) .wp-block-image.alignfull,
     208body:not(.has-sidebar):not(.blog) .wp-block-image.alignwide,
     209body:not(.has-sidebar):not(.blog) .wp-block-cover-image.alignfull,
     210body:not(.has-sidebar):not(.blog) .wp-block-cover-image.alignwide,
     211body:not(.has-sidebar):not(.blog) .wp-block-gallery.alignfull,
     212body:not(.has-sidebar):not(.blog) .wp-block-audio.alignfull,
     213body:not(.has-sidebar):not(.blog) .wp-block-audio.alignwide {
     214        width: 100vw;
     215        position: relative;
     216        left: 50%;
     217        right: 50%;
     218        margin-left: -50vw;
     219        margin-right: -50vw;
     220        max-width: none;
     221        text-align: center;
     222}
     223
     224body:not(.has-sidebar):not(.blog) .wp-block-audio.alignfull,
     225body:not(.has-sidebar):not(.blog) .wp-block-audio.alignwide {
     226        width: 98vw;
     227        margin-left: -49vw;
     228        margin-right: -49vw;
     229}
     230
     231body:not(.has-sidebar):not(.blog) .wp-block-audio.alignwide audio {
     232        display: inline;
     233        max-width: 1024px;
     234        width: 100%;
     235}
     236
     237body:not(.has-sidebar):not(.blog) .wp-block-file.alignfull,
     238body:not(.has-sidebar):not(.blog) .wp-block-file.alignwide {
     239}
     240
     241body:not(.has-sidebar):not(.blog) .wp-block-image.alignfull img,
     242body:not(.has-sidebar):not(.blog) .wp-block-cover-image.alignfull img {
     243        max-width: none;
     244        width: 100%;
     245}
     246
     247body:not(.has-sidebar):not(.blog) .wp-block-image.alignwide img,
     248body:not(.has-sidebar):not(.blog) .wp-block-cover-image.alignwide img {
     249        max-width: 1024px;
     250        width: 100%;
     251}
     252 No newline at end of file

  • src/wp-content/themes/twentyseventeen/assets/css/editor-blocks.css 

    Property changes on: src/wp-content/themes/twentyseventeen/assets/css/blocks.css
___________________________________________________________________
Added: svn:executable
## -0,0 +1 ##
+*
\ No newline at end of property
     
     1/*
     2Theme Name: Twenty Seventeen
     3Description: Used to style Gutenberg Blocks in the editor.
     4*/
     5
     6/*--------------------------------------------------------------
     7>>> TABLE OF CONTENTS:
     8----------------------------------------------------------------
     91.0 General Typography
     102.0 General Block Settings
     113.0 Blocks - Common Blocks
     124.0 Blocks - Formatting
     135.0 Blocks - Layout Elements
     146.0 Blocks - Widgets
     157.0 Blocks - Embeds
     168.0 Blocks - Wide Alignments
     17--------------------------------------------------------------*/
     18
     19/*--------------------------------------------------------------
     201.0 General Typography
     21--------------------------------------------------------------*/
     22
     23.edit-post-visual-editor .editor-block-list__block,
     24.editor-default-block-appender input[type="text"].editor-default-block-appender__content {
     25        font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
     26        font-size: 15px;
     27        font-size: 0.9375rem;
     28        font-weight: 400;
     29        line-height: 1.66;
     30}
     31
     32.edit-post-visual-editor .editor-block-list__block {
     33        color: #333;
     34}
     35
     36.edit-post-visual-editor h1 {
     37        font-size: 24px;
     38        font-size: 1.5rem;
     39        font-weight: 300;
     40}
     41
     42.edit-post-visual-editor h2,
     43.editor-post-title__block .editor-post-title__input {
     44        color: #666;
     45        font-size: 20px;
     46        font-size: 1.25rem;
     47        font-weight: 300;
     48}
     49
     50.editor-post-title__block .editor-post-title__input {
     51        color: #333;
     52        font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
     53}
     54
     55.edit-post-visual-editor h3 {
     56        color: #333;
     57        font-size: 18px;
     58        font-size: 1.125rem;
     59        font-weight: 300;
     60}
     61
     62.edit-post-visual-editor h4 {
     63        color: #333;
     64        font-size: 16px;
     65        font-size: 1rem;
     66        font-weight: 800;
     67}
     68
     69.edit-post-visual-editor h5 {
     70        color: #767676;
     71        font-size: 13px;
     72        font-size: 0.8125rem;
     73        font-weight: 800;
     74        letter-spacing: 0.15em;
     75        text-transform: uppercase;
     76}
     77
     78.edit-post-visual-editor h6 {
     79        color: #333;
     80        font-size: 15px;
     81        font-size: 0.9375rem;
     82        font-weight: 800;
     83}
     84
     85@media screen and (min-width: 30em) {
     86
     87        .edit-post-visual-editor .editor-block-list__block {
     88                font-size: 18px;
     89                font-size: 1.125rem;
     90        }
     91
     92        .edit-post-visual-editor h1 {
     93                font-size: 30px;
     94                font-size: 1.875rem;
     95        }
     96
     97        .edit-post-visual-editor h2,
     98        .editor-post-title__block .editor-post-title__input {
     99                font-size: 26px;
     100                font-size: 1.625rem;
     101        }
     102
     103        .edit-post-visual-editor h3 {
     104                font-size: 22px;
     105                font-size: 1.375rem;
     106        }
     107
     108        .edit-post-visual-editor h4 {
     109                font-size: 18px;
     110                font-size: 1.125rem;
     111        }
     112
     113        .edit-post-visual-editor h5 {
     114                font-size: 13px;
     115                font-size: 0.8125rem;
     116        }
     117
     118        .edit-post-visual-editor h6 {
     119                font-size: 16px;
     120                font-size: 1rem;
     121        }
     122}
     123
     124@media screen and (min-width: 48em) {
     125
     126        .edit-post-visual-editor .editor-block-list__block {
     127                font-size: 16px;
     128                font-size: 1rem;
     129                line-height: 1.5;
     130        }
     131}
     132
     133/* Typography for Arabic Font */
     134
     135html[lang="ar"] .edit-post-visual-editor .editor-block-list__block,
     136html[lang="ary"] .edit-post-visual-editor .editor-block-list__block,
     137html[lang="azb"] .edit-post-visual-editor .editor-block-list__block,
     138html[lang="fa-IR"] .edit-post-visual-editor .editor-block-list__block,
     139html[lang="haz"] .edit-post-visual-editor .editor-block-list__block,
     140html[lang="ps"] .edit-post-visual-editor .editor-block-list__block,
     141html[lang="ur"] .edit-post-visual-editor .editor-block-list__block {
     142        font-family: Tahoma, Arial, sans-serif;
     143}
     144
     145html[lang="ar"] .edit-post-visual-editor h1,
     146html[lang="ar"] .edit-post-visual-editor h2,
     147html[lang="ar"] .edit-post-visual-editor h3,
     148html[lang="ar"] .edit-post-visual-editor h4,
     149html[lang="ar"] .edit-post-visual-editor h5,
     150html[lang="ar"] .edit-post-visual-editor h6,
     151html[lang="ary"] .edit-post-visual-editor h1,
     152html[lang="ary"] .edit-post-visual-editor h2,
     153html[lang="ary"] .edit-post-visual-editor h3,
     154html[lang="ary"] .edit-post-visual-editor h4,
     155html[lang="ary"] .edit-post-visual-editor h5,
     156html[lang="ary"] .edit-post-visual-editor h6,
     157html[lang="azb"] .edit-post-visual-editor h1,
     158html[lang="azb"] .edit-post-visual-editor h2,
     159html[lang="azb"] .edit-post-visual-editor h3,
     160html[lang="azb"] .edit-post-visual-editor h4,
     161html[lang="azb"] .edit-post-visual-editor h5,
     162html[lang="azb"] .edit-post-visual-editor h6,
     163html[lang="fa-IR"] .edit-post-visual-editor h1,
     164html[lang="fa-IR"] .edit-post-visual-editor h2,
     165html[lang="fa-IR"] .edit-post-visual-editor h3,
     166html[lang="fa-IR"] .edit-post-visual-editor h4,
     167html[lang="fa-IR"] .edit-post-visual-editor h5,
     168html[lang="fa-IR"] .edit-post-visual-editor h6,
     169html[lang="haz"] .edit-post-visual-editor h1,
     170html[lang="haz"] .edit-post-visual-editor h2,
     171html[lang="haz"] .edit-post-visual-editor h3,
     172html[lang="haz"] .edit-post-visual-editor h4,
     173html[lang="haz"] .edit-post-visual-editor h5,
     174html[lang="haz"] .edit-post-visual-editor h6,
     175html[lang="ps"] .edit-post-visual-editor h1,
     176html[lang="ps"] .edit-post-visual-editor h2,
     177html[lang="ps"] .edit-post-visual-editor h3,
     178html[lang="ps"] .edit-post-visual-editor h4,
     179html[lang="ps"] .edit-post-visual-editor h5,
     180html[lang="ps"] .edit-post-visual-editor h6,
     181html[lang="ur"] .edit-post-visual-editor h1,
     182html[lang="ur"] .edit-post-visual-editor h2,
     183html[lang="ur"] .edit-post-visual-editor h3,
     184html[lang="ur"] .edit-post-visual-editor h4,
     185html[lang="ur"] .edit-post-visual-editor h5,
     186html[lang="ur"] .edit-post-visual-editor h6 {
     187        font-weight: 700;
     188}
     189
     190/* Typography for Chinese Font */
     191
     192html[lang^="zh-"] .edit-post-visual-editor .editor-block-list__block,
     193html[lang="zh-CN"] .edit-post-visual-editor .editor-block-list__block {
     194        font-family: "PingFang TC", "Helvetica Neue", Helvetica, STHeitiTC-Light, Arial, sans-serif;
     195}
     196
     197html[lang^="zh-"] .edit-post-visual-editor h1,
     198html[lang^="zh-"] .edit-post-visual-editor h2,
     199html[lang^="zh-"] .edit-post-visual-editor h3,
     200html[lang^="zh-"] .edit-post-visual-editor h4,
     201html[lang^="zh-"] .edit-post-visual-editor h5,
     202html[lang^="zh-"] .edit-post-visual-editor h6 {
     203        font-weight: 700;
     204}
     205
     206/* Typography for Cyrillic Font */
     207
     208html[lang="bg-BG"] .edit-post-visual-editor .editor-block-list__block,
     209html[lang="ru-RU"] .edit-post-visual-editor .editor-block-list__block,
     210html[lang="uk"] .edit-post-visual-editor .editor-block-list__block {
     211        font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;
     212}
     213
     214html[lang="bg-BG"] .edit-post-visual-editor h1,
     215html[lang="bg-BG"] .edit-post-visual-editor h2,
     216html[lang="bg-BG"] .edit-post-visual-editor h3,
     217html[lang="bg-BG"] .edit-post-visual-editor h4,
     218html[lang="bg-BG"] .edit-post-visual-editor h5,
     219html[lang="bg-BG"] .edit-post-visual-editor h6,
     220html[lang="ru-RU"] .edit-post-visual-editor h1,
     221html[lang="ru-RU"] .edit-post-visual-editor h2,
     222html[lang="ru-RU"] .edit-post-visual-editor h3,
     223html[lang="ru-RU"] .edit-post-visual-editor h4,
     224html[lang="ru-RU"] .edit-post-visual-editor h5,
     225html[lang="ru-RU"] .edit-post-visual-editor h6,
     226html[lang="uk"] .edit-post-visual-editor h1,
     227html[lang="uk"] .edit-post-visual-editor h2,
     228html[lang="uk"] .edit-post-visual-editor h3,
     229html[lang="uk"] .edit-post-visual-editor h4,
     230html[lang="uk"] .edit-post-visual-editor h5,
     231html[lang="uk"] .edit-post-visual-editor h6 {
     232        font-weight: 700;
     233        line-height: 1.2;
     234}
     235
     236/* Typography for Devanagari Font */
     237
     238html[lang="bn-BD"] .edit-post-visual-editor .editor-block-list__block,
     239html[lang="hi-IN"] .edit-post-visual-editor .editor-block-list__block,
     240html[lang="mr-IN"] .edit-post-visual-editor .editor-block-list__block {
     241        font-family: Arial, sans-serif;
     242}
     243
     244html[lang="bn-BD"] .edit-post-visual-editor h1,
     245html[lang="bn-BD"] .edit-post-visual-editor h2,
     246html[lang="bn-BD"] .edit-post-visual-editor h3,
     247html[lang="bn-BD"] .edit-post-visual-editor h4,
     248html[lang="bn-BD"] .edit-post-visual-editor h5,
     249html[lang="bn-BD"] .edit-post-visual-editor h6,
     250html[lang="hi-IN"] .edit-post-visual-editor h1,
     251html[lang="hi-IN"] .edit-post-visual-editor h2,
     252html[lang="hi-IN"] .edit-post-visual-editor h3,
     253html[lang="hi-IN"] .edit-post-visual-editor h4,
     254html[lang="hi-IN"] .edit-post-visual-editor h5,
     255html[lang="hi-IN"] .edit-post-visual-editor h6,
     256html[lang="mr-IN"] .edit-post-visual-editor h1,
     257html[lang="mr-IN"] .edit-post-visual-editor h2,
     258html[lang="mr-IN"] .edit-post-visual-editor h3,
     259html[lang="mr-IN"] .edit-post-visual-editor h4,
     260html[lang="mr-IN"] .edit-post-visual-editor h5,
     261html[lang="mr-IN"] .edit-post-visual-editor h6 {
     262        font-weight: 700;
     263}
     264
     265/* Typography for Greek Font */
     266
     267html[lang="el"] .edit-post-visual-editor .editor-block-list__block {
     268        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     269}
     270
     271html[lang="el"] .edit-post-visual-editor h1,
     272html[lang="el"] .edit-post-visual-editor h2,
     273html[lang="el"] .edit-post-visual-editor h3,
     274html[lang="el"] .edit-post-visual-editor h4,
     275html[lang="el"] .edit-post-visual-editor h5,
     276html[lang="el"] .edit-post-visual-editor h6 {
     277        font-weight: 700;
     278        line-height: 1.3;
     279}
     280
     281/* Typography for Gujarati Font */
     282
     283html[lang="gu-IN"] .edit-post-visual-editor .editor-block-list__block {
     284        font-family: Arial, sans-serif;
     285}
     286
     287html[lang="gu-IN"] .edit-post-visual-editor h1,
     288html[lang="gu-IN"] .edit-post-visual-editor h2,
     289html[lang="gu-IN"] .edit-post-visual-editor h3,
     290html[lang="gu-IN"] .edit-post-visual-editor h4,
     291html[lang="gu-IN"] .edit-post-visual-editor h5,
     292html[lang="gu-IN"] .edit-post-visual-editor h6 {
     293        font-weight: 700;
     294}
     295
     296/* Typography for Hebrew Font */
     297
     298html[lang="he-IL"] .edit-post-visual-editor .editor-block-list__block {
     299        font-family: "Arial Hebrew", Arial, sans-serif;
     300}
     301
     302html[lang="he-IL"] .edit-post-visual-editor h1,
     303html[lang="he-IL"] .edit-post-visual-editor h2,
     304html[lang="he-IL"] .edit-post-visual-editor h3,
     305html[lang="he-IL"] .edit-post-visual-editor h4,
     306html[lang="he-IL"] .edit-post-visual-editor h5,
     307html[lang="he-IL"] .edit-post-visual-editor h6 {
     308        font-weight: 700;
     309}
     310
     311/* Typography for Japanese Font */
     312
     313html[lang="ja"] .edit-post-visual-editor .editor-block-list__block {
     314        font-family: "Hiragino Kaku Gothic Pro", Meiryo, sans-serif;
     315}
     316
     317html[lang="ja"] .edit-post-visual-editor h1,
     318html[lang="ja"] .edit-post-visual-editor h2,
     319html[lang="ja"] .edit-post-visual-editor h3,
     320html[lang="ja"] .edit-post-visual-editor h4,
     321html[lang="ja"] .edit-post-visual-editor h5,
     322html[lang="ja"] .edit-post-visual-editor h6 {
     323        font-weight: 700;
     324}
     325
     326/* Typography for Korean font */
     327
     328html[lang="ko-KR"] .edit-post-visual-editor .editor-block-list__block {
     329        font-family: "Apple SD Gothic Neo", "Malgun Gothic", "Nanum Gothic", Dotum, sans-serif;
     330}
     331
     332html[lang="ko-KR"] .edit-post-visual-editor h1,
     333html[lang="ko-KR"] .edit-post-visual-editor h2,
     334html[lang="ko-KR"] .edit-post-visual-editor h3,
     335html[lang="ko-KR"] .edit-post-visual-editor h4,
     336html[lang="ko-KR"] .edit-post-visual-editor h5,
     337html[lang="ko-KR"] .edit-post-visual-editor h6 {
     338        font-weight: 600;
     339}
     340
     341/* Typography for Thai Font */
     342
     343html[lang="th"] .edit-post-visual-editor .editor-block-list__block {
     344        line-height: 1.8;
     345        font-family: "Sukhumvit Set", "Helvetica Neue", Helvetica, Arial, sans-serif;
     346}
     347
     348html[lang="th"] .edit-post-visual-editor h1,
     349html[lang="th"] .edit-post-visual-editor h2,
     350html[lang="th"] .edit-post-visual-editor h3,
     351html[lang="th"] .edit-post-visual-editor h4,
     352html[lang="th"] .edit-post-visual-editor h5,
     353html[lang="th"] .edit-post-visual-editor h6 {
     354        line-height: 1.65;
     355        font-family: "Sukhumvit Set", "Helvetica Neue", Helvetica, Arial, sans-serif;
     356}
     357
     358/* Remove letter-spacing for all non-latin alphabets */
     359
     360html[lang="ar"] .edit-post-visual-editor *,
     361html[lang="ary"] .edit-post-visual-editor *,
     362html[lang="azb"] .edit-post-visual-editor *,
     363html[lang="haz"] .edit-post-visual-editor *,
     364html[lang="ps"] .edit-post-visual-editor *,
     365html[lang^="zh-"] .edit-post-visual-editor *,
     366html[lang="bg-BG"] .edit-post-visual-editor *,
     367html[lang="ru-RU"] .edit-post-visual-editor *,
     368html[lang="uk"] .edit-post-visual-editor *,
     369html[lang="bn-BD"] .edit-post-visual-editor *,
     370html[lang="hi-IN"] .edit-post-visual-editor *,
     371html[lang="mr-IN"] .edit-post-visual-editor *,
     372html[lang="el"] .edit-post-visual-editor *,
     373html[lang="gu-IN"] .edit-post-visual-editor *,
     374html[lang="he-IL"] .edit-post-visual-editor *,
     375html[lang="ja"] .edit-post-visual-editor *,
     376html[lang="ko-KR"] .edit-post-visual-editor *,
     377html[lang="th"] .edit-post-visual-editor * {
     378        letter-spacing: 0 !important;
     379}
     380
     381/*--------------------------------------------------------------
     3822.0 General Block Settings
     383--------------------------------------------------------------*/
     384
     385/* Main column width */
     386body.gutenberg-editor-page .edit-post-visual-editor .editor-post-title__block,
     387body.gutenberg-editor-page .edit-post-visual-editor .editor-default-block-appender,
     388body.gutenberg-editor-page .edit-post-visual-editor .editor-block-list__block {
     389        max-width: 740px;
     390}
     391
     392/* Link styles */
     393
     394.edit-post-visual-editor a,
     395.editor-block-list__block a {
     396        color: #222;
     397}
     398
     399/* List styles */
     400
     401.edit-post-visual-editor ul:not(.wp-block-gallery),
     402.editor-block-list__block ul:not(.wp-block-gallery),
     403.block-library-list ul,
     404.edit-post-visual-editor ol,
     405.editor-block-list__block ol,
     406.block-library-list ol,
     407.block-library-list .editor-rich-text__tinymce {
     408        margin: 0 0 1.5em;
     409        padding: 0;
     410}
     411
     412.edit-post-visual-editor ul:not(.wp-block-gallery),
     413.editor-block-list__block ul:not(.wp-block-gallery),
     414.block-library-list ul {
     415        list-style: disc;
     416}
     417
     418.edit-post-visual-editor ol,
     419.editor-block-list__block ol,
     420.block-library-list ol {
     421        list-style: decimal;
     422}
     423
     424.edit-post-visual-editor li > ul,
     425.editor-block-list__block li > ul,
     426.edit-post-visual-editor li > ol,
     427.editor-block-list__block li > ol,
     428.block-library-list li > ul,
     429.block-library-list li > ol {
     430        margin-bottom: 0;
     431        margin-left: 1.5em;
     432}
     433
     434.edit-post-visual-editor li,
     435.editor-block-list__block li,
     436.block-library-list li {
     437        margin: 0;
     438}
     439
     440/*--------------------------------------------------------------
     4413.0 Blocks - Common Blocks
     442--------------------------------------------------------------*/
     443
     444/* Paragraph */
     445
     446.wp-block-paragraph.has-drop-cap:not(:focus)::first-letter {
     447        font-size: 5em;
     448        line-height: 0.68;
     449        margin: 0.05em 0.1em 0 0;
     450        text-transform: uppercase;
     451        font-style: normal;
     452}
     453
     454/* Quote */
     455
     456.wp-block-quote {
     457        color: #666;
     458        font-size: 18px;
     459        font-size: 1.125rem;
     460        font-style: italic;
     461        line-height: 1.7;
     462}
     463
     464.wp-block-quote:not(.is-large):not(.is-style-large) {
     465        border-left: 0;
     466        padding-left: 0;
     467}
     468
     469.wp-block-quote .wp-block-quote__citation,
     470.wp-block-quote cite,
     471.wp-block-quote footer {
     472        display: block;
     473        font-size: inherit;
     474        font-style: normal;
     475        font-weight: 600;
     476        margin-top: 0.5em;
     477}
     478
     479.wp-block-quote.alignleft,
     480.wp-block-quote.alignright {
     481        color: #666;
     482        width: 48%;
     483}
     484
     485.editor-block-list__block .wp-block-quote.alignleft p,
     486.editor-block-list__block .wp-block-quote.alignright p,
     487.editor-block-list__block .wp-block-quote .wp-block-quote__citation,
     488.editor-block-list__block .wp-block-quote cite,
     489.editor-block-list__block .wp-block-quote footer {
     490        font-size: 13px;
     491        font-size: 0.8125rem;
     492}
     493
     494.editor-block-list__block .wp-block-quote.alignleft p:last-of-type,
     495.editor-block-list__block .wp-block-quote.alignright p:last-of-type {
     496        margin-bottom: 0;
     497}
     498
     499@media screen and (min-width: 30em) {
     500        .editor-block-list__block .wp-block-quote.alignleft p,
     501        .editor-block-list__block .wp-block-quote.alignright p,
     502        .editor-block-list__block .wp-block-quote .wp-block-quote__citation,
     503        .editor-block-list__block .wp-block-quote cite,
     504        .editor-block-list__block .wp-block-quote footer {
     505                font-size: 14px;
     506                font-size: 0.875rem;
     507        }
     508}
     509
     510@media screen and (min-width: 48em) {
     511        .editor-block-list__block .wp-block-quote.alignleft p,
     512        .editor-block-list__block .wp-block-quote.alignright p,
     513        .editor-block-list__block .wp-block-quote .wp-block-quote__citation,
     514        .editor-block-list__block .wp-block-quote cite,
     515        .editor-block-list__block .wp-block-quote footer {
     516                font-size: 13px;
     517                font-size: 0.8125rem;
     518        }
     519
     520        .editor-block-list__block .wp-block-quote.alignleft {
     521                margin-left: -17.5%;
     522                width: 48%;
     523        }
     524
     525        .editor-block-list__block .wp-block-quote.alignright {
     526                margin-right: -17.5%;
     527                width: 48%;
     528        }
     529}
     530
     531/* File */
     532
     533.wp-block-file .wp-block-file__button {
     534        background-color: #222;
     535        -webkit-border-radius: 2px;
     536        border-radius: 2px;
     537        -webkit-box-shadow: none;
     538        box-shadow: none;
     539        color: #fff;
     540        display: inline-block;
     541        font-size: 14px;
     542        font-size: 0.875rem;
     543        font-weight: 800;
     544        padding: 0.7em 2em;
     545        -webkit-transition: background-color 0.2s ease-in-out;
     546        transition: background-color 0.2s ease-in-out;
     547        white-space: nowrap;
     548}
     549
     550/*--------------------------------------------------------------
     5514.0 Blocks - Formatting
     552--------------------------------------------------------------*/
     553
     554/* Verse */
     555
     556.wp-block-verse pre {
     557        background: #eee;
     558        font-family: "Courier 10 Pitch", Courier, monospace;
     559        font-size: 15px;
     560        font-size: 0.9375rem;
     561        line-height: 1.6;
     562        margin-bottom: 1.6em;
     563        max-width: 100%;
     564        overflow: auto;
     565        padding: 1.6em;
     566}
     567
     568/* Code */
     569
     570.wp-block-code {
     571        border: 0;
     572        padding: 0;
     573}
     574
     575/* Classic */
     576
     577.wp-block-freeform.block-library-rich-text__tinymce blockquote {
     578        border-left: 0;
     579        color: #666;
     580        font-size: 18px;
     581        font-size: 1.125rem;
     582        font-style: italic;
     583        line-height: 1.7;
     584        margin: 0;
     585        overflow: hidden;
     586        padding: 0;
     587}
     588
     589/* Preformatted */
     590
     591.wp-block-preformatted pre {
     592        background: #eee;
     593        font-family: "Courier 10 Pitch", Courier, monospace;
     594        font-size: 15px;
     595        font-size: 0.9375rem;
     596        line-height: 1.6;
     597        margin-bottom: 1.6em;
     598        max-width: 100%;
     599        overflow: auto;
     600        padding: 1.6em;
     601}
     602
     603/* Table */
     604
     605table.wp-block-table {
     606        border-collapse: collapse;
     607        margin: 0 0 1.5em;
     608        width: 100%;
     609}
     610
     611table.wp-block-table thead th {
     612        border: 0;
     613        border-bottom: 2px solid #bbb;
     614        padding-bottom: 0.5em;
     615}
     616
     617table.wp-block-table th {
     618        padding: 0.4em;
     619        text-align: left;
     620}
     621
     622table.wp-block-table tr {
     623        border-bottom: 1px solid #eee;
     624}
     625
     626table.wp-block-table td {
     627        border: 0;
     628        padding: 0.4em;
     629}
     630
     631table.wp-block-table th:first-child,
     632table.wp-block-table td:first-child {
     633        padding-left: 0;
     634}
     635
     636table.wp-block-table th:last-child,
     637table.wp-block-table td:last-child {
     638        padding-right: 0;
     639}
     640
     641.wp-block-table__cell-content {
     642        padding: 0;
     643}
     644
     645/*--------------------------------------------------------------
     6465.0 Blocks - Layout Elements
     647--------------------------------------------------------------*/
     648
     649/* Separators */
     650
     651.edit-post-visual-editor .wp-block-separator:not(.is-style-dots) {
     652    border-bottom: 1px solid #bbb;
     653}
     654
     655/* Buttons */
     656
     657.wp-block-button .wp-block-button__link {
     658        background-color: #222;
     659        -webkit-border-radius: 2px;
     660        border-radius: 2px;
     661        -webkit-box-shadow: none;
     662        box-shadow: none;
     663        color: #fff;
     664        display: inline-block;
     665        font-size: 14px;
     666        font-size: 0.875rem;
     667        font-weight: 800;
     668        line-height: 1.66;
     669        margin-top: 2em;
     670        padding: 0.7em 2em;
     671        -webkit-transition: background-color 0.2s ease-in-out;
     672        transition: background-color 0.2s ease-in-out;
     673        white-space: nowrap;
     674}
     675/*--------------------------------------------------------------
     6766.0 Blocks - Widgets
     677--------------------------------------------------------------*/
     678
     679/* Comments */
     680
     681.wp-block-latest-comments article {
     682        margin-bottom: 4em;
     683}
     684
     685.wp-block-latest-comments .avatar,
     686.wp-block-latest-comments__comment-avatar {
     687        border-radius: 0;
     688}
     689
     690.wp-block-latest-comments__comment-meta {
     691        font-size: 16px;
     692        font-size: 1rem;
     693        margin-bottom: 0.4em;
     694}
     695
     696.wp-block-latest-comments__comment-author,
     697.wp-block-latest-comments__comment-link {
     698        font-weight: 700;
     699        text-decoration: none;
     700}
     701
     702.wp-block-latest-comments__comment-date {
     703        color: #767676;
     704        font-size: 10px;
     705        font-size: 0.625rem;
     706        font-weight: 800;
     707        letter-spacing: 0.1818em;
     708        margin-top: 0.4em;
     709        text-transform: uppercase;
     710}
     711
     712.editor-block-list__block .wp-block-latest-comments__comment-excerpt p {
     713        font-size: 14px;
     714        font-size: 0.875rem;
     715}
     716
     717/*--------------------------------------------------------------
     7187.0 Blocks - Embeds
     719--------------------------------------------------------------*/
     720
     721/*--------------------------------------------------------------
     7228.0 Blocks - Wide Alignments
     723--------------------------------------------------------------*/
     724
     725/* Wide Alignments */
     726body.gutenberg-editor-page .edit-post-visual-editor .editor-block-list__block[data-align=full],
     727body.gutenberg-editor-page .edit-post-visual-editor .editor-block-list__block[data-align=wide] {
     728        max-width: none;
     729}
     730 No newline at end of file

  • src/wp-content/themes/twentyseventeen/functions.php 

    Property changes on: src/wp-content/themes/twentyseventeen/assets/css/editor-blocks.css
___________________________________________________________________
Added: svn:executable
## -0,0 +1 ##
+*
\ No newline at end of property
     
    117117          */
    118118        add_editor_style( array( 'assets/css/editor-style.css', twentyseventeen_fonts_url() ) );
    119119
     120        // Load regular editor styles into the new block-based editor.
     121        add_theme_support( 'editor-styles' );
     122
     123        // Load default block styles.
     124        add_theme_support( 'wp-block-styles' );
     125
     126        // Add support for the wide alignment option.
     127        add_theme_support( 'align-wide' );
     128
     129        /*
     130         * Add support for the editor color palette.
     131         *
     132         * See:
     133         */
     134        add_theme_support( 'editor-color-palette', array(
     135                array(
     136                        'name'  => __( 'Dark Grey', 'twentyseventeen' ),
     137                        'slug'  => 'dark-grey',
     138                        'color' => '#333',
     139                ),
     140                array(
     141                        'name'  => __( 'Medium Grey', 'twentyseventeen' ),
     142                        'slug'  => 'medium-grey',
     143                        'color' => '#666',
     144                ),
     145                array(
     146                        'name'  => __( 'Light Grey', 'twentyseventeen' ),
     147                        'slug'  => 'light-grey',
     148                        'color' => '#eee',
     149                ),
     150                array(
     151                        'name'  => __( 'White', 'twentyseventeen' ),
     152                        'slug'  => 'white',
     153                        'color' => '#fff',
     154                ),
     155        ) );
     156
    120157        // Define and register starter content to showcase the theme on new sites.
    121158        $starter_content = array(
    122159                'widgets'     => array(
    … …  
    439476        // Theme stylesheet.
    440477        wp_enqueue_style( 'twentyseventeen-style', get_stylesheet_uri() );
    441478
     479        // Theme block stylesheet.
     480        wp_enqueue_style( 'twentyseventeen-block-style', get_theme_file_uri( '/assets/css/blocks.css' ), array( 'twentyseventeen-style' ), '1.0' );
     481
    442482        // Load the dark colorscheme.
    443483        if ( 'dark' === get_theme_mod( 'colorscheme', 'light' ) || is_customize_preview() ) {
    444484                wp_enqueue_style( 'twentyseventeen-colors-dark', get_theme_file_uri( '/assets/css/colors-dark.css' ), array( 'twentyseventeen-style' ), '1.0' );
    … …  
    489529add_action( 'wp_enqueue_scripts', 'twentyseventeen_scripts' );
    490530
    491531/**
     532 * Enqueue editor styles for Gutenberg
     533 *
     534 * @since Twenty Seventeen 1.8
     535 */
     536function twentyseventeen_block_editor_styles() {
     537        // Block styles.
     538        wp_enqueue_style( 'twentyseventeen-block-editor-style', get_template_directory_uri() . '/assets/css/editor-blocks.css' );
     539        // Add custom fonts.
     540        wp_enqueue_style( 'twentyseventeen-fonts', twentyseventeen_fonts_url(), array(), null );
     541}
     542add_action( 'enqueue_block_editor_assets', 'twentyseventeen_block_editor_styles' );
     543
     544/**
    492545 * Add custom image sizes attribute to enhance responsive image functionality
    493546 * for content images.
    494547 *