malhuda/fictioneer
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 112 Wiki Activity

Refactor style (among other things) #24

Merged
Tetrakern merged 94 commits from refactor_colors into main 2024-03-03 02:47:35 +08:00
Conversation 0 Commits 94 Files Changed 145 +31 -37
8 changed files with 31 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit c1190ae329 - Show all commits

2
css/application.css
View File

File diff suppressed because one or more lines are too long

2
css/complete.css
View File

File diff suppressed because one or more lines are too long

2
css/editor.css
View File

File diff suppressed because one or more lines are too long

2
css/properties.css
View File

File diff suppressed because one or more lines are too long

14
src/scss/_mobile-menu.scss
View File

@ -64,7 +64,7 @@ body:not(.mobile-menu-open) {
inset: 0 100% -128px 0;
z-index: 100000; // Above adminbar
display: block;
background: #000;
background: var(--mobile-menu-overlay);
opacity: 0;
transition: opacity 0.3s, right 0s;
transition-delay: 0s, 0.3s; // Delay instant movement of overlay until fade is done
@ -102,7 +102,7 @@ body:not(.mobile-menu-open) {
#site {
&::before {
inset: 0 0 -128px;
opacity: 0.5;
opacity: 1;
transition: opacity 0.3s; // Override transition of overlay position
}
}
@ -133,12 +133,12 @@ body:not(.mobile-menu-open) {
background-color: var(--mobile-menu-background);
font-size: 15px;
line-height: 1.66; // ~ 25px @ 15px
text-shadow: var(--mobile-menu-text-shadow);
text-shadow: var(--mobile-menu-text-shadow, var(--text-shadow));
padding: 16px 16px 144px;
width: 100%;
max-width: min(75vw, #{$max-mobile-menu-width});
overflow: auto;
box-shadow: var(--mobile-menu-site-box-shadow);
box-shadow: var(--mobile-menu-box-shadow);
opacity: 0;
transition: left 0.3s, opacity 0.3s;
@ -240,7 +240,7 @@ body:not(.mobile-menu-open) {
max-width: min(calc(75vw - 32px), #{$max-mobile-menu-width - 32px});
&:not(:last-child) {
border-bottom: 1px solid var(--layout-color-lineart);
border-bottom: var(--mobile-menu-panel-border, var(--layout-hr-border));
}
&-header {
@ -248,7 +248,7 @@ body:not(.mobile-menu-open) {
align-items: center;
justify-content: space-between;
padding-bottom: 8px;
border-bottom: 1px dashed var(--layout-color-lineart);
border-bottom: var(--mobile-menu-panel-header-border, var(--layout-hr-border-dashed));
}
.icon._font-settings {
@ -376,7 +376,7 @@ body:not(.mobile-menu-open) {
.current-chapter {
position: relative;
background: var(--mobile-menu-current-chapter-background);
color: var(--mobile-menu-current-chapter-text);
color: var(--mobile-menu-current-chapter-color);
border-radius: var(--layout-border-radius-small);
width: calc(100% + 4px);

6
src/scss/common/_base.scss
View File

@ -180,13 +180,11 @@ button[type=submit]:where(:not(._inline)) {
&._quick {
background: var(--button-quick-background);
color: var(--button-quick-text);
border: var(--button-quick-border);
color: var(--button-quick-color);
&:not(.current, [disabled]):hover {
background: var(--button-quick-background-hover);
color: var(--button-quick-text-hover);
border: var(--button-quick-border-hover);
color: var(--button-quick-color-hover);
}
}

8
src/scss/common/_lightmode.scss
View File

@ -133,7 +133,7 @@
--mobile-menu-text-shadow: none;
--mobile-menu-bookmark-text-shadow: none;
--mobile-menu-bookmark-progress-background: hsl(var(--bg-1000-free) / 10%);
--mobile-menu-current-chapter-text: var(--fg-300);
--mobile-menu-current-chapter-color: var(--fg-300);
--mobile-menu-current-chapter-background: rgb(0 0 0 / 10%);
// === CONTENT ===============================================================
@ -211,10 +211,8 @@
// === BUTTONS - QUICK =======================================================
--button-quick-background: var(--bg-100);
--button-quick-background-hover: var(--bg-500);
--button-quick-text: var(--fg-700);
--button-quick-text-hover: var(--fg-1000);
--button-quick-border: none;
--button-quick-border-hover: none;
--button-quick-color: var(--fg-700);
--button-quick-color-hover: var(--fg-1000);
// === BUTTONS - FILE BLOCK ==================================================
--button-file-block-color: var(--fg-1000);

32
src/scss/common/_properties.scss
View File

@ -197,9 +197,9 @@
--bg-50: hsl(var(--bg-50-free)); // popup menu, tooltip
--bg-100: hsl(var(--bg-100-free)); // button active, popup menu hover/selected
--bg-200: hsl(var(--bg-200-free)); // secondary button border hover, pagination active
--bg-300: hsl(var(--bg-300-free)); // primary button hover, secondary button border, navigation item hover, input placeholder color, horizontal lines
--bg-300: hsl(var(--bg-300-free)); // primary button hover, secondary button border, navigation item hover, input placeholder color, horizontal lines, mobile menu quick button hover
--bg-400: hsl(var(--bg-400-free)); // primary button, navigation item, navigation menus, pagination hover
--bg-500: hsl(var(--bg-500-free)); // primary button disabled, secondary button hover, password submit color, pagination
--bg-500: hsl(var(--bg-500-free)); // primary button disabled, secondary button hover, password submit color, pagination, mobile menu quick button
--bg-600: hsl(var(--bg-600-free)); // card, modal
--bg-700: hsl(var(--bg-700-free)); // page, card content list item, navigation item divider, password form cutout
--bg-800: hsl(var(--bg-800-free)); // content list item
@ -341,15 +341,15 @@
--drop-shadow-xl: drop-shadow(0 3px 8px rgb(0 0 0 / 9%)) drop-shadow(0 3px 12px rgb(0 0 0 / 17%));
// === MOBILE MENU ===========================================================
// --mobile-menu-background: var(--e-1);
// --mobile-menu-advanced-background: var(--e-body);
// --mobile-menu-site-box-shadow: 2px 0 3px rgb(0 0 0 / 30%);
// --mobile-advanced-menu-site-box-shadow: inset -5px 0 3px -4px rgb(0 0 0 / 30%);
// --mobile-menu-overlay: rgb(0 0 0 / 20%);
// --mobile-menu-text-shadow: var(--text-shadow);
// --mobile-menu-bookmark-progress-background: rgb(0 0 0 / 40%);
// --mobile-menu-current-chapter-text: var(--fg-400);
// --mobile-menu-current-chapter-background: rgb(0 0 0 / 25%);
--mobile-menu-background: var(--bg-700);
--mobile-menu-advanced-background: color-mix(in srgb, var(--bg-950), white 3%);
--mobile-menu-box-shadow: 2px 0 3px rgb(0 0 0 / 30%);
--mobile-advanced-menu-site-box-shadow: inset -5px 0 3px -4px rgb(0 0 0 / 30%);
--mobile-menu-overlay: rgb(0 0 0 / 50%);
--mobile-menu-bookmark-progress-background: rgb(0 0 0 / 40%);
--mobile-menu-current-chapter-color: var(--fg-400);
--mobile-menu-current-chapter-background: rgb(0 0 0 / 25%);
// === FONT SETTINGS =========================================================
@ -458,12 +458,10 @@
// === BUTTONS - QUICK =======================================================
// --button-quick-background: var(--bg-500);
// --button-quick-background-hover: var(--bg-300);
// --button-quick-text: var(--fg-600);
// --button-quick-text-hover: var(--fg-400);
// --button-quick-border: none;
// --button-quick-border-hover: none;
--button-quick-background: var(--bg-500);
--button-quick-background-hover: var(--bg-300);
--button-quick-color: var(--fg-600);
--button-quick-color-hover: var(--fg-400);
// === BUTTONS - FILE BLOCK ==================================================