@clayui/shared
Advanced tools
Changelog
3.38.0 (2021-10-22)
clay-css
mixin pattern (adbc3ed).btn-group
inside .alert-inline
and increase space between alert-inline buttons and close (48px) (1fb3075).alert-inline .alert-indicator
so it's more centered with the text (6991050)alert-indicator
and text should be 8px (abb1ad9)$alert-indicator-font-size
instead of $alert-font-size
when calculating spacing for the .alert-indicator
(10809da)$badge-close
Sass map to use newer keys for hover and focus (485862c)border-color
is the wrong value. Table Row Variants scoped $border-color
variable was overwriting global $border-color
variable (834209a)clay-css
mixin pattern (915c748).btn-group
inside .alert-inline
and increase space between alert-inline buttons and close (48px) (f6c7a02)modal-body
should have border-top to create separation when components are inserted between modal-header
and modal-body
(b5b33c0)clay-darken
, clay-lighten
, clay-adjust-hue
, clay-desaturate
, clay-saturate
, clay-mix
, clay-blue
, clay-green
, clay-red
. It converts CSS Custom Property fallback values to the correct type before running them through the Sass functions. (189e281)math-sign
uses deprecated [@elseif](https://github.com/elseif)
syntax, changed to [@else](https://github.com/else) if
(bd22a48), closes #4353modal-body
should have border-top to create separation when components are inserted between modal-header
and modal-body
(b3f648e)modal-header
increase z-index so it appears on top of modal-body
. modal-header
border gets hidden by modal-body
border due to last commit. (fd3ae71)node-sass
and add new build file (80f6ec2)onLoadMore
API to TreeView (ff972d7).badge
, .badge-pill
, and badge variants to use clay-badge-variant
mixin (8c9d4eb).badge
and badge variants to use clay-badge-variant
mixin (a2b04b2)$enable-clay-color-functions-process-fallback
and $cadmin-enable-clay-color-functions-process-fallback
variables. This forces Clay color functions to return the CSS Custom Property instead of processing the fallback color and returning a hex value. (15a6bc1)clay-alert-variant
adds option to configure .alert-indicator
(0c9f913)clay-alert-variant
adds option to pass in styles to .alert-indicator + .lead
(ff5146b)clay-badge-variant
(dc52ed1)Changelog
3.37.0 (2021-10-06)
$alert-*-btn
variant Sass maps to use newer keys (ecdd38a)clay-alert-variant
mixin to generate alert variant styles (9be70d7)alert-inline
should have more space between text and top / bottom borders (29c4764)$alert-font-size
to 0.875rem
and change $alert-indicator-font-size
to 1rem
(21d33ed)sticker-light
and sticker-dark
(adcd19f)$alert-*-btn
variant Sass maps to use newer keys and update $cadmin-alert-palette
to use $alert-*
variant Sass maps (6a4a100)clay-alert-variant
mixin to generate alert variant styles (3410faf).form-feedback-group
, .form-feedback-item
,.form-feedback-indicator
, and .form-text
(db26016), closes #4298fieldset[disabled] .form-control
should use values from the $cadmin-input
Sass map and move rule-set closer to the .form-control
rule-set (0504ff2)label.disabled
should use properties declared in $cadmin-input-label
map and move the label.disabled
rule-set closer to the label
rule-set (d00b97b)url("data:image/svg+xml,<svg></svg>")
to use clay-svg-url
(c1cd8a2)clay-form-control-variant
to style Danger, Warning, Success readonly inputs instead of clay-button-variant
(23ed8cb)fieldset[disabled] .form-control
should use values from the $input
Sass map and move rule-set closer to the .form-control
rule-set (9ffc635)label.disabled
should use properties declared in $input-label
map and move the label.disabled
rule-set closer to the label
rule-set (0ea7c72)math-sign
should return a negative calc value if a CSS custom property is passed in (e824c5d)escape-svg
function (e8ffa5d)$enable-hover-media-query
, $caret-width
, $caret-vertical-align
, $caret-spacing
, $emphasized-link-hover-darken-percentage
(54d39f9)$escaped-characters
variable (9b93ca0)math-sign
function (835a62a)clay-alert-variant
mixin and deprecate Bootstrap's alert-variant
mixin (a3f1722)treeview-dropping-bottom
, treeview-dropping-inside
and treeview-dropping-top
(f0b4c5e).alert-inline
, alert-autofit-stacked
, alert-autofit-stacked-sm-down
, alert-autofit-stacked-xs-down
, alert-indicator-start
(7738e78).alert-inline
, alert-autofit-stacked
, alert-autofit-stacked-sm-down
, alert-autofit-stacked-xs-down
, alert-indicator-start
(b60b0c7)$cadmin-input-danger
, $cadmin-input-warning
, $cadmin-input-success
, $cadmin-input-danger-select
, $cadmin-input-warning-select
, $cadmin-input-success-select
Sass maps with clay-form-control-variant
and clay-select-variant
for more customization options (df1e426)$input-danger
, $input-warning
, $input-success
, $input-danger-select
, $input-warning-select
, $input-success-select
Sass maps with clay-form-control-variant
and clay-select-variant
for more customization options (c23c8f5)sticker-light
now has a light font color and sticker-dark
has a dark font color. All instances of sticker-light
should be updated to use sticker-dark
and all instances of sticker-dark
should be updated to use sticker-light
. If you do not want to make this change in your markup, you can revert back to the original styles with:$sticker-light-bg: $dark !default;
$sticker-light-color: $white !default;
$sticker-dark-bg: $dark !default;
$sticker-dark-color: $white !default;
See issue https://github.com/liferay/clay/issues/4310 for more context.
Changelog
3.36.0 (2021-09-23)
.btn-monospaced
icons are off center by a pixel, use display: inline-flex
to center and remove padding. If you need items to display inline in .btn-monospaced
wrap them in a span
tag. (ece0b5b)clay-enable-transitions
should return $transitions
instead of $transition
(ca2d59a)clay-enable-transitions
the variable $enable-transitions
isn't available in Cadmin, use $enable
instead (bd4e1c5)clay-button-variant
adds option to style :disabled:focus
, mostly for removing focus shadow on disabled .btn
(bb942f9)clay-button-variant
c-inner should work if mobile sizes are enabled (a0a005c)clay-button-variant
remove outputting a.btn, button.btn { cursor: pointer; }
we can pass it in directly to .btn
(d5a1942)width
property of the Menu (f29681e)closeOnClickOutside
API support to DropDown (ece1061)expanderIcons
API to change icons throughout the structure (455002c).btn-lg
and .btn-sm
to use clay-button-variant
mixin (f6b3e95).btn-unstyled
, .btn-monospaced
, .btn-monospaced-lg
, .btn-monospaced-sm
, .btn-outline-borderless
to use clay-button-variant
mixin (4c16ce5).btn
to use clay-button-variant
mixin (617befc).btn
, .btn-lg
, .btn-sm
, .btn-monospaced
, .btn-monospaced-sm
, .btn-monospaced-lg
, .btn-unstyled
, and .btn-outline-borderless
to use clay-button-variant
mixin (8481f19)starts-with($str1, $str2)
. A function that determines whether the string $str1
begins with the characters of the specified string $str2
. (6ddef3e)clay-css
if transition has a value other than null
or none
, it should output a prefers-reduced-motion media query (95b5c08)clay-css
should output any CSS Custom Properties passed into it. (a78ddfa), closes #4252Changelog
3.32.0 (2021-07-28)
dangerouslySetInnerHTML
(675910c)component-text
and component-icon
, generic names for reuse in other components (ae49f03)form-group-sm div.form-control
should be 32px tall and grow to fix content inside, similar to a textarea element (eb987a1), closes #4164container-max-width-*
classes should work with Custom Properties (b12dbf5)clay-loading-animation-variant
to use clay-css
pattern (4280c6f), closes #3987sheet-footer-btn-block
to use clay-css
pattern (5523b67), closes #3987$sheet-lg-max-width
should use fixed number instead of generating based on a $container-max-widths
value (5968bd5)dragstart
(70d78da)@clayui/core
package (1d4e4b3)theme
API to Provider (e7bae7d)map-deep-get
for getting values of deeply nested Sass map items (2b80302)showDeltasDropDown
prop (6c65f43), closes #4175Changelog
3.29.0 (2021-05-28)
setter
to accept more than 2 variables (e.g., setter($var1, $var2, $var3, $var4, $var5)
) (2a923f0), closes #4076clay-aspect-ratio-item-variant
and clay-aspect-ratio-variant
convert to use new (easier to remember) Sass map keys. The old keys will still work and win over new keys. (d4680a9), closes #4085block
SVG icon (96dabe4)noWrap
prop to ClayTable.Cell (da88293)