smig/odin-codespace
1
0
Fork 0
mirror of https://gitea.smigz.com/smiggiddy/odin-codeprojects.git synced 2025-07-15 05:40:36 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

additional styling and formatting

Browse source
This commit is contained in:
Smigz 2025-03-04 20:47:37 -05:00
parent 231902ab6d
commit 4417dec46a
7 changed files with 85 additions and 50 deletions
Download patch file Download diff file Expand all files Collapse all files

45
keynotes.app/public/css/style.css
View file

@ -130,8 +130,11 @@ input {
}
footer {
position: absolute;
bottom: 0;
justify-content: center;
}
.full-page {
height: 90vh;
}
.divider {
@ -169,11 +172,12 @@ footer {
}
.center-horizontal {
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin: 0 auto;
gap: 1em;
}
.hero__heading {
@ -228,40 +232,62 @@ footer {
.feed-heading {
margin-left: 1em;
text-transform: capitalize;
text-align: center;
}
.feed-heading span {
text-transform: initial;
}
.author__meta {
gap: 0.5em;
}
.grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
/*grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));*/
gap: 1em;
padding: 2em;
grid-auto-flow: dense;
margin: 0 auto;
}
.grid-item {
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 2em;
position: relative;
}
.grid-item.card {
border: 1px solid black;
border-radius: 0.5em;
text-align: center;
padding: 1.5em 1.5em 0.5em;
background: var(--500-blue);
}
.grid-item > p {
padding: 5em;
}
.grid__card__metadata {
position: absolute;
bottom: 0;
display: flex;
font-size: 0.8em;
justify-content: space-between;
width: 100%;
padding: 0 0.9em 0.7em;
}
.likes {
flex: 1;
flex-grow: 0;
display: flex;
align-self: center;
width: auto;
align-items: center;
justify-content: center;
gap: 0.5em;
}
.card__likes {
@ -337,6 +363,11 @@ footer {
#main > .container.flex {
gap: 10em;
}
.grid {
width: 100%;
max-width: 750px;
}
.grid__span_two {
grid-column-end: span 2;
}