cdransf/coryd.dev-eleventy
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: styles

Browse source
This commit is contained in:
Cory Dransfeldt 2024-08-15 09:50:00 -07:00
parent 39ce5ea05c
commit ea67473957
No known key found for this signature in database
7 changed files with 48 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/assets/styles/components/media-grid.css
View file

@ -51,7 +51,7 @@
content: '';
top: 0;
left: 1px;
box-shadow: inset 0 -85px 60px -65px var(--black);
box-shadow: inset 0 -85px 60px -60px var(--black);
width: calc(100% - 2px);
height: calc(100% - 1px);
}
@ -87,7 +87,7 @@
color: var(--color-lightest);
font-size: var(--font-size-sm);
line-height: 1.5;
text-shadow: rgba(0, 0, 0, 0.7) 0px 0px 10px;
text-shadow: var(--black) 0px 0px 10px;
}
& .header {

2
src/assets/styles/components/modal.css
View file

@ -2,7 +2,7 @@
width: 100%;
height: 100%;
inset: 0;
background: rgba(0, 0, 0, 0.7);
background: #000000b3;
position: fixed;
z-index: 3;

56
src/assets/styles/components/music-chart.css
View file

@ -12,17 +12,18 @@
& .item {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
flex-direction: column;
justify-content: start;
align-items: start;
overflow: hidden;
&:not(:last-of-type) {
margin-bottom: var(--sizing-md);
}
& .progress-bar-wrapper {
margin-top: var(--sizing-sm);
max-width: 40%;
margin-left: var(--sizing-lg);
}
& img {
@ -39,13 +40,13 @@
& .presentation {
justify-content: start;
gap: var(--sizing-md);
width: calc(55% - var(--sizing-lg));
}
& .meta {
display: flex;
flex-direction: row;
align-items: center;
max-width: 95%;
}
& .meta-text {
@ -89,13 +90,8 @@
}
& .timestamp {
margin-left: var(--sizing-lg);
text-align: right;
white-space: nowrap;
}
& .info {
max-width: calc(75% - var(--sizing-lg));
margin-top: var(--sizing-sm);
margin-left: 0;
}
}
@ -105,18 +101,16 @@
grid-template-columns: repeat(2, 1fr);
margin-bottom: var(--sizing-base);
& .item {
& .meta {
max-width: 80%;
& .item .meta {
max-width: 80%;
& .title {
line-height: var(--line-height-sm);
}
& .title {
line-height: var(--line-height-sm);
}
& .subtext p {
margin: 0;
line-height: var(--line-height-sm);
}
& .subtext p {
margin: 0;
line-height: var(--line-height-sm);
}
}
}
@ -134,6 +128,10 @@
}
& .item {
flex-direction: row;
align-items: center;
justify-content: space-between;
& .meta {
width: calc(75% - var(--sizing-lg));
}
@ -141,6 +139,20 @@
& .meta-text {
max-width: 85%;
}
& .timestamp {
margin-left: var(--sizing-lg);
text-align: right;
white-space: nowrap;
}
& .info {
max-width: calc(75% - var(--sizing-lg));
}
& .progress-bar-wrapper {
margin-left: var(--sizing-lg);
}
}
&.grid {

6
src/assets/styles/components/progress-bar.css
View file

@ -4,8 +4,8 @@
overflow: hidden;
height: var(--sizing-lg);
width: 100%;
}
.progress-bar {
background-color: var(--accent-color);
& .progress-bar {
background-color: var(--accent-color);
}
}

4
src/assets/styles/pages/watching.css
View file

@ -4,8 +4,8 @@
border: 0
}
& a:focus .shadow::after,
& a:focus-within .shadow::after {
& a:focus .shadow:after,
& a:focus-within .shadow:after {
left: 0;
width: 100%;
height: 100%