mirror of
https://github.com/hugo-fixit/FixIt.git
synced 2026-09-03 20:22:41 +00:00
Cell
3926cc0220
* refactor: CSS variables to use fixit-var for consistency across styles * refactor: reorganize CSS structure and consolidate imports for improved maintainability * refactor: unify CSS variable usage and improve structure across stylesheets * refactor: standardize CSS variable usage for layout * refactor: standardize CSS variable usage for archive and special pages * refactor: standardize CSS variable usage for single page * refactor: standardize CSS variable usage for widgets * refactor(css): refactors the border-radius mixin and adds the .rounded-full utility class * refactor: standardize z-index usage across components * refactor(css): removes deprecated compatibility mixins and replaces them with native CSS properties * feat: unify color variable naming and update theme color values - Rename `global-font-secondary-color` to `global-placeholder-color` for more accurate description of its purpose - Update multiple style references to use the new `secondary` theme color variable - Update theme color mapping to the new color values for improved visual consistency - Fixed the use of search box placeholder colors and removed hard-coded transparency values - Added color preview test documentation for easier verification of color rendering - Cleaned up some duplicate dark mode styles and replaced them with unified CSS variables * refactor: remove the `hr-background-color` variable and uses `global-border-color` uniformly * feat(CSE): add dark theme style to Google CSE search box and results container * fix(task-lists): fixed styling and rendering issues with nested task lists
89 lines
1.9 KiB
SCSS
89 lines
1.9 KiB
SCSS
.post-reward {
|
|
padding: 1rem;
|
|
text-align: center;
|
|
@extend .print-d-none;
|
|
|
|
&:has(.reward-ways:empty) {
|
|
display: none;
|
|
}
|
|
|
|
.comment {
|
|
margin: 0.5rem 0;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.reward-ways {
|
|
display: none;
|
|
}
|
|
|
|
.reward-input:checked~.reward-ways {
|
|
display: block;
|
|
padding-top: 20px;
|
|
|
|
div {
|
|
display: inline-block;
|
|
@include user-select(none);
|
|
|
|
span {
|
|
display: block;
|
|
}
|
|
|
|
&:hover span[data-animation] {
|
|
animation: fixit-var(animation-reward, jackInTheBox) 0.8s infinite linear;
|
|
// The animation may affect :hover of img in dark mode
|
|
pointer-events: none;
|
|
}
|
|
|
|
img {
|
|
display: inline-block;
|
|
margin: 0.8em 2em 0;
|
|
max-width: 100%;
|
|
width: fixit-var(reward-img-width);
|
|
}
|
|
}
|
|
|
|
// `fixed` mode only supports desktop
|
|
&[data-mode='fixed'] {
|
|
position: fixed;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
padding: 1rem;
|
|
background-color: fixit-var(global-background-color);
|
|
@include z-index(fixed);
|
|
@include border-radius;
|
|
box-shadow: 0 0 1.5rem 0 rgba(0, 0, 0, 0.2);
|
|
|
|
[data-theme=dark] & {
|
|
box-shadow: 0 0 1.5rem 0 rgba(255, 255, 255, 0.2);
|
|
}
|
|
}
|
|
}
|
|
|
|
.reward-button {
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
cursor: pointer;
|
|
outline: none;
|
|
color: fixit-var(reward-color, lighten($reward-color, 5%));
|
|
border: 2px solid lighten($reward-color, 10%);
|
|
padding: 0.6rem 1rem;
|
|
background-color: fixit-var(global-background-color);
|
|
vertical-align: text-top;
|
|
line-height: 1rem;
|
|
@include border-radius;
|
|
transition: all 0.3s ease-out;
|
|
|
|
&:active,
|
|
&:hover {
|
|
color: #ffffff;
|
|
border-color: fixit-var(reward-color);
|
|
background-color: fixit-var(reward-color);
|
|
}
|
|
|
|
[data-theme=dark] & {
|
|
border-color: lighten($reward-color, 5%);
|
|
}
|
|
}
|
|
}
|