-
-
Save diggeddy/9e77109f4dc80d858074282b2ae2f491 to your computer and use it in GitHub Desktop.
Style Sheet for Dispatch - A GeneratePress Site
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* GeneratePress Sites - Dispatch Style Sheet */ | |
/* Colors */ | |
.main-navigation ul li:after { | |
background-color: #000; | |
} | |
.main-navigation .inside-navigation { | |
border-top: 0.5px solid #d4d7d8; | |
} | |
.wpsp-card, | |
.wpsp-card a, | |
.wpsp-card .wp-show-posts-meta a, | |
.wpsp-card .wp-show-posts-meta a:visited { | |
color: #fff; | |
} | |
.navigation-search.nav-search-active { | |
background-color: rgba(255, 255, 255, 0.95); | |
top: 100%; | |
} | |
/* Theme Global */ | |
@media (min-width: 769px) { | |
body { | |
margin: 0 30px; | |
} | |
} | |
body.single-post.no-sidebar .site-content { | |
max-width: 720px; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
/* Navigation */ | |
.second-nav.grid-container { | |
padding: 0; | |
} | |
@media (min-width: 769px) { | |
.main-navigation ul li { | |
position: relative; | |
} | |
.main-navigation ul li:after { | |
content: ""; | |
position: absolute; | |
height: 0; | |
width: 100%; | |
bottom: 0; | |
left: 0; | |
pointer-events: none; | |
filter: hue-rotation(90deg); | |
-webkit-filter: hue-rotation(90deg); | |
-webkit-transition: height 0.35s ease; | |
transition: height 0.35s ease; | |
} | |
.main-navigation ul li:hover:after, | |
.main-navigation ul li.current-menu-item:after { | |
height: 6px; | |
} | |
} | |
/* Widgets */ | |
.widget-title { | |
margin: 1em 0; | |
font-size: 0.8em !important; | |
} | |
.widget .wp-show-posts article { | |
margin-bottom: 0.5em !important; | |
} | |
.zero-padding { | |
padding: 0 !important; | |
} | |
.widget.no-background { | |
background-color: transparent; | |
} | |
/* Buttons */ | |
button, | |
html input[type="button"], | |
input[type="reset"], | |
input[type="submit"], | |
a.button, | |
a.button:visited, | |
a.wp-block-button__link:not(.has-background) { | |
pointer-events: initial !important; | |
border-color: inherit; | |
border: 1px solid; | |
} | |
/* Page Heros */ | |
.page-hero.overlay { | |
-webkit-box-shadow: inset 0px -180px 83px -15px rgba(0, 0, 0, 0.75); | |
box-shadow: inset 0px -180px 83px -15px rgba(0, 0, 0, 0.75); | |
} | |
.gradient-overlay { | |
position: relative; | |
z-index: -1; | |
} | |
.gradient-overlay:after { | |
content: ""; | |
position: absolute; | |
top: 0; | |
right: 0; | |
bottom: 0; | |
left: 0; | |
background: -webkit-gradient( | |
linear, | |
left top, | |
left bottom, | |
from(rgba(3, 89, 155, 0.5)), | |
to(rgba(14, 161, 234, 0.6)) | |
); | |
background: linear-gradient(rgba(3, 89, 155, 0.5), rgba(14, 161, 234, 0.6)); | |
z-index: -1; | |
} | |
/* Blog */ | |
.generate-columns .inside-article { | |
padding: 0 0 15px; | |
} | |
@media (max-width: 768px) { | |
.generate-columns .inside-article > *:not(.post-image) { | |
padding: 0 15px; | |
} | |
} | |
.generate-columns-container article .inside-article .post-image { | |
margin-bottom: 0.5em; | |
} | |
.generate-columns-container article .inside-article .entry-summary { | |
margin-top: 0.5em; | |
font-size: 0.8em; | |
} | |
.generate-columns-container article .entry-header, | |
.wp-show-posts-entry-header { | |
display: -webkit-box; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-box-orient: vertical; | |
-webkit-box-direction: reverse; | |
-ms-flex-direction: column-reverse; | |
flex-direction: column-reverse; | |
} | |
@media (min-width: 768px) { | |
.generate-columns-container article .entry-header .entry-title, | |
.wp-show-posts article .wp-show-posts-entry-title { | |
line-height: 2.5ex; | |
height: 5ex; | |
overflow: hidden; | |
text-overflow: ellipsis; | |
} | |
} | |
.wp-show-posts .wp-show-posts-inner { | |
overflow: hidden; | |
} | |
@media (min-width: 420px) { | |
.wpsp-align .wp-show-posts-image { | |
margin-bottom: 0; | |
} | |
} | |
.wpsp-align .wp-show-posts-image a, | |
.wpsp-align .wp-show-posts-image img { | |
height: 100%; | |
} | |
.generate-columns-container article .inside-article img, | |
.wp-show-posts-image img { | |
-o-object-fit: cover !important; | |
object-fit: cover !important; | |
} | |
/* WPSP Grids */ | |
/* Single column align side image */ | |
/* Add wpsp-align class to to WPSP List shortcode wrapper */ | |
@media (min-width: 420px) { | |
.wpsp-align .wp-show-posts-inner { | |
display: -webkit-box; | |
display: -ms-flexbox; | |
display: flex; | |
} | |
.wpsp-align .wp-show-posts-inner > div { | |
-webkit-box-flex: 1; | |
-ms-flex: 1; | |
flex: 1; | |
display: -webkit-box; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-box-orient: vertical; | |
-webkit-box-direction: normal; | |
-ms-flex-direction: column; | |
flex-direction: column; | |
-webkit-box-pack: center; | |
-ms-flex-pack: center; | |
justify-content: center; | |
} | |
} | |
@media (max-width: 768px) and (min-width: 420px) { | |
.wpsp-align .wp-show-posts-inner .wp-show-posts-image { | |
margin-right: 1.5em; | |
} | |
} | |
/* magazine Grid Golden Ratio 5 block standard */ | |
/* Add wpsp-grid class to WPSP List shortcode wrapper */ | |
@media (min-width: 600px) { | |
.wpsp-grid .wp-show-posts { | |
display: grid; | |
} | |
} | |
@media (min-width: 900px) { | |
.wpsp-grid .wp-show-posts { | |
grid-template-columns: repeat(8, 1fr); | |
grid-template-rows: 1fr auto; | |
} | |
.wpsp-grid .wp-show-posts article:first-child { | |
grid-column: 1 / 5; | |
grid-row: 1 / 4; | |
} | |
.wpsp-grid .wp-show-posts article:nth-child(2) { | |
grid-column: 5 / end; | |
grid-row: 1 / 2; | |
} | |
.wpsp-grid .wp-show-posts article:nth-child(3) { | |
grid-column: 5 / 7; | |
grid-row: 2 / 4; | |
} | |
.wpsp-grid .wp-show-posts article:nth-child(4) { | |
grid-column: 7 / end; | |
grid-row: 2 / 4; | |
} | |
} | |
@media (max-width: 899px) and (min-width: 600px) { | |
.wpsp-grid .wp-show-posts article { | |
grid-column: span 4; | |
} | |
.wpsp-grid .wp-show-posts article:nth-child(3), | |
.wpsp-grid .wp-show-posts article:nth-child(4) { | |
grid-row: 3; | |
grid-column: span 2; | |
} | |
} | |
.wpsp-grid article:not(:first-child) .wp-show-posts-image a img { | |
height: 250px; | |
width: 100%; | |
-o-object-fit: cover; | |
object-fit: cover; | |
} | |
.wpsp-grid article:first-child .wp-show-posts-image a img { | |
height: 500px; | |
width: 100%; | |
-o-object-fit: cover; | |
object-fit: cover; | |
} | |
.wpsp-grid article:not(:first-child) .wp-show-posts-entry-summary, | |
.wpsp-grid article:not(:first-child) .wp-show-posts-entry-meta-below-post, | |
.wpsp-grid article:not(:first-child) .wpsp-read-more { | |
display: none; | |
} | |
/* WPSP Card Styling */ | |
/* Add wpsp-card class to WPSP List shortcode wrapper */ | |
.wpsp-card .wp-show-posts-meta a, | |
.wpsp-card .wp-show-posts-meta a:visited { | |
font-size: 1em; | |
font-weight: 500; | |
text-transform: uppercase; | |
} | |
:not(.widget).wpsp-card .wp-show-posts article, | |
.wpsp-card .wp-show-posts-image { | |
margin-bottom: 0 !important; | |
} | |
.wpsp-card .wp-show-posts-inner { | |
position: relative; | |
-webkit-box-sizing: border-box; | |
box-sizing: border-box; | |
} | |
.wpsp-card .wpsp-content-wrap { | |
position: absolute; | |
bottom: 0; | |
left: 0; | |
right: 0; | |
padding: 5% 8%; | |
-webkit-box-sizing: border-box; | |
box-sizing: border-box; | |
background-color: rgba(0, 0, 0, 0.35); | |
background: -webkit-gradient( | |
linear, | |
left bottom, | |
left top, | |
color-stop(30%, rgba(80, 50, 50, 0.5)), | |
to(rgba(0, 0, 0, 0)) | |
); | |
background: linear-gradient( | |
0deg, | |
rgba(80, 50, 50, 0.5) 30%, | |
rgba(0, 0, 0, 0) 100% | |
); | |
pointer-events: none; | |
} | |
.wpsp-card article { | |
position: relative; | |
overflow: hidden; | |
} | |
.wpsp-card article, | |
.wpsp-card article .wp-show-posts-image img { | |
-webkit-backface-visibility: hidden; | |
-webkit-transition: 0.3s all ease; | |
transition: 0.3s all ease; | |
} | |
.wpsp-card article:hover .wp-show-posts-image img { | |
-webkit-transform: scale(1.1); | |
transform: scale(1.1); | |
-webkit-transition: 0.3s all ease; | |
transition: 0.3s all ease; | |
} | |
/* Post Navigation */ | |
#post-nav a { | |
-webkit-box-flex: 1; | |
-ms-flex: 1 0 50%; | |
flex: 1 0 50%; | |
-webkit-box-sizing: border-box; | |
box-sizing: border-box; | |
} | |
@media (max-width: 768px) { | |
#post-nav a { | |
-webkit-box-flex: 1; | |
-ms-flex: 1 0 100%; | |
flex: 1 0 100%; | |
} | |
} | |
#post-nav, | |
#post-nav .post-nav-wrap { | |
display: -webkit-box; | |
display: -ms-flexbox; | |
display: flex; | |
-webkit-box-sizing: border-box; | |
box-sizing: border-box; | |
} | |
#post-nav { | |
-ms-flex-wrap: wrap; | |
flex-wrap: wrap; | |
margin-top: 60px; | |
} | |
#post-nav .post-nav-wrap { | |
background-size: cover !important; | |
background-position: center center !important; | |
min-height: 120px; | |
height: 100%; | |
padding: calc(6% + 1em) 5%; | |
-webkit-box-shadow: inset 0 -50px 70px 20px rgba(0, 0, 0, 0.5); | |
box-shadow: inset 0 -50px 70px 20px rgba(0, 0, 0, 0.5); | |
-webkit-transition: -webkit-box-shadow 500ms; | |
transition: -webkit-box-shadow 500ms; | |
transition: box-shadow 500ms; | |
transition: box-shadow 500ms, -webkit-box-shadow 500ms; | |
position: relative; | |
box-sizing: border-box; | |
} | |
#post-nav .post-nav-wrap:hover { | |
-webkit-box-shadow: inset 0 -90px 70px 20px rgba(0, 0, 0, 0.5); | |
box-shadow: inset 0 -90px 70px 20px rgba(0, 0, 0, 0.5); | |
} | |
.post-nav-wrap > * { | |
color: #fff; | |
} | |
.post-nav-date { | |
font-size: 0.9em; | |
} | |
.post-nav-title { | |
margin: 5px 0 !important; | |
} | |
.post-nav { | |
min-width: 60px; | |
position: absolute; | |
top: 0; | |
border-radius: 0 0 2px 0; | |
} | |
.post-nav:first-child { | |
left: 0; | |
} | |
.post-nav:last-child { | |
right: 0; | |
} | |
.post-nav { | |
padding: 6px 12px; | |
border-radius: 3px; | |
font-size: 0.7em; | |
text-transform: uppercase; | |
background-color: #ff1956; | |
color: #fff !important; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment