@vaadin/vaadin-lumo-styles 25.1.0-alpha1 → 25.1.0-alpha2

package/components/index.css

@@ -68,4 +68,5 @@
 @import './time-picker.css';
 @import './tooltip.css';
 @import './upload.css';
+@import './upload-button.css';
 @import './vertical-layout.css';

package/components/upload-button.css

@@ -0,0 +1,12 @@
+/**
+ * @license
+ * Copyright (c) 2000 - 2026 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */
+@import './button.css';
+
+:root::before,
+:host::before {
+  --_lumo-vaadin-upload-button-inject: 1;
+  --_lumo-vaadin-upload-button-inject-modules: lumo_components_button;
+}

package/dist/lumo.css

@@ -52,4 +52,4 @@
       --vaadin-radio-button-label-padding,var(--lumo-space-xs) var(--lumo-space-s) var(--lumo-space-xs) var(--lumo-space-xs)
     )}[part=radio]{--_input-size:var(--_radio-button-size);background:var(--vaadin-radio-button-background,var(--lumo-contrast-20pct));border-radius:50%;cursor:var(--lumo-clickable-cursor);margin:var(--lumo-space-xs);position:relative;transition:transform .2s cubic-bezier(.12,.32,.54,2),background-color .15s;will-change:transform;--_input-border-color:var(--vaadin-input-field-border-color,var(--lumo-contrast-50pct))}[part=radio]:before{background-color:inherit;border-radius:inherit;color:transparent;height:100%;opacity:0;pointer-events:none;transform:scale(1.4);transition:transform .1s,opacity .8s;width:100%;will-change:transform,opacity}[part=radio]:after{background-clip:content-box;border:var(--vaadin-radio-button-marker-size,3px) solid var(--vaadin-radio-button-dot-color,var(--lumo-primary-contrast-color));border-radius:50%;content:"";height:0;left:50%;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%) scale(0);transition:transform .25s;width:0;will-change:transform}:host([checked]){--vaadin-input-field-border-color:transparent}:host([checked]) [part=radio]{background-color:var(--_selection-color)}:host([checked]) [part=radio]:after{transform:translate(-50%,-50%) scale(1)}:host(:not([checked]):not([disabled]):hover) [part=radio]{background:var(--vaadin-radio-button-background-hover,var(--lumo-contrast-30pct))}:host([active]) [part=radio]{transform:scale(.9);transition-duration:.05s}:host([active][checked]) [part=radio]{transform:scale(1.1)}:host([active]:not([checked])) [part=radio]:before{opacity:.4;transform:scale(0);transition-duration:.01s,.01s}:host([focus-ring]) [part=radio]{box-shadow:0 0 0 1px var(--lumo-base-color),0 0 0 calc(var(--_focus-ring-width) + 1px) var(--_focus-ring-color),inset 0 0 0 var(--_input-border-width,0) var(--_input-border-color)}:host([disabled]){color:var(--lumo-disabled-text-color);pointer-events:none;--vaadin-input-field-border-color:var(--lumo-contrast-20pct)}:host([disabled]) ::slotted(label){color:inherit}:host([disabled]) [part=radio]{background-color:var(--vaadin-radio-button-disabled-background,var(--lumo-contrast-10pct))}:host([disabled]) [part=radio]:after{border-color:var(--vaadin-radio-button-disabled-dot-color,var(--lumo-contrast-30pct))}:host([dir=rtl][has-label]) ::slotted(label){padding:var(--lumo-space-xs) var(--lumo-space-xs) var(--lumo-space-xs) var(--lumo-space-s)}@media (forced-colors:active){[part=radio]{outline:1px solid;outline-offset:-1px}:host([focused]) [part=radio]{outline-width:2px}:host([disabled]) [part=radio]{outline-color:GrayText}}}:host:before,:root:before{--_lumo-vaadin-radio-button-inject:1;--_lumo-vaadin-radio-button-inject-modules:lumo_mixins_checkable-field,lumo_components_radio-button}@media lumo_components_radio-group{:host(:hover:not([readonly])) [part=helper-text],:host(:hover:not([readonly]):not([focused])) [part=label]{color:var(--lumo-body-text-color)}@media (pointer:coarse){:host(:hover:not([readonly]):not([focused])) [part=label]{color:var(--lumo-secondary-text-color)}}}:host:before,:root:before{--_lumo-vaadin-radio-group-inject:1;--_lumo-vaadin-radio-group-inject-modules:lumo_mixins_group-field,lumo_mixins_field-label,lumo_mixins_field-required,lumo_mixins_field-error-message,lumo_mixins_field-helper,lumo_components_radio-group}@media lumo_components_rich-text-editor-popup-overlay{:host{--_focus-ring-color:var(--vaadin-focus-ring-color,var(--lumo-primary-color-50pct));--_focus-ring-width:var(--vaadin-focus-ring-width,2px)}[part=overlay]{margin:var(--lumo-space-xs) 0}[part=content]{display:flex;flex-wrap:wrap;justify-content:center;max-width:calc((var(--_button-size) + var(--_button-margin)*2)*7);padding:var(--lumo-space-xs);--_button-size:1.25rem;--_button-margin:3px}[part=content] ::slotted(button){background-color:var(--_btn-background);border:none;height:var(--_button-size);margin:var(--_button-margin);width:var(--_button-size)}[part=content] ::slotted(button:focus-visible){outline:var(--_focus-ring-width) solid var(--_focus-ring-color);outline-offset:calc(var(--_focus-ring-width)*-1 + 1px)}[part=content] ::slotted(button:first-of-type){background-clip:padding-box;background-color:transparent;background-image:repeating-linear-gradient(135deg,transparent,transparent 47%,red 50%,transparent 53%,transparent);border:1px solid var(--lumo-contrast-10pct);position:relative}}@media lumo_components_rich-text-editor{:host{font-family:var(--lumo-font-family);font-size:var(--lumo-font-size-m);line-height:var(--lumo-line-height-m);min-height:calc(var(--lumo-size-m)*8);-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--_focus-ring-color:var(--vaadin-focus-ring-color,var(--lumo-primary-color-50pct));--_focus-ring-width:var(--vaadin-focus-ring-width,2px);--_item-indent:var(--lumo-space-m);--_marker-indent:var(--lumo-space-xs)}:host(:focus-within){outline:none}.vaadin-rich-text-editor-container{background:var(--vaadin-rich-text-editor-background,transparent);border:none;border-radius:0}[part=content]{background-color:var(--lumo-base-color)}[part=toolbar]{background-color:var(--vaadin-rich-text-editor-toolbar-background,var(--lumo-contrast-5pct));gap:var(--vaadin-rich-text-editor-toolbar-gap,0);padding:var(--vaadin-rich-text-editor-toolbar-padding,calc(var(--lumo-space-s) - 1px) var(--lumo-space-xs))}[part~=toolbar-button]{background:var(--vaadin-rich-text-editor-toolbar-button-background,transparent);border-radius:var(--lumo-border-radius-m);border-width:var(--vaadin-rich-text-editor-toolbar-button-border-width,0);color:var(--vaadin-rich-text-editor-toolbar-button-text-color,var(--lumo-contrast-60pct));cursor:var(--lumo-clickable-cursor);font:inherit;height:var(--lumo-size-m);line-height:1;margin:2px 1px;padding:var(--vaadin-rich-text-editor-toolbar-button-padding,0);text-transform:none;transition:background-color .1s,color .1s;width:var(--lumo-size-m)}[part~=toolbar-button]:not([part~=toolbar-button-pressed]):hover{outline:none;--vaadin-rich-text-editor-toolbar-button-background:var(--lumo-contrast-5pct);--vaadin-rich-text-editor-toolbar-button-text-color:var(--lumo-contrast-80pct)}[part~=toolbar-button]:before{background:transparent;font-family:"lumo-icons",var(--lumo-font-family);font-size:var(--lumo-icon-size-m);height:auto;left:50%;mask-image:none;position:absolute;top:50%;transform:translate(-50%,-50%);width:auto}[part~=toolbar-group]{margin:0 .5em;margin:0 calc(var(--lumo-space-l)/2 - 1px)}[part~=toolbar-button-bold]:before{content:"B";font-weight:700}[part~=toolbar-button-italic]:before{content:"I";font-style:italic}[part~=toolbar-button-underline]:before{content:"U";text-decoration:underline}[part~=toolbar-button-strike]:before{content:"T";text-decoration:line-through}[part~=toolbar-button-h1]:before{content:"H1";font-size:1.25em;font-size:var(--lumo-font-size-m)}[part~=toolbar-button-h2]:before{content:"H2";font-size:1em;font-size:var(--lumo-font-size-s)}[part~=toolbar-button-h3]:before{content:"H3";font-size:.875em;font-size:var(--lumo-font-size-xs)}[part~=toolbar-button-h1]:before,[part~=toolbar-button-h2]:before,[part~=toolbar-button-h3]:before{font-weight:600;letter-spacing:-.05em}[part~=toolbar-button-subscript]:before,[part~=toolbar-button-superscript]:before{content:"X";font-size:var(--lumo-font-size-s);font-weight:600}[part~=toolbar-button-subscript]:after,[part~=toolbar-button-superscript]:after{content:"2";font-size:.625em;font-weight:700;left:70%;position:absolute;top:50%}[part~=toolbar-button-superscript]:after{top:20%}[part~=toolbar-button-blockquote]:before{content:"”";font-size:var(--lumo-font-size-xxl);height:.6em}[part~=toolbar-button-code-block]:before{content:var(--lumo-icons-angle-left) var(--lumo-icons-angle-right);font-size:var(--lumo-font-size-l);font-weight:600;letter-spacing:-.5em;margin-left:-.25em}[part~=toolbar-button-background]:before,[part~=toolbar-button-color]:before{content:"A";font-size:1em}[part~=toolbar-button-background]:after,[part~=toolbar-button-color]:after{height:auto;mask-image:none;transform:none;width:auto}[part~=toolbar-button-color]:after{bottom:4px;height:4px;left:25%;right:25%;width:50%}[part~=toolbar-button-background]:before{background-color:var(--lumo-base-color);background-image:linear-gradient(var(--lumo-contrast-5pct),var(--lumo-contrast-5pct));z-index:1}[part~=toolbar-button-background]:after{background:repeating-linear-gradient(135deg,var(--_background-value,currentColor),var(--_background-value,currentColor) 1px,transparent 1px,transparent 2px);content:"";inset:20%;position:absolute}:host([disabled]) [part~=toolbar-button]{--vaadin-rich-text-editor-toolbar-button-background:transparent}[part~=toolbar-button]:focus,[part~=toolbar-button][aria-expanded=true]{box-shadow:0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);outline:none}@media (hover:none){[part~=toolbar-button]:hover{--vaadin-rich-text-editor-toolbar-button-background:transparent}}[part~=toolbar-button-pressed]{--vaadin-rich-text-editor-toolbar-button-background:var(--vaadin-selection-color,var(--lumo-primary-color));--vaadin-rich-text-editor-toolbar-button-text-color:var(--lumo-primary-contrast-color)}[part~=toolbar-button]:not([part~=toolbar-button-pressed]):active{--vaadin-rich-text-editor-toolbar-button-background:var(--lumo-contrast-10pct);--vaadin-rich-text-editor-toolbar-button-text-color:var(--lumo-contrast-90pct)}[part~=toolbar-button-undo]:before{content:var(--lumo-icons-undo)}[part~=toolbar-button-redo]:before{content:var(--lumo-icons-redo)}[part~=toolbar-button-background]:before,[part~=toolbar-button-bold]:before,[part~=toolbar-button-color]:before,[part~=toolbar-button-italic]:before,[part~=toolbar-button-strike]:before,[part~=toolbar-button-underline]:before{font-size:var(--lumo-font-size-m);font-weight:600}[part~=toolbar-button-background]:hover:before{background-image:linear-gradient(var(--lumo-contrast-5pct),var(--lumo-contrast-5pct)),linear-gradient(var(--lumo-contrast-5pct),var(--lumo-contrast-5pct))}[part~=toolbar-button-background]:active:before{background-image:linear-gradient(var(--lumo-contrast-5pct),var(--lumo-contrast-5pct)),linear-gradient(var(--lumo-contrast-10pct),var(--lumo-contrast-10pct))}[part~=toolbar-button-list-ordered]:before{content:var(--lumo-icons-ordered-list)}[part~=toolbar-button-list-bullet]:before{content:var(--lumo-icons-unordered-list)}[part~=toolbar-button-outdent]:before{content:var(--lumo-icons-outdent)}[part~=toolbar-button-indent]:before{content:var(--lumo-icons-indent)}[part~=toolbar-button-align-left]:before{content:var(--lumo-icons-align-left)}[part~=toolbar-button-align-center]:before{content:var(--lumo-icons-align-center)}[part~=toolbar-button-align-right]:before{content:var(--lumo-icons-align-right)}[part~=toolbar-button-image]:before{content:var(--lumo-icons-photo)}[part~=toolbar-button-link]:before{content:var(--lumo-icons-link)}[part~=toolbar-button-clean]:before{content:var(--lumo-icons-clean);font-size:var(--lumo-font-size-l)}:host(:not([theme~=no-border])){border:1px solid var(--lumo-contrast-20pct)}:host(:not([theme~=no-border]):not([readonly])) [part=content]{border-top:1px solid var(--lumo-contrast-20pct)}:host([theme~=no-border]) [part=toolbar]{--vaadin-rich-text-editor-toolbar-padding:var(--lumo-space-s) var(--lumo-space-xs)}:host([theme~=compact]){min-height:calc(var(--lumo-size-m)*6)}:host([theme~=compact]) [part=toolbar]{--vaadin-rich-text-editor-toolbar-padding:var(--lumo-space-xs) 0}:host([theme~=compact][theme~=no-border]) [part=toolbar]{--vaadin-rich-text-editor-toolbar-padding:calc(var(--lumo-space-xs) + 1px) 0}:host([theme~=compact]) [part~=toolbar-button]{height:var(--lumo-size-s);width:var(--lumo-size-s)}:host([theme~=compact]) [part~=toolbar-group]{margin:0 calc(var(--lumo-space-m)/2 - 1px)}.ql-editor{color:var(--vaadin-rich-text-editor-content-color,inherit);padding:var(--vaadin-rich-text-editor-content-padding,var(--lumo-space-s) var(--lumo-space-m))}.ql-code-block-container{background-color:var(--lumo-contrast-10pct);border-radius:var(--lumo-border-radius-m);margin-block:.3125em;padding:.3125em .625em}blockquote{margin-inline:40px;padding-left:1em}code{background-color:var(--lumo-contrast-10pct);font-size:85%;padding:.125em .25em}:where(h1,h2,h3,h4,h5,h6){margin-top:1.25em}:where(h1){margin-bottom:.75em}:where(h2,h3,h4){margin-bottom:.5em}:where(h5){margin-bottom:.25em}:host([dir=rtl]) [part~=toolbar-button-redo]:before{content:var(--lumo-icons-undo)}:host([dir=rtl]) [part~=toolbar-button-undo]:before{content:var(--lumo-icons-redo)}}@media lumo_global_typography{:where(:host),:where(body){font-family:var(--lumo-font-family);font-size:var(--lumo-font-size-m);line-height:var(--lumo-line-height-m);-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}[theme~=font-size-s],small{font-size:var(--lumo-font-size-s);line-height:var(--lumo-line-height-s)}[theme~=font-size-xs]{font-size:var(--lumo-font-size-xs);line-height:var(--lumo-line-height-xs)}:where(h1,h2,h3,h4,h5,h6){color:var(--lumo-header-text-color);font-weight:600;line-height:var(--lumo-line-height-xs);margin-block:0}:where(h1){font-size:var(--lumo-font-size-xxxl)}:where(h2){font-size:var(--lumo-font-size-xxl)}:where(h3){font-size:var(--lumo-font-size-xl)}:where(h4){font-size:var(--lumo-font-size-l)}:where(h5){font-size:var(--lumo-font-size-m)}:where(h6){font-size:var(--lumo-font-size-xs);letter-spacing:.03em;text-transform:uppercase}blockquote,p{margin-bottom:.75em;margin-top:.5em}a{text-decoration:none}a:where(:any-link){color:var(--lumo-primary-text-color)}a:where(:any-link):hover{text-decoration:underline}a:not(:any-link){color:var(--lumo-disabled-text-color)}hr{align-self:stretch;background-color:var(--lumo-contrast-10pct);border:0;display:block;height:1px;margin:var(--lumo-space-s) calc(var(--lumo-border-radius-m)/2);padding:0}b,strong{font-weight:600}code,pre{border-radius:var(--lumo-border-radius-m)}pre code{background:transparent}blockquote{border-left:2px solid var(--lumo-contrast-30pct);color:var(--lumo-secondary-text-color)}blockquote[dir=rtl]{border-left:none;border-right:2px solid var(--lumo-contrast-30pct)}}@media lumo_components_tooltip-overlay{:host{--_vaadin-tooltip-default-offset:var(--lumo-space-xs)}[part=overlay]{background:var(--lumo-base-color) linear-gradient(var(--lumo-contrast-5pct),var(--lumo-contrast-5pct));color:var(--lumo-body-text-color);font-size:var(--lumo-font-size-xs);line-height:var(--lumo-line-height-s);max-width:40ch}[part=content]{padding:var(--lumo-space-xs) var(--lumo-space-s)}:host(:not([markdown])) [part=content]{white-space:pre-wrap}:host([position^=bottom][top-aligned]) [part=overlay],:host([position^=top][top-aligned]) [part=overlay]{margin-top:var(--vaadin-tooltip-offset-top,var(--_vaadin-tooltip-default-offset))}:host([position^=bottom][bottom-aligned]) [part=overlay],:host([position^=top][bottom-aligned]) [part=overlay]{margin-bottom:var(--vaadin-tooltip-offset-bottom,var(--_vaadin-tooltip-default-offset))}:host([position^=end][start-aligned]) [part=overlay],:host([position^=start][start-aligned]) [part=overlay]{margin-inline-start:var(--vaadin-tooltip-offset-start,var(--_vaadin-tooltip-default-offset))}:host([position^=end][end-aligned]) [part=overlay],:host([position^=start][end-aligned]) [part=overlay]{margin-inline-end:var(--vaadin-tooltip-offset-end,var(--_vaadin-tooltip-default-offset))}@media (forced-colors:active){[part=overlay]{outline:1px dashed}}}:host:before,:root:before{--_lumo-vaadin-tooltip-overlay-inject:1;--_lumo-vaadin-tooltip-overlay-inject-modules:lumo_mixins_overlay,lumo_components_tooltip-overlay}:host:before,:root:before{--_lumo-vaadin-rich-text-editor-inject:1;--_lumo-vaadin-rich-text-editor-inject-modules:lumo_global_typography,lumo_components_rich-text-editor;--_lumo-vaadin-rich-text-editor-popup-overlay-inject:1;--_lumo-vaadin-rich-text-editor-popup-overlay-inject-modules:lumo_mixins_overlay,lumo_components_rich-text-editor-popup-overlay}@media lumo_components_scroller{:host{--_focus-ring-color:var(--vaadin-focus-ring-color,var(--lumo-primary-color-50pct));--_focus-ring-width:var(--vaadin-focus-ring-width,2px)}:host([focus-ring]){box-shadow:0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);outline:none}}:host:before,:root:before{--_lumo-vaadin-scroller-inject:1;--_lumo-vaadin-scroller-inject-modules:lumo_components_scroller}@media lumo_components_side-nav{:host{color:var(--lumo-body-text-color);display:block;font-family:var(--lumo-font-family);font-size:var(--lumo-font-size-m);font-weight:500;line-height:var(--lumo-line-height-xs);-webkit-tap-highlight-color:transparent;--_focus-ring-color:var(--vaadin-focus-ring-color,var(--lumo-primary-color-50pct));--_focus-ring-width:var(--vaadin-focus-ring-width,2px)}:host([hidden]){display:none!important}button{align-items:center;background-color:initial;border:initial;color:inherit;display:flex;font:inherit;justify-content:inherit;margin:0;outline:none;padding:0;text-align:inherit;width:100%}[part=children]{list-style-type:none;margin:0;padding:0}[part=label]{align-items:center;border-radius:var(--lumo-border-radius-m);box-sizing:border-box;display:flex;font-family:var(--lumo-font-family);font-size:var(--lumo-font-size-s);font-weight:500;line-height:var(--lumo-line-height-xs);outline:none;width:100%}[part=label] ::slotted([slot=label]){color:var(--lumo-secondary-text-color);margin:var(--lumo-space-s)}:host([focus-ring]) [part=label]{box-shadow:0 0 0 var(--_focus-ring-width) var(--_focus-ring-color)}[part=toggle-button]{align-items:center;color:var(--lumo-contrast-60pct);cursor:var(--lumo-clickable-cursor);display:inline-flex;font-family:lumo-icons;font-size:var(--lumo-icon-size-m);height:var(--lumo-size-s);justify-content:center;line-height:1;margin-inline:auto var(--lumo-space-xs);width:var(--lumo-size-s)}[part=toggle-button]:before{content:var(--lumo-icons-angle-right);transition:transform .14s}:host(:not([collapsible])) [part=toggle-button]{display:none!important}:host(:not([collapsed])) [part=toggle-button]:before{transform:rotate(90deg)}:host([collapsed][dir=rtl]) [part=toggle-button]:before{transform:rotate(180deg)}@media (any-hover:hover){[part=label]:hover [part=toggle-button]{color:var(--lumo-body-text-color)}}}@media lumo_components_side-nav-item{:host{display:block;--_focus-ring-color:var(--vaadin-focus-ring-color,var(--lumo-primary-color-50pct));--_focus-ring-width:var(--vaadin-focus-ring-width,2px)}:host([hidden]),[hidden]{display:none!important}:host([disabled]){pointer-events:none}[part=content],[part=link]{align-items:center;display:flex}[part=link]{border-radius:var(--lumo-border-radius-m);color:inherit;cursor:var(--lumo-clickable-cursor,default);flex:auto;font:inherit;gap:var(--lumo-space-xs);min-height:var(--lumo-icon-size-m);min-width:0;padding:var(--lumo-space-s);padding-inline-start:calc(var(--lumo-space-s) + var(--_child-indent, 0px));text-decoration:none;transition:background-color .14s,color .14s;width:100%}button{appearance:none;background:transparent;border:0;flex:none;margin:0;padding:0;position:relative}[part=children]{list-style-type:none;margin:0;padding:0}:host(:not([has-children])) button{display:none!important}slot[name=prefix],slot[name=suffix]{flex:none}slot:not([name]){display:block;flex:auto;margin:0 var(--lumo-space-s);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[part=link][href]{cursor:pointer}:host([disabled]) [part=link]{color:var(--lumo-disabled-text-color)}[part=toggle-button]{height:var(--lumo-size-s);margin-inline-end:calc(var(--lumo-space-xs)*-1);width:var(--lumo-size-s)}:host([has-children]) [part=content]{padding-inline-end:var(--lumo-space-s)}@media (any-hover:hover){[part=link]:hover{color:var(--lumo-header-text-color)}[part=toggle-button]:hover{color:var(--lumo-body-text-color)}}[part=link]:active:focus{background-color:var(--lumo-contrast-5pct)}[part=toggle-button]:before{content:var(--lumo-icons-dropdown);transform:rotate(-90deg);transition:transform .14s}:host([dir=rtl]) [part=toggle-button]:before{transform:rotate(90deg)}:host([expanded]) [part=toggle-button]:before{transform:none}[part=link],[part=toggle-button]{outline:none}[part=link]:focus-visible,[part=toggle-button]:focus-visible{border-radius:var(--lumo-border-radius-m);box-shadow:0 0 0 var(--_focus-ring-width) var(--_focus-ring-color)}[part=link]:active{color:var(--lumo-header-text-color)}slot[name=prefix]::slotted(:is(vaadin-icon,[class*=icon])){color:var(--lumo-contrast-60pct);flex-shrink:0;padding:.1em}:host([disabled]) slot[name=prefix]::slotted(:is(vaadin-icon,[class*=icon])){color:var(--lumo-disabled-text-color)}:host([current]) slot[name=prefix]::slotted(:is(vaadin-icon,[class*=icon])){color:inherit}slot[name=children]{--_child-indent:calc(var(--_child-indent-2, 0px) + var(--vaadin-side-nav-child-indent, var(--lumo-space-l)))}slot[name=children]::slotted(*){--_child-indent-2:var(--_child-indent)}:host([current]) [part=content]{background-color:var(--lumo-primary-color-10pct);border-radius:var(--lumo-border-radius-m);color:var(--vaadin-selection-color-text,var(--lumo-primary-text-color))}.sr-only{border:0!important;clip:rect(1px,1px,1px,1px)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}}:host:before,:root:before{--_lumo-vaadin-side-nav-item-inject:1;--_lumo-vaadin-side-nav-item-inject-modules:lumo_mixins_field-button,lumo_components_side-nav-item}:host:before,:root:before{--_lumo-vaadin-side-nav-inject:1;--_lumo-vaadin-side-nav-inject-modules:lumo_components_side-nav}@media lumo_components_split-layout{[part=splitter]{--_splitter-size:var(--vaadin-split-layout-splitter-size,var(--lumo-space-s));--_splitter-target-size:var(--vaadin-split-layout-splitter-target-size,var(--lumo-space-s));--_handle-size:var(--vaadin-split-layout-handle-size,var(--lumo-space-xs));--_handle-target-size:var(--vaadin-split-layout-handle-target-size,var(--lumo-size-m));background:var(--vaadin-split-layout-splitter-background,var(--lumo-contrast-5pct));transition:background-color .1s}[part=handle]{background:var(--vaadin-split-layout-handle-background,var(--lumo-contrast-30pct));border-radius:var(--lumo-border-radius-s)}[part=splitter]:active [part=handle]{background:var(--lumo-contrast-50pct)}:host([theme~=small])>[part=splitter]{--vaadin-split-layout-handle-size:5px;background:var(--lumo-contrast-10pct)}:host([theme~=minimal])>[part=splitter]{--vaadin-split-layout-splitter-size:0px;--vaadin-split-layout-handle-size:5px;--vaadin-split-layout-splitter-target-size:5px}:host([theme~=minimal])>[part=splitter]>[part=handle]{opacity:0}:host([theme~=minimal])>[part=splitter]:is(:hover,:active)>[part=handle]{opacity:1}@media (any-hover:hover){[part=splitter]:hover [part=handle]{background-color:var(--lumo-contrast-40pct)}}}:host:before,:root:before{--_lumo-vaadin-split-layout-inject:1;--_lumo-vaadin-split-layout-inject-modules:lumo_components_split-layout}@media lumo_components_tabs{:host{align-items:center;display:flex;-webkit-tap-highlight-color:transparent}:host([hidden]){display:none!important}:host([orientation=vertical]){box-shadow:-1px 0 0 0 var(--lumo-contrast-10pct);display:block}:host([orientation=vertical]) [part=tabs]{height:100%;margin:.5rem 0;overflow-y:auto;width:100%}:host(:not([orientation=vertical])){box-shadow:inset 0 -1px 0 0 var(--lumo-contrast-10pct);min-height:var(--lumo-size-l);position:relative}:host([orientation=horizontal]) [part=tabs]{align-self:stretch;display:flex;flex-grow:1;margin:0 .75rem;overflow-x:auto}:host([orientation=horizontal]) [part=tabs] ::slotted(vaadin-tab:not([theme~=icon-on-top])){justify-content:center}@-moz-document url-prefix(){:host([orientation=horizontal]) [part=tabs]{overflow:hidden}}:host([orientation=horizontal]) [part=tabs]::-webkit-scrollbar{display:none}[part=back-button],[part=forward-button]{align-items:center;color:var(--lumo-tertiary-text-color);cursor:default;display:flex;font-family:lumo-icons;font-size:var(--lumo-icon-size-m);height:100%;justify-content:center;opacity:0;pointer-events:none;position:absolute;top:0;transition:opacity .2s;width:1.5em;z-index:1}[part=back-button]:hover,[part=forward-button]:hover{color:inherit}:host([overflow~=end]) [part=forward-button],:host([overflow~=start]) [part=back-button]{opacity:1;pointer-events:auto}[part=back-button]:after{content:var(--lumo-icons-angle-left)}[part=forward-button]:after{content:var(--lumo-icons-angle-right)}:host([orientation=vertical]) [part=back-button],:host([orientation=vertical]) [part=forward-button]{display:none}[part=tabs]{--_lumo-tabs-overflow-mask-image:none;mask-image:var(--_lumo-tabs-overflow-mask-image)}:host([overflow~=start][overflow~=end]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(90deg,transparent 2em,#000 4em,#000 calc(100% - 4em),transparent calc(100% - 2em))}:host([overflow~=end]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(90deg,#000 calc(100% - 4em),transparent calc(100% - 2em))}:host([overflow~=start]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(90deg,transparent 2em,#000 4em)}:host([overflow~=start][overflow~=end][orientation=vertical]) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(transparent,#000 2em,#000 calc(100% - 2em),transparent)}:host([overflow~=end][orientation=vertical]) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(#000 calc(100% - 2em),transparent)}:host([overflow~=start][orientation=vertical]) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(transparent,#000 2em)}:host [part=tabs] ::slotted(:not(vaadin-tab)){margin-left:var(--lumo-space-m)}:host([theme~=centered][orientation=horizontal]) ::slotted(vaadin-tab:first-of-type){margin-inline-start:auto}:host([theme~=centered][orientation=horizontal]) ::slotted(vaadin-tab:last-of-type){margin-inline-end:auto}:host([theme~=small]),:host([theme~=small]) [part=tabs]{min-height:var(--lumo-size-m)}:host([theme~=small]) [part=tabs] ::slotted(vaadin-tab){font-size:var(--lumo-font-size-s)}:host([theme~=minimal]){box-shadow:none;--_lumo-tab-marker-display:none}:host([theme~=hide-scroll-buttons]) [part=back-button],:host([theme~=hide-scroll-buttons]) [part=forward-button]{display:none}:host([theme~=hide-scroll-buttons][overflow~=start][overflow~=end]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(90deg,transparent,#000 2em,#000 calc(100% - 2em),transparent)}:host([theme~=hide-scroll-buttons][overflow~=end]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(90deg,#000 calc(100% - 2em),transparent)}:host([theme~=hide-scroll-buttons][overflow~=start]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(90deg,transparent,#000 2em)}:host([theme~=equal-width-tabs]){flex:auto}:host([theme~=equal-width-tabs]) [part=tabs] ::slotted(vaadin-tab){flex:1 0 0%}:host(:not([dir=rtl])) [part=forward-button]{right:0}:host([dir=rtl]) [part=back-button]:after{content:var(--lumo-icons-angle-right)}:host([dir=rtl]) [part=forward-button]:after{content:var(--lumo-icons-angle-left)}:host([dir=rtl][orientation=vertical]){box-shadow:1px 0 0 0 var(--lumo-contrast-10pct)}:host([dir=rtl]) [part=forward-button]{left:0}:host([dir=rtl]) [part=tabs] ::slotted(:not(vaadin-tab)){margin-left:0;margin-right:var(--lumo-space-m)}:host([dir=rtl][overflow~=start][overflow~=end]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(-90deg,transparent 2em,#000 4em,#000 calc(100% - 4em),transparent calc(100% - 2em))}:host([dir=rtl][overflow~=end]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(-90deg,#000 calc(100% - 4em),transparent calc(100% - 2em))}:host([dir=rtl][overflow~=start]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(-90deg,transparent 2em,#000 4em)}:host([dir=rtl][theme~=hide-scroll-buttons][overflow~=start][overflow~=end]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(-90deg,transparent,#000 2em,#000 calc(100% - 2em),transparent)}:host([dir=rtl][theme~=hide-scroll-buttons][overflow~=end]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(-90deg,#000 calc(100% - 2em),transparent)}:host([dir=rtl][theme~=hide-scroll-buttons][overflow~=start]:not([orientation=vertical])) [part=tabs]{--_lumo-tabs-overflow-mask-image:linear-gradient(-90deg,transparent,#000 2em)}}@media lumo_components_tab{:host{align-items:center;box-sizing:border-box;color:var(--lumo-secondary-text-color);cursor:var(--lumo-clickable-cursor);display:flex;flex-shrink:0;font-family:var(--lumo-font-family);font-size:var(--lumo-font-size-m);font-weight:500;line-height:var(--lumo-line-height-xs);opacity:1;outline:none;padding:.5rem .75rem;position:relative;transform-origin:50% 100%;transition:color .15s,transform .2s;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-width:var(--lumo-size-m);overflow:hidden;-webkit-user-select:none;user-select:none;--_focus-ring-color:var(--vaadin-focus-ring-color,var(--lumo-primary-color-50pct));--_focus-ring-width:var(--vaadin-focus-ring-width,2px);--_selection-color:var(--vaadin-selection-color,var(--lumo-primary-color));--_selection-color-text:var(--vaadin-selection-color-text,var(--lumo-primary-text-color))}:host([hidden]){display:none!important}:host(:not([orientation=vertical])){text-align:center}:host([orientation=vertical]){min-height:var(--lumo-size-m);min-width:0;padding:.25rem 1rem;transform-origin:0 50%}:host(:hover),:host([focus-ring]){color:var(--lumo-body-text-color)}:host([selected]){color:var(--_selection-color-text);transition:color .6s}:host([active]:not([selected])){color:var(--_selection-color-text);transition-duration:.1s}:host:after,:host:before{background-color:var(--lumo-contrast-60pct);border-radius:var(--lumo-border-radius-s) var(--lumo-border-radius-s) 0 0;bottom:0;content:"";display:var(--_lumo-tab-marker-display,block);height:2px;left:50%;position:absolute;transform:translateX(-50%) scale(0);transform-origin:50% 100%;transition:transform .14s cubic-bezier(.12,.32,.54,1);width:var(--lumo-size-s);will-change:transform}:host([orientation=vertical]):after,:host([orientation=vertical]):before{border-radius:0 var(--lumo-border-radius-s) var(--lumo-border-radius-s) 0;bottom:50%;height:var(--lumo-size-xs);left:0;transform:translateY(50%) scale(0);transform-origin:100% 50%;width:2px}:host:after{box-shadow:0 0 0 4px var(--_selection-color);opacity:.15;transition:transform .15s .02s,opacity .8s .17s}:host([selected]):after,:host([selected]):before{background-color:var(--_selection-color);transform:translateX(-50%) scale(1);transition-timing-function:cubic-bezier(.12,.32,.54,1.5)}:host([orientation=vertical][selected]):after,:host([orientation=vertical][selected]):before{transform:translateY(50%) scale(1)}:host([selected]:not([active])):after{opacity:0}:host(:not([orientation=vertical])) ::slotted(a[href]){justify-content:center}:host ::slotted(a){align-items:center;color:inherit!important;display:flex;height:100%;margin:-.5rem -.75rem;outline:none;padding:.5rem .75rem;text-decoration:none!important;width:100%}:host ::slotted(vaadin-icon){height:var(--lumo-icon-size-m);margin:0 4px;width:var(--lumo-icon-size-m)}:host ::slotted(vaadin-icon[icon^="vaadin:"]){box-sizing:border-box!important;padding:.25rem}:host(:not([dir=rtl])) ::slotted(vaadin-icon:first-child){margin-left:0}:host(:not([dir=rtl])) ::slotted(vaadin-icon:last-child){margin-right:0}:host([theme~=icon-on-top]){align-items:center;display:flex;flex-direction:column;justify-content:space-around;padding-bottom:.5rem;padding-top:.25rem;text-align:center}:host([theme~=icon-on-top]) ::slotted(a){align-items:center;flex-direction:column;margin-top:-.25rem;padding-top:.25rem}:host([theme~=icon-on-top]) ::slotted(vaadin-icon){margin:0}:host([disabled]){color:var(--lumo-disabled-text-color);opacity:1;pointer-events:none}:host([focus-ring]){border-radius:var(--lumo-border-radius-m);box-shadow:inset 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color)}:host([dir=rtl]):after,:host([dir=rtl]):before{left:auto;right:50%;transform:translateX(50%) scale(0)}:host([dir=rtl][selected]:not([orientation=vertical])):after,:host([dir=rtl][selected]:not([orientation=vertical])):before{transform:translateX(50%) scale(1)}:host([dir=rtl]) ::slotted(vaadin-icon:first-child){margin-right:0}:host([dir=rtl]) ::slotted(vaadin-icon:last-child){margin-left:0}:host([orientation=vertical][dir=rtl]){transform-origin:100% 50%}:host([dir=rtl][orientation=vertical]):after,:host([dir=rtl][orientation=vertical]):before{border-radius:var(--lumo-border-radius-s) 0 0 var(--lumo-border-radius-s);left:auto;right:0;transform-origin:0 50%}@media (forced-colors:active){:host([focused]){outline:1px solid;outline-offset:-1px}:host([selected]){border-bottom:2px solid}:host([orientation=vertical][selected]){border-bottom:none;border-left:2px solid}}}:host:before,:root:before{--_lumo-vaadin-tab-inject:1;--_lumo-vaadin-tab-inject-modules:lumo_components_tab}:host:before,:root:before{--_lumo-vaadin-tabs-inject:1;--_lumo-vaadin-tabs-inject-modules:lumo_components_tabs}@media lumo_components_tabsheet{:host{display:flex;flex-direction:column;font-family:var(--lumo-font-family);font-size:var(--lumo-font-size-m);line-height:var(--lumo-line-height-m)}:host([hidden]){display:none!important}[part=tabs-container]{align-items:center;box-shadow:inset 0 -1px 0 0 var(--lumo-contrast-10pct);display:flex;gap:var(--lumo-space-s);padding:var(--lumo-space-xs) var(--lumo-space-s);position:relative}::slotted([slot=tabs]){align-self:stretch;box-shadow:none;flex:1;margin:calc(var(--lumo-space-xs)*-1) calc(var(--lumo-space-s)*-1);min-width:8em}::slotted([hidden]){display:none!important}[part=content]{box-sizing:border-box;flex:1;position:relative;--vaadin-scroller-padding-block:var(--lumo-space-s);--vaadin-scroller-padding-inline:var(--lumo-space-m);border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}:host([theme~=bordered]){border:1px solid var(--lumo-contrast-20pct);border-radius:var(--lumo-border-radius-l)}:host([loading]) [part=content]{align-items:center;display:flex;justify-content:center}:host([theme~=no-padding]) [part=content]{padding:0!important;--vaadin-scroller-padding-block:0px!important;--vaadin-scroller-padding-inline:0px!important}}:host:before,:root:before{--_lumo-vaadin-tabsheet-inject:1;--_lumo-vaadin-tabsheet-inject-modules:lumo_mixins_loader,lumo_components_tabsheet;--_lumo-vaadin-tabsheet-scroller-inject:1;--_lumo-vaadin-tabsheet-scroller-inject-modules:lumo_components_scroller}@media lumo_components_upload-file{:host{border-radius:var(--vaadin-upload-file-border-radius,var(--lumo-border-radius-s));gap:var(--vaadin-upload-file-gap,0 var(--lumo-space-xs));padding:var(--vaadin-upload-file-padding,var(--lumo-space-s) 0);--_focus-ring-color:var(--vaadin-focus-ring-color,var(--lumo-primary-color-50pct));--_focus-ring-width:var(--vaadin-focus-ring-width,2px)}:host(:focus-visible){outline:var(--_focus-ring-width) solid var(--_focus-ring-color);outline-offset:calc(var(--_focus-ring-width)*-1)}[part=error],[part=status]{color:var(--lumo-secondary-text-color);font-size:var(--lumo-font-size-s)}[part=name]{color:var(--lumo-body-text-color);white-space:nowrap}[part$=icon],[part=commands]{align-self:start}[part$=icon]{font-family:lumo-icons;font-size:var(--lumo-icon-size-m);line-height:1}[part$=button]{border:none;border-radius:var(--lumo-border-radius-s);box-shadow:none;cursor:var(--lumo-clickable-cursor);outline:none;padding:0}[part$=button]:focus{outline:var(--_focus-ring-width) solid var(--_focus-ring-color);outline-offset:calc(var(--_focus-ring-width)*-1)}[part$=button],[part$=icon]{margin-top:calc((1em*var(--lumo-line-height-m) - var(--lumo-icon-size-m))/2)}[part$=button]:before,[part$=icon]:before{background:transparent;height:auto;mask-image:none;width:auto}[part=done-icon]:before{color:var(--lumo-primary-text-color);content:var(--lumo-icons-checkmark)}[part=warning-icon]:before{color:var(--lumo-error-text-color);content:var(--lumo-icons-error)}[part=start-button]:before{content:var(--lumo-icons-play)}[part=retry-button]:before{content:var(--lumo-icons-reload)}[part=remove-button]:before{content:var(--lumo-icons-cross)}[part=error]{color:var(--lumo-error-text-color)}::slotted([slot=progress]){margin-inline-end:calc(var(--lumo-icon-size-m) + var(--lumo-space-xs))}}@media lumo_components_upload-icon{:host{display:inline-block}:host:before{background-color:transparent;content:var(--lumo-icons-upload);font-family:lumo-icons;font-size:var(--lumo-icon-size-m);line-height:1;mask-image:none;vertical-align:-.25em}}@media lumo_components_upload{:host{border:var(--vaadin-upload-border-width,1px) dashed var(--vaadin-upload-border-color,var(--lumo-contrast-20pct));border-radius:var(--vaadin-upload-border-radius,var(--lumo-border-radius-l));line-height:var(--lumo-line-height-m);padding:var(--vaadin-upload-padding,var(--lumo-space-m));transition:background-color .6s,border-color .6s}:host([nodrop]){border:none;border-radius:0;padding:0;transition:none}[part=drop-label]{color:var(--vaadin-upload-drop-label-color,var(--lumo-secondary-text-color));font-family:var(--lumo-font-family);gap:var(--vaadin-upload-drop-label-gap,var(--lumo-space-xs));padding:0 var(--lumo-space-s)}[part=primary-buttons]{gap:0}:host([dragover-valid]){--vaadin-upload-background:var(--lumo-primary-color-10pct);--vaadin-upload-border-color:var(--lumo-primary-color-50pct);transition:background-color .1s,border-color .1s}:host([dragover-valid]) [part=drop-label]{color:var(--lumo-primary-text-color)}:host([disabled]) [part=drop-label],:host([max-files-reached]) [part=drop-label]{color:var(--lumo-disabled-text-color)}}:host:before,:root:before{--_lumo-vaadin-upload-inject:1;--_lumo-vaadin-upload-inject-modules:lumo_components_upload;--_lumo-vaadin-upload-icon-inject:1;--_lumo-vaadin-upload-icon-inject-modules:lumo_components_upload-icon;--_lumo-vaadin-upload-file-inject:1;--_lumo-vaadin-upload-file-inject-modules:lumo_mixins_field-button,lumo_components_upload-file}:where(:host),:where(:root){--vaadin-upload-gap:0;--vaadin-upload-file-list-divider-color:var(
     --lumo-contrast-10pct
-  )}@media lumo_components_vertical-layout{:host([theme~=margin]){margin:var(--vaadin-vertical-layout-margin,var(--lumo-space-m))}:host([theme~=padding]){padding:var(--vaadin-vertical-layout-padding,var(--lumo-space-m))}:host([theme~=spacing-xs]){gap:var(--lumo-space-xs)}:host([theme~=spacing-s]){gap:var(--lumo-space-s)}:host([theme~=spacing]){gap:var(--vaadin-vertical-layout-gap,var(--lumo-space-m))}:host([theme~=spacing-l]){gap:var(--lumo-space-l)}:host([theme~=spacing-xl]){gap:var(--lumo-space-xl)}}:host:before,:root:before{--_lumo-vaadin-vertical-layout-inject:1;--_lumo-vaadin-vertical-layout-inject-modules:lumo_components_vertical-layout}:where(:host),:where(:root){--vaadin-lumo-theme:1}
+  )}:host:before,:root:before{--_lumo-vaadin-upload-button-inject:1;--_lumo-vaadin-upload-button-inject-modules:lumo_components_button}@media lumo_components_vertical-layout{:host([theme~=margin]){margin:var(--vaadin-vertical-layout-margin,var(--lumo-space-m))}:host([theme~=padding]){padding:var(--vaadin-vertical-layout-padding,var(--lumo-space-m))}:host([theme~=spacing-xs]){gap:var(--lumo-space-xs)}:host([theme~=spacing-s]){gap:var(--lumo-space-s)}:host([theme~=spacing]){gap:var(--vaadin-vertical-layout-gap,var(--lumo-space-m))}:host([theme~=spacing-l]){gap:var(--lumo-space-l)}:host([theme~=spacing-xl]){gap:var(--lumo-space-xl)}}:host:before,:root:before{--_lumo-vaadin-vertical-layout-inject:1;--_lumo-vaadin-vertical-layout-inject-modules:lumo_components_vertical-layout}:where(:host),:where(:root){--vaadin-lumo-theme:1}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/vaadin-lumo-styles",
-  "version": "25.1.0-alpha1",
+  "version": "25.1.0-alpha2",
   "publishConfig": {
     "access": "public"
   },
@@ -42,9 +42,9 @@
     "web-component"
   ],
   "dependencies": {
-    "@vaadin/component-base": "25.1.0-alpha1",
-    "@vaadin/icon": "25.1.0-alpha1",
-    "@vaadin/vaadin-themable-mixin": "25.1.0-alpha1"
+    "@vaadin/component-base": "25.1.0-alpha2",
+    "@vaadin/icon": "25.1.0-alpha2",
+    "@vaadin/vaadin-themable-mixin": "25.1.0-alpha2"
   },
   "devDependencies": {
     "cssnano": "^7.1.1",
@@ -52,5 +52,5 @@
     "postcss-cli": "^11.0.1",
     "postcss-import": "^16.1.1"
   },
-  "gitHead": "c789cdd350bcd74b280268a83f5475ad7f2f65e1"
+  "gitHead": "dfeb6e14643ec923e5505ca645f7354c6dc170ec"
 }