From 0a28a9826753f70b16d18650db537d12dbe8af73 Mon Sep 17 00:00:00 2001 From: Takashi Irie Date: Tue, 21 May 2019 14:44:29 +0100 Subject: [PATCH] Modern Business: Edit link style adjustment --- modern-business/sass/blocks/_blocks.scss | 7 +- modern-business/style-rtl.css | 153 +++++++++++++++++++++++ modern-business/style.css | 7 +- 3 files changed, 163 insertions(+), 4 deletions(-) diff --git a/modern-business/sass/blocks/_blocks.scss b/modern-business/sass/blocks/_blocks.scss index d08d56ef7..a81133c6e 100644 --- a/modern-business/sass/blocks/_blocks.scss +++ b/modern-business/sass/blocks/_blocks.scss @@ -1109,14 +1109,17 @@ text-align: center; } + .a8c-posts-list-item__author { + margin-right: calc(.5 * #{$size__spacing-unit}); + } + .a8c-posts-list-item__edit-link { @include button-transition; background: $color__background-button; border-radius: 3px; font-family: $font__heading; font-weight: 700; - margin-left: calc(.5 * #{$size__spacing-unit}); - padding: .1rem .4rem; + padding: .05rem .4rem; &:hover, &:focus { diff --git a/modern-business/style-rtl.css b/modern-business/style-rtl.css index 60592a2c9..d0f4105b4 100644 --- a/modern-business/style-rtl.css +++ b/modern-business/style-rtl.css @@ -4417,6 +4417,159 @@ body.page .main-navigation { color: #FFF; } +.entry .entry-content .a8c-posts-list-item__title a, +.entry .entry-content .a8c-posts-list-item__meta a { + text-decoration: none; +} + +.entry .entry-content .a8c-posts-list__view-all { + text-decoration: none; +} + +.entry .entry-content .a8c-posts-list-item__title a { + color: inherit; +} + +.entry .entry-content .a8c-posts-list-item__title a:hover, .entry .entry-content .a8c-posts-list-item__title a:focus { + color: #4a4a4a; +} + +.entry .entry-content .a8c-posts-list-item__meta a { + color: inherit; +} + +.entry .entry-content .a8c-posts-list-item__meta a:hover, .entry .entry-content .a8c-posts-list-item__meta a:focus { + color: #c43d80; +} + +.entry .entry-content .a8c-posts-list-item__meta .a8c-posts-list-item__edit-link a { + color: #fff; +} + +.entry .entry-content .a8c-posts-list { + text-align: center; +} + +.entry .entry-content .a8c-posts-list__item:not(:first-child) { + margin-top: calc(6 * 1rem); +} + +.entry .entry-content .a8c-posts-list-item__featured { + text-align: center; +} + +.entry .entry-content .a8c-posts-list-item__featured span { + background: #c43d80; + color: #fff; + display: inline-block; + font-size: 0.71111em; + font-weight: bold; + line-height: 1; + padding: .25rem; + text-transform: uppercase; + z-index: 1; +} + +.entry .entry-content .a8c-posts-list-item__post-thumbnail { + margin-bottom: 32px; +} + +.entry .entry-content .a8c-posts-list-item__post-thumbnail img { + display: block; +} + +.entry .entry-content .a8c-posts-list-item__title { + font-size: 1.6875em; + margin: 0; + text-align: center; +} + +@media only screen and (min-width: 768px) { + .entry .entry-content .a8c-posts-list-item__title { + font-size: 2.25em; + } +} + +.entry .entry-content .a8c-posts-list-item__meta { + color: #686868; + font-size: 0.71111em; + font-weight: 500; + text-align: center; +} + +.entry .entry-content .a8c-posts-list-item__author { + margin-left: calc(.5 * 1rem); +} + +.entry .entry-content .a8c-posts-list-item__edit-link { + transition: background 150ms ease-in-out; + background: #c43d80; + border-radius: 3px; + font-family: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; + font-weight: 700; + padding: .05rem .4rem; +} + +.entry .entry-content .a8c-posts-list-item__edit-link:hover, .entry .entry-content .a8c-posts-list-item__edit-link:focus { + background: #111; + cursor: pointer; +} + +.entry .entry-content .a8c-posts-list-item__excerpt { + margin: 0 auto; + text-align: right; +} + +@media only screen and (min-width: 768px) { + .entry .entry-content .a8c-posts-list-item__excerpt { + max-width: calc(8 * (100vw / 12) - 28px); + } +} + +@media only screen and (min-width: 1168px) { + .entry .entry-content .a8c-posts-list-item__excerpt { + max-width: calc(6 * (100vw / 12) - 28px); + } +} + +.entry .entry-content .a8c-posts-list-item__excerpt p { + margin: 32px 0; +} + +.entry .entry-content .a8c-posts-list__view-all { + transition: background 150ms ease-in-out; + background: #c43d80; + border: none; + border-radius: 5px; + box-sizing: border-box; + color: #fff; + display: inline-block; + font-family: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; + font-size: 0.88889em; + font-weight: 700; + line-height: 1.2; + margin-top: calc(6 * 1rem - 32px); + outline: none; + padding: 0.76rem 1rem; + vertical-align: bottom; +} + +.entry .entry-content .a8c-posts-list__view-all:hover { + background: #111; + cursor: pointer; +} + +.entry .entry-content .a8c-posts-list__view-all:visited { + color: #fff; + text-decoration: none; +} + +.entry .entry-content .a8c-posts-list__view-all:focus { + background: #111; + outline: thin dotted; + outline-offset: -4px; +} + /* Site Builder */ /* !Site Builder styles */ .entry .entry-content .site-builder__header { diff --git a/modern-business/style.css b/modern-business/style.css index 0cb909fcf..b67de183d 100644 --- a/modern-business/style.css +++ b/modern-business/style.css @@ -4509,14 +4509,17 @@ body.page .main-navigation { text-align: center; } +.entry .entry-content .a8c-posts-list-item__author { + margin-right: calc(.5 * 1rem); +} + .entry .entry-content .a8c-posts-list-item__edit-link { transition: background 150ms ease-in-out; background: #c43d80; border-radius: 3px; font-family: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; font-weight: 700; - margin-left: calc(.5 * 1rem); - padding: .1rem .4rem; + padding: .05rem .4rem; } .entry .entry-content .a8c-posts-list-item__edit-link:hover, .entry .entry-content .a8c-posts-list-item__edit-link:focus {