fix: styles get overwritten by loading indicator changes (#3012)

This commit is contained in:
Matti Nannt
2024-08-15 14:09:29 +02:00
committed by GitHub
parent 3e25ef4b5a
commit 0aebf234f9
2 changed files with 10 additions and 18 deletions

View File

@@ -4,22 +4,4 @@ const base = require("../../packages/config-tailwind/tailwind.config");
module.exports = {
...base,
content: [...base.content],
theme: {
extend: {
keyframes: {
surveyLoadingAnimation: {
"0%": { transform: "translateY(50px)", opacity: "0" },
"100%": { transform: "translateY(0)", opacity: "1" },
},
surveyExitAnimation: {
"0%": { transform: "translateY(0)", opacity: "1" },
"100%": { transform: "translateY(-50px)", opacity: "0" },
},
},
animation: {
surveyLoading: "surveyLoadingAnimation 0.5s ease-out forwards",
surveyExit: "surveyExitAnimation 0.5s ease-out forwards",
},
},
},
};

View File

@@ -15,6 +15,8 @@ module.exports = {
"accordion-up": "accordion-up 0.2s ease-out",
fadeIn: "fadeIn 0.2s ease-out",
fadeOut: "fadeOut 0.2s ease-out",
surveyLoading: "surveyLoadingAnimation 0.5s ease-out forwards",
surveyExit: "surveyExitAnimation 0.5s ease-out forwards",
},
blur: {
xxs: "0.33px",
@@ -87,6 +89,14 @@ module.exports = {
from: { height: "var(--radix-accordion-content-height)" },
to: { height: 0 },
},
surveyLoadingAnimation: {
"0%": { transform: "translateY(50px)", opacity: "0" },
"100%": { transform: "translateY(0)", opacity: "1" },
},
surveyExitAnimation: {
"0%": { transform: "translateY(0)", opacity: "1" },
"100%": { transform: "translateY(-50px)", opacity: "0" },
},
},
width: {
"sidebar-expanded": "4rem",