Changeset 44149 for trunk/src/wp-content/themes/twentynineteen/sass/site/primary/_posts-and-pages.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/primary/_posts-and-pages.scss (modified) (14 diffs)

trunk/src/wp-content/themes/twentynineteen/sass/site/primary/_posts-and-pages.scss

@@ -25 +25 @@
 }
 
-.hentry {
+.entry {
 
         margin-top: calc(6 * #{$size__spacing-unit});
@@ -39 +39 @@
 
                 @include media(tablet) {
-                        margin: calc(3 * #{ $size__spacing-unit}) calc(2 * (100vw / 12 ) ) $size__spacing-unit;
-
-                        .featured-image & {
-                                margin-bottom: 0;
-                        }
+                        margin: calc(3 * #{ $size__spacing-unit}) $size__site-margins $size__spacing-unit;
                 }
         }
@@ -70 +66 @@
 
                         margin-right: $size__spacing-unit;
+                        display: inline-block;
 
                         &:last-child {
@@ -96 +93 @@
 
         .entry-meta {
-
                 margin: $size__spacing-unit 0;
-
-                &.has-discussion .comment-count {
-
-                        @include media(desktop) {
-                                float: right;
-                                position: relative;
-                        }
-
-                        .discussion-avatar-list {
-                                display: none;
-
-                                @include media(desktop) {
-                                        bottom: 100%;
-                                        display: block;
-                                        position: absolute;
-                                }
-                        }
-                }
         }
 
@@ -123 +101 @@
 
                 @include media(tablet) {
-                        margin: calc(3 * #{$size__spacing-unit}) calc(2 * (100vw / 12));
-                        max-width: calc(8 * (100vw / 12));
-                }
-
-                @include media(tablet) {
-                        max-width: calc(6 * (100vw / 12));
+                        margin: $size__spacing-unit $size__site-margins calc(3 * #{$size__spacing-unit});
+                        max-width: $size__site-tablet-content;
+                }
+
+                @include media(tablet) {
+                        max-width: $size__site-desktop-content;
                 }
         }
@@ -137 +115 @@
 
                 @include media(tablet) {
-                        margin: $size__spacing-unit calc(2 * (100vw / 12));
+                        margin: $size__spacing-unit $size__site-margins;
                 }
 
@@ -153 +131 @@
                         }
                 }
-
         }
 
@@ -163 +140 @@
 
                         .post-thumbnail-inner {
-                                @include filter-grayscale;
-                        }
-
-                        &:before, &:after {
+                                filter: grayscale(100%);
+
+                                &:after {
+                                        background: rgba(0, 0, 0, 0.35);
+                                        content: "";
+                                        display: block;
+                                        height: 100%;
+                                        opacity: .5;
+                                        pointer-events: none;
+                                        position: absolute;
+                                        top: 0;
+                                        width: 100%;
+                                        z-index: 4;
+
+                                        @supports (mix-blend-mode: multiply) {
+                                                display: none;
+                                        }
+                                }
+                        }
+
+                        &:before,
+                        &:after, {
                                 position: absolute;
                                 display: block;
@@ -173 +168 @@
                                 top: 0; left: 0;
                                 content: "\020";
-                                display: block;
                                 pointer-events: none;
                         }
@@ -180 +174 @@
 
                 }
-
+        }
+
+        .entry-content,
+        .entry-summary {
+                max-width: calc(100% - (2 * #{ $size__spacing-unit }));
+                margin: 0 $size__spacing-unit;
+
+                @include media(tablet) {
+                        max-width: 80%;
+                        margin: 0 10%;
+                        padding: 0 60px;
+                }
         }
 
         .entry-content {
+
+                p {
+                        word-wrap: break-word;
+                }
 
                 .more-link {
@@ -191 +200 @@
 
                         &:after {
-                                content: "»";
+                                content: "\02192";
                                 margin-left: 0.5em;
                         }
@@ -204 +213 @@
                         text-decoration: underline;
 
+                        &.button,
                         &:hover {
                                 text-decoration: none;
+                        }
+
+                        &.button {
+                                display: inline-block;
+                        }
+
+                        &.button:hover {
+                                background: $color__background-button-hover;
+                                color: $color__background-body;
+                                cursor: pointer;
                         }
                 }
@@ -212 +232 @@
                 > iframe[style] {
 
-                        margin: 32px $size__spacing-unit !important;
-                        max-width: calc(100vw - (2 * #{ $size__spacing-unit })) !important;
+                        margin: 32px 0 !important;
+                        max-width: 100% !important;
 
                         @include media(tablet) {
-                                margin: 32px calc(2 * (100vw / 12)) !important;
-                                max-width: calc(8 * (100vw / 12)) !important;
+                                max-width: $size__site-tablet-content !important;
                         }
 
                         @include media(desktop) {
-                                max-width: calc(6 * (100vw / 12)) !important;
-                        }
+                                max-width: $size__site-desktop-content !important;
+                        }
+                }
+
+                // Page links
+                .page-links a {
+                        margin: calc(0.5 * #{$size__spacing-unit});
+                        text-decoration: none;
                 }
 
@@ -230 +255 @@
 
                         @include media(tablet) {
-                                max-width: calc(8 * (100vw / 12));
+                                max-width: $size__site-tablet-content;
                         }
 
                         @include media(desktop) {
-                                max-width: calc(6 * (100vw / 12));
-                        }
-                }
-        }
-}
+                                max-width: $size__site-desktop-content;
+                        }
+                }
+        }
+}
+
+/* Author description */
+
+.author-bio {
+        margin: calc(2 * #{$size__spacing-unit}) $size__spacing-unit $size__spacing-unit;
+
+        @include postContentMaxWidth();
+
+        @include media(tablet) {
+                margin: calc(3 * #{$size__spacing-unit}) $size__site-margins;
+        }
+
+        @include media(desktop) {
+                margin: calc(3 * #{$size__spacing-unit}) $size__site-margins;
+        }
+
+        .author-title {
+                @include post-section-dash;
+                display: inline;
+        }
+
+        .author-description {
+
+                display: inline;
+                color: $color__text-light;
+                font-size: $font__size-md;
+                line-height: $font__line-height-heading;
+
+                .author-link {
+                        display: inline-block;
+
+                        &:hover {
+                                color: $color__link-hover;
+                                text-decoration: none;
+                        }
+                }
+        }
+}