michi.vonah/website-v3
1
0
Fork 0
mirror of https://github.com/michivonah/website-v3.git synced 2025-12-22 21:36:28 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

reduce redundancy in project section styling

Browse source
This commit is contained in:
Michi 2025-03-20 22:04:14 +01:00
parent 448ae8a49b
commit 892f8ece0c
1 changed files with 20 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

33
static/style.css
View file

@ -434,9 +434,16 @@ nav.small .nav-links a:last-child:focus{
background-position: center; background-position: center;
border-radius: var(--baseRadius); border-radius: var(--baseRadius);
transition: var(--baseTransition); transition: var(--baseTransition);
box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.705); box-shadow: var(--boxShadow);
overflow: hidden; overflow: hidden;
position: relative; position: relative;
--boxShadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.705);
--backgroundImage: url("assets/projects/sprinkle.svg");
--fontSizeH2: 1.2rem;
--fontSizeIcon: 2.5rem;
--fontSizeP: 1.1rem;
--fontWeightP: 600;
} }
.card-first img{ .card-first img{
@ -451,11 +458,11 @@ nav.small .nav-links a:last-child:focus{
@media (pointer: fine){ @media (pointer: fine){
.project-card:hover{ .project-card:hover{
background: var(--primary); background: var(--primary);
background-image: url("assets/projects/sprinkle.svg"); background-image: var(--backgroundImage);
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.705); box-shadow: var(--boxShadow);
cursor: pointer; cursor: pointer;
overflow: hidden; overflow: hidden;
} }
@ -497,27 +504,27 @@ nav.small .nav-links a:last-child:focus{
} }
.project-card:hover .card-second h2{ .project-card:hover .card-second h2{
font-size: 1.2rem; font-size: var(--fontSizeH2);
} }
.project-card:hover .card-second p{ .project-card:hover .card-second p{
font-size: 1.1rem; font-size: var(--fontSizeP);;
font-weight: 600; font-weight: var(--fontWeightP);
} }
.project-card:hover .card-second i{ .project-card:hover .card-second i{
font-size: 2.5rem; font-size: var(--fontSizeIcon);;
} }
} }
@media (pointer: coarse) or (pointer: none){ @media (pointer: coarse) or (pointer: none){
.project-card{ .project-card{
background: var(--primary); background: var(--primary);
background-image: url("assets/projects/sprinkle.svg"); background-image: var(--backgroundImage);
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.705); box-shadow: var(--boxShadow);
} }
.card-first img{ .card-first img{
@ -541,16 +548,16 @@ nav.small .nav-links a:last-child:focus{
} }
.project-card .card-second h2{ .project-card .card-second h2{
font-size: 1.2rem; font-size: var(--fontSizeH2);
} }
.project-card .card-second p{ .project-card .card-second p{
font-size: 1.1rem; font-size: var(--fontSizeP);
font-weight: 600; font-weight: var(--fontWeightP);
} }
.project-card .card-second i{ .project-card .card-second i{
font-size: 2.5rem; font-size: var(--fontSizeIcon);
} }
} }