ari/bliss.town
ari/bliss.town
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Activity

full page redesign; improved light theme

Browse source
This commit is contained in:
ari melody 2025-07-10 16:05:21 +01:00
parent b58290b4e5
commit 6ee4538dc3
Signed by: ari
GPG key ID: CF99829C92678188
9 changed files with 379 additions and 284 deletions
Download patch file Download diff file Expand all files Collapse all files

117
public/style/index.css Normal file
View file

@ -0,0 +1,117 @@
#project-list {
display: flex;
gap: 1em;
}
.project-item {
width: 256px;
border-radius: 8px;
overflow: clip;
background-color: var(--primary);
transition: background-color .2s linear;
box-shadow: 2px 2px 2px #0004;
cursor: pointer;
}
.project-item:hover {
outline: 1px solid var(--on-primary);
}
.project-item-banner {
width: 256px;
height: 128px;
}
.project-item-banner img {
width: 100%;
height: 100%;
object-fit: cover;
}
.project-info {
padding: .4em .5em;
}
.project-info h3 {
margin: 0;
}
.project-info p {
font-size: .8em;
margin: 0;
}
.project-info a {
font-style: italic;
font-size: .8em;
color: var(--on-background);
opacity: .75;
transition: color .2s linear;
text-decoration: none;
}
#crew-list {
display: flex;
gap: 1em;
flex-wrap: wrap;
}
.crew-item {
display: flex;
flex-direction: row;
gap: .5em;
}
.crew-item img.avatar {
width: 64px;
height: 64px;
object-fit: cover;
border-radius: 8px;
background-color: #101010;
}
.crew-item .crew-info {
padding: .5em;
background-color: var(--primary);
border-radius: 8px;
box-shadow: 2px 2px 2px #0004;
transition: background-color .2s linear;
cursor: pointer;
}
.crew-info:hover {
outline: 1px solid var(--on-primary);
}
.crew-item h3 {
display: block;
margin: 0 0 -.2em 0;
transition: inherit;
}
.crew-item h3 a {
display: block;
color: inherit;
}
.crew-item a.handle {
display: block;
font-style: italic;
font-size: .8em;
color: var(--on-background);
opacity: .75;
transition: color .2s linear;
text-decoration: none;
}
.crew-item p {
margin: .2em 0;
}
.crew-item .crew-tags {
margin: .5em 0 0 0;
display: flex;
gap: .2em;
}
.crew-item .crew-tag {
font-size: .75em;
padding: .2em .5em;
border-radius: 4px;
text-wrap: nowrap;
color: var(--on-primary);
border: 1px solid var(--on-primary);
}