mirror of
https://github.com/hugo-fixit/FixIt.git
synced 2026-08-24 07:18:57 +00:00
Cell
2c0b48370b
* feat(gen-docs): add documentation generation package with SassDoc and TypeDoc support Add new `@hugo-fixit/gen-docs` package that parses Hugo config (hugo.toml) and generates documentation. Includes SassDoc annotations for SCSS variables and mixins, TypeDoc config for TypeScript source docs, and a `.sassdocrc` configuration file. * docs(readme): add browsers support section * feat(gen-docs): add Hugo partials docs generation and fix config empty sections - Add partial-parser.ts: parses Hugo partial comment blocks (@param/@return/@example) - Add partials.ts renderer: generates grouped Markdown with param tables - Add `partials` subcommand with -t/-o options for template injection - Fix config-parser: empty TOML sections (library.js/library.css) now retain descriptions - Fix config-parser: correctly distinguish section-level vs key-level comments - Update README with partials subcommand documentation
57 lines
1.9 KiB
SCSS
57 lines
1.9 KiB
SCSS
@use "variables" as *;
|
|
|
|
/// Duration of the theme-switch icon animation.
|
|
/// @type Time
|
|
$theme-switch-animation-duration: 0.5s !default;
|
|
|
|
/// Easing function for the theme-switch icon animation.
|
|
/// @type String
|
|
$theme-switch-animation-easing: cubic-bezier(0.22, 1, 0.36, 1) !default;
|
|
|
|
/// Bind a theme mode selector to an icon glyph and its matching animation.
|
|
/// @param {String} $mode - Theme mode name: auto | light | dark
|
|
/// @param {String|null} $icon - Optional Font Awesome glyph code assigned to --fa
|
|
/// @example
|
|
/// @include theme-switch-mode('auto');
|
|
/// @include theme-switch-mode('light', '\f185');
|
|
@mixin theme-switch-mode($mode, $icon: null) {
|
|
[data-theme-mode='#{$mode}'] & {
|
|
@if $icon != null {
|
|
--fa: '#{$icon}';
|
|
}
|
|
|
|
animation: #{$prefix}theme-switch-#{$mode} $theme-switch-animation-duration $theme-switch-animation-easing;
|
|
}
|
|
}
|
|
|
|
/// Generate one theme-switch keyframes block from a compact parameter list.
|
|
/// The final state is intentionally shared so all modes settle on the same resting pose.
|
|
/// @param {String} $name - Animation suffix used in the generated keyframes name
|
|
/// @param {Angle} $from-rotate - Initial rotation angle
|
|
/// @param {Number} $from-scale - Initial icon scale
|
|
/// @param {Number} $from-opacity - Initial icon opacity
|
|
/// @param {String} $mid-step - Intermediate keyframe percentage such as 55% or 60%
|
|
/// @param {Angle} $mid-rotate - Intermediate rotation angle
|
|
/// @param {Number} $mid-scale - Intermediate icon scale
|
|
@mixin theme-switch-keyframes($name, $from-rotate, $from-scale, $from-opacity, $mid-step, $mid-rotate, $mid-scale) {
|
|
@keyframes #{$prefix}theme-switch-#{$name} {
|
|
0% {
|
|
rotate: $from-rotate;
|
|
scale: $from-scale;
|
|
opacity: $from-opacity;
|
|
}
|
|
|
|
#{$mid-step} {
|
|
rotate: $mid-rotate;
|
|
scale: $mid-scale;
|
|
opacity: 1;
|
|
}
|
|
|
|
100% {
|
|
rotate: 225deg;
|
|
scale: 1;
|
|
opacity: 1;
|
|
}
|
|
}
|
|
}
|