janis/dertyp7.github.io
1
0
Fork 0
mirror of https://github.com/DerTyp7/dertyp7.github.io.git synced 2025-10-29 12:52:08 +01:00
Code Issues Packages Projects Releases Wiki Activity

Add fade-in animation to projects on larger screens

Browse Source
This commit is contained in:
dertyp7
2024-01-14 17:46:59 +01:00
parent 120205725c
commit fc6aa3d8c1
1 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/styles/Projects.scss
View File

@@ -15,10 +15,13 @@
} }
&.active { &.active {
@media (min-width: 768px) {
.project { .project {
opacity: 0;
animation: fadeIn 300ms ease-in-out forwards; animation: fadeIn 300ms ease-in-out forwards;
} }
} }
}
.grid { .grid {
padding: 1rem 0; padding: 1rem 0;
@@ -39,7 +42,6 @@
cursor: pointer; cursor: pointer;
max-width: 500px; max-width: 500px;
min-width: 300px; min-width: 300px;
opacity: 0;
&:hover { &:hover {
border-color: var(--color-accent-background); border-color: var(--color-accent-background);