granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update themes and global styles

Browse source
This commit is contained in:
Justin Edmund 2025-09-23 22:10:01 -07:00
parent 0c03332988
commit 53df1db2bc
3 changed files with 24 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
src/app.scss
View file

@ -10,7 +10,7 @@
html { html {
background-color: var(--background); background-color: var(--background);
font-size: 62.5%; font-size: 62.5%;
// height: 100%; height: 100%;
} }
body { body {
@ -19,6 +19,8 @@ body {
font-family: var(--font-family); font-family: var(--font-family);
font-size: 1.4rem; font-size: 1.4rem;
height: 100%; height: 100%;
margin: 0;
overflow: hidden; // Prevent body scroll since we handle scrolling in layout
&.no-scroll { &.no-scroll {
overflow: hidden; overflow: hidden;
@ -31,20 +33,24 @@ ul {
list-style: none; list-style: none;
} }
main { // Main content styling - now applied within the scrollable container
max-width: var(--main-max-width); .main-content {
margin: 0 auto; > * {
width: 100%; max-width: var(--main-max-width);
transition: max-width 0.3s ease; margin: 0 auto;
width: 100%;
padding: 0 spacing.$unit-2x; // Only horizontal padding, vertical handled by layout
transition: max-width 0.3s ease;
// Responsive padding for smaller screens // Responsive padding for smaller screens
@media (max-width: 768px) { @media (max-width: 768px) {
padding: 0 spacing.$unit; padding: 0 spacing.$unit;
} }
// Wider layout for database pages // Wider layout for database pages
&.database-layout { &.database-layout {
max-width: 1400px; max-width: 1400px;
}
} }
} }

5
src/themes/_effects.scss
View file

@ -7,8 +7,9 @@ $card-border: 0.5px solid rgba(0, 0, 0, 0.18);
// Elevation // Elevation
$page-elevation: 0 0 4px rgba(0, 0, 0, 0.06); $page-elevation: 0 0 4px rgba(0, 0, 0, 0.06);
$dialog-elevation: 0 1px 8px rgba(0, 0, 0, 0.16); $dialog-elevation: 0 0 12px rgba(0, 0, 0, 0.16);
$card-elevation: 0 1px 3px rgba(0, 0, 0, 0.1); $card-elevation: 0 0 4px rgba(0, 0, 0, 0.12);
$card-elevation-hover: 0 0 8px rgba(0, 0, 0, 0.12);
// Shadows // Shadows
$hover-stroke: 1px solid rgba(0, 0, 0, 0.1); $hover-stroke: 1px solid rgba(0, 0, 0, 0.1);

2
src/themes/themes.scss
View file

@ -30,6 +30,7 @@
--spacing-2xl: #{spacing.$unit-14x}; --spacing-2xl: #{spacing.$unit-14x};
--background: #{colors.$page--bg--light}; --background: #{colors.$page--bg--light};
--background-rgb: 245, 245, 245; // RGB values for grey-90
--page-hover: #{colors.$page--hover--light}; --page-hover: #{colors.$page--hover--light};
--grid-rep-hover: #{colors.$grid--rep--hover--light}; --grid-rep-hover: #{colors.$grid--rep--hover--light};
@ -280,6 +281,7 @@
[data-theme='dark'] { [data-theme='dark'] {
--background: #{colors.$page--bg--dark}; --background: #{colors.$page--bg--dark};
--background-rgb: 25, 25, 25; // RGB values for grey-15
--page-hover: #{colors.$page--hover--dark}; --page-hover: #{colors.$page--hover--dark};
--grid-rep-hover: #{colors.$grid--rep--hover--dark}; --grid-rep-hover: #{colors.$grid--rep--hover--dark};