Repository URL to install this package:
|
Version:
3.7.1 ▾
|
jsarnowski/oxygen
/
components
/
classes
/
easy-posts-templates
/
masonry-image-w-rectangle-overlap.css
|
|---|
%%EPID%% .oxy-posts {
display: block;
column-count: 2;
column-gap: 2em;
margin-bottom: 4em;
}
%%EPID%% .oxy-post {
display: flex;
flex-direction: column;
text-align: left;
align-items: flex-start;
margin-bottom: 0em;
break-inside: avoid;
}
%%EPID%% .oxy-post-image {
position: relative;
background-color: #ddd;
background-image: repeating-linear-gradient(
45deg,
#eee,
#eee 10px,
#ddd 10px,
#ddd 20px);
width: 100%;
}
%%EPID%% .oxy-post-image-fixed-ratio {
padding-bottom: 50%;
background-size: cover;
background-position: center center;
}
%%EPID%% .oxy-post-image-date-overlay {
position: absolute;
top: 1em;
right: 1em;
font-size: .7em;
color: white;
background-color: rgba(0,0,0,0.5);
padding: .7em 1em;
font-weight: bold;
-webkit-font-smoothing: antialiased;
}
%%EPID%% .oxy-post-wrap {
background-color: white;
padding: 2em;
margin: 2em;
margin-top: -6em;
z-index: 1;
align-self: stretch;
}
%%EPID%% .oxy-post-title {
font-size: 1.5em;
line-height: 1.2em;
}
%%EPID%% .oxy-post-meta {
margin-top: 0.5em;
font-size: .8em;
display: flex;
flex-direction: row;
}
%%EPID%% .oxy-post-meta-item::after {
content: "\00b7";
margin-right: .5em;
margin-left: .5em;
}
%%EPID%% .oxy-post-meta-item:last-child::after {
content: "";
display: none;
}
%%EPID%% .oxy-post-content {
margin-top: 1em;
margin-bottom: 1em;
}
%%EPID%% .oxy-post-content p {
margin: 0;
}
@media (max-width: 1120px) {
%%EPID%% .oxy-post-meta {
display: none;
}
}
@media (max-width: 991px) {
%%EPID%% .oxy-posts {
column-count: 1;
}
}