works on single

This commit is contained in:
2019-07-11 13:36:28 +02:00
parent 99e2082e42
commit 4c443cd7ec
6 changed files with 731 additions and 220 deletions

View File

@@ -1286,7 +1286,8 @@ body.category.category-esemeny {
/* single */
/* -------------------------------------------------------------------------- */
.single {
.single,
.page {
//no menus on single
@media #{$smalldesktop} {
.wrapper {
@@ -1315,6 +1316,7 @@ body.category.category-esemeny {
// padding: $padd;
// margin: 0;
// }
padding-bottom: $h-unit-1;
.thumbnailwrapper {
padding: 0;
@@ -1363,7 +1365,7 @@ body.category.category-esemeny {
}
}
/* ---------------------------- single on desktop --------------------------- */
/* ---------------------------- single header on desktop --------------------------- */
@media #{$smalldesktop} {
margin-top: 100vh;
@@ -1440,6 +1442,28 @@ body.category.category-esemeny {
/* ----------------------------- single content ----------------------------- */
hr {
height: 1px;
background-color: #ff5f5f;
padding: 0;
margin: 0 auto;
border: none;
width: 20%;
&.content-wrap {
width: 40%;
}
&.content-begin {
margin-top: calc(25vh + #{$padd});
@media #{$smalldesktop} {
margin-top: 0;
}
}
&.content-end {
margin-top: $padd;
margin-bottom: $padd;
}
}
.single-content {
position: relative;
padding: $padd;
@@ -1449,6 +1473,14 @@ body.category.category-esemeny {
padding-right: $h-unit-2;
}
h3 {
@include single-quote();
margin: 2rem 0;
display: inline-block;
background: #ff5f5f;
@include box-shadow(10px 0 #ff5f5f, -5px 0 #ff5f5f);
}
h4 {
@include single-h4();
}
@@ -1457,24 +1489,6 @@ body.category.category-esemeny {
text-decoration: underline;
}
hr {
height: 1px;
background-color: #ff5f5f;
padding: 0;
margin: 0 auto;
border: none;
width: 20%;
&.content-wrap {
width: 40%;
}
&.content-begin {
margin-top: calc(25vh + #{$padd});
@media #{$smalldesktop} {
margin-top: 0;
}
}
}
strong {
font-weight: 900;
}
@@ -1483,10 +1497,10 @@ body.category.category-esemeny {
@include single-quote();
margin: 3rem 0;
p {
// background: #ff5f5f;
background: #ff5f5f;
display: inline;
padding: 3px 0;
// @include box-shadow(10px 0 #ff5f5f, -5px 0 #ff5f5f);
@include box-shadow(10px 0 #ff5f5f, -5px 0 #ff5f5f);
}
cite {
position: relative;
@@ -1499,7 +1513,7 @@ body.category.category-esemeny {
// padding: $padd 0;
margin: $padd 0;
@media #{$smalldesktop} {
padding: 0 $h-unit-1;
padding: $padd 0;
}
position: relative !important;
figcaption {
@@ -1552,6 +1566,12 @@ body.category.category-esemeny {
flex-direction: column;
justify-content: center;
z-index: 1;
@media #{$smalldesktop} {
display: none;
&.vis {
display: block;
}
}
}
//aligned:
@@ -1562,6 +1582,13 @@ body.category.category-esemeny {
//no align on mobile
float: unset;
margin: 0;
@media #{$smalldesktop} {
width: 100%;
}
}
.alignright{
text-align: right;
}
}
}
@@ -1629,6 +1656,28 @@ body.category.category-esemeny {
} //#colorbox end
/* ------------------------------ related posts ----------------------------- */
.toHome,
#related_posts > h3 {
padding-bottom: $padd * 2;
margin: 0 auto;
// display: inline-block;
text-align: center;
@include single-metadata();
a {
@include single-metadata();
&:hover {
color: #000;
-webkit-text-stroke-color: transparent;
}
}
}
.toHome {
@media #{$smalldesktop} {
padding-top: $padd * 2;
}
}
#related_posts {
& > h3 {
display: none;
@@ -1637,21 +1686,60 @@ body.category.category-esemeny {
padding: 0;
li {
display: block;
position: relative;
cursor: pointer;
// .relatedcontent {
// height: 50vw;
// padding: $padd;
//
// }
& > a {
margin: 0;
padding: 0;
border: none;
display: inline-block;
}
.relatedthumb {
.related_thumbnailwrapper {
img {
// post thumbnail on home
height: 50vw;
width: 100vw;
object-fit: cover;
}
}
.relatedcontent {
h2 {
width: 100%;
height: 50vw;
padding: $padd;
h3 {
padding: 2rem;
padding-top: 3rem;
margin: 0;
a {
@include related-title();
}
}
.metadata {
bottom: 50%;
height: $h-unit-1;
display: flex;
@include fit-content(width);
justify-content: space-around;
flex-wrap: nowrap;
align-items: center;
padding: 0;
.vr {
height: 100%;
width: 1px;
background-color: #000;
flex-grow: 0 !important;
flex-shrink: 0 !important;
flex-basis: auto !important;
}
}
}
}
@@ -1659,7 +1747,6 @@ body.category.category-esemeny {
@media #{$smalldesktop} {
padding-right: $h-unit-2;
& > h3 {
display: block;
}
@@ -1669,17 +1756,97 @@ body.category.category-esemeny {
flex-wrap: nowrap;
li {
flex: 1 1 33%;
.relatedthumb {
// .relatedthumb {
// img {
// width: 100%;
// height: calc((100vw - #{$v-unit-4}) / 3);
// }
// }
// .relatedcontent {
// position: absolute;
// height: unset;
// bottom: 0;
// width: calc((100vw - #{$v-unit-4}) / 3);
// }
flex: 0 0 calc(100% / 3);
// height: 50%;
height: calc((100vw - #{$v-unit-4}) / 3);
position: relative;
.related_thumbnailwrapper {
width: 100%;
height: 100%;
img {
width: 100%;
height: calc((100vw - #{$v-unit-4}) / 3);
height: 100%;
object-fit: cover;
}
}
.relatedcontent {
.metadata {
width: 100%;
min-width: unset;
height: $h-unit-1;
position: absolute;
height: unset;
bottom: 0;
width: calc((100vw - #{$v-unit-4}) / 3);
right: 0;
background: transparent;
display: flex;
flex-direction: row;
padding: 0;
justify-content: space-between;
align-items: stretch;
@include triangle-corner-bordered(#{$h-unit-1}, 0, transparent, #000, left);
display: none;
&.vis {
display: flex;
}
.categories,
.postedon {
@include home-metadata();
}
.categories {
margin-left: $v-unit-1 * 1.5;
padding: $v-unit-1 / 3 0;
flex: 1 1 auto;
}
.postedon {
padding: $v-unit-1 / 3 $v-unit-1 / 4;
flex: 1 0 auto;
}
}
h2,
h2 a {
@include home-title-small();
}
h2 {
display: none;
position: absolute;
top: 0;
background-color: #fff;
height: 100%;
padding-left: $v-unit-1;
@media #{$bigdesktop} {
padding: $h-unit-1;
}
a {
bottom: $h-unit-1 + $v-unit-1 * 0.5;
width: calc(100% - #{$v-unit-2});
@include fit-content(height);
position: absolute;
@media #{$bigdesktop} {
width: calc(100% - #{$h-unit-2});
}
}
}
}
}
@@ -1706,10 +1873,6 @@ body.category.category-esemeny {
}
}
blockquote p {
background: $color !important;
@include box-shadow(10px 0 $color, -5px 0 $color !important);
}
hr {
background-color: $color !important;
}
@@ -1782,19 +1945,26 @@ body.category.category-esemeny {
//colors on single articles
@mixin tagcolors-single($color) {
.metadata {
@media #{$smalldesktop} {
color: #fff !important;
-webkit-text-stroke: $color 1px !important;
}
a {
.titlewrapper {
.metadata {
@media #{$smalldesktop} {
color: #fff !important;
-webkit-text-stroke: $color 1px !important;
}
a {
@media #{$smalldesktop} {
color: #fff !important;
-webkit-text-stroke: $color 1px !important;
}
}
}
}
.single-content {
blockquote p,
h3 {
background: $color !important;
@include box-shadow(10px 0 $color, -5px 0 $color !important);
}
a {
color: $color;
}