Changeset 44149 for trunk/src/wp-content/themes/twentynineteen/sass/site/header/_site-header.scss

Timestamp:

12/14/2018 02:32:33 AM (8 years ago)

Author:

pento

Message:

Default Themes: Import Twenty Nineteen from the 5.0 branch.

Merges [43808,43821,43842,43860,43892,43904,43909,43926-43929,43956,43961-43963] from the 5.0 branch to trunk.

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, xkon, twoabove.

Fixes #45424.

Location:

trunk

Files:

• . (modified) (1 prop)
• src/wp-content/themes/twentynineteen (copied) (copied from branches/5.0/src/wp-content/themes/twentynineteen )
• src/wp-content/themes/twentynineteen/sass/site/header/_site-header.scss (modified) (9 diffs)

trunk/src/wp-content/themes/twentynineteen/sass/site/header/_site-header.scss

@@ -2 +2 @@
 
 .site-header {
+        padding: 1em;
 
-        padding: 1em;
+        &.featured-image {
+                display: flex;
+                flex-direction: column;
+                justify-content: space-between;
+                min-height: 90vh;
+
+                .site-branding-container {
+                        margin-bottom: auto;
+                }
+        }
 
         @include media(tablet) {
@@ -10 +20 @@
 
                 &.featured-image {
-                        display: flex;
                         min-height: 100vh;
-                        flex-direction: column;
-                        justify-content: space-between;
                         margin-bottom: 3rem;
-
-                        .site-branding-container {
-                                margin-bottom: auto;
-                        }
                 }
         }
@@ -31 +34 @@
 
         @include media(tablet) {
-                margin: 0 calc(2 * (100vw / 12));
-                max-width: 22em;
+                margin: 0 $size__site-margins;
         }
 }
@@ -47 +49 @@
                 margin-bottom: 0;
                 position: absolute;
-                right: calc(100% + (0.5 * calc(100vw / 12)));
+                right: calc(100% + (1.25 * #{$size__spacing-unit}));
                 top: 4px; // Accounts for box-shadow widths
                 z-index: 999;
@@ -55 +57 @@
                 border-radius: 100%;
                 box-sizing: content-box;
-                box-shadow: 0 0 0 0 rgba(black, 0);
+                box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
                 display: block;
-                width: 32px;
-                height: 32px;
+                width: 50px;
+                height: 50px;
                 overflow: hidden;
                 transition: box-shadow $background_transition ease-in-out;
@@ -69 +71 @@
                 &:active,
                 &:focus {
-                        box-shadow: 0 0 0 2px rgba(black, 1);
+                        box-shadow: 0 0 0 2px rgba(0, 0, 0, 1);
                 }
 
@@ -82 +84 @@
 
 .site-title {
-
         margin: auto;
         display: inline;
         color: $color__text-main;
+
+        a {
+                color: $color__text-main;
+
+                &:link,
+                &:visited {
+                        color: $color__text-main;
+                }
+
+                &:hover {
+                        color: $color__text-hover;
+                }
+        }
 
         .featured-image & {
@@ -100 +114 @@
         }
 
-        a {
-                color: inherit;
-
-                &:hover {
-                        color: $color__text-hover;
-                }
+        @include media(tablet) {
+                display: inline;
         }
 
-        @include media(tablet) {
-                display: inline;
+        &:not(:empty) + .site-description:not(:empty):before {
+                content: "\2014";
+                margin: 0 .2em;
         }
 }
@@ -121 +132 @@
         font-weight: normal;
         margin: 0;
-
-        &:not(:empty):before {
-                content: "\2014";
-                margin: 0 .2em;
-        }
 }