home updates

This commit is contained in:
2019-06-17 19:27:21 +02:00
parent fc73386e85
commit 5fe471dfe6
4 changed files with 198 additions and 85 deletions

View File

@@ -311,7 +311,7 @@ $v-unit-1: 4rem;
// color: #000;
// fill: currentColor;
filter: invert(100%); //black
@include transform(rotate(180deg)) // transform: rotate(180deg);;;;;;;;;;;;;;;;
@include transform(rotate(180deg)) // transform: rotate(180deg);;;;;;;;;;;;;;;;;;;;
}
}
}
@@ -563,8 +563,18 @@ $v-unit-1: 4rem;
} //wrapper end
//no header scroll on touch devices(because it's invisible)
.touchevents .header-scroll {
display: none !important;
.touchevents {
.header-scroll {
display: none !important;
}
// no overflow on touch devices, where no horizontal scrollbar visible
.archive,
.home {
@media #{$smalldesktop} {
overflow-y: hidden;
}
}
}
/* -------------------------------------------------------------------------- */
@@ -574,7 +584,7 @@ $v-unit-1: 4rem;
.archive,
.home {
@media #{$smalldesktop} {
overflow-y: hidden;
// overflow-y: hidden;
}
.wrapper {
@@ -685,7 +695,8 @@ $v-unit-1: 4rem;
padding-top: $v-unit-1;
border-right: #000 1px solid;
/* -------------------------------- thumbnail and title ------------------------------- */
/* ------------- home article desktop big - thumbnail and title ------------- */
.thumbnailwrapper {
height: calc(100% - #{$v-unit-1});
display: flex;
@@ -720,18 +731,23 @@ $v-unit-1: 4rem;
align-items: center;
@include triangle-corner-bordered(#{$v-unit-1}, 0, transparent);
@include home-metadata-big();
& > div {
width: 30%;
}
@media #{$mobile-landscape} {
height: calc(#{$h-unit-2} / 2);
}
.categories {
// display: none;
display: block;
// border-right: #000 solid 1px;
padding: 0 $h-unit-1;
}
.vr {
height: 100%;
width: 1px;
background-color: #000;
}
.postedon{
padding: 0 $h-unit-1;
}
.bevezeto,
@@ -742,7 +758,6 @@ $v-unit-1: 4rem;
/* ------------------------- home article big hover ------------------------- */
&.hovered {
width: calc(100vw - (#{$h-unit-2} * 2));
h2 > a {
color: #000;
}
@@ -758,6 +773,12 @@ $v-unit-1: 4rem;
&.home-wrapper-2 {
article {
border-left: #000 1px solid;
.thumbnailwrapper {
img {
left: -$h-unit-1;
position: relative;
}
}
}
}
}
@@ -846,7 +867,7 @@ $v-unit-1: 4rem;
border-right: #000 1px solid;
@include home-title();
@include triangle-corner-bordered($h-unit-1, 0, transparent);
&.tag{
&.tag {
text-transform: uppercase;
}
}
@@ -864,7 +885,7 @@ $v-unit-1: 4rem;
justify-content: flex-end;
align-items: flex-start;
padding: 2rem;
p{
p {
margin: 0;
@include archive-tag-description();
}
@@ -1142,6 +1163,8 @@ $v-unit-1: 4rem;
}
}
//tagclip: filters on small articale images
@mixin tagclip($tag) {
@media #{$smalldesktop} {
.thumbnailwrapper > img {
@@ -1157,6 +1180,8 @@ $v-unit-1: 4rem;
}
}
//colors on single articles
@mixin tagcolors-single($color) {
.metadata {
@media #{$smalldesktop} {
@@ -1172,6 +1197,8 @@ $v-unit-1: 4rem;
}
}
//colors on articles
.tag-be {
@include tagcolors(#00ffb8);
&.random {
@@ -1200,6 +1227,7 @@ $v-unit-1: 4rem;
}
}
//single article
.single {
.tag-be {
@include tagcolors-single(#00ffb8);
@@ -1218,6 +1246,28 @@ $v-unit-1: 4rem;
}
}
//menu colored on big article hover
body,
.header-1,
.header-2 {
&.hover-tag-be {
background-color: #00ffb8 !important;
}
&.hover-tag-do {
background-color: #ff5f5f !important;
}
&.hover-tag-think {
background-color: #fdff00 !important;
}
&.hover-tag-love {
background-color: #3c00ff !important;
}
}
/* -------------------------------------------------------------------------- */
/* imports */
/* -------------------------------------------------------------------------- */