WordPress.org
Get WordPress

Make WordPress Core


Ignore:
Timestamp:
11/19/2018 09:26:02 PM (8 years ago)
Author:
allancole
Message:

Updating Twenty Nineteen, our new default theme for 2019, set for 5.0.

This update changes the following:

  • Fix JS errors in customizer caused by menu scripts
  • Fix footer menu spacing
  • Fix pullquote block borders to follow Gutenberg’s described style
  • Fix editor-only styles so they don't appear on the frontend when not needed
  • Fix search field widget width on mobile
  • Fix :visited .button link colors
  • Fix Block toolbar position in the editor
  • Fix off-canvas mobile menu to prevent text from overflowing
  • Improve column block formatting for the editor and frontend
  • Improve CSS optimization for selectors that add dashes to multi-level lists
  • Improve editor font sizes to use pixels over ems
  • Improve styles for galleries in the Classic Editor block
  • Improve priority+ more-menu threshold to allow more space for menu-items
  • Improve logo size on mobile devices
  • Improve customizer color options to present a single, unified color option
  • Improve print stylesheet for better spacing and colors
  • Add more color options to Gutenberg editor

Initial development occurred on GitHub. See: ​https://github.com/WordPress/twentynineteen

Props allancole, karmatosed, kjellr, yingling017, mrasharirfan, milana_cap, fabiankaegy, westonruter, jorbin, netweb, b-07, khleomix, audrasjb, nielslange, mmaumio, richsalvucci, littlebigthing, dimadin, joyously, anevins, peterwilsoncc, dannycooper, iCaleb, siriokun, technosiren, travel_girl, azchughtai, ianbelanger, nadim1992, ismailelkorchi, nativeinside, chetan200891, grapplerulrich, ocean90, joshfeck, frankew, AbdulWahab610, mendezcode, eliorivero, melchoyce, joen, laurelfulford, mdawaffe, kraftbj, dsmart, nao, mayukojpn, enodekciw, ketuchetan, atanasangelovdev, poena, sharaz, artisticasad, mukesh27, burhandodhy, crunnells, aprakasa, themeroots, imonly_ik, tlxo, youthkee, brentswisher, smyoon315, mrahmadawais, desideveloper, Kau-Boy, mor10, mikeyarce, dingo_bastard

File:
1 edited

Legend:

Unmodified
Added
Removed

  • branches/5.0/src/wp-content/themes/twentynineteen/sass/blocks/_blocks.scss

    r43904 r43909  
    6161                        margin-right: calc(2 * #{$size__spacing-unit});
    6262                }
    63 
    64                 @include media(desktop) {
    65                         max-width: calc(3 * (100vw / 12));
    66                 }
    6763        }
    6864
    … …  
    164160                        @include button-transition;
    165161                        border: none;
    166                         background: $color__background-button;
    167162                        font-size: $font__size-sm;
    168163                        font-family: $font__heading;
    … …  
    173168                        padding: ($size__spacing-unit * .76) $size__spacing-unit;
    174169                        outline: none;
    175                         color: white;
    176170                        outline: none;
    177171
     172                        &:not(.has-background) {
     173                                background-color: $color__background-button;
     174                        }
     175
     176                        &:not(.has-text-color) {
     177                                color: white;
     178                        }
     179
    178180                        &:hover {
     181                                color: white;
    179182                                background: $color__background-button-hover;
    180183                                cursor: pointer;
    … …  
    182185
    183186                        &:focus {
     187                                color: white;
    184188                                background: $color__background-button-hover;
    185189                                outline: thin dotted;
    … …  
    195199                &.is-style-outline .wp-block-button__link:focus,
    196200                &.is-style-outline .wp-block-button__link:active {
    197 
    198                         @include button-all-transition;
    199                         background: transparent;
    200                         border: 2px solid currentColor;
    201                         color: $color__background-button;
     201                        @include button-all-transition;
     202                        border-width: 2px;
     203                        border-style: solid;           
     204
     205                        &:not(.has-background) {
     206                                background: transparent;
     207                        }
     208
     209                        &:not(.has-text-color) {
     210                                color: $color__background-button;
     211                                border-color: currentColor;
     212                        }
    202213                }
    203214
    204215                &.is-style-outline .wp-block-button__link:hover {
    205                         color: $color__background-button-hover;
     216                        color: white;
     217                        border-color: $color__background-button-hover;
    206218                }
    207219        }
    … …  
    295307        //! Pullquote
    296308        .wp-block-pullquote {
    297                 border: none;
     309                border-color: transparent;
     310                border-width: 2px;
    298311                padding: $size__spacing-unit;
    299312
    … …  
    384397                                margin-left: $size__spacing-unit;
    385398
     399                                &.has-text-color p,
     400                                &.has-primary-color,
     401                                &.has-secondary-color,
     402                                &.has-dark-gray-color,
     403                                &.has-light-gray-color,
     404                                &.has-white-color {
     405                                        color: inherit;
     406                                }
     407
    386408                                @include media(tablet) {
    387409                                        margin-left: 0;
    388410                                        margin-right: 0;
    389411                                }
    390                         }
    391 
    392                         .has-primary-background-color {
    393                                 background-color: $color__link;
    394412                        }
    395413
    … …  
    502520                        padding: 0;
    503521                        color: #fff;
     522                        -ms-hyphens: auto;
     523                        -moz-hyphens: auto;
     524                        -webkit-hyphens: auto;
     525                        hyphens: auto;
    504526
    505527                        @include media(tablet) {
    … …  
    509531                }
    510532
    511                 &.aligncenter {
    512                         h2,
    513                         .wp-block-cover-image-text,
    514                         .wp-block-cover-text {
    515                                 width: 100%;
    516                                 z-index: 1;
    517                                 left: 50%;
    518                                 position: absolute;
    519                                 transform: translate(-50%, -50%);
    520                                 top: 50%;
    521                         }
    522                 }
    523 
    524533                &.alignleft,
    525534                &.alignright {
    526535                        width: 100%;
     536
     537                        @include media(tablet) {
     538                                padding: $size__spacing-unit;
     539                        }
    527540                }
    528541
    … …  
    682695        .wp-block-columns {
    683696
     697                &.alignfull {
     698                        padding-left: $size__spacing-unit;
     699                        padding-right: $size__spacing-unit;
     700                }
     701
    684702                @include media(tablet) {
    685703                        .wp-block-column > * {
    … …  
    700718                                        margin-right: 0;
    701719                                }
     720                        }
     721
     722                        &.alignfull,
     723                        &.alignfull .wp-block-column {
     724                                padding-left: calc(2 * #{$size__spacing-unit});
     725                                padding-right: calc(2 * #{$size__spacing-unit});
    702726                        }
    703727                }
    … …  
    738762        }
    739763
    740         //! Custom colors
    741         .has-primary-background-color {
    742                 background-color: $color__link;
     764        //! Font Sizes
     765        .has-small-font-size {
     766                font-size: $font__size-sm;
     767        }
     768
     769        .has-normal-font-size {
     770                font-size: $font__size-md;
     771        }
     772
     773        .has-large-font-size {
     774                font-size: $font__size-lg;
     775        }
     776
     777        .has-huge-font-size {
     778                font-size: $font__size-xl;
     779        }
     780
     781        //! Custom background colors
     782        .has-primary-background-color,
     783        .has-secondary-background-color,
     784        .has-dark-gray-background-color,
     785        .has-light-gray-background-color {
     786               
     787                // Use white text against these backgrounds by default.
     788                color: $color__background-body;
    743789
    744790                p,
    … …  
    753799                }
    754800        }
     801
     802        .has-white-background-color {
     803                color: $color__text-main;
     804
     805                // Use dark gray text against this background by default.
     806                p,
     807                h1,
     808                h2,
     809                h3,
     810                h4,
     811                h5,
     812                h6,
     813                a {
     814                        color: $color__text-main;
     815                }
     816        }
     817
     818        .has-primary-background-color,
     819        .wp-block-pullquote.is-style-solid-color.has-primary-background-color {
     820                background-color: $color__link;
     821        }
     822
     823        .has-secondary-background-color,
     824        .wp-block-pullquote.is-style-solid-color.has-secondary-background-color {
     825                background-color: $color__border-link-hover;
     826        }
     827
     828        .has-dark-gray-background-color,
     829        .wp-block-pullquote.is-style-solid-color.has-dark-gray-background-color {
     830                background-color: $color__text-main;
     831        }
     832
     833        .has-light-gray-background-color,
     834        .wp-block-pullquote.is-style-solid-color.has-light-gray-background-color {
     835                background-color: $color__text-light;
     836        }
     837
     838        .has-white-background-color,
     839        .wp-block-pullquote.is-style-solid-color.has-white-background-color {
     840                background-color: #FFF;
     841        }
     842
     843        //! Custom foreground colors
     844        .has-primary-color,
     845        .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color,
     846        .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color p {
     847                color: $color__link;
     848        }
     849
     850        .has-secondary-color,
     851        .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color,
     852        .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color p {
     853                color: $color__border-link-hover;
     854        }
     855
     856        .has-dark-gray-color,
     857        .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color,
     858        .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color p {
     859                color: $color__text-main;
     860        }
     861
     862        .has-light-gray-color,
     863        .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color,
     864        .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color p {
     865                color: $color__text-light;
     866        }
     867
     868        .has-white-color,
     869        .wp-block-pullquote.is-style-solid-color blockquote.has-white-color {
     870                color: #FFF;
     871        }
    755872}
Note: See TracChangeset for help on using the changeset viewer.