mirror of
https://github.com/hugo-fixit/FixIt.git
synced 2026-08-24 15:28:57 +00:00
Cell
164a699701
* refactor(styles): unify theme properties and update color variables across stylesheets * Implement theme mode support with light-dark color adjustments across stylesheets - Added color-scheme support in _root.scss for light and dark modes. - Replaced theme property mixins with light-dark function in various widget styles including _cell-tooltip.scss, _cookieconsent.scss, _fixed-button.scss, and others. - Updated alert styles in _alert.scss to use light-dark for border and text colors. - Refactored code syntax highlighting in _code.scss and _code-syntax/_index.scss to utilize light-dark for background gradients. - Enhanced search input styles in _search.scss to adapt to theme mode. - Modified theme switching logic in color-scheme.js and theme.js to support new theme mode structure. - Adjusted APlayer and Valine styles to accommodate dark mode using new theme variables. * feat(shortcode): add auto-dark shortcode for dark mode adaptation * refactor(styles): update theme colors and improve box-shadow properties for better visual consistency * feat(header): add scroll-state container queries and enhance header shadow effects * feat(styles): enhance scroll behavior with overscroll-behavior adjustments for better UX * feat(styles): update code&table styles and colors for improved visual consistency * feat(styles): update color variables and improve font styling for better visual hierarchy
85 lines
1.4 KiB
SCSS
85 lines
1.4 KiB
SCSS
@import "../../lib/normalize/normalize";
|
|
|
|
html {
|
|
font-family: fixit-var(global-font-family);
|
|
font-weight: fixit-var(global-font-weight);
|
|
font-display: swap;
|
|
font-size: fixit-var(global-font-size);
|
|
line-height: fixit-var(global-line-height);
|
|
width: 100%;
|
|
scroll-behavior: smooth;
|
|
overflow: auto;
|
|
container-type: scroll-state;
|
|
container-name: scroller;
|
|
|
|
@include media('reduce-motion') {
|
|
scroll-behavior: auto;
|
|
}
|
|
}
|
|
|
|
::selection {
|
|
background-color: fixit-var(selection-color);
|
|
}
|
|
|
|
body {
|
|
background-color: fixit-var(global-background-color);
|
|
color: fixit-var(global-font-color);
|
|
@include overflow-wrap(break-word);
|
|
}
|
|
|
|
iframe {
|
|
border: 0;
|
|
@include border-radius;
|
|
}
|
|
|
|
[role='button'] {
|
|
cursor: pointer;
|
|
}
|
|
|
|
summary {
|
|
cursor: pointer;
|
|
}
|
|
|
|
abbr[title] {
|
|
cursor: help;
|
|
text-decoration-skip-ink: none;
|
|
}
|
|
|
|
img {
|
|
object-fit: cover;
|
|
}
|
|
|
|
img,
|
|
video {
|
|
max-width: 100%;
|
|
height: auto;
|
|
@include border-radius;
|
|
}
|
|
|
|
dialog {
|
|
padding: 0;
|
|
}
|
|
|
|
details {
|
|
&.center {
|
|
summary {
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
%code {
|
|
padding: 0.2em 0.4em;
|
|
margin: 0;
|
|
font-size: fixit-var(code-font-size);
|
|
line-height: fixit-var(code-font-size);
|
|
font-family: fixit-var(code-font-family);
|
|
color: fixit-var(code-color);
|
|
background-color: fixit-var(code-inline-background-color);
|
|
text-decoration: inherit;
|
|
@include border-radius;
|
|
@include overflow-wrap(break-word);
|
|
}
|
|
|
|
@include link(true, true);
|