blisstown/campfire
blisstown/campfire
2
0
Fork 1
Code Issues 19 Pull requests Projects 1 Releases Activity

rework post design; refine light theme

Browse source
This commit is contained in:
ari melody 2025-07-10 18:11:49 +01:00
parent 8d9c3cc4fe
commit 0a563e6121
Signed by: ari
GPG key ID: CF99829C92678188
6 changed files with 23 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/lib/ui/Navigation.svelte
View file

@ -200,6 +200,8 @@
height: calc(100vh - 32px);
border-radius: 8px;
background-color: var(--bg-800);
transition: background-color .1s linear;
user-select: none;
}
.server-header {
@ -213,6 +215,7 @@
background-size: cover;
background-color: var(--bg-600);
background-image: linear-gradient(to top, var(--bg-800), var(--bg-600));
transition: background .1s linear;
}
.server-icon {
@ -270,6 +273,7 @@
font-size: .9em;
opacity: .6;
text-align: center;
user-select: text;
}
.version ul {

1
src/lib/ui/post/Body.svelte
View file

@ -84,7 +84,6 @@
}
.post-text {
font-size: .9em;
line-height: 1.45em;
word-wrap: break-word;
}

10
src/lib/ui/post/Post.svelte
View file

@ -73,19 +73,19 @@
</div>
<style>
.post-container:first-of-type {
border-top: none;
}
.post-container {
width: 732px;
max-width: 732px;
margin-bottom: 8px;
display: flex;
flex-direction: column;
border-radius: 8px;
background-color: var(--bg-800);
border-top: 1px solid color-mix(in srgb, transparent, var(--text) 25%);
}
.post {
padding: 16px;
border-radius: 8px;
transition: background-color .1s;
cursor: pointer;
}
@ -100,7 +100,7 @@
}
.post:hover {
background-color: color-mix(in srgb, var(--bg-800), black 5%);
background-color: color-mix(in srgb, transparent, var(--bg-800) 25%);
}
.post-container:has(.post-context) .post {

3
src/lib/ui/post/ReplyContext.svelte
View file

@ -61,13 +61,12 @@
flex-direction: row;
color: var(--text);
align-items: stretch;
border-radius: 8px;
transition: background-color .1s;
cursor: pointer;
}
.post-reply:hover {
background-color: color-mix(in srgb, var(--bg-800), black 5%);
background-color: color-mix(in srgb, var(--bg-800), transparent 50%);
}
.post-avatar-container {