mirror of
https://github.com/picocss/pico.git
synced 2025-06-18 20:27:02 -04:00
Build CSS
This commit is contained in:
github-actions[bot]
parent
ddf41a191a
commit
951aae3801
77 changed files with 7702 additions and 7702 deletions
|
|
@ -1,203 +1,203 @@
|
|||
@use "sass:map";
|
||||
@use "sass:math";
|
||||
@use "sass:list";
|
||||
|
||||
// Settings
|
||||
// ––––––––––––––––––––
|
||||
|
||||
// Theme color
|
||||
$yo-themes: (
|
||||
"amber",
|
||||
"azure",
|
||||
"blue",
|
||||
"cyan",
|
||||
"fuchsia",
|
||||
"green",
|
||||
"grey",
|
||||
"indigo",
|
||||
"jade",
|
||||
"lime",
|
||||
"orange",
|
||||
"pink",
|
||||
"pumpkin",
|
||||
"purple",
|
||||
"red",
|
||||
"sand",
|
||||
"slate",
|
||||
"violet",
|
||||
"yellow",
|
||||
"zinc"
|
||||
);
|
||||
$random: list.nth($yo-themes, math.random(list.length($yo-themes)));
|
||||
// picks a random theme to use as default
|
||||
$theme-color: $random !default; // amber, azure, blue, cyan, fuchsia, green, grey, indigo, jade, lime, orange, pink, pumpkin, purple, red, sand, slate, violet, yellow, zinc
|
||||
|
||||
// Prefix for CSS variables
|
||||
$css-var-prefix: "--pico-" !default; // Must start with "--"
|
||||
|
||||
// Define the root element used to target <header>, <main>, <footer>
|
||||
// with $enable-semantic-container and $enable-responsive-spacings
|
||||
$semantic-root-element: "body" !default;
|
||||
|
||||
// Enable <header>, <main>, <footer> inside $semantic-root-element as containers
|
||||
$enable-semantic-container: false !default;
|
||||
|
||||
// Enable a centered viewport for <header>, <main>, <footer> inside $semantic-root-element
|
||||
// Fluid layout if disabled
|
||||
$enable-viewport: true !default;
|
||||
|
||||
// Enable responsive spacings for <header>, <main>, <footer>, <section>, <article>
|
||||
// Fixed spacings by default
|
||||
$enable-responsive-spacings: false !default;
|
||||
|
||||
// Enable responsive typography
|
||||
// Fixed root element size (rem) if disabled
|
||||
$enable-responsive-typography: true !default;
|
||||
|
||||
// Enable .classes
|
||||
// .classless version if disabled
|
||||
$enable-classes: true !default;
|
||||
|
||||
// Enable transitions
|
||||
$enable-transitions: true !default;
|
||||
|
||||
// Enable overriding with !important
|
||||
$enable-important: true !default;
|
||||
|
||||
// Optional parent selector
|
||||
// If defined, all HTML tags are wrapped with this selector
|
||||
// :root is not wrapped
|
||||
$parent-selector: "" !default;
|
||||
|
||||
$row-columns: 12 !default;
|
||||
|
||||
// Breakpoints, viewports and root font size
|
||||
$breakpoints: () !default;
|
||||
$breakpoints: map.deep-merge(
|
||||
(
|
||||
// Small (landscape phones)
|
||||
// Font size: 17px
|
||||
sm: (
|
||||
breakpoint: 576px,
|
||||
viewport: 510px,
|
||||
root-font-size: 106.25%,
|
||||
),
|
||||
|
||||
// Medium (tablets)
|
||||
// Font size: 18px
|
||||
md: (
|
||||
breakpoint: 768px,
|
||||
viewport: 700px,
|
||||
root-font-size: 112.5%,
|
||||
),
|
||||
|
||||
// Large
|
||||
// Font size: 19px
|
||||
lg: (
|
||||
breakpoint: 1024px,
|
||||
viewport: 950px,
|
||||
root-font-size: 118.75%,
|
||||
),
|
||||
|
||||
// Extra large
|
||||
// Font size: 20px
|
||||
xl: (
|
||||
breakpoint: 1280px,
|
||||
viewport: 1200px,
|
||||
root-font-size: 125%,
|
||||
),
|
||||
|
||||
// Extra extra large
|
||||
// Font size: 21px
|
||||
xxl: (
|
||||
breakpoint: 1536px,
|
||||
viewport: 1450px,
|
||||
root-font-size: 131.25%,
|
||||
)
|
||||
),
|
||||
$breakpoints
|
||||
);
|
||||
|
||||
// Modules to export
|
||||
$modules: () !default;
|
||||
$modules: map.merge(
|
||||
(
|
||||
// Theme
|
||||
"themes/default": true,
|
||||
|
||||
// Layout
|
||||
"layout/document": true,
|
||||
"layout/landmarks": true,
|
||||
"layout/container": true,
|
||||
"layout/section": true,
|
||||
|
||||
// V3 Notes
|
||||
// Add <aside> to layout folder, and have it auto build the a grid system
|
||||
// will add notes someplace about idea on how to enable.
|
||||
// use grid-template
|
||||
// maybe only then keep the grid and remove the row system.
|
||||
"layout/grid": true,
|
||||
"layout/row": true,
|
||||
"layout/overflow-auto": true,
|
||||
|
||||
// Content
|
||||
"content/link": true,
|
||||
"content/typography": true,
|
||||
"content/embedded": true,
|
||||
"content/button": true,
|
||||
"content/table": true,
|
||||
"content/code": true,
|
||||
"content/figure": true,
|
||||
"content/misc": true,
|
||||
|
||||
// Forms
|
||||
"forms/basics": true,
|
||||
"forms/checkbox-radio-switch": true,
|
||||
"forms/input-color": true,
|
||||
"forms/input-date": true,
|
||||
"forms/input-file": true,
|
||||
"forms/input-range": true,
|
||||
"forms/input-search": true,
|
||||
"forms/floating": true,
|
||||
// V3 Notes
|
||||
// Remove original pico validation in favor of :user-[in]valid
|
||||
"forms/validation": true,
|
||||
|
||||
// Components
|
||||
"components/accordion": true,
|
||||
"components/card": true,
|
||||
// V3 Notes
|
||||
// Allow for sub-menus in dropdown
|
||||
"components/dropdown": true,
|
||||
"components/group": true,
|
||||
"components/loading": true,
|
||||
"components/modal": true,
|
||||
// V3 Notes
|
||||
// incorperate the <menu> tag into navigations.
|
||||
"components/nav": true,
|
||||
"components/progress": true,
|
||||
"components/tab": true,
|
||||
// [role=tablist]
|
||||
// I wish role="tablist|tab|tabpanel" could be used on <details> and <summary> tag.
|
||||
"components/tab-region": false,
|
||||
// DOES NOT WORK IN CHROME
|
||||
"components/tooltip": true,
|
||||
// V3 Notes
|
||||
// might find a new way to do this, I'll wait to hear feedback on this approach.
|
||||
"components/nav-hamburger": true,
|
||||
|
||||
// V3 Notes
|
||||
// Notification should be redone to be more in line with Pico's design
|
||||
"components/notification": false,
|
||||
"components/popover": true,
|
||||
// V3 Notes
|
||||
// timeline disabled by default because its more out of the scope of this project,
|
||||
// and should be moved to a separate "extras" repository, to be included.
|
||||
"components/timeline": true,
|
||||
|
||||
// Utilities
|
||||
"utilities/accessibility": true,
|
||||
"utilities/reduce-motion": true
|
||||
),
|
||||
$modules
|
||||
);
|
||||
@use "sass:map";
|
||||
@use "sass:math";
|
||||
@use "sass:list";
|
||||
|
||||
// Settings
|
||||
// ––––––––––––––––––––
|
||||
|
||||
// Theme color
|
||||
$yo-themes: (
|
||||
"amber",
|
||||
"azure",
|
||||
"blue",
|
||||
"cyan",
|
||||
"fuchsia",
|
||||
"green",
|
||||
"grey",
|
||||
"indigo",
|
||||
"jade",
|
||||
"lime",
|
||||
"orange",
|
||||
"pink",
|
||||
"pumpkin",
|
||||
"purple",
|
||||
"red",
|
||||
"sand",
|
||||
"slate",
|
||||
"violet",
|
||||
"yellow",
|
||||
"zinc"
|
||||
);
|
||||
$random: list.nth($yo-themes, math.random(list.length($yo-themes)));
|
||||
// picks a random theme to use as default
|
||||
$theme-color: $random !default; // amber, azure, blue, cyan, fuchsia, green, grey, indigo, jade, lime, orange, pink, pumpkin, purple, red, sand, slate, violet, yellow, zinc
|
||||
|
||||
// Prefix for CSS variables
|
||||
$css-var-prefix: "--pico-" !default; // Must start with "--"
|
||||
|
||||
// Define the root element used to target <header>, <main>, <footer>
|
||||
// with $enable-semantic-container and $enable-responsive-spacings
|
||||
$semantic-root-element: "body" !default;
|
||||
|
||||
// Enable <header>, <main>, <footer> inside $semantic-root-element as containers
|
||||
$enable-semantic-container: false !default;
|
||||
|
||||
// Enable a centered viewport for <header>, <main>, <footer> inside $semantic-root-element
|
||||
// Fluid layout if disabled
|
||||
$enable-viewport: true !default;
|
||||
|
||||
// Enable responsive spacings for <header>, <main>, <footer>, <section>, <article>
|
||||
// Fixed spacings by default
|
||||
$enable-responsive-spacings: false !default;
|
||||
|
||||
// Enable responsive typography
|
||||
// Fixed root element size (rem) if disabled
|
||||
$enable-responsive-typography: true !default;
|
||||
|
||||
// Enable .classes
|
||||
// .classless version if disabled
|
||||
$enable-classes: true !default;
|
||||
|
||||
// Enable transitions
|
||||
$enable-transitions: true !default;
|
||||
|
||||
// Enable overriding with !important
|
||||
$enable-important: true !default;
|
||||
|
||||
// Optional parent selector
|
||||
// If defined, all HTML tags are wrapped with this selector
|
||||
// :root is not wrapped
|
||||
$parent-selector: "" !default;
|
||||
|
||||
$row-columns: 12 !default;
|
||||
|
||||
// Breakpoints, viewports and root font size
|
||||
$breakpoints: () !default;
|
||||
$breakpoints: map.deep-merge(
|
||||
(
|
||||
// Small (landscape phones)
|
||||
// Font size: 17px
|
||||
sm: (
|
||||
breakpoint: 576px,
|
||||
viewport: 510px,
|
||||
root-font-size: 106.25%,
|
||||
),
|
||||
|
||||
// Medium (tablets)
|
||||
// Font size: 18px
|
||||
md: (
|
||||
breakpoint: 768px,
|
||||
viewport: 700px,
|
||||
root-font-size: 112.5%,
|
||||
),
|
||||
|
||||
// Large
|
||||
// Font size: 19px
|
||||
lg: (
|
||||
breakpoint: 1024px,
|
||||
viewport: 950px,
|
||||
root-font-size: 118.75%,
|
||||
),
|
||||
|
||||
// Extra large
|
||||
// Font size: 20px
|
||||
xl: (
|
||||
breakpoint: 1280px,
|
||||
viewport: 1200px,
|
||||
root-font-size: 125%,
|
||||
),
|
||||
|
||||
// Extra extra large
|
||||
// Font size: 21px
|
||||
xxl: (
|
||||
breakpoint: 1536px,
|
||||
viewport: 1450px,
|
||||
root-font-size: 131.25%,
|
||||
)
|
||||
),
|
||||
$breakpoints
|
||||
);
|
||||
|
||||
// Modules to export
|
||||
$modules: () !default;
|
||||
$modules: map.merge(
|
||||
(
|
||||
// Theme
|
||||
"themes/default": true,
|
||||
|
||||
// Layout
|
||||
"layout/document": true,
|
||||
"layout/landmarks": true,
|
||||
"layout/container": true,
|
||||
"layout/section": true,
|
||||
|
||||
// V3 Notes
|
||||
// Add <aside> to layout folder, and have it auto build the a grid system
|
||||
// will add notes someplace about idea on how to enable.
|
||||
// use grid-template
|
||||
// maybe only then keep the grid and remove the row system.
|
||||
"layout/grid": true,
|
||||
"layout/row": true,
|
||||
"layout/overflow-auto": true,
|
||||
|
||||
// Content
|
||||
"content/link": true,
|
||||
"content/typography": true,
|
||||
"content/embedded": true,
|
||||
"content/button": true,
|
||||
"content/table": true,
|
||||
"content/code": true,
|
||||
"content/figure": true,
|
||||
"content/misc": true,
|
||||
|
||||
// Forms
|
||||
"forms/basics": true,
|
||||
"forms/checkbox-radio-switch": true,
|
||||
"forms/input-color": true,
|
||||
"forms/input-date": true,
|
||||
"forms/input-file": true,
|
||||
"forms/input-range": true,
|
||||
"forms/input-search": true,
|
||||
"forms/floating": true,
|
||||
// V3 Notes
|
||||
// Remove original pico validation in favor of :user-[in]valid
|
||||
"forms/validation": true,
|
||||
|
||||
// Components
|
||||
"components/accordion": true,
|
||||
"components/card": true,
|
||||
// V3 Notes
|
||||
// Allow for sub-menus in dropdown
|
||||
"components/dropdown": true,
|
||||
"components/group": true,
|
||||
"components/loading": true,
|
||||
"components/modal": true,
|
||||
// V3 Notes
|
||||
// incorperate the <menu> tag into navigations.
|
||||
"components/nav": true,
|
||||
"components/progress": true,
|
||||
"components/tab": true,
|
||||
// [role=tablist]
|
||||
// I wish role="tablist|tab|tabpanel" could be used on <details> and <summary> tag.
|
||||
"components/tab-region": false,
|
||||
// DOES NOT WORK IN CHROME
|
||||
"components/tooltip": true,
|
||||
// V3 Notes
|
||||
// might find a new way to do this, I'll wait to hear feedback on this approach.
|
||||
"components/nav-hamburger": true,
|
||||
|
||||
// V3 Notes
|
||||
// Notification should be redone to be more in line with Pico's design
|
||||
"components/notification": false,
|
||||
"components/popover": true,
|
||||
// V3 Notes
|
||||
// timeline disabled by default because its more out of the scope of this project,
|
||||
// and should be moved to a separate "extras" repository, to be included.
|
||||
"components/timeline": true,
|
||||
|
||||
// Utilities
|
||||
"utilities/accessibility": true,
|
||||
"utilities/reduce-motion": true
|
||||
),
|
||||
$modules
|
||||
);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue