edshot99/eBooru
1
0
Fork 0
forked from e621ng/e621ng
Code Issues 11 Releases 1 Activity

[Posts] Tweak the sidebar styles (#921)

Browse Source
This commit is contained in:
Cinder 2025-02-14 19:03:40 -08:00 committed by GitHub
parent 037cc85655
commit 4af95e56cc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 12 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
app/javascript/src/styles/views/posts/index/_index.desktop.scss
View File

@ -4,14 +4,12 @@
grid-template-areas: grid-template-areas:
"search content" "search content"
"sidebar content"; "sidebar content";
grid-template-columns: 14rem 1fr; grid-template-columns: 15rem 1fr;
grid-template-rows: min-content 1fr; grid-template-rows: min-content 1fr;
.search { .search {
box-shadow: inset -0.25rem 0px 0.25rem -0.25rem themed("color-background"); box-shadow: inset -0.25rem 0px 0.25rem -0.25rem themed("color-background");
margin-top: 0.25rem; padding: 0.5rem 0.75rem 0.5rem 0.5rem;
border-top-left-radius: 0.25rem;
padding: 0.5rem;
// Align the controls properly // Align the controls properly
position: relative; position: relative;
@ -23,7 +21,7 @@
position: absolute; position: absolute;
bottom: -1.633rem; bottom: -1.633rem;
right: 0.25rem; right: 0.5rem;
padding: 0.25rem; padding: 0.25rem;
gap: 0.5rem; gap: 0.5rem;
@ -47,14 +45,13 @@
.sidebar { .sidebar {
box-shadow: inset -0.25rem 0px 0.25rem -0.25rem themed("color-background"); box-shadow: inset -0.25rem 0px 0.25rem -0.25rem themed("color-background");
margin-bottom: 0.25rem; padding: 0.5rem 0.75rem 0.5rem 0.5rem;
border-bottom-left-radius: 0.25rem;
padding: 0.5rem;
font-size: 100%; font-size: 100%;
} }
.content { .content {
border-radius: 0.25rem; border-radius: 0 0.25rem 0.25rem 0;
padding: 0.5rem 0.75rem themed("content-padding-bottom");
} }
} }

6
app/javascript/src/styles/views/posts/index/_index.scss
View File

@ -2,7 +2,7 @@ body.c-posts.a-index, body.c-favorites.a-index {
#page { #page {
// Override the theme to instead // Override the theme to instead
// project it upon the content area // project it upon the content area
background: none; background: var(--color-foreground);
padding: 0; padding: 0;
} }
@ -36,8 +36,6 @@ body.c-posts.a-index, body.c-favorites.a-index {
grid-area: search; grid-area: search;
padding: 0.5rem 0.25rem; padding: 0.5rem 0.25rem;
background-color: #152f56;
background-color: themed("color-foreground");
box-shadow: inset 0px -0.25rem 0.25rem -0.25rem themed("color-background"); box-shadow: inset 0px -0.25rem 0.25rem -0.25rem themed("color-background");
h1 { h1 {
@ -92,8 +90,6 @@ body.c-posts.a-index, body.c-favorites.a-index {
gap: 1em; gap: 1em;
padding: 0.5rem 0.25rem; padding: 0.5rem 0.25rem;
background-color: #152f56;
background-color: themed("color-foreground");
box-shadow: inset 0px 0.25rem 0.25rem -0.25rem themed("color-background"); box-shadow: inset 0px 0.25rem 0.25rem -0.25rem themed("color-background");
// By popular demand // By popular demand

2
app/javascript/src/styles/views/posts/index/partials/_fullscreen.scss
View File

@ -24,6 +24,8 @@
background: themed("color-button-active"); background: themed("color-button-active");
color: black; color: black;
} }
.search-controls { right: 0.25rem; }
} }
.sidebar { display: none; } .sidebar { display: none; }
.content { .content {

3
app/javascript/src/styles/views/posts/index/partials/_sticky.scss
View File

@ -2,6 +2,9 @@
position: sticky; position: sticky;
top: 0; top: 0;
background: themed("color-foreground");
border-radius: 0.25rem;
// on top of thumbnail labels // on top of thumbnail labels
z-index: 11; z-index: 11;