infeeeee/dis-2019
1
0
Fork 0
Code Issues 6 Pull Requests Releases 19 Wiki Activity

fix icon clicks on iphone

Browse Source
This commit is contained in:
infeeeee
2019-09-06 20:00:09 +02:00
parent 5d03dea44d
commit 1595691bc3
6 changed files with 369 additions and 303 deletions
Download Patch File Download Diff File Expand all files Collapse all files

287
sass/base.scss
View File

@@ -76,10 +76,6 @@ button {
}
}
object {
pointer-events: none;
}
/* ---------------------------- default selection --------------------------- */
html *::selection {
@@ -429,7 +425,7 @@ $v-unit-6: 24rem;
padding: 2rem !important;
justify-content: space-between !important;
align-content: space-between;
z-index: 3100;
// z-index: 3100;
background: #fff;
}
@media #{$smalldesktop} {
@@ -438,9 +434,9 @@ $v-unit-6: 24rem;
div {
z-index: 3500;
object {
-webkit-transform: translate3d(0, 0, 0);
}
// object {
// -webkit-transform: translate3d(0, 0, 0);
// }
}
a {
display: inline-block;
@@ -487,56 +483,123 @@ $v-unit-6: 24rem;
// }
// }
//icons in menu:
object {
height: 3rem;
// width: 3rem;
@media #{$tablet} {
height: 2.5rem;
// width: 2.5rem;
}
@media #{$smalldesktop} {
height: 3rem;
// width: 3rem;
}
}
// object {
// height: 3rem;
// // width: 3rem;
// @media #{$tablet} {
// height: 2.5rem;
// // width: 2.5rem;
// }
// @media #{$smalldesktop} {
// height: 3rem;
// // width: 3rem;
// }
// }
/* -------------------------------------------------------------------------- */
/* header elements */
/* -------------------------------------------------------------------------- */
// color of header elements, icons
.logo,
.social-link,
.menubutton,
.events-link {
a,
button,
* {
z-index: 3501;
cursor: pointer;
// .logo,
// .social-link,
// .menubutton,
// .events-link {
// a,
// button,
// * {
// // z-index: 3501;
// // cursor: pointer;
// }
// // .white {
// // display: block;
// // }
// // .black {
// // display: none;
// // }
// // filter: invert(100);
// }
// @media #{$tablet} {
// .logo,
// .social-link,
// .menubutton,
// .events-link {
// // .white {
// // display: none;
// // }
// // .black {
// // display: block;
// // }
// // filter: invert(100);
// }
// }
//icons:
.dis-logo {
background-image: url(../img/dis-logo-white.png);
background-image: url(../img/dis-logo-white.svg);
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
width: $h-unit-1;
height: $h-unit-1;
@media #{$tablet} {
background-image: url(../img/dis-logo-black.png);
background-image: url(../img/dis-logo-black.svg);
height: 4rem;
width: 4rem;
}
.white {
display: block;
@media #{$smalldesktop} {
height: $h-unit-1;
width: $h-unit-1;
}
.black {
display: none;
}
// filter: invert(100);
}
@media #{$tablet} {
.logo,
.social-link,
.menubutton,
.events-link {
.white {
display: none;
}
.black {
display: block;
}
// filter: invert(100);
.icon {
height: 3rem;
width: 3rem;
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
-webkit-transform: translate3d(0, 0, 0);
@media #{$tablet} {
height: 2.5rem;
width: 2.5rem;
}
@media #{$smalldesktop} {
height: 3rem;
width: 3rem;
}
}
@mixin bw-icon($iconname) {
background-image: url(../img/#{$iconname}-white.png);
background-image: url(../img/#{$iconname}-white.svg);
@media #{$tablet} {
background-image: url(../img/#{$iconname}-black.png);
background-image: url(../img/#{$iconname}-black.svg);
}
}
.facebook-icon {
@include bw-icon(facebook_icon);
}
.instagram-icon {
@include bw-icon(instagram_icon);
}
.esemeny-icon {
@include bw-icon(naptar_icon);
}
.menubutton-icon {
@include bw-icon(dis-plus);
}
.kereso-icon {
@include bw-icon(kereso_icon);
}
@media #{$tablet} {
@@ -547,20 +610,20 @@ $v-unit-6: 24rem;
}
// dis logo size:
.logo {
object {
height: $h-unit-1;
// width: $h-unit-1;
@media #{$tablet} {
height: 4rem;
// width: 4rem;
}
@media #{$smalldesktop} {
height: $h-unit-1;
// width: $h-unit-1;
}
}
}
// .logo {
// object {
// height: $h-unit-1;
// // width: $h-unit-1;
// @media #{$tablet} {
// height: 4rem;
// // width: 4rem;
// }
// @media #{$smalldesktop} {
// height: $h-unit-1;
// // width: $h-unit-1;
// }
// }
// }
.menubutton {
$speed: 0.5s;
@@ -568,7 +631,7 @@ $v-unit-6: 24rem;
$easing: linear;
order: 99;
z-index: 3002;
// z-index: 3002;
button {
transform-origin: center;
@@ -577,14 +640,16 @@ $v-unit-6: 24rem;
&.rotated {
@include transform(rotate($degree));
}
&.inverted {
&.inverted .menubutton-icon {
@media #{$tablet} {
.white {
display: block;
}
.black {
display: none;
}
background-image: url(../img/dis-plus-white.png);
background-image: url(../img/dis-plus-white.svg);
// .white {
// display: block;
// }
// .black {
// display: none;
// }
}
}
}
@@ -634,12 +699,12 @@ $v-unit-6: 24rem;
button {
flex: 0 0 auto;
.white {
display: block;
}
.black {
display: none;
}
// .white {
// display: block;
// }
// .black {
// display: none;
// }
}
}
} //search-bar end
@@ -650,14 +715,14 @@ $v-unit-6: 24rem;
.search-box {
display: block;
flex: 1 1 0 !important;
& > button {
.white {
display: none;
}
.black {
display: block;
}
}
// & > button {
// .white {
// display: none;
// }
// .black {
// display: block;
// }
// }
}
.search-bar {
@@ -715,6 +780,7 @@ $v-unit-6: 24rem;
display: flex;
flex-direction: row;
align-items: center;
height: 100vh;
}
.menuseparator {
display: block;
@@ -823,7 +889,7 @@ $v-unit-6: 24rem;
/* STRUCTURE ALL PAGE */
/* -------------------------------------------------------------------------- */
main {
z-index: 2;
// z-index: 2;
section {
article {
position: relative;
@@ -1127,26 +1193,26 @@ $v-unit-6: 24rem;
}
//border on first elements
&.post_nr_1 {
// .metadata {
// &::after {
// display: none;
// }
// &.post_nr_1 {
// // .metadata {
// // &::after {
// // display: none;
// // }
// @include triangle-corner-bordered(#{$h-unit-1}, #{$h-unit-1} + 1px, white, #000, left);
// z-index: 15;
// & > * {
// z-index: 15;
// }
// }
// h2 {
// height: calc(50vh + 1px);
// top: -1px;
// position: relative;
// border-top: #000 1px solid;
// z-index: 8;
// }
}
// // @include triangle-corner-bordered(#{$h-unit-1}, #{$h-unit-1} + 1px, white, #000, left);
// // z-index: 15;
// // & > * {
// // z-index: 15;
// // }
// // }
// // h2 {
// // height: calc(50vh + 1px);
// // top: -1px;
// // position: relative;
// // border-top: #000 1px solid;
// // z-index: 8;
// // }
// }
} //article end
/* ------------------------ home article desktop big ------------------------ */
@@ -1800,10 +1866,9 @@ body.category.category-esemeny {
padding: 0;
border: none;
padding-right: 2rem;
a{
a {
@include event-title;
}
}
.vr {
flex: 0 0 auto;
@@ -1989,9 +2054,9 @@ $padd: 2rem;
flex-direction: row;
justify-content: flex-start;
.time-cat {
z-index: 10;
}
// .time-cat {
// // z-index: 10;
// }
.time-cat::after {
content: " ";
display: inline-block;
@@ -2197,10 +2262,10 @@ $padd: 2rem;
blockquote {
display: inline;
position: relative;
p{
p {
@include single-quote-big();
}
cite {
// display: inline !important;
position: absolute;