jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-19 21:35:31 -04:00
Code Issues Activity

add :focus-visible css selector to some hover styles

Browse Source
This commit is contained in:
Jake Jarvis
2022-07-27 18:05:50 -04:00
parent 78593b03ca
commit 1f373541be
12 changed files with 27 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
components/Loading/Loading.tsx
View File

@@ -1,15 +1,6 @@
import { styled, theme, keyframes } from "../../lib/styles/stitches.config";
import type { ComponentProps } from "react";
const pulse = keyframes({
"0%, 80%, 100%": {
transform: "scale(0)",
},
"40%": {
transform: "scale(0.6)",
},
});
const Wrapper = styled("div", {
display: "inline-block",
textAlign: "center",
@@ -18,7 +9,14 @@ const Wrapper = styled("div", {
const Box = styled("div", {
display: "inline-block",
height: "100%",
animation: `${pulse} 1.5s infinite ease-in-out both`,
animation: `${keyframes({
"0%, 80%, 100%": {
transform: "scale(0)",
},
"40%": {
transform: "scale(0.6)",
},
})} 1.5s infinite ease-in-out both`,
backgroundColor: theme.colors.mediumLight,
});