colin
/
bookstack
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
bookstack/resources/sass/_colors.scss

108 lines
2.2 KiB
SCSS
Raw Normal View History

SASS: Updated to use modules and address deprecations Changes the name of our spacing variables due to the prefixing -/_ meaning private in the use of new "use" rather than include. All now modular too, so all variables/mixins are accessed via their package. Also renamed variables file to vars for simpler/cleaner access/writing. eg. '$-m' is now 'vars.$m'
2024-12-09 21:25:35 +08:00
@use "mixins";
Converted primary color use to css variable - Removed all existing SCSS usage of primary color. - Cut down custom styles injection to just be css vars. - Reduced button styles so default button is primary. - Updated button styles to lighten/brighten on hover & active states even when a custom color is set. - Removed unused scss color vars. - Updated default BookStack blue to achieve better accessibility.
2019-08-25 19:40:04 +08:00
/**
* Background colors
*/
.primary-background {
background-color: var(--color-primary) !important;
}
.primary-background-light {
background-color: var(--color-primary-light);
SASS: Updated to use modules and address deprecations Changes the name of our spacing variables due to the prefixing -/_ meaning private in the use of new "use" rather than include. All now modular too, so all variables/mixins are accessed via their package. Also renamed variables file to vars for simpler/cleaner access/writing. eg. '$-m' is now 'vars.$m'
2024-12-09 21:25:35 +08:00
@include mixins.whenDark {
Rolled dark mode out to the editors - Updated editor, and other area, styles to look okay in dark mode. - Used tinyMCE theme generator to create dark mode theme. - Updated tinymce to latest 4x version.
2020-04-11 22:48:08 +08:00
background: #000;
Rolled out use of seperate link color style
2023-01-29 00:06:11 +08:00
.text-link {
Rolled dark mode out to the editors - Updated editor, and other area, styles to look okay in dark mode. - Used tinyMCE theme generator to create dark mode theme. - Updated tinymce to latest 4x version.
2020-04-11 22:48:08 +08:00
color: #AAA !important;
}
}
Converted primary color use to css variable - Removed all existing SCSS usage of primary color. - Cut down custom styles injection to just be css vars. - Reduced button styles so default button is primary. - Updated button styles to lighten/brighten on hover & active states even when a custom color is set. - Removed unused scss color vars. - Updated default BookStack blue to achieve better accessibility.
2019-08-25 19:40:04 +08:00
}
Rolled out use of seperate link color style
2023-01-29 00:06:11 +08:00
.link-background {
background-color: var(--color-link) !important;
}
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
Started on a design update - Added base of new grid system. - Added new margin/padding/visiblity helpers. - Made header collapse to overflow menu on mobile.
2018-10-17 01:49:16 +08:00
/*
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
* Status text colors
Started on a design update - Added base of new grid system. - Added new margin/padding/visiblity helpers. - Made header collapse to overflow menu on mobile.
2018-10-17 01:49:16 +08:00
*/
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
.text-pos, .text-pos:hover, .text-pos-hover:hover {
CSS: Updated status colors to be CSS variables, Added dark variants Needed some level of harcoding though due to callouts using colors, which can't be css colors as DOMPDF won't understand these. Use css variables elsewhere and added new dark variants to fit a bit better.
2023-06-13 22:52:33 +08:00
color: var(--color-positive) !important;
fill: var(--color-positive) !important;
Started on a design update - Added base of new grid system. - Added new margin/padding/visiblity helpers. - Made header collapse to overflow menu on mobile.
2018-10-17 01:49:16 +08:00
}
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
.text-warn, .text-warn:hover, .text-warn-hover:hover {
CSS: Updated status colors to be CSS variables, Added dark variants Needed some level of harcoding though due to callouts using colors, which can't be css colors as DOMPDF won't understand these. Use css variables elsewhere and added new dark variants to fit a bit better.
2023-06-13 22:52:33 +08:00
color: var(--color-warning) !important;
fill: var(--color-warning) !important;
Started on a design update - Added base of new grid system. - Added new margin/padding/visiblity helpers. - Made header collapse to overflow menu on mobile.
2018-10-17 01:49:16 +08:00
}
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
.text-neg, .text-neg:hover, .text-neg-hover:hover {
CSS: Updated status colors to be CSS variables, Added dark variants Needed some level of harcoding though due to callouts using colors, which can't be css colors as DOMPDF won't understand these. Use css variables elsewhere and added new dark variants to fit a bit better.
2023-06-13 22:52:33 +08:00
color: var(--color-negative) !important;
fill: var(--color-negative) !important;
Started on a design update - Added base of new grid system. - Added new margin/padding/visiblity helpers. - Made header collapse to overflow menu on mobile.
2018-10-17 01:49:16 +08:00
}
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
/*
* Style text colors
*/
.text-primary, .text-primary:hover, .text-primary-hover:hover {
Converted primary color use to css variable - Removed all existing SCSS usage of primary color. - Cut down custom styles injection to just be css vars. - Reduced button styles so default button is primary. - Updated button styles to lighten/brighten on hover & active states even when a custom color is set. - Removed unused scss color vars. - Updated default BookStack blue to achieve better accessibility.
2019-08-25 19:40:04 +08:00
color: var(--color-primary) !important;
fill: var(--color-primary) !important;
Started on a design update - Added base of new grid system. - Added new margin/padding/visiblity helpers. - Made header collapse to overflow menu on mobile.
2018-10-17 01:49:16 +08:00
}
Rolled out use of seperate link color style
2023-01-29 00:06:11 +08:00
.text-link, .text-link:hover, .text-link-hover:hover {
color: var(--color-link) !important;
fill: var(--color-link) !important;
}
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
.text-muted {
SASS: Updated to use modules and address deprecations Changes the name of our spacing variables due to the prefixing -/_ meaning private in the use of new "use" rather than include. All now modular too, so all variables/mixins are accessed via their package. Also renamed variables file to vars for simpler/cleaner access/writing. eg. '$-m' is now 'vars.$m'
2024-12-09 21:25:35 +08:00
@include mixins.lightDark(color, #575757, #888888, true);
Started work on supporting a dark-mode - Most elements done, but still need to do editors, tables and final pass. - Toggled only by quick js check at the moment, checking via css media query. Need to make into user-preference toggle. For #1234
2020-04-11 05:38:29 +08:00
fill: currentColor !important;
Started on a design update - Added base of new grid system. - Added new margin/padding/visiblity helpers. - Made header collapse to overflow menu on mobile.
2018-10-17 01:49:16 +08:00
}
Compacted entity color options in settings view - Also extracted the view code into it's own blade template - Made smaller color input styles
2019-12-08 05:23:15 +08:00
.text-dark {
SASS: Updated to use modules and address deprecations Changes the name of our spacing variables due to the prefixing -/_ meaning private in the use of new "use" rather than include. All now modular too, so all variables/mixins are accessed via their package. Also renamed variables file to vars for simpler/cleaner access/writing. eg. '$-m' is now 'vars.$m'
2024-12-09 21:25:35 +08:00
@include mixins.lightDark(color, #222, #ccc, true);
Started work on supporting a dark-mode - Most elements done, but still need to do editors, tables and final pass. - Toggled only by quick js check at the moment, checking via css media query. Need to make into user-preference toggle. For #1234
2020-04-11 05:38:29 +08:00
fill: currentColor !important;
Compacted entity color options in settings view - Also extracted the view code into it's own blade template - Made smaller color input styles
2019-12-08 05:23:15 +08:00
}
Converted image-manager to be component/HTML based Instead of vue based.
2020-07-25 07:20:58 +08:00
.text-white {
color: #fff;
fill: currentColor !important;
}
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
/*
* Entity text colors
*/
.text-bookshelf, .text-bookshelf:hover {
Tweaked entity color palette for accessibility Also converted entity colors to CSS variables for easier instance customization. Related to #1320
2019-08-26 21:37:53 +08:00
color: var(--color-bookshelf);
fill: var(--color-bookshelf);
Started on a design update - Added base of new grid system. - Added new margin/padding/visiblity helpers. - Made header collapse to overflow menu on mobile.
2018-10-17 01:49:16 +08:00
}
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
.text-book, .text-book:hover {
Tweaked entity color palette for accessibility Also converted entity colors to CSS variables for easier instance customization. Related to #1320
2019-08-26 21:37:53 +08:00
color: var(--color-book);
fill: var(--color-book);
Started on a design update - Added base of new grid system. - Added new margin/padding/visiblity helpers. - Made header collapse to overflow menu on mobile.
2018-10-17 01:49:16 +08:00
}
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
.text-page, .text-page:hover {
Tweaked entity color palette for accessibility Also converted entity colors to CSS variables for easier instance customization. Related to #1320
2019-08-26 21:37:53 +08:00
color: var(--color-page);
fill: var(--color-page);
Started on a design update - Added base of new grid system. - Added new margin/padding/visiblity helpers. - Made header collapse to overflow menu on mobile.
2018-10-17 01:49:16 +08:00
}
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
.text-page.draft, .text-page.draft:hover {
Tweaked entity color palette for accessibility Also converted entity colors to CSS variables for easier instance customization. Related to #1320
2019-08-26 21:37:53 +08:00
color: var(--color-page-draft);
fill: var(--color-page-draft);
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
}
.text-chapter, .text-chapter:hover {
Tweaked entity color palette for accessibility Also converted entity colors to CSS variables for easier instance customization. Related to #1320
2019-08-26 21:37:53 +08:00
color: var(--color-chapter);
fill: var(--color-chapter);
Started looking at the books listing design
2018-12-02 00:29:57 +08:00
}
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
/*
Replaced jquery sortable with sortablejs
2019-06-06 20:09:58 +08:00
* Standard & Entity background colors
Cleaned up usage of some core scss files
2019-04-07 18:34:40 +08:00
*/
Replaced jquery sortable with sortablejs
2019-06-06 20:09:58 +08:00
.bg-white {
background-color: #FFFFFF;
}
Started looking at the books listing design
2018-12-02 00:29:57 +08:00
.bg-book {
Tweaked entity color palette for accessibility Also converted entity colors to CSS variables for easier instance customization. Related to #1320
2019-08-26 21:37:53 +08:00
background-color: var(--color-book);
Updated user and shelf views to new design
2019-02-03 21:45:45 +08:00
}
Updated standard entity lists
2019-03-17 23:07:03 +08:00
.bg-chapter {
Tweaked entity color palette for accessibility Also converted entity colors to CSS variables for easier instance customization. Related to #1320
2019-08-26 21:37:53 +08:00
background-color: var(--color-chapter);
Updated standard entity lists
2019-03-17 23:07:03 +08:00
}
Aligned book and shelf grid item views Updated the titles so they are limited via CSS rather than by a estimated hardcoded limit. For #1469
2020-12-19 05:26:22 +08:00
.bg-bookshelf {
Tweaked entity color palette for accessibility Also converted entity colors to CSS variables for easier instance customization. Related to #1320
2019-08-26 21:37:53 +08:00
background-color: var(--color-bookshelf);
Rolled dark mode out to the editors - Updated editor, and other area, styles to look okay in dark mode. - Used tinyMCE theme generator to create dark mode theme. - Updated tinymce to latest 4x version.
2020-04-11 22:48:08 +08:00
}