diff options
| author | Armand Philippot <git@armandphilippot.com> | 2022-02-01 22:59:25 +0100 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2022-02-01 22:59:25 +0100 |
| commit | eeb9ea8d489c890a80c88658cb860577075ac660 (patch) | |
| tree | 33248a5d1175c9b897b238796d68d28eaeed7ce2 /src | |
| parent | 01d578b6dd5252305ce3d1a1a49336d3f7edc697 (diff) | |
chore: animate main with fade in effect
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/Main/Main.module.scss | 4 | ||||
| -rw-r--r-- | src/styles/base/_animations.scss | 10 |
2 files changed, 14 insertions, 0 deletions
diff --git a/src/components/Main/Main.module.scss b/src/components/Main/Main.module.scss index 7c20020..819474c 100644 --- a/src/components/Main/Main.module.scss +++ b/src/components/Main/Main.module.scss @@ -1,3 +1,7 @@ .wrapper { flex: 1; + + :global { + animation: fade-in 1.5s ease-in-out 0s 1; + } } diff --git a/src/styles/base/_animations.scss b/src/styles/base/_animations.scss index 773bf1d..7dc0d25 100644 --- a/src/styles/base/_animations.scss +++ b/src/styles/base/_animations.scss @@ -136,3 +136,13 @@ color: var(--color-bg-tertiary); } } + +@keyframes fade-in { + 0% { + opacity: 0; + } + + 100% { + opacity: 1; + } +} |