replace hp with clapper
Signed-off-by: Naman Sood <mail@nsood.in>
This commit is contained in:
parent
e3bad0686f
commit
ea81f7aeef
5 changed files with 87 additions and 14 deletions
|
@ -17,6 +17,9 @@ body.dark-mode {
|
|||
body.dark-mode .image-container img {
|
||||
filter: invert(100%);
|
||||
}
|
||||
body.dark-mode .clapper {
|
||||
filter: invert(100%);
|
||||
}
|
||||
body.dark-mode .bg {
|
||||
opacity: 0 !important;
|
||||
}
|
||||
|
@ -451,6 +454,39 @@ footer {
|
|||
will-change: opacity;
|
||||
}
|
||||
|
||||
.clapper {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 10rem;
|
||||
line-height: 10rem;
|
||||
text-align: center;
|
||||
z-index: 100000;
|
||||
font-size: 5rem;
|
||||
pointer-events: none;
|
||||
transition: none;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.clapper.clapping {
|
||||
animation: clap 1s ease-in-out;
|
||||
}
|
||||
|
||||
@keyframes clap {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
49% {
|
||||
opacity: 0;
|
||||
}
|
||||
51% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1800px) {
|
||||
html {
|
||||
font-size: 20px;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue