diff --git a/src/assets/scss/_derived-defaults.scss b/src/assets/scss/_derived-defaults.scss index e871795..2f1dfd3 100644 --- a/src/assets/scss/_derived-defaults.scss +++ b/src/assets/scss/_derived-defaults.scss @@ -2,7 +2,6 @@ @use "bulma/sass/utilities/derived-variables" as dv; -/* @docs */ $sizes-map: ( "small": dv.$size-small, "normal": dv.$size-normal, diff --git a/src/assets/scss/_initial-defaults.scss b/src/assets/scss/_initial-defaults.scss index c4ca755..63c76b2 100644 --- a/src/assets/scss/_initial-defaults.scss +++ b/src/assets/scss/_initial-defaults.scss @@ -1,8 +1,7 @@ -// This file is home to defaulted variables which DO NOT reference bulma +// This file is home to defaulted variables which need to be passed to Bulma, or to general defaulted variables which are not part of a particular component @use "sass:map"; -/* @docs */ $speed-slow: 150ms !default; $speed-slower: 250ms !default; @@ -14,7 +13,6 @@ $active-shadow-size: 0 0 0.5em !default; // renamed with theme-bulma prefix to avoid namespace collision with the @forward below $theme-bulma-custom-colors: () !default; -/* @docs */ // Merge any user-defined custom colors with the custom colors defined by the theme. This will be passes to Bulma as $custom-colors // This is the one variable in this file which is not defaulted, but it collects defaulted values so it counts. It's going to be passed into bulma so it has to be here so it comes first @@ -23,72 +21,3 @@ $theme-bulma-custom-colors-merged: map.merge( ("secondary": $secondary), $theme-bulma-custom-colors ); - -/* @docs */ -$carousel-arrow-icon-spaced: 1.5rem !default; -$carousel-arrow-top: 50% !default; -$carousel-indicator-spaced: 0.5rem !default; -$carousel-overlay-z: 40 !default; - -$checkbox-size: 1.25em !default; -$checkbox-background-color: transparent !default; -$checkbox-border-width: 2px !default; - -$dropdown-content-max-height: 200px !default; - -$dropdown-disabled-opacity: 0.5 !default; -$dropdown-gap: 0px !default; -$dropdown-z: 40 !default; - -// Belongs to field -$floating-in-height: 3.25em !default; - -$icon-spin-duration: 2s !default; - -$loading-background-color: rgba(255, 255, 255, 0.5) !default; -$loading-icon-size: 3em !default; -$loading-icon-size-full-page: 5em !default; -$loading-z: 29 !default; - -$notification-margin-bottom: 1.5rem !default; -$notification-notices-padding: 2em !default; -$notification-notices-z: 1000 !default; - -$radio-size: 1.25em !default; - -$sidebar-z: 40; -$sidebar-width: 260px !default; -$sidebar-height: 260px !default; -$sidebar-mobile-width: 80px !default; - -$skeleton-duration: 1.5s !default; -$skeleton-margin-top: 0.5rem !default; - -$slider-tick-label-size: 0.75rem !default; -$slider-thumb-shadow: none !default; -$slider-thumb-to-track-ratio: 2 !default; -$slider-tick-to-track-ratio: 0.5 !default; -$slider-tick-width: 3px !default; - -$steps-divider-height: 0.2em !default; -$steps-vertical-padding: 1em 0 !default; - -$switch-width: 2.75em !default; -$switch-padding: 0.2em !default; - -$table-sticky-header-height: 300px !default; - -$tabs-focused-outline: none !default; - -$taginput-height: 2em !default; -$taginput-tag-size: 0.9em !default; - -$tooltip-arrow-size: 5px !default; -$tooltip-arrow-margin: 2px !default; -$tooltip-content-multiline-width: 300px !default; -$tooltip-shadow: 0 1px 2px 1px rgba(0, 1, 0, 0.2) !default; -$tooltip-z: 38 !default; - -$upload-bg: transparent !default; -$upload-draggable-padding: 0.5rem !default; -/* @docs */ diff --git a/src/assets/scss/component-defaults/_carousel.scss b/src/assets/scss/component-defaults/_carousel.scss index cda2414..c773d50 100644 --- a/src/assets/scss/component-defaults/_carousel.scss +++ b/src/assets/scss/component-defaults/_carousel.scss @@ -1,8 +1,14 @@ @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$carousel-arrow-icon-spaced: 1.5rem !default; +$carousel-arrow-top: 50% !default; +$carousel-indicator-spaced: 0.5rem !default; +$carousel-overlay-z: 40 !default; $carousel-arrow-background: css.getVar("scheme-main") !default; $carousel-arrow-color: css.getVar("primary") !default; $carousel-indicator-background: rgba(css.getVar("scheme-invert"), 0.5) !default; $carousel-indicator-border: css.getVar("scheme-main") !default; $carousel-indicator-color: css.getVar("primary") !default; $carousel-overlay-background: rgba(css.getVar("scheme-invert"), 0.86) !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_checkbox.scss b/src/assets/scss/component-defaults/_checkbox.scss index e2a2b26..08576bc 100644 --- a/src/assets/scss/component-defaults/_checkbox.scss +++ b/src/assets/scss/component-defaults/_checkbox.scss @@ -1,6 +1,10 @@ @use "bulma/sass/utilities/derived-variables" as dv; @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$checkbox-size: 1.25em !default; +$checkbox-background-color: transparent !default; +$checkbox-border-width: 2px !default; $checkbox-colors: dv.$colors !default; $checkbox-border-color: css.getVar("grey") !default; $checkbox-border-radius: css.getVar("radius") !default; @@ -11,3 +15,4 @@ $checkbox-active-focus-color: hsl( ) !default; $checkbox-active-background-color: css.getVar("primary") !default; $checkbox-shadow: css.getVar("shadow"); +/* @docs */ diff --git a/src/assets/scss/component-defaults/_datepicker.scss b/src/assets/scss/component-defaults/_datepicker.scss index 7e89344..82414e3 100644 --- a/src/assets/scss/component-defaults/_datepicker.scss +++ b/src/assets/scss/component-defaults/_datepicker.scss @@ -1,6 +1,7 @@ @use "bulma/sass/utilities/derived-variables" as dv; @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ $datepicker-colors: dv.$colors !default; $datepicker-header-color: css.getVar("grey") !default; $datepicker-today-border: solid 1px rgba(css.getVar("primary"), 0.5) !default; @@ -11,3 +12,4 @@ $datepicker-item-hover-background-color: css.getVar("background") !default; $datepicker-item-selected-color: css.getVar("primary-invert") !default; $datepicker-item-selected-background-color: css.getVar("primary") !default; $datepicker-event-background-color: css.getVar("grey-light") !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_dropdown.scss b/src/assets/scss/component-defaults/_dropdown.scss index 47bef3a..f1d5c5f 100644 --- a/src/assets/scss/component-defaults/_dropdown.scss +++ b/src/assets/scss/component-defaults/_dropdown.scss @@ -1,6 +1,11 @@ @use "bulma/sass/utilities/initial-variables" as iv; @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$dropdown-content-max-height: 200px !default; +$dropdown-disabled-opacity: 0.5 !default; +$dropdown-gap: 0px !default; +$dropdown-z: 40 !default; $dropdown-mobile-breakpoint: iv.$desktop !default; $dropdown-background-background-color: hsla( #{css.getVar("scheme-h")}, @@ -8,3 +13,4 @@ $dropdown-background-background-color: hsla( #{css.getVar("scheme-invert-l")}, 0.86 ) !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_field.scss b/src/assets/scss/component-defaults/_field.scss new file mode 100644 index 0000000..fdb3140 --- /dev/null +++ b/src/assets/scss/component-defaults/_field.scss @@ -0,0 +1,3 @@ +/* @docs */ +$floating-in-height: 3.25em !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_icon.scss b/src/assets/scss/component-defaults/_icon.scss new file mode 100644 index 0000000..1feafdc --- /dev/null +++ b/src/assets/scss/component-defaults/_icon.scss @@ -0,0 +1,3 @@ +/* @docs */ +$icon-spin-duration: 2s !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_loading.scss b/src/assets/scss/component-defaults/_loading.scss new file mode 100644 index 0000000..fb25365 --- /dev/null +++ b/src/assets/scss/component-defaults/_loading.scss @@ -0,0 +1,6 @@ +/* @docs */ +$loading-background-color: rgba(255, 255, 255, 0.5) !default; +$loading-icon-size: 3em !default; +$loading-icon-size-full-page: 5em !default; +$loading-z: 29 !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_notification.scss b/src/assets/scss/component-defaults/_notification.scss new file mode 100644 index 0000000..3dc6f0f --- /dev/null +++ b/src/assets/scss/component-defaults/_notification.scss @@ -0,0 +1,5 @@ +/* @docs */ +$notification-margin-bottom: 1.5rem !default; +$notification-notices-padding: 2em !default; +$notification-notices-z: 1000 !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_radio.scss b/src/assets/scss/component-defaults/_radio.scss index 5ec3210..a152663 100644 --- a/src/assets/scss/component-defaults/_radio.scss +++ b/src/assets/scss/component-defaults/_radio.scss @@ -1,7 +1,10 @@ @use "bulma/sass/utilities/derived-variables" as dv; @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$radio-size: 1.25em !default; $radio-colors: dv.$colors !default; $radio-active-background-color: css.getVar("primary") !default; $radio-border-color: css.getVar("grey") !default; $radio-shadow: css.getVar("shadow"); +/* @docs */ diff --git a/src/assets/scss/component-defaults/_sidebar.scss b/src/assets/scss/component-defaults/_sidebar.scss index 762dfd7..ece8142 100644 --- a/src/assets/scss/component-defaults/_sidebar.scss +++ b/src/assets/scss/component-defaults/_sidebar.scss @@ -1,6 +1,11 @@ @use "bulma/sass/utilities/derived-variables" as dv; @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$sidebar-z: 40; +$sidebar-width: 260px !default; +$sidebar-height: 260px !default; +$sidebar-mobile-width: 80px !default; $sidebar-colors: dv.$colors !default; $sidebar-background-background-color: hsla( #{css.getVar("scheme-h")}, @@ -9,3 +14,4 @@ $sidebar-background-background-color: hsla( 0.86 ) !default; $sidebar-shadow: css.getVar("shadow"); +/* @docs */ diff --git a/src/assets/scss/component-defaults/_skeleton.scss b/src/assets/scss/component-defaults/_skeleton.scss index 97dd412..637bab0 100644 --- a/src/assets/scss/component-defaults/_skeleton.scss +++ b/src/assets/scss/component-defaults/_skeleton.scss @@ -1,3 +1,7 @@ @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$skeleton-duration: 1.5s !default; +$skeleton-margin-top: 0.5rem !default; $skeleton-border-radius: css.getVar("radius") !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_slider.scss b/src/assets/scss/component-defaults/_slider.scss index 87b543a..ba0b03c 100644 --- a/src/assets/scss/component-defaults/_slider.scss +++ b/src/assets/scss/component-defaults/_slider.scss @@ -1,6 +1,12 @@ @use "bulma/sass/utilities/derived-variables" as dv; @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$slider-tick-label-size: 0.75rem !default; +$slider-thumb-shadow: none !default; +$slider-thumb-to-track-ratio: 2 !default; +$slider-tick-to-track-ratio: 0.5 !default; +$slider-tick-width: 3px !default; $slider-colors: dv.$colors !default; $slider-radius: css.getVar("radius") !default; $slider-background: css.getVar("grey-lighter") !default; @@ -12,3 +18,4 @@ $slider-thumb-radius: css.getVar("radius") !default; $slider-thumb-border: 1px solid css.getVar("grey-light") !default; $slider-tick-radius: css.getVar("radius") !default; $slider-tick-background: css.getVar("grey-light") !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_steps.scss b/src/assets/scss/component-defaults/_steps.scss index 94d38f6..8e20a4d 100644 --- a/src/assets/scss/component-defaults/_steps.scss +++ b/src/assets/scss/component-defaults/_steps.scss @@ -2,6 +2,9 @@ @use "bulma/sass/utilities/derived-variables" as dv; @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$steps-divider-height: 0.2em !default; +$steps-vertical-padding: 1em 0 !default; $steps-colors: dv.$colors !default; $steps-mobile-breakpoint: iv.$tablet !default; $steps-marker-background: css.getVar("grey-light") !default; @@ -13,3 +16,4 @@ $steps-previous-background: css.getVar("primary") !default; $steps-active-color: css.getVar("primary") !default; $steps-active-background: css.getVar("scheme-main") !default; $steps-details-background-color: css.getVar("body-background-color") !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_switch.scss b/src/assets/scss/component-defaults/_switch.scss index 88f0a2f..d26e52b 100644 --- a/src/assets/scss/component-defaults/_switch.scss +++ b/src/assets/scss/component-defaults/_switch.scss @@ -1,7 +1,11 @@ @use "bulma/sass/utilities/derived-variables" as dv; @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$switch-width: 2.75em !default; +$switch-padding: 0.2em !default; $switch-colors: dv.$colors !default; $switch-background-color: css.getVar("grey-light") !default; $switch-active-background-color: css.getVar("primary") !default; $switch-shadow: css.getVar("shadow"); +/* @docs */ diff --git a/src/assets/scss/component-defaults/_table.scss b/src/assets/scss/component-defaults/_table.scss new file mode 100644 index 0000000..16990ba --- /dev/null +++ b/src/assets/scss/component-defaults/_table.scss @@ -0,0 +1,3 @@ +/* @docs */ +$table-sticky-header-height: 300px !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_tabs.scss b/src/assets/scss/component-defaults/_tabs.scss index 2120da7..a1f50c6 100644 --- a/src/assets/scss/component-defaults/_tabs.scss +++ b/src/assets/scss/component-defaults/_tabs.scss @@ -1,5 +1,7 @@ @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$tabs-focused-outline: none !default; $tabs-link-focus-border-bottom-color: css.getVar("tabs-link-hover-border-bottom-color") !default; $tabs-link-focus-active-border-bottom-color: css.getVar("tabs-link-active-border-bottom-color") !default; $tabs-boxed-link-focus-active-background-color: css.getVar("tabs-boxed-link-active-background-color") !default; @@ -10,3 +12,4 @@ $tabs-toggle-link-focus-active-background-color: css.getVar("tabs-toggle-link-ac $tabs-toggle-link-focus-background-color: css.getVar("tabs-toggle-link-hover-background-color") !default; $tabs-toggle-link-focus-active-border-color: css.getVar("tabs-toggle-link-active-border-color") !default; $tabs-toggle-link-focus-border-color: css.getVar("tabs-toggle-link-hover-border-color") !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_taginput.scss b/src/assets/scss/component-defaults/_taginput.scss new file mode 100644 index 0000000..17a03fe --- /dev/null +++ b/src/assets/scss/component-defaults/_taginput.scss @@ -0,0 +1,4 @@ +/* @docs */ +$taginput-height: 2em !default; +$taginput-tag-size: 0.9em !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_tooltip.scss b/src/assets/scss/component-defaults/_tooltip.scss index a066672..6043128 100644 --- a/src/assets/scss/component-defaults/_tooltip.scss +++ b/src/assets/scss/component-defaults/_tooltip.scss @@ -1,7 +1,14 @@ @use "bulma/sass/utilities/derived-variables" as dv; @use "bulma/sass/utilities/css-variables" as css; +/* @docs */ +$tooltip-arrow-size: 5px !default; +$tooltip-arrow-margin: 2px !default; +$tooltip-content-multiline-width: 300px !default; +$tooltip-shadow: 0 1px 2px 1px rgba(0, 1, 0, 0.2) !default; +$tooltip-z: 38 !default; $tooltip-colors: dv.$colors !default; $tooltip-border-radius: css.getVar("radius") !default; $tooltip-bg: css.getVar("scheme-main-bis") !default; $tooltip-color: css.getVar("text-body") !default; +/* @docs */ diff --git a/src/assets/scss/component-defaults/_upload.scss b/src/assets/scss/component-defaults/_upload.scss index 407d14a..0178b8a 100644 --- a/src/assets/scss/component-defaults/_upload.scss +++ b/src/assets/scss/component-defaults/_upload.scss @@ -1,5 +1,9 @@ @use "bulma/sass/utilities/css-variables" as css; @use "bulma/sass/form/file" as file; +/* @docs */ +$upload-bg: transparent !default; +$upload-draggable-padding: 0.5rem !default; $upload-colors: file.$file-colors !default; $upload-border-color: css.getVar("grey-light") !default; +/* @docs */ diff --git a/src/assets/scss/components/_carousel.scss b/src/assets/scss/components/_carousel.scss index 8bc79cc..dd27dee 100644 --- a/src/assets/scss/components/_carousel.scss +++ b/src/assets/scss/components/_carousel.scss @@ -2,9 +2,6 @@ @use "bulma/sass/utilities/css-variables" as css; @use "bulma/sass/utilities/mixins" as mixins; -/* @docs */ -/* @docs */ - .carousel { @include css.register-vars( (