Compare commits

..

No commits in common. "b286e2e8891efa9f7daf86a73483e278e81b3970" and "3737631412dd84a7e3b3bd3264bb65121f0b125c" have entirely different histories.

View File

@ -21,8 +21,6 @@ body {
grid-template-rows: 1fr;
width: 100vw;
height: 100vh;
overflow: hidden;
}
main {
@ -36,6 +34,9 @@ main {
place-items: center;
}
.btn {
}
.btn:focus {
outline: none;
}
@ -47,6 +48,7 @@ main {
position: relative;
padding: 2.2rem;
margin: -.4rem;
width: 0;
height: 0;
@ -58,44 +60,21 @@ main {
border-radius: 100vw;
}
.btn.cbtn {
--padding: 5vmin;
padding: var(--padding);
font-size: 3vmin;
}
.btn.cbtn.medium {
--padding: 5vmin;
padding: var(--padding);
font-size: 3vmin;
}
.btn.cbtn.big {
--padding: 30vmin;
padding: var(--padding);
font-size: 20vmin;
}
.btn.cbtn.overlap {
margin: -1vmin;
}
.btn.cbtn > i {
display: grid;
place-items: center;
padding: inherit;
}
.btn.cbtn > i::after {
display: grid;
place-content: center;
position: absolute;
z-index: 1000;
overflow: hidden;
padding: 0rem;
background: var(--btn-light);
color: var(--btn-dark);
background: #fff;
filter: invert(1);
width: 0;
@ -107,7 +86,7 @@ main {
/* When deployed on a platform, choose one or the other, not both */
.btn.cbtn:focus > i::after, /* TV */
.btn.cbtn:hover > i::after /* PC */ {
padding: var(--padding);
padding: inherit;
}
@keyframes cbtn-click {
@ -116,7 +95,7 @@ main {
opacity: 1;
}
to {
padding: calc(var(--padding) * 1.3);
padding: inherit;
opacity: 0;
}
}
@ -143,7 +122,6 @@ main {
text-decoration: none;
font-family: Lato;
}
.btn.sbtn::after {
}