WordPress.org

Make WordPress Core


Ignore:
Timestamp:
11/19/2018 09:26:02 PM (3 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.