Skip to content
This repository was archived by the owner on Oct 19, 2022. It is now read-only.

Commit b619f6c

Browse files
jospoortvlietjospoortvliet
committed
pointer-events:none on non-visible demo/ download buttons
1 parent 4a7f7f9 commit b619f6c

3 files changed

Lines changed: 37 additions & 13 deletions

File tree

‎assets/css/custom.css‎

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -724,7 +724,8 @@
724724
display: none;
725725
position: relative;
726726
left: 0;
727-
padding: 0; }
727+
padding: 0;
728+
visibility: hidden; }
728729
.nav .container .nav__sections-wrapper .nav__sections .nav__section {
729730
display: block;
730731
height: calc(100% / 7);
@@ -733,7 +734,8 @@
733734
margin: 0;
734735
opacity: 0;
735736
color: white;
736-
padding: 0; }
737+
padding: 0;
738+
visibility: hidden; }
737739
.nav .container .nav__sections-wrapper .nav__sections .nav__section:last-child {
738740
font-weight: 500; }
739741
.nav .container .nav__sections-wrapper .nav__sections .nav__section a {
@@ -742,10 +744,12 @@
742744
.nav .container .nav__sections-wrapper .nav__sections.active {
743745
display: block;
744746
color: white;
745-
margin: 0; }
747+
margin: 0;
748+
visibility: visible; }
746749
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section {
747750
animation: fadeInRight .5s ease forwards;
748-
animation-delay: .35s; }
751+
animation-delay: .35s;
752+
visibility: visible; }
749753
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section .nav__label {
750754
font-size: 35px;
751755
line-height: 45px;
@@ -792,6 +796,8 @@
792796
transition-delay: .65s; }
793797
.nav .container .nav__sections-wrapper .right-buttons.active .nav__label {
794798
color: white; }
799+
.nav .container .nav__sections-wrapper .right-buttons.active .ghost-btn a {
800+
pointer-events: all; }
795801
.nav .container .nav__sections-wrapper .right-buttons .ghost-btn {
796802
font-size: 35px;
797803
line-height: 45px;
@@ -802,7 +808,8 @@
802808
text-align: left;
803809
padding-left: 0;
804810
height: calc(100% / 7);
805-
animation: fadeInRight .5s ease forwards; } }
811+
animation: fadeInRight .5s ease forwards;
812+
pointer-events: none; } }
806813
@keyframes fadeInRight {
807814
0% {
808815
opacity: 0;

‎assets/css/header.css‎

Lines changed: 16 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
.brand {
33
-webkit-transform: scale(0.5);
44
top: -26px !important; } }
5+
56
.nav {
67
z-index: 1;
78
padding-top: 20px;
@@ -263,7 +264,8 @@
263264
display: none;
264265
position: relative;
265266
left: 0;
266-
padding: 0; }
267+
padding: 0;
268+
visibility: hidden; }
267269
.nav .container .nav__sections-wrapper .nav__sections .nav__section {
268270
display: block;
269271
height: calc(100% / 7);
@@ -272,7 +274,8 @@
272274
margin: 0;
273275
opacity: 0;
274276
color: white;
275-
padding: 0; }
277+
padding: 0;
278+
visibility: hidden; }
276279
.nav .container .nav__sections-wrapper .nav__sections .nav__section:last-child {
277280
font-weight: 500; }
278281
.nav .container .nav__sections-wrapper .nav__sections .nav__section a {
@@ -281,10 +284,12 @@
281284
.nav .container .nav__sections-wrapper .nav__sections.active {
282285
display: block;
283286
color: white;
284-
margin: 0; }
287+
margin: 0;
288+
visibility: visible; }
285289
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section {
286290
animation: fadeInRight .5s ease forwards;
287-
animation-delay: .35s; }
291+
animation-delay: .35s;
292+
visibility: visible; }
288293
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section .nav__label {
289294
font-size: 35px;
290295
line-height: 45px;
@@ -331,6 +336,8 @@
331336
transition-delay: .65s; }
332337
.nav .container .nav__sections-wrapper .right-buttons.active .nav__label {
333338
color: white; }
339+
.nav .container .nav__sections-wrapper .right-buttons.active .ghost-btn a {
340+
pointer-events: all; }
334341
.nav .container .nav__sections-wrapper .right-buttons .ghost-btn {
335342
font-size: 35px;
336343
line-height: 45px;
@@ -341,14 +348,17 @@
341348
text-align: left;
342349
padding-left: 0;
343350
height: calc(100% / 7);
344-
animation: fadeInRight .5s ease forwards; } }
351+
animation: fadeInRight .5s ease forwards;
352+
pointer-events: none; } }
345353
@keyframes fadeInRight {
346354
0% {
347355
opacity: 0;
348356
left: 20%; }
357+
349358
100% {
350359
opacity: 1;
351360
left: 0; } }
361+
352362
@media (max-height: 800px) {
353363
.nav-down {
354364
opacity: 1;
@@ -447,7 +457,6 @@
447457
@keyframes play {
448458
from {
449459
background-position-x: 0px; }
460+
450461
to {
451462
background-position-x: -4620px; } }
452-
453-
/*# sourceMappingURL=header.css.map */

‎assets/css/header.scss‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -361,6 +361,7 @@
361361
position: relative;
362362
left: 0;
363363
padding: 0;
364+
visibility: hidden;
364365

365366
.nav__section {
366367
display: block;
@@ -371,6 +372,7 @@
371372
opacity: 0;
372373
color: white;
373374
padding: 0;
375+
visibility: hidden;
374376

375377
&:last-child{
376378
font-weight: 500;
@@ -386,11 +388,12 @@
386388
display: block;
387389
color: white;
388390
margin: 0;
391+
visibility: visible;
389392

390393
.nav__section {
391394
animation: fadeInRight .5s ease forwards;
392395
animation-delay: .35s;
393-
396+
visibility: visible;
394397
.nav__label {
395398
font-size: 35px;
396399
line-height: 45px;
@@ -459,6 +462,9 @@
459462
.nav__label {
460463
color: white;
461464
}
465+
.ghost-btn a {
466+
pointer-events: all;
467+
}
462468
}
463469

464470
.ghost-btn {
@@ -472,6 +478,8 @@
472478
padding-left:0;
473479
height: calc(100% / 7);
474480
animation: fadeInRight .5s ease forwards;
481+
pointer-events: none;
482+
475483
}
476484
}
477485
}

0 commit comments

Comments
 (0)