jasterv/MEMORY-CARD-GAME
1
0
Fork 0
mirror of https://codeberg.org/JasterV/MEMORY-CARD-GAME.git synced 2026-04-26 18:20:03 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

😼🐸 Checkpoint

Browse source 
./style.css:18108127/1801
./index.html:18108127/618
This commit is contained in:
Glitch (hello-webpage) 2020-07-30 09:32:46 +00:00
parent 204615b3fb
commit c6fc18ab28
2 changed files with 19 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
index.html
View file

@ -15,7 +15,7 @@
<link rel="stylesheet" href="/style.css" />
</head>
<body>
<i id="score-responsive" class="fas fa-trophy"></i>
<i id="score-toggle" class="fas fa-trophy"></i>
<div class="cards-row">
<div class="left-card card">

39
style.css
View file

@ -275,15 +275,15 @@ strong {
background: #479EEB;
}
#score-responsive {
#score-toggle {
position: absolute;
font-size: 30px;
top: -255px;
left: 50px;
color: hsla(208, 80%, 60%, 1);
z-index: 3;
top: 30px;
left: 48px;
z-index: 2;
font-size: 34px;
opacity: 0;
pointer-events: none;
transition: 300ms ease-out;
}
@media (max-width: 980px) {
@ -354,7 +354,7 @@ strong {
max-height: 73%;
}
.fa-trophy {
.score-container .fa-trophy {
font-size: 27vh;
bottom: 0;
transform: translateX(-62%) translateY(26%);
@ -367,34 +367,31 @@ strong {
@media (max-width: 500px) {
body {
display: block;
margin: 0;
padding: 0;
height: auto;
overflow: hidden;
}
.score-container {
position: absolute;
top: 0;
max-height: 100%;
min-height: 100%;
bottom: 0;
margin-top: 0;
opacity: 0;
pointer-events: none;
position: absolute;
}
.cards-row {
height: 100%;
margin-top: 0;
}
.fa-trophy {
font-size: 78vh;
opacity: .3;
left: 53px;
top: 80px;
.left-card {
position: absolute;
top: 0;
padding: 0 2rem;
}
#score-responsive {
opacity: .3;
#score-toggle {
opacity: 1;
pointer-events: all;
}
}