@spectrum-web-components/button
Advanced tools
Comparing version 0.2.2 to 0.3.0
@@ -6,2 +6,9 @@ # Change Log | ||
# [0.3.0](https://github.com/adobe/spectrum-web-components/compare/@spectrum-web-components/button@0.2.2...@spectrum-web-components/button@0.3.0) (2019-11-19) | ||
### Features | ||
- use :focus-visable (via polyfill) instead of :focus ([11c6fc7](https://github.com/adobe/spectrum-web-components/commit/11c6fc7)) | ||
- use @adobe/spectrum-css@2.15.1 ([3918888](https://github.com/adobe/spectrum-web-components/commit/3918888)) | ||
## [0.2.2](https://github.com/adobe/spectrum-web-components/compare/@spectrum-web-components/button@0.2.1...@spectrum-web-components/button@0.2.2) (2019-11-01) | ||
@@ -8,0 +15,0 @@ |
@@ -14,12 +14,13 @@ /* | ||
const styles = css ` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;position:relative;height:var(--spectrum-actionbutton-height,var(--spectrum-global-dimension-size-400));min-width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));padding:0 calc(var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)) - var(--spectrum-actionbutton-border-size, 1px));border-radius:var(--spectrum-actionbutton-border-radius,var(--spectrum-global-dimension-size-50));font-size:var(--spectrum-actionbutton-text-size,var(--spectrum-global-dimension-font-size-100));font-weight:var(--spectrum-actionbutton-text-font-weight,400);background-color:var(--spectrum-actionbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-actionbutton-border-size,1px) solid var(--spectrum-actionbutton-border-color,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color,var(--spectrum-global-color-gray-800))}#button:focus{outline:none;background-color:var(--spectrum-actionbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}:host([disabled]) #button{cursor:default;background-color:var(--spectrum-actionbutton-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}::slotted([slot=icon]){max-height:100%;color:var(--spectrum-actionbutton-icon-color,var(--spectrum-global-color-gray-700))}slot[name=icon]+#label{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85));padding-right:calc(var(--spectrum-actionbutton-text-padding-x, | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;position:relative;height:var(--spectrum-actionbutton-height,var(--spectrum-alias-single-line-height));min-width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));padding:0 calc(var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)) - var(--spectrum-actionbutton-border-size, | ||
var(--spectrum-alias-border-size-thin)));border-radius:var(--spectrum-actionbutton-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-actionbutton-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-text-font-weight,var(--spectrum-alias-body-text-font-weight));background-color:var(--spectrum-actionbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-actionbutton-border-size,var(--spectrum-alias-border-size-thin)) solid var(--spectrum-actionbutton-border-color,var(--spectrum-alias-border-color));color:var(--spectrum-actionbutton-text-color,var(--spectrum-alias-text-color))}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}:host([disabled]) #button{cursor:default;background-color:var(--spectrum-actionbutton-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}::slotted([slot=icon]){max-height:100%;color:var(--spectrum-actionbutton-icon-color,var(--spectrum-alias-icon-color))}slot[name=icon]+#label{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85));padding-right:calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-global-dimension-size-150)) - var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)))}.spectrum-Icon--sizeS:only-child{position:absolute;top:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-global-dimension-size-225))/2);left:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-global-dimension-size-225))/2)}#label:only-child{padding:0 calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-alias-workflow-icon-size))/2);left:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-alias-workflow-icon-size))/2)}#label:only-child{padding:0 calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-global-dimension-size-150)) - var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)))}#hold-affordance{position:absolute;right:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40));bottom:var(--spectrum-actionbutton-hold-icon-padding-bottom,var(--spectrum-global-dimension-size-40));color:var(--spectrum-actionbutton-hold-icon-color,var(--spectrum-global-color-gray-700))}#label{align-self:center;justify-self:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#label:empty{display:none}:host([quiet]) #button{border-width:var(--spectrum-actionbutton-quiet-border-size,1px);border-radius:var(--spectrum-actionbutton-quiet-border-radius,var(--spectrum-global-dimension-size-50));font-size:var(--spectrum-actionbutton-quiet-text-size,var(--spectrum-global-dimension-font-size-100));font-weight:var(--spectrum-actionbutton-quiet-text-font-weight,400);background-color:var(--spectrum-actionbutton-quiet-background-color,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color,transparent);color:var(--spectrum-actionbutton-quiet-text-color,var(--spectrum-global-color-gray-800))}#button:hover{background-color:var(--spectrum-actionbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-hover,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-hover,var(--spectrum-global-color-gray-900))}#button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-hover,var(--spectrum-global-color-gray-900))}#button:hover #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-hover,var(--spectrum-global-color-gray-900))}#button:focus ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button:focus #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button:active{background-color:var(--spectrum-actionbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-down,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-down,var(--spectrum-global-color-gray-900))}#button:active #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-down,var(--spectrum-global-color-gray-900))}:host([disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([disabled]) #button #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([selected]) #button{background-color:var(--spectrum-actionbutton-background-color-selected,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color-selected,var(--spectrum-global-color-gray-800))}:host([selected]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected,var(--spectrum-global-color-gray-700))}:host([selected]) #button:focus{background-color:var(--spectrum-actionbutton-background-color-selected-key-focus,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-text-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([selected]) #button:focus ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([selected]) #button:hover{background-color:var(--spectrum-actionbutton-background-color-selected-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-hover,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([selected]) #button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([selected]) #button:active{background-color:var(--spectrum-actionbutton-background-color-selected-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-down,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-down,var(--spectrum-global-color-gray-900))}:host([selected]) #button:active ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-down,var(--spectrum-global-color-gray-900))}:host([selected][disabled]) #button{background-color:var(--spectrum-actionbutton-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-selected-disabled,var(--spectrum-global-color-gray-500))}:host([selected][disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-disabled,var(--spectrum-global-color-gray-400))}:host([quiet]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-hover,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color-hover,transparent);color:var(--spectrum-actionbutton-quiet-text-color-hover,var(--spectrum-global-color-gray-900));box-shadow:none}:host([quiet]) #button:focus{background-color:var(--spectrum-actionbutton-quiet-background-color-key-focus,transparent);box-shadow:0 0 0 var(--spectrum-actionbutton-quiet-border-size-key-focus,2px) var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-global-color-blue-400));border-color:var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-quiet-text-color-key-focus,var(--spectrum-global-color-gray-900))}:host([quiet]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-down,var(--spectrum-global-color-gray-900));box-shadow:none}:host([quiet][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-disabled,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color-disabled,transparent);color:var(--spectrum-actionbutton-quiet-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([quiet][selected]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected,var(--spectrum-global-color-gray-800))}:host([quiet][selected]) #button:focus{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-key-focus,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-quiet-text-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([quiet][selected]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-hover,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-hover,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([quiet][selected]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-down,var(--spectrum-global-color-gray-900))}:host([quiet][selected][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-quiet-text-color-selected-disabled,var(--spectrum-global-color-gray-500))}:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}#button:focus,:host(:focus){outline:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)}:host(.spectrum-Dropdown-trigger) #button{text-align:left}::slotted([slot=icon]){flex-shrink:0} | ||
var(--spectrum-global-dimension-size-85)))}#hold-affordance{position:absolute;right:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40));bottom:var(--spectrum-actionbutton-hold-icon-padding-bottom,var(--spectrum-global-dimension-size-40));color:var(--spectrum-actionbutton-hold-icon-color,var(--spectrum-alias-icon-color))}#label{align-self:center;justify-self:center;text-align:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#label:empty{display:none}:host([quiet]) #button{border-width:var(--spectrum-actionbutton-quiet-border-size,var(--spectrum-alias-border-size-thin));border-radius:var(--spectrum-actionbutton-quiet-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-actionbutton-quiet-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-quiet-text-font-weight,var(--spectrum-alias-body-text-font-weight));background-color:var(--spectrum-actionbutton-quiet-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color,var(--spectrum-alias-text-color))}#button:hover{background-color:var(--spectrum-actionbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-hover,var(--spectrum-alias-border-color-hover));box-shadow:none;color:var(--spectrum-actionbutton-text-color-hover,var(--spectrum-alias-text-color-hover))}#button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-hover,var(--spectrum-alias-icon-color-hover))}#button:hover #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-hover,var(--spectrum-alias-icon-color-hover))}#button.focus-visible{background-color:var(--spectrum-actionbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-text-color-key-focus,var(--spectrum-alias-text-color-hover))}#button.focus-visible ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-key-focus,var(--spectrum-alias-icon-color-focus))}#button.focus-visible #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-key-focus,var(--spectrum-alias-icon-color-hover))}#button:active{background-color:var(--spectrum-actionbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-down,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-down,var(--spectrum-alias-text-color-down))}#button:active #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-down,var(--spectrum-alias-icon-color-down))}:host([disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}:host([disabled]) #button #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}:host([selected]) #button{background-color:var(--spectrum-actionbutton-background-color-selected,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color-selected,var(--spectrum-alias-text-color))}:host([selected]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected,var(--spectrum-alias-icon-color))}:host([selected]) #button.focus-visible{background-color:var(--spectrum-actionbutton-background-color-selected-key-focus,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-text-color-selected-key-focus,var(--spectrum-alias-text-color-hover))}:host([selected]) #button.focus-visible ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-key-focus,var(--spectrum-alias-icon-color-hover))}:host([selected]) #button:hover{background-color:var(--spectrum-actionbutton-background-color-selected-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-hover,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-hover,var(--spectrum-alias-text-color-hover))}:host([selected]) #button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-hover,var(--spectrum-alias-icon-color-hover))}:host([selected]) #button:active{background-color:var(--spectrum-actionbutton-background-color-selected-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-down,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-down,var(--spectrum-alias-text-color-down))}:host([selected]) #button:active ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-down,var(--spectrum-alias-icon-color-down))}:host([selected][disabled]) #button{background-color:var(--spectrum-actionbutton-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-selected-disabled,var(--spectrum-alias-text-color-disabled))}:host([selected][disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-disabled,var(--spectrum-alias-icon-color-disabled))}:host([quiet]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-hover,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color-hover,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color-hover,var(--spectrum-alias-text-color-hover));box-shadow:none}:host([quiet]) #button.focus-visible{background-color:var(--spectrum-actionbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 0 0 1px var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus));border-color:var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-quiet-text-color-key-focus,var(--spectrum-alias-text-color-hover))}:host([quiet]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-down,var(--spectrum-alias-text-color-down));box-shadow:none}:host([quiet][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color-disabled,var(--spectrum-alias-text-color-disabled))}:host([quiet][selected]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected,var(--spectrum-alias-text-color))}:host([quiet][selected]) #button.focus-visible{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-key-focus,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-quiet-text-color-selected-key-focus,var(--spectrum-alias-text-color-hover))}:host([quiet][selected]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-hover,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-hover,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-hover,var(--spectrum-alias-text-color-hover))}:host([quiet][selected]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-down,var(--spectrum-alias-text-color-down))}:host([quiet][selected][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-quiet-text-color-selected-disabled,var(--spectrum-alias-text-color-disabled))}:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)}:host(.spectrum-Dropdown-trigger) #button{text-align:left}::slotted([slot=icon]){flex-shrink:0} | ||
`; | ||
export default styles; | ||
//# sourceMappingURL=action-button.css.js.map |
@@ -14,5 +14,5 @@ /* | ||
const styles = css ` | ||
:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}#button:focus,:host(:focus){outline:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)} | ||
:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)} | ||
`; | ||
export default styles; | ||
//# sourceMappingURL=button-base.css.js.map |
@@ -14,7 +14,8 @@ /* | ||
const styles = css ` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;border-width:var(--spectrum-button-primary-border-size,2px);border-style:solid;border-radius:var(--spectrum-button-primary-border-radius,var(--spectrum-global-dimension-size-200));min-height:var(--spectrum-button-primary-height,var(--spectrum-global-dimension-size-400));height:auto;min-width:var(--spectrum-button-primary-min-width,var(--spectrum-button-cta-min-width));padding:var(--spectrum-global-dimension-size-50) calc(var(--spectrum-button-primary-padding-x, | ||
var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, 2px));padding-bottom:calc(var(--spectrum-global-dimension-size-50) + .5px);padding-top:calc(var(--spectrum-global-dimension-size-50) - .5px);font-size:var(--spectrum-button-primary-text-size,var(--spectrum-global-dimension-font-size-150));font-weight:var(--spectrum-button-primary-text-font-weight,700)}#button:focus{outline:none;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-primary-border-color-key-focus,#1473e6)}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}:host([disabled]) #button{cursor:default}::slotted([slot=icon]){max-height:100%;flex-shrink:0}#button:active,#button:hover{box-shadow:none}slot[name=icon]+#label{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}#label+::slotted([slot=icon]){margin-left:calc(var(--spectrum-button-primary-text-gap, | ||
var(--spectrum-global-dimension-size-100))/2)}#label{align-self:center;justify-self:center;width:100%}#label:empty{display:none}#button:active{box-shadow:none}:host([variant=cta]) #button{background-color:var(--spectrum-button-cta-background-color,#1473e6);border-color:var(--spectrum-button-cta-border-color,#1473e6);color:var(--spectrum-button-cta-text-color,#fff)}:host([variant=cta]) #button:hover{background-color:var(--spectrum-button-cta-background-color-hover,#0d66d0);border-color:var(--spectrum-button-cta-border-color-hover,#0d66d0);color:var(--spectrum-button-cta-text-color-hover,#fff)}:host([variant=cta]) #button:focus{background-color:var(--spectrum-button-cta-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-cta-border-color-key-focus,#1473e6);color:var(--spectrum-button-cta-text-color-key-focus,#fff)}:host([variant=cta]) #button:active{background-color:var(--spectrum-button-cta-background-color-down,#0d66d0);border-color:var(--spectrum-button-cta-border-color-down,#0d66d0);color:var(--spectrum-button-cta-text-color-down,#fff)}:host([variant=cta][disabled]) #button{background-color:var(--spectrum-button-cta-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-cta-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-cta-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=primary]) #button{background-color:var(--spectrum-button-primary-background-color,transparent);border-color:var(--spectrum-button-primary-border-color,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary]) #button:hover{background-color:var(--spectrum-button-primary-background-color-hover,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-primary-border-color-hover,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=primary]) #button:focus{background-color:var(--spectrum-button-primary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-primary-border-color-key-focus,#1473e6);color:var(--spectrum-button-primary-text-color-key-focus,#fff)}:host([variant=primary]) #button:active{background-color:var(--spectrum-button-primary-background-color-down,var(--spectrum-global-color-gray-900));border-color:var(--spectrum-button-primary-border-color-down,var(--spectrum-global-color-gray-900));color:var(--spectrum-button-primary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=primary][disabled]) #button{background-color:var(--spectrum-button-primary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-primary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary]) #button{background-color:var(--spectrum-button-secondary-background-color,transparent);border-color:var(--spectrum-button-secondary-border-color,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary]) #button:hover{background-color:var(--spectrum-button-secondary-background-color-hover,var(--spectrum-global-color-gray-700));border-color:var(--spectrum-button-secondary-border-color-hover,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=secondary]) #button:focus{background-color:var(--spectrum-button-secondary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-secondary-border-color-key-focus,#1473e6);color:var(--spectrum-button-secondary-text-color-key-focus,#fff)}:host([variant=secondary]) #button:active{background-color:var(--spectrum-button-secondary-background-color-down,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-secondary-border-color-down,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-secondary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=secondary][disabled]) #button{background-color:var(--spectrum-button-secondary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-secondary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative]) #button{background-color:var(--spectrum-button-warning-background-color,transparent);border-color:var(--spectrum-button-warning-border-color,var(--spectrum-global-color-red-600));color:var(--spectrum-button-warning-text-color,var(--spectrum-global-color-red-600))}:host([variant=negative]) #button:hover{background-color:var(--spectrum-button-warning-background-color-hover,var(--spectrum-global-color-red-600));border-color:var(--spectrum-button-warning-border-color-hover,var(--spectrum-global-color-red-600));color:var(--spectrum-button-warning-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=negative]) #button:focus{background-color:var(--spectrum-button-warning-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-warning-border-color-key-focus,#1473e6);color:var(--spectrum-button-warning-text-color-key-focus,#fff)}:host([variant=negative]) #button:active{background-color:var(--spectrum-button-warning-background-color-down,var(--spectrum-global-color-red-700));border-color:var(--spectrum-button-warning-border-color-down,var(--spectrum-global-color-red-700));color:var(--spectrum-button-warning-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=negative][disabled]) #button{background-color:var(--spectrum-button-warning-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-warning-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=overBackground]) #button{background-color:var(--spectrum-button-over-background-background-color,transparent);border-color:var(--spectrum-button-over-background-border-color,#fff);color:var(--spectrum-button-over-background-text-color,#fff)}:host([variant=overBackground]) #button:hover{background-color:var(--spectrum-button-over-background-background-color-hover,#fff);border-color:var(--spectrum-button-over-background-border-color-hover,#fff);color:inherit}:host([variant=overBackground]) #button:focus{background-color:var(--spectrum-button-over-background-background-color-key-focus,#fff);border-color:var(--spectrum-button-over-background-border-color-key-focus,#fff);color:inherit;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-over-background-border-color-key-focus,#fff)}:host([variant=overBackground]) #button:active{background-color:var(--spectrum-button-over-background-background-color-down,#fff);border-color:var(--spectrum-button-over-background-border-color-down,#fff);color:inherit;box-shadow:none}:host([variant=overBackground][disabled]) #button{background-color:var(--spectrum-button-over-background-background-color-disabled,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-over-background-border-color-disabled,transparent);color:var(--spectrum-button-over-background-text-color-disabled,hsla(0,0%,100%,.35))}:host([variant=overBackground][quiet]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color,transparent);color:var(--spectrum-button-quiet-over-background-text-color,#fff)}:host([variant=overBackground][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,transparent);color:var(--spectrum-button-quiet-over-background-text-color-hover,#fff)}:host([variant=overBackground][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,#fff);border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff);color:inherit;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff)}:host([variant=overBackground][quiet]) #button:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,transparent);color:var(--spectrum-button-quiet-over-background-text-color-down,#fff);box-shadow:none}:host([variant=overBackground][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,transparent);color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))}:host([variant=primary][quiet]) #button{background-color:var(--spectrum-button-quiet-primary-background-color,transparent);border-color:var(--spectrum-button-quiet-primary-border-color,transparent);color:var(--spectrum-button-quiet-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-primary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-primary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-primary-text-color-hover,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-primary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-primary-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-primary-text-color-key-focus,#fff)}:host([variant=primary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-primary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-primary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-primary-text-color-down,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-primary-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-primary-border-color-disabled,transparent);color:var(--spectrum-button-quiet-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary][quiet]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color,transparent);border-color:var(--spectrum-button-quiet-secondary-border-color,transparent);color:var(--spectrum-button-quiet-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-secondary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-secondary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-secondary-text-color-hover,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-secondary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-secondary-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-secondary-text-color-key-focus,#fff)}:host([variant=secondary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-secondary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-secondary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-secondary-text-color-down,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-secondary-border-color-disabled,transparent);color:var(--spectrum-button-quiet-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative][quiet]) #button{background-color:var(--spectrum-button-quiet-warning-background-color,transparent);border-color:var(--spectrum-button-quiet-warning-border-color,transparent);color:var(--spectrum-button-quiet-warning-text-color,var(--spectrum-global-color-red-500))}:host([variant=negative][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-warning-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-warning-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-warning-text-color-hover,var(--spectrum-global-color-red-600))}:host([variant=negative][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-warning-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-warning-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-warning-text-color-key-focus,#fff)}:host([variant=negative][quiet]) #button:active{background-color:var(--spectrum-button-quiet-warning-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-warning-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-warning-text-color-down,var(--spectrum-global-color-red-600))}:host([variant=negative][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-warning-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-warning-border-color-disabled,transparent);color:var(--spectrum-button-quiet-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}#button:focus,:host(:focus){outline:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)} | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;border-width:var(--spectrum-button-primary-border-size,var(--spectrum-alias-border-size-thick));border-style:solid;border-radius:var(--spectrum-button-primary-border-radius,var(--spectrum-alias-border-radius-large));min-height:var(--spectrum-button-primary-height,var(--spectrum-alias-single-line-height));height:auto;min-width:var(--spectrum-button-primary-min-width);padding:var(--spectrum-global-dimension-size-50) calc(var(--spectrum-button-primary-padding-x, | ||
var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, | ||
var(--spectrum-alias-border-size-thick)));padding-bottom:calc(var(--spectrum-global-dimension-size-50) + .5px);padding-top:calc(var(--spectrum-global-dimension-size-50) - .5px);font-size:var(--spectrum-button-primary-text-size,var(--spectrum-alias-pill-button-text-size));font-weight:var(--spectrum-button-primary-text-font-weight,var(--spectrum-global-font-weight-bold))}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}:host([disabled]) #button{cursor:default}::slotted([slot=icon]){max-height:100%;flex-shrink:0}#button:active,#button:hover{box-shadow:none}slot[name=icon]+#label{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}#label+::slotted([slot=icon]){margin-left:calc(var(--spectrum-button-primary-text-gap, | ||
var(--spectrum-global-dimension-size-100))/2)}#label{align-self:center;justify-self:center;text-align:center;width:100%}#label:empty{display:none}#button.focus-visible{box-shadow:0 0 0 1px var(--spectrum-button-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus))}#button:active{box-shadow:none}:host([variant=cta]) #button{background-color:var(--spectrum-button-cta-background-color,var(--spectrum-semantic-cta-color-background-default));border-color:var(--spectrum-button-cta-border-color,var(--spectrum-semantic-cta-color-background-default));color:var(--spectrum-button-cta-text-color,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button:hover{background-color:var(--spectrum-button-cta-background-color-hover,var(--spectrum-semantic-cta-color-background-hover));border-color:var(--spectrum-button-cta-border-color-hover,var(--spectrum-semantic-cta-color-background-hover));color:var(--spectrum-button-cta-text-color-hover,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button.focus-visible{background-color:var(--spectrum-button-cta-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-cta-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-cta-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button:active{background-color:var(--spectrum-button-cta-background-color-down,var(--spectrum-semantic-cta-color-background-down));border-color:var(--spectrum-button-cta-border-color-down,var(--spectrum-semantic-cta-color-background-down));color:var(--spectrum-button-cta-text-color-down,var(--spectrum-global-color-static-white))}:host([variant=cta][disabled]) #button{background-color:var(--spectrum-button-cta-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-cta-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-cta-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=primary]) #button{background-color:var(--spectrum-button-primary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-primary-border-color,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary]) #button:hover{background-color:var(--spectrum-button-primary-background-color-hover,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-primary-border-color-hover,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=primary]) #button.focus-visible{background-color:var(--spectrum-button-primary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-primary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=primary]) #button:active{background-color:var(--spectrum-button-primary-background-color-down,var(--spectrum-global-color-gray-900));border-color:var(--spectrum-button-primary-border-color-down,var(--spectrum-global-color-gray-900));color:var(--spectrum-button-primary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=primary][disabled]) #button{background-color:var(--spectrum-button-primary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-primary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary]) #button{background-color:var(--spectrum-button-secondary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-secondary-border-color,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary]) #button:hover{background-color:var(--spectrum-button-secondary-background-color-hover,var(--spectrum-global-color-gray-700));border-color:var(--spectrum-button-secondary-border-color-hover,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=secondary]) #button.focus-visible{background-color:var(--spectrum-button-secondary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-secondary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-secondary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=secondary]) #button:active{background-color:var(--spectrum-button-secondary-background-color-down,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-secondary-border-color-down,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-secondary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=secondary][disabled]) #button{background-color:var(--spectrum-button-secondary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-secondary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative]) #button{background-color:var(--spectrum-button-warning-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-warning-border-color,var(--spectrum-semantic-negative-color-text-small));color:var(--spectrum-button-warning-text-color,var(--spectrum-semantic-negative-color-text-small))}:host([variant=negative]) #button:hover{background-color:var(--spectrum-button-warning-background-color-hover,var(--spectrum-semantic-negative-color-text-small));border-color:var(--spectrum-button-warning-border-color-hover,var(--spectrum-semantic-negative-color-text-small));color:var(--spectrum-button-warning-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=negative]) #button.focus-visible{background-color:var(--spectrum-button-warning-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-warning-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-warning-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=negative]) #button:active{background-color:var(--spectrum-button-warning-background-color-down,var(--spectrum-global-color-red-700));border-color:var(--spectrum-button-warning-border-color-down,var(--spectrum-global-color-red-700));color:var(--spectrum-button-warning-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=negative][disabled]) #button{background-color:var(--spectrum-button-warning-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-warning-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=overBackground]) #button{background-color:var(--spectrum-button-over-background-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-over-background-border-color,var(--spectrum-global-color-static-white));color:var(--spectrum-button-over-background-text-color,var(--spectrum-global-color-static-white))}:host([variant=overBackground]) #button:hover{background-color:var(--spectrum-button-over-background-background-color-hover,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-hover,var(--spectrum-global-color-static-white));color:inherit}:host([variant=overBackground]) #button.focus-visible{background-color:var(--spectrum-button-over-background-background-color-key-focus,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-key-focus,var(--spectrum-global-color-static-white));color:inherit;box-shadow:0 0 0 1px var(--spectrum-button-over-background-border-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=overBackground]) #button:active{background-color:var(--spectrum-button-over-background-background-color-down,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-down,var(--spectrum-global-color-static-white));color:inherit;box-shadow:none}:host([variant=overBackground][disabled]) #button{background-color:var(--spectrum-button-over-background-background-color-disabled,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-over-background-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-over-background-text-color-disabled,hsla(0,0%,100%,.35))}:host([variant=overBackground][quiet]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-hover,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white));color:inherit;box-shadow:0 0 0 1px var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-down,var(--spectrum-global-color-static-white));box-shadow:none}:host([variant=overBackground][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))}:host([variant=primary][quiet]) #button{background-color:var(--spectrum-button-quiet-primary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-primary-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-primary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-primary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-primary-text-color-hover,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-primary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-primary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=primary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-primary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-primary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-primary-text-color-down,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-primary-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-primary-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary][quiet]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-secondary-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-secondary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-secondary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-secondary-text-color-hover,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-secondary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-secondary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-secondary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=secondary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-secondary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-secondary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-secondary-text-color-down,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-secondary-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative][quiet]) #button{background-color:var(--spectrum-button-quiet-warning-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-warning-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-warning-text-color,var(--spectrum-semantic-negative-color-text-small))}:host([variant=negative][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-warning-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-warning-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-warning-text-color-hover,var(--spectrum-global-color-red-700))}:host([variant=negative][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-warning-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-warning-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-warning-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=negative][quiet]) #button:active{background-color:var(--spectrum-button-quiet-warning-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-warning-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-warning-text-color-down,var(--spectrum-global-color-red-700))}:host([variant=negative][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-warning-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-warning-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)} | ||
`; | ||
export default styles; | ||
//# sourceMappingURL=button.css.js.map |
@@ -14,5 +14,5 @@ /* | ||
const styles = css ` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;border-style:solid;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;height:var(--spectrum-dropdown-height,var(--spectrum-global-dimension-size-400));font-family:inherit;font-weight:400;font-size:var(--spectrum-dropdown-text-size,var(--spectrum-global-dimension-font-size-100));line-height:normal;-webkit-font-smoothing:initial;cursor:pointer;margin:0;padding:0 var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));border-radius:var(--spectrum-global-dimension-size-50);transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-global-color-gray-800));background-color:var(--spectrum-fieldbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-dropdown-border-size,1px) solid var(--spectrum-fieldbutton-border-color,var(--spectrum-global-color-gray-300))}#button,#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}#button:disabled{cursor:default}.icon{max-height:100%;flex-shrink:0}#button.is-disabled,#button:disabled{border-width:0;cursor:default}#button.is-open{border-width:var(--spectrum-dropdown-border-size,1px)}.spectrum-FieldButton--quiet{margin:0;padding:0;border-width:0;border-radius:var(--spectrum-fieldbutton-quiet-border-radius,0);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-fieldbutton-quiet-border-color,transparent);background-color:var(--spectrum-fieldbutton-quiet-background-color,transparent)}#button:hover{color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-global-color-gray-900));background-color:var(--spectrum-fieldbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-hover,var(--spectrum-global-color-gray-400))}#button.is-focused,#button:focus{background-color:var(--spectrum-fieldbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-fieldbutton-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button.is-focused.is-placeholder,#button:focus.is-placeholder{color:var(--spectrum-fieldbutton-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button.is-selected,#button:active{background-color:var(--spectrum-fieldbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-fieldbutton-border-color-down,var(--spectrum-global-color-gray-400))}#button.is-selected.is-focused,#button.is-selected:focus,#button:active.is-focused,#button:active:focus{box-shadow:none}:host([invalid]) #button{border-color:var(--spectrum-fieldbutton-border-color-error,var(--spectrum-global-color-red-500))}:host([invalid]) #button:hover{border-color:var(--spectrum-fieldbutton-border-color-error-hover,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-selected,:host([invalid]) #button:active{border-color:var(--spectrum-fieldbutton-border-color-error-down,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-focused,:host([invalid]) #button:focus{border-color:var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-fieldbutton-background-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}#button.is-disabled:focus,#button:disabled:focus{box-shadow:none}#button.is-disabled .icon,#button:disabled .icon{color:var(--spectrum-fieldbutton-icon-color-disabled,var(--spectrum-global-color-gray-400))}.spectrum-FieldButton--quiet:hover{background-color:var(--spectrum-fieldbutton-quiet-background-color-hover,transparent);color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-global-color-gray-900))}.spectrum-FieldButton--quiet.is-focused,.spectrum-FieldButton--quiet:focus{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,transparent);box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400))}.spectrum-FieldButton--quiet.is-focused.is-placeholder,.spectrum-FieldButton--quiet:focus.is-placeholder{color:var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}.spectrum-FieldButton--quiet.is-selected,.spectrum-FieldButton--quiet:active{background-color:var(--spectrum-fieldbutton-quiet-background-color-down,transparent);border-color:var(--spectrum-fieldbutton-quiet-border-color-down,transparent)}.spectrum-FieldButton--quiet.is-selected.is-focused,.spectrum-FieldButton--quiet.is-selected:focus,.spectrum-FieldButton--quiet:active.is-focused,.spectrum-FieldButton--quiet:active:focus{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,transparent);box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400))}:host([invalid]) .spectrum-FieldButton--quiet.is-focused,:host([invalid]) .spectrum-FieldButton--quiet:focus{box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400))}.spectrum-FieldButton--quiet.is-disabled,.spectrum-FieldButton--quiet:disabled{background-color:var(--spectrum-fieldbutton-quiet-background-color-disabled,transparent);color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}.spectrum-FieldButton--quiet.is-disabled:focus,.spectrum-FieldButton--quiet:disabled:focus{box-shadow:none} | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;border-style:solid;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;height:var(--spectrum-dropdown-height,var(--spectrum-global-dimension-size-400));font-family:inherit;font-weight:400;font-size:var(--spectrum-dropdown-text-size,var(--spectrum-alias-font-size-default));line-height:normal;-webkit-font-smoothing:initial;cursor:pointer;margin:0;padding:0 var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));border-radius:var(--spectrum-global-dimension-size-50);transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-alias-text-color));background-color:var(--spectrum-fieldbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin)) solid var(--spectrum-fieldbutton-border-color,var(--spectrum-global-color-gray-300))}#button,#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:disabled{cursor:default}.icon{max-height:100%;flex-shrink:0}#button.is-disabled,#button:disabled{border-width:0;cursor:default}#button.is-open{border-width:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin))}.spectrum-FieldButton--quiet{margin:0;padding:0;border-width:0;border-radius:var(--spectrum-fieldbutton-quiet-border-radius,0);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-alias-text-color));border-color:var(--spectrum-fieldbutton-quiet-border-color,var(--spectrum-alias-border-color-transparent));background-color:var(--spectrum-fieldbutton-quiet-background-color,var(--spectrum-alias-background-color-transparent))}#button:hover{color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-alias-text-color-hover));background-color:var(--spectrum-fieldbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-hover,var(--spectrum-global-color-gray-400))}#button.focus-visible,#button.is-focused{background-color:var(--spectrum-fieldbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-fieldbutton-text-color-key-focus,var(--spectrum-alias-text-color-hover))}#button.focus-visible.is-placeholder,#button.is-focused.is-placeholder{color:var(--spectrum-fieldbutton-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover))}#button.is-selected,#button:active{background-color:var(--spectrum-fieldbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-fieldbutton-border-color-down,var(--spectrum-global-color-gray-400))}#button.is-selected.focus-visible,#button.is-selected.is-focused,#button:active.focus-visible,#button:active.is-focused{box-shadow:none}:host([invalid]) #button{border-color:var(--spectrum-fieldbutton-border-color-error,var(--spectrum-global-color-red-500))}:host([invalid]) #button:hover{border-color:var(--spectrum-fieldbutton-border-color-error-hover,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-selected,:host([invalid]) #button:active{border-color:var(--spectrum-fieldbutton-border-color-error-down,var(--spectrum-global-color-red-600))}:host([invalid]) #button.focus-visible,:host([invalid]) #button.is-focused{border-color:var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-fieldbutton-background-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}#button.is-disabled.focus-visible,#button:disabled.focus-visible{box-shadow:none}#button.is-disabled .icon,#button:disabled .icon{color:var(--spectrum-fieldbutton-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}.spectrum-FieldButton--quiet:hover{background-color:var(--spectrum-fieldbutton-quiet-background-color-hover,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-alias-text-color-hover))}.spectrum-FieldButton--quiet.focus-visible,.spectrum-FieldButton--quiet.is-focused{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-FieldButton--quiet.focus-visible.is-placeholder,.spectrum-FieldButton--quiet.is-focused.is-placeholder{color:var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover))}.spectrum-FieldButton--quiet.is-selected,.spectrum-FieldButton--quiet:active{background-color:var(--spectrum-fieldbutton-quiet-background-color-down,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-fieldbutton-quiet-border-color-down,var(--spectrum-alias-border-color-transparent))}.spectrum-FieldButton--quiet.is-selected.focus-visible,.spectrum-FieldButton--quiet.is-selected.is-focused,.spectrum-FieldButton--quiet:active.focus-visible,.spectrum-FieldButton--quiet:active.is-focused{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus))}:host([invalid]) .spectrum-FieldButton--quiet.focus-visible,:host([invalid]) .spectrum-FieldButton--quiet.is-focused{box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-FieldButton--quiet.is-disabled,.spectrum-FieldButton--quiet:disabled{background-color:var(--spectrum-fieldbutton-quiet-background-color-disabled,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-FieldButton--quiet.is-disabled.focus-visible,.spectrum-FieldButton--quiet:disabled.focus-visible{box-shadow:none} | ||
`; | ||
export default styles; | ||
//# sourceMappingURL=field-button.css.js.map |
@@ -14,12 +14,13 @@ /* | ||
const styles = css ` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;position:relative;height:var(--spectrum-actionbutton-height,var(--spectrum-global-dimension-size-400));min-width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));padding:0 calc(var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)) - var(--spectrum-actionbutton-border-size, 1px));border-radius:var(--spectrum-actionbutton-border-radius,var(--spectrum-global-dimension-size-50));font-size:var(--spectrum-actionbutton-text-size,var(--spectrum-global-dimension-font-size-100));font-weight:var(--spectrum-actionbutton-text-font-weight,400);background-color:var(--spectrum-actionbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-actionbutton-border-size,1px) solid var(--spectrum-actionbutton-border-color,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color,var(--spectrum-global-color-gray-800))}#button:focus{outline:none;background-color:var(--spectrum-actionbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}:host([disabled]) #button{cursor:default;background-color:var(--spectrum-actionbutton-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}::slotted([slot=icon]){max-height:100%;flex-shrink:0;color:var(--spectrum-actionbutton-icon-color,var(--spectrum-global-color-gray-700))}slot[name=icon]+#label{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85));padding-right:calc(var(--spectrum-actionbutton-text-padding-x, | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;position:relative;height:var(--spectrum-actionbutton-height,var(--spectrum-alias-single-line-height));min-width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));padding:0 calc(var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)) - var(--spectrum-actionbutton-border-size, | ||
var(--spectrum-alias-border-size-thin)));border-radius:var(--spectrum-actionbutton-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-actionbutton-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-text-font-weight,var(--spectrum-alias-body-text-font-weight));background-color:var(--spectrum-actionbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-actionbutton-border-size,var(--spectrum-alias-border-size-thin)) solid var(--spectrum-actionbutton-border-color,var(--spectrum-alias-border-color));color:var(--spectrum-actionbutton-text-color,var(--spectrum-alias-text-color))}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}:host([disabled]) #button{cursor:default;background-color:var(--spectrum-actionbutton-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}::slotted([slot=icon]){max-height:100%;flex-shrink:0;color:var(--spectrum-actionbutton-icon-color,var(--spectrum-alias-icon-color))}slot[name=icon]+#label{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85));padding-right:calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-global-dimension-size-150)) - var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)))}.spectrum-Icon--sizeS:only-child{position:absolute;top:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-global-dimension-size-225))/2);left:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-global-dimension-size-225))/2)}#label:only-child{padding:0 calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-alias-workflow-icon-size))/2);left:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-alias-workflow-icon-size))/2)}#label:only-child{padding:0 calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-global-dimension-size-150)) - var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)))}#hold-affordance{position:absolute;right:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40));bottom:var(--spectrum-actionbutton-hold-icon-padding-bottom,var(--spectrum-global-dimension-size-40));color:var(--spectrum-actionbutton-hold-icon-color,var(--spectrum-global-color-gray-700))}#label{align-self:center;justify-self:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#label:empty{display:none}:host([quiet]) #button{border-width:var(--spectrum-actionbutton-quiet-border-size,1px);border-radius:var(--spectrum-actionbutton-quiet-border-radius,var(--spectrum-global-dimension-size-50));font-size:var(--spectrum-actionbutton-quiet-text-size,var(--spectrum-global-dimension-font-size-100));font-weight:var(--spectrum-actionbutton-quiet-text-font-weight,400);background-color:var(--spectrum-actionbutton-quiet-background-color,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color,transparent);color:var(--spectrum-actionbutton-quiet-text-color,var(--spectrum-global-color-gray-800))}#button:hover{background-color:var(--spectrum-actionbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-hover,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-hover,var(--spectrum-global-color-gray-900))}#button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-hover,var(--spectrum-global-color-gray-900))}#button:hover #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-hover,var(--spectrum-global-color-gray-900))}#button:focus ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button:focus #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button:active{background-color:var(--spectrum-actionbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-down,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-down,var(--spectrum-global-color-gray-900))}#button:active #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-down,var(--spectrum-global-color-gray-900))}:host([disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([disabled]) #button #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([selected]) #button{background-color:var(--spectrum-actionbutton-background-color-selected,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color-selected,var(--spectrum-global-color-gray-800))}:host([selected]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected,var(--spectrum-global-color-gray-700))}:host([selected]) #button:focus{background-color:var(--spectrum-actionbutton-background-color-selected-key-focus,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-text-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([selected]) #button:focus ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([selected]) #button:hover{background-color:var(--spectrum-actionbutton-background-color-selected-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-hover,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([selected]) #button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([selected]) #button:active{background-color:var(--spectrum-actionbutton-background-color-selected-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-down,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-down,var(--spectrum-global-color-gray-900))}:host([selected]) #button:active ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-down,var(--spectrum-global-color-gray-900))}:host([selected][disabled]) #button{background-color:var(--spectrum-actionbutton-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-selected-disabled,var(--spectrum-global-color-gray-500))}:host([selected][disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-disabled,var(--spectrum-global-color-gray-400))}:host([quiet]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-hover,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color-hover,transparent);color:var(--spectrum-actionbutton-quiet-text-color-hover,var(--spectrum-global-color-gray-900));box-shadow:none}:host([quiet]) #button:focus{background-color:var(--spectrum-actionbutton-quiet-background-color-key-focus,transparent);box-shadow:0 0 0 var(--spectrum-actionbutton-quiet-border-size-key-focus,2px) var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-global-color-blue-400));border-color:var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-quiet-text-color-key-focus,var(--spectrum-global-color-gray-900))}:host([quiet]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-down,var(--spectrum-global-color-gray-900));box-shadow:none}:host([quiet][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-disabled,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color-disabled,transparent);color:var(--spectrum-actionbutton-quiet-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([quiet][selected]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected,var(--spectrum-global-color-gray-800))}:host([quiet][selected]) #button:focus{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-key-focus,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-quiet-text-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([quiet][selected]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-hover,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-hover,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([quiet][selected]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-down,var(--spectrum-global-color-gray-900))}:host([quiet][selected][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-quiet-text-color-selected-disabled,var(--spectrum-global-color-gray-500))} | ||
var(--spectrum-global-dimension-size-85)))}#hold-affordance{position:absolute;right:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40));bottom:var(--spectrum-actionbutton-hold-icon-padding-bottom,var(--spectrum-global-dimension-size-40));color:var(--spectrum-actionbutton-hold-icon-color,var(--spectrum-alias-icon-color))}#label{align-self:center;justify-self:center;text-align:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#label:empty{display:none}:host([quiet]) #button{border-width:var(--spectrum-actionbutton-quiet-border-size,var(--spectrum-alias-border-size-thin));border-radius:var(--spectrum-actionbutton-quiet-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-actionbutton-quiet-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-quiet-text-font-weight,var(--spectrum-alias-body-text-font-weight));background-color:var(--spectrum-actionbutton-quiet-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color,var(--spectrum-alias-text-color))}#button:hover{background-color:var(--spectrum-actionbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-hover,var(--spectrum-alias-border-color-hover));box-shadow:none;color:var(--spectrum-actionbutton-text-color-hover,var(--spectrum-alias-text-color-hover))}#button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-hover,var(--spectrum-alias-icon-color-hover))}#button:hover #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-hover,var(--spectrum-alias-icon-color-hover))}#button.focus-visible{background-color:var(--spectrum-actionbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-text-color-key-focus,var(--spectrum-alias-text-color-hover))}#button.focus-visible ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-key-focus,var(--spectrum-alias-icon-color-focus))}#button.focus-visible #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-key-focus,var(--spectrum-alias-icon-color-hover))}#button:active{background-color:var(--spectrum-actionbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-down,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-down,var(--spectrum-alias-text-color-down))}#button:active #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-down,var(--spectrum-alias-icon-color-down))}:host([disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}:host([disabled]) #button #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}:host([selected]) #button{background-color:var(--spectrum-actionbutton-background-color-selected,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color-selected,var(--spectrum-alias-text-color))}:host([selected]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected,var(--spectrum-alias-icon-color))}:host([selected]) #button.focus-visible{background-color:var(--spectrum-actionbutton-background-color-selected-key-focus,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-text-color-selected-key-focus,var(--spectrum-alias-text-color-hover))}:host([selected]) #button.focus-visible ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-key-focus,var(--spectrum-alias-icon-color-hover))}:host([selected]) #button:hover{background-color:var(--spectrum-actionbutton-background-color-selected-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-hover,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-hover,var(--spectrum-alias-text-color-hover))}:host([selected]) #button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-hover,var(--spectrum-alias-icon-color-hover))}:host([selected]) #button:active{background-color:var(--spectrum-actionbutton-background-color-selected-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-down,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-down,var(--spectrum-alias-text-color-down))}:host([selected]) #button:active ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-down,var(--spectrum-alias-icon-color-down))}:host([selected][disabled]) #button{background-color:var(--spectrum-actionbutton-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-selected-disabled,var(--spectrum-alias-text-color-disabled))}:host([selected][disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-disabled,var(--spectrum-alias-icon-color-disabled))}:host([quiet]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-hover,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color-hover,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color-hover,var(--spectrum-alias-text-color-hover));box-shadow:none}:host([quiet]) #button.focus-visible{background-color:var(--spectrum-actionbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 0 0 1px var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus));border-color:var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-quiet-text-color-key-focus,var(--spectrum-alias-text-color-hover))}:host([quiet]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-down,var(--spectrum-alias-text-color-down));box-shadow:none}:host([quiet][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color-disabled,var(--spectrum-alias-text-color-disabled))}:host([quiet][selected]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected,var(--spectrum-alias-text-color))}:host([quiet][selected]) #button.focus-visible{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-key-focus,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-quiet-text-color-selected-key-focus,var(--spectrum-alias-text-color-hover))}:host([quiet][selected]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-hover,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-hover,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-hover,var(--spectrum-alias-text-color-hover))}:host([quiet][selected]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-down,var(--spectrum-alias-text-color-down))}:host([quiet][selected][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-quiet-text-color-selected-disabled,var(--spectrum-alias-text-color-disabled))} | ||
`; | ||
export default styles; | ||
//# sourceMappingURL=spectrum-action-button.css.js.map |
@@ -14,7 +14,8 @@ /* | ||
const styles = css ` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;border-width:var(--spectrum-button-primary-border-size,2px);border-style:solid;border-radius:var(--spectrum-button-primary-border-radius,var(--spectrum-global-dimension-size-200));min-height:var(--spectrum-button-primary-height,var(--spectrum-global-dimension-size-400));height:auto;min-width:var(--spectrum-button-primary-min-width,var(--spectrum-button-cta-min-width));padding:var(--spectrum-global-dimension-size-50) calc(var(--spectrum-button-primary-padding-x, | ||
var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, 2px));padding-bottom:calc(var(--spectrum-global-dimension-size-50) + .5px);padding-top:calc(var(--spectrum-global-dimension-size-50) - .5px);font-size:var(--spectrum-button-primary-text-size,var(--spectrum-global-dimension-font-size-150));font-weight:var(--spectrum-button-primary-text-font-weight,700)}#button:focus{outline:none;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-primary-border-color-key-focus,#1473e6)}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}:host([disabled]) #button{cursor:default}::slotted([slot=icon]){max-height:100%;flex-shrink:0}#button:active,#button:hover{box-shadow:none}slot[name=icon]+#label{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}#label+::slotted([slot=icon]){margin-left:calc(var(--spectrum-button-primary-text-gap, | ||
var(--spectrum-global-dimension-size-100))/2)}#label{align-self:center;justify-self:center;width:100%}#label:empty{display:none}#button:active{box-shadow:none}:host([variant=cta]) #button{background-color:var(--spectrum-button-cta-background-color,#1473e6);border-color:var(--spectrum-button-cta-border-color,#1473e6);color:var(--spectrum-button-cta-text-color,#fff)}:host([variant=cta]) #button:hover{background-color:var(--spectrum-button-cta-background-color-hover,#0d66d0);border-color:var(--spectrum-button-cta-border-color-hover,#0d66d0);color:var(--spectrum-button-cta-text-color-hover,#fff)}:host([variant=cta]) #button:focus{background-color:var(--spectrum-button-cta-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-cta-border-color-key-focus,#1473e6);color:var(--spectrum-button-cta-text-color-key-focus,#fff)}:host([variant=cta]) #button:active{background-color:var(--spectrum-button-cta-background-color-down,#0d66d0);border-color:var(--spectrum-button-cta-border-color-down,#0d66d0);color:var(--spectrum-button-cta-text-color-down,#fff)}:host([variant=cta][disabled]) #button{background-color:var(--spectrum-button-cta-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-cta-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-cta-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=primary]) #button{background-color:var(--spectrum-button-primary-background-color,transparent);border-color:var(--spectrum-button-primary-border-color,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary]) #button:hover{background-color:var(--spectrum-button-primary-background-color-hover,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-primary-border-color-hover,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=primary]) #button:focus{background-color:var(--spectrum-button-primary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-primary-border-color-key-focus,#1473e6);color:var(--spectrum-button-primary-text-color-key-focus,#fff)}:host([variant=primary]) #button:active{background-color:var(--spectrum-button-primary-background-color-down,var(--spectrum-global-color-gray-900));border-color:var(--spectrum-button-primary-border-color-down,var(--spectrum-global-color-gray-900));color:var(--spectrum-button-primary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=primary][disabled]) #button{background-color:var(--spectrum-button-primary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-primary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary]) #button{background-color:var(--spectrum-button-secondary-background-color,transparent);border-color:var(--spectrum-button-secondary-border-color,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary]) #button:hover{background-color:var(--spectrum-button-secondary-background-color-hover,var(--spectrum-global-color-gray-700));border-color:var(--spectrum-button-secondary-border-color-hover,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=secondary]) #button:focus{background-color:var(--spectrum-button-secondary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-secondary-border-color-key-focus,#1473e6);color:var(--spectrum-button-secondary-text-color-key-focus,#fff)}:host([variant=secondary]) #button:active{background-color:var(--spectrum-button-secondary-background-color-down,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-secondary-border-color-down,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-secondary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=secondary][disabled]) #button{background-color:var(--spectrum-button-secondary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-secondary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative]) #button{background-color:var(--spectrum-button-warning-background-color,transparent);border-color:var(--spectrum-button-warning-border-color,var(--spectrum-global-color-red-600));color:var(--spectrum-button-warning-text-color,var(--spectrum-global-color-red-600))}:host([variant=negative]) #button:hover{background-color:var(--spectrum-button-warning-background-color-hover,var(--spectrum-global-color-red-600));border-color:var(--spectrum-button-warning-border-color-hover,var(--spectrum-global-color-red-600));color:var(--spectrum-button-warning-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=negative]) #button:focus{background-color:var(--spectrum-button-warning-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-warning-border-color-key-focus,#1473e6);color:var(--spectrum-button-warning-text-color-key-focus,#fff)}:host([variant=negative]) #button:active{background-color:var(--spectrum-button-warning-background-color-down,var(--spectrum-global-color-red-700));border-color:var(--spectrum-button-warning-border-color-down,var(--spectrum-global-color-red-700));color:var(--spectrum-button-warning-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=negative][disabled]) #button{background-color:var(--spectrum-button-warning-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-warning-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=overBackground]) #button{background-color:var(--spectrum-button-over-background-background-color,transparent);border-color:var(--spectrum-button-over-background-border-color,#fff);color:var(--spectrum-button-over-background-text-color,#fff)}:host([variant=overBackground]) #button:hover{background-color:var(--spectrum-button-over-background-background-color-hover,#fff);border-color:var(--spectrum-button-over-background-border-color-hover,#fff);color:inherit}:host([variant=overBackground]) #button:focus{background-color:var(--spectrum-button-over-background-background-color-key-focus,#fff);border-color:var(--spectrum-button-over-background-border-color-key-focus,#fff);color:inherit;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-over-background-border-color-key-focus,#fff)}:host([variant=overBackground]) #button:active{background-color:var(--spectrum-button-over-background-background-color-down,#fff);border-color:var(--spectrum-button-over-background-border-color-down,#fff);color:inherit;box-shadow:none}:host([variant=overBackground][disabled]) #button{background-color:var(--spectrum-button-over-background-background-color-disabled,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-over-background-border-color-disabled,transparent);color:var(--spectrum-button-over-background-text-color-disabled,hsla(0,0%,100%,.35))}:host([variant=overBackground][quiet]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color,transparent);color:var(--spectrum-button-quiet-over-background-text-color,#fff)}:host([variant=overBackground][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,transparent);color:var(--spectrum-button-quiet-over-background-text-color-hover,#fff)}:host([variant=overBackground][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,#fff);border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff);color:inherit;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff)}:host([variant=overBackground][quiet]) #button:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,transparent);color:var(--spectrum-button-quiet-over-background-text-color-down,#fff);box-shadow:none}:host([variant=overBackground][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,transparent);color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))}:host([variant=primary][quiet]) #button{background-color:var(--spectrum-button-quiet-primary-background-color,transparent);border-color:var(--spectrum-button-quiet-primary-border-color,transparent);color:var(--spectrum-button-quiet-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-primary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-primary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-primary-text-color-hover,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-primary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-primary-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-primary-text-color-key-focus,#fff)}:host([variant=primary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-primary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-primary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-primary-text-color-down,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-primary-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-primary-border-color-disabled,transparent);color:var(--spectrum-button-quiet-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary][quiet]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color,transparent);border-color:var(--spectrum-button-quiet-secondary-border-color,transparent);color:var(--spectrum-button-quiet-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-secondary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-secondary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-secondary-text-color-hover,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-secondary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-secondary-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-secondary-text-color-key-focus,#fff)}:host([variant=secondary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-secondary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-secondary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-secondary-text-color-down,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-secondary-border-color-disabled,transparent);color:var(--spectrum-button-quiet-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative][quiet]) #button{background-color:var(--spectrum-button-quiet-warning-background-color,transparent);border-color:var(--spectrum-button-quiet-warning-border-color,transparent);color:var(--spectrum-button-quiet-warning-text-color,var(--spectrum-global-color-red-500))}:host([variant=negative][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-warning-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-warning-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-warning-text-color-hover,var(--spectrum-global-color-red-600))}:host([variant=negative][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-warning-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-warning-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-warning-text-color-key-focus,#fff)}:host([variant=negative][quiet]) #button:active{background-color:var(--spectrum-button-quiet-warning-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-warning-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-warning-text-color-down,var(--spectrum-global-color-red-600))}:host([variant=negative][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-warning-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-warning-border-color-disabled,transparent);color:var(--spectrum-button-quiet-warning-text-color-disabled,var(--spectrum-global-color-gray-500))} | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;border-width:var(--spectrum-button-primary-border-size,var(--spectrum-alias-border-size-thick));border-style:solid;border-radius:var(--spectrum-button-primary-border-radius,var(--spectrum-alias-border-radius-large));min-height:var(--spectrum-button-primary-height,var(--spectrum-alias-single-line-height));height:auto;min-width:var(--spectrum-button-primary-min-width);padding:var(--spectrum-global-dimension-size-50) calc(var(--spectrum-button-primary-padding-x, | ||
var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, | ||
var(--spectrum-alias-border-size-thick)));padding-bottom:calc(var(--spectrum-global-dimension-size-50) + .5px);padding-top:calc(var(--spectrum-global-dimension-size-50) - .5px);font-size:var(--spectrum-button-primary-text-size,var(--spectrum-alias-pill-button-text-size));font-weight:var(--spectrum-button-primary-text-font-weight,var(--spectrum-global-font-weight-bold))}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}:host([disabled]) #button{cursor:default}::slotted([slot=icon]){max-height:100%;flex-shrink:0}#button:active,#button:hover{box-shadow:none}slot[name=icon]+#label{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}#label+::slotted([slot=icon]){margin-left:calc(var(--spectrum-button-primary-text-gap, | ||
var(--spectrum-global-dimension-size-100))/2)}#label{align-self:center;justify-self:center;text-align:center;width:100%}#label:empty{display:none}#button.focus-visible{box-shadow:0 0 0 1px var(--spectrum-button-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus))}#button:active{box-shadow:none}:host([variant=cta]) #button{background-color:var(--spectrum-button-cta-background-color,var(--spectrum-semantic-cta-color-background-default));border-color:var(--spectrum-button-cta-border-color,var(--spectrum-semantic-cta-color-background-default));color:var(--spectrum-button-cta-text-color,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button:hover{background-color:var(--spectrum-button-cta-background-color-hover,var(--spectrum-semantic-cta-color-background-hover));border-color:var(--spectrum-button-cta-border-color-hover,var(--spectrum-semantic-cta-color-background-hover));color:var(--spectrum-button-cta-text-color-hover,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button.focus-visible{background-color:var(--spectrum-button-cta-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-cta-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-cta-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button:active{background-color:var(--spectrum-button-cta-background-color-down,var(--spectrum-semantic-cta-color-background-down));border-color:var(--spectrum-button-cta-border-color-down,var(--spectrum-semantic-cta-color-background-down));color:var(--spectrum-button-cta-text-color-down,var(--spectrum-global-color-static-white))}:host([variant=cta][disabled]) #button{background-color:var(--spectrum-button-cta-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-cta-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-cta-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=primary]) #button{background-color:var(--spectrum-button-primary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-primary-border-color,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary]) #button:hover{background-color:var(--spectrum-button-primary-background-color-hover,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-primary-border-color-hover,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=primary]) #button.focus-visible{background-color:var(--spectrum-button-primary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-primary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=primary]) #button:active{background-color:var(--spectrum-button-primary-background-color-down,var(--spectrum-global-color-gray-900));border-color:var(--spectrum-button-primary-border-color-down,var(--spectrum-global-color-gray-900));color:var(--spectrum-button-primary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=primary][disabled]) #button{background-color:var(--spectrum-button-primary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-primary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary]) #button{background-color:var(--spectrum-button-secondary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-secondary-border-color,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary]) #button:hover{background-color:var(--spectrum-button-secondary-background-color-hover,var(--spectrum-global-color-gray-700));border-color:var(--spectrum-button-secondary-border-color-hover,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=secondary]) #button.focus-visible{background-color:var(--spectrum-button-secondary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-secondary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-secondary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=secondary]) #button:active{background-color:var(--spectrum-button-secondary-background-color-down,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-secondary-border-color-down,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-secondary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=secondary][disabled]) #button{background-color:var(--spectrum-button-secondary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-secondary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative]) #button{background-color:var(--spectrum-button-warning-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-warning-border-color,var(--spectrum-semantic-negative-color-text-small));color:var(--spectrum-button-warning-text-color,var(--spectrum-semantic-negative-color-text-small))}:host([variant=negative]) #button:hover{background-color:var(--spectrum-button-warning-background-color-hover,var(--spectrum-semantic-negative-color-text-small));border-color:var(--spectrum-button-warning-border-color-hover,var(--spectrum-semantic-negative-color-text-small));color:var(--spectrum-button-warning-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=negative]) #button.focus-visible{background-color:var(--spectrum-button-warning-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-warning-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-warning-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=negative]) #button:active{background-color:var(--spectrum-button-warning-background-color-down,var(--spectrum-global-color-red-700));border-color:var(--spectrum-button-warning-border-color-down,var(--spectrum-global-color-red-700));color:var(--spectrum-button-warning-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=negative][disabled]) #button{background-color:var(--spectrum-button-warning-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-warning-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=overBackground]) #button{background-color:var(--spectrum-button-over-background-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-over-background-border-color,var(--spectrum-global-color-static-white));color:var(--spectrum-button-over-background-text-color,var(--spectrum-global-color-static-white))}:host([variant=overBackground]) #button:hover{background-color:var(--spectrum-button-over-background-background-color-hover,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-hover,var(--spectrum-global-color-static-white));color:inherit}:host([variant=overBackground]) #button.focus-visible{background-color:var(--spectrum-button-over-background-background-color-key-focus,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-key-focus,var(--spectrum-global-color-static-white));color:inherit;box-shadow:0 0 0 1px var(--spectrum-button-over-background-border-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=overBackground]) #button:active{background-color:var(--spectrum-button-over-background-background-color-down,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-down,var(--spectrum-global-color-static-white));color:inherit;box-shadow:none}:host([variant=overBackground][disabled]) #button{background-color:var(--spectrum-button-over-background-background-color-disabled,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-over-background-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-over-background-text-color-disabled,hsla(0,0%,100%,.35))}:host([variant=overBackground][quiet]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-hover,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white));color:inherit;box-shadow:0 0 0 1px var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-down,var(--spectrum-global-color-static-white));box-shadow:none}:host([variant=overBackground][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))}:host([variant=primary][quiet]) #button{background-color:var(--spectrum-button-quiet-primary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-primary-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-primary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-primary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-primary-text-color-hover,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-primary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-primary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=primary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-primary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-primary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-primary-text-color-down,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-primary-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-primary-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary][quiet]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-secondary-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-secondary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-secondary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-secondary-text-color-hover,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-secondary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-secondary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-secondary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=secondary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-secondary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-secondary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-secondary-text-color-down,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-secondary-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative][quiet]) #button{background-color:var(--spectrum-button-quiet-warning-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-warning-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-warning-text-color,var(--spectrum-semantic-negative-color-text-small))}:host([variant=negative][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-warning-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-warning-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-warning-text-color-hover,var(--spectrum-global-color-red-700))}:host([variant=negative][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-warning-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-warning-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-warning-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=negative][quiet]) #button:active{background-color:var(--spectrum-button-quiet-warning-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-warning-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-warning-text-color-down,var(--spectrum-global-color-red-700))}:host([variant=negative][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-warning-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-warning-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-warning-text-color-disabled,var(--spectrum-global-color-gray-500))} | ||
`; | ||
export default styles; | ||
//# sourceMappingURL=spectrum-button.css.js.map |
@@ -14,5 +14,5 @@ /* | ||
const styles = css ` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;width:var(--spectrum-clearbutton-medium-width,var(--spectrum-global-dimension-size-400));height:var(--spectrum-clearbutton-medium-height,var(--spectrum-global-dimension-size-400));border-radius:100%;padding:0;margin:0;border:none;background-color:var(--spectrum-clearbutton-medium-background-color,transparent);color:var(--spectrum-clearbutton-medium-icon-color,var(--spectrum-global-color-gray-600))}#button:focus{outline:none;background-color:var(--spectrum-clearbutton-medium-background-color-key-focus,transparent);color:var(--spectrum-clearbutton-medium-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}#button:disabled{cursor:default}.spectrum-Icon{max-height:100%;flex-shrink:0}.spectrum-ClearButton--small{width:var(--spectrum-clearbutton-small-width,var(--spectrum-global-dimension-size-300));height:var(--spectrum-clearbutton-small-height,var(--spectrum-global-dimension-size-300))}#button:hover{background-color:var(--spectrum-clearbutton-medium-background-color-hover,transparent);color:var(--spectrum-clearbutton-medium-icon-color-hover,var(--spectrum-global-color-gray-900))}#button:active{background-color:var(--spectrum-clearbutton-medium-background-color-down,transparent);color:var(--spectrum-clearbutton-medium-icon-color-down,var(--spectrum-global-color-gray-900))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-clearbutton-medium-background-color-disabled,transparent);color:var(--spectrum-clearbutton-medium-icon-color-disabled,var(--spectrum-global-color-gray-500))}.spectrum-ClearButton--overBackground{background-color:var(--spectrum-button-quiet-over-background-background-color,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color,transparent);color:var(--spectrum-button-quiet-over-background-text-color,#fff)}.spectrum-ClearButton--overBackground:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,transparent);color:var(--spectrum-button-quiet-over-background-text-color-hover,#fff)}.spectrum-ClearButton--overBackground:focus{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,#fff);border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff);color:inherit;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff)}.spectrum-ClearButton--overBackground:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,transparent);color:var(--spectrum-button-quiet-over-background-text-color-down,#fff);box-shadow:none}.spectrum-ClearButton--overBackground.is-disabled,.spectrum-ClearButton--overBackground:disabled{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,transparent);color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))} | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;width:var(--spectrum-clearbutton-medium-width,var(--spectrum-alias-single-line-height));height:var(--spectrum-clearbutton-medium-height,var(--spectrum-alias-single-line-height));border-radius:100%;padding:0;margin:0;border:none;background-color:var(--spectrum-clearbutton-medium-background-color,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-clearbutton-medium-icon-color,var(--spectrum-alias-icon-color))}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:disabled{cursor:default}.spectrum-Icon{max-height:100%;flex-shrink:0}.spectrum-ClearButton--small{width:var(--spectrum-clearbutton-small-width,var(--spectrum-global-dimension-size-300));height:var(--spectrum-clearbutton-small-height,var(--spectrum-global-dimension-size-300))}#button:hover{background-color:var(--spectrum-clearbutton-medium-background-color-hover,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-clearbutton-medium-icon-color-hover,var(--spectrum-alias-icon-color-hover))}#button:active{background-color:var(--spectrum-clearbutton-medium-background-color-down,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-clearbutton-medium-icon-color-down,var(--spectrum-alias-icon-color-down))}#button.focus-visible{background-color:var(--spectrum-clearbutton-medium-background-color-key-focus,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-clearbutton-medium-icon-color-key-focus,var(--spectrum-alias-icon-color-focus))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-clearbutton-medium-background-color-disabled,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-clearbutton-medium-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}.spectrum-ClearButton--overBackground{background-color:var(--spectrum-button-quiet-over-background-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color,var(--spectrum-global-color-static-white))}.spectrum-ClearButton--overBackground:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-hover,var(--spectrum-global-color-static-white))}.spectrum-ClearButton--overBackground.focus-visible{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white));color:inherit;box-shadow:0 0 0 1px var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white))}.spectrum-ClearButton--overBackground:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-down,var(--spectrum-global-color-static-white));box-shadow:none}.spectrum-ClearButton--overBackground.is-disabled,.spectrum-ClearButton--overBackground:disabled{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))} | ||
`; | ||
export default styles; | ||
//# sourceMappingURL=spectrum-clear-button.css.js.map |
@@ -14,5 +14,5 @@ /* | ||
const styles = css ` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;border-style:solid;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;height:var(--spectrum-dropdown-height,var(--spectrum-global-dimension-size-400));font-family:inherit;font-weight:400;font-size:var(--spectrum-dropdown-text-size,var(--spectrum-global-dimension-font-size-100));line-height:normal;-webkit-font-smoothing:initial;cursor:pointer;margin:0;padding:0 var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));border-radius:var(--spectrum-global-dimension-size-50);transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-global-color-gray-800));background-color:var(--spectrum-fieldbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-dropdown-border-size,1px) solid var(--spectrum-fieldbutton-border-color,var(--spectrum-global-color-gray-300))}#button,#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}#button:disabled{cursor:default}.icon{max-height:100%;flex-shrink:0}#button.is-disabled,#button:disabled{border-width:0;cursor:default}#button.is-open{border-width:var(--spectrum-dropdown-border-size,1px)}.spectrum-FieldButton--quiet{margin:0;padding:0;border-width:0;border-radius:var(--spectrum-fieldbutton-quiet-border-radius,0);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-fieldbutton-quiet-border-color,transparent);background-color:var(--spectrum-fieldbutton-quiet-background-color,transparent)}#button:hover{color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-global-color-gray-900));background-color:var(--spectrum-fieldbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-hover,var(--spectrum-global-color-gray-400))}#button.is-focused,#button:focus{background-color:var(--spectrum-fieldbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-fieldbutton-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button.is-focused.is-placeholder,#button:focus.is-placeholder{color:var(--spectrum-fieldbutton-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button.is-selected,#button:active{background-color:var(--spectrum-fieldbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-fieldbutton-border-color-down,var(--spectrum-global-color-gray-400))}#button.is-selected.is-focused,#button.is-selected:focus,#button:active.is-focused,#button:active:focus{box-shadow:none}:host([invalid]) #button{border-color:var(--spectrum-fieldbutton-border-color-error,var(--spectrum-global-color-red-500))}:host([invalid]) #button:hover{border-color:var(--spectrum-fieldbutton-border-color-error-hover,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-selected,:host([invalid]) #button:active{border-color:var(--spectrum-fieldbutton-border-color-error-down,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-focused,:host([invalid]) #button:focus{border-color:var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-fieldbutton-background-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}#button.is-disabled:focus,#button:disabled:focus{box-shadow:none}#button.is-disabled .icon,#button:disabled .icon{color:var(--spectrum-fieldbutton-icon-color-disabled,var(--spectrum-global-color-gray-400))}.spectrum-FieldButton--quiet:hover{background-color:var(--spectrum-fieldbutton-quiet-background-color-hover,transparent);color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-global-color-gray-900))}.spectrum-FieldButton--quiet.is-focused,.spectrum-FieldButton--quiet:focus{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,transparent);box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400))}.spectrum-FieldButton--quiet.is-focused.is-placeholder,.spectrum-FieldButton--quiet:focus.is-placeholder{color:var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}.spectrum-FieldButton--quiet.is-selected,.spectrum-FieldButton--quiet:active{background-color:var(--spectrum-fieldbutton-quiet-background-color-down,transparent);border-color:var(--spectrum-fieldbutton-quiet-border-color-down,transparent)}.spectrum-FieldButton--quiet.is-selected.is-focused,.spectrum-FieldButton--quiet.is-selected:focus,.spectrum-FieldButton--quiet:active.is-focused,.spectrum-FieldButton--quiet:active:focus{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,transparent);box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400))}:host([invalid]) .spectrum-FieldButton--quiet.is-focused,:host([invalid]) .spectrum-FieldButton--quiet:focus{box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400))}.spectrum-FieldButton--quiet.is-disabled,.spectrum-FieldButton--quiet:disabled{background-color:var(--spectrum-fieldbutton-quiet-background-color-disabled,transparent);color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}.spectrum-FieldButton--quiet.is-disabled:focus,.spectrum-FieldButton--quiet:disabled:focus{box-shadow:none} | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;border-style:solid;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;height:var(--spectrum-dropdown-height,var(--spectrum-global-dimension-size-400));font-family:inherit;font-weight:400;font-size:var(--spectrum-dropdown-text-size,var(--spectrum-alias-font-size-default));line-height:normal;-webkit-font-smoothing:initial;cursor:pointer;margin:0;padding:0 var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));border-radius:var(--spectrum-global-dimension-size-50);transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-alias-text-color));background-color:var(--spectrum-fieldbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin)) solid var(--spectrum-fieldbutton-border-color,var(--spectrum-global-color-gray-300))}#button,#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:disabled{cursor:default}.icon{max-height:100%;flex-shrink:0}#button.is-disabled,#button:disabled{border-width:0;cursor:default}#button.is-open{border-width:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin))}.spectrum-FieldButton--quiet{margin:0;padding:0;border-width:0;border-radius:var(--spectrum-fieldbutton-quiet-border-radius,0);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-alias-text-color));border-color:var(--spectrum-fieldbutton-quiet-border-color,var(--spectrum-alias-border-color-transparent));background-color:var(--spectrum-fieldbutton-quiet-background-color,var(--spectrum-alias-background-color-transparent))}#button:hover{color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-alias-text-color-hover));background-color:var(--spectrum-fieldbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-hover,var(--spectrum-global-color-gray-400))}#button.focus-visible,#button.is-focused{background-color:var(--spectrum-fieldbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-fieldbutton-text-color-key-focus,var(--spectrum-alias-text-color-hover))}#button.focus-visible.is-placeholder,#button.is-focused.is-placeholder{color:var(--spectrum-fieldbutton-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover))}#button.is-selected,#button:active{background-color:var(--spectrum-fieldbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-fieldbutton-border-color-down,var(--spectrum-global-color-gray-400))}#button.is-selected.focus-visible,#button.is-selected.is-focused,#button:active.focus-visible,#button:active.is-focused{box-shadow:none}:host([invalid]) #button{border-color:var(--spectrum-fieldbutton-border-color-error,var(--spectrum-global-color-red-500))}:host([invalid]) #button:hover{border-color:var(--spectrum-fieldbutton-border-color-error-hover,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-selected,:host([invalid]) #button:active{border-color:var(--spectrum-fieldbutton-border-color-error-down,var(--spectrum-global-color-red-600))}:host([invalid]) #button.focus-visible,:host([invalid]) #button.is-focused{border-color:var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-fieldbutton-background-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}#button.is-disabled.focus-visible,#button:disabled.focus-visible{box-shadow:none}#button.is-disabled .icon,#button:disabled .icon{color:var(--spectrum-fieldbutton-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}.spectrum-FieldButton--quiet:hover{background-color:var(--spectrum-fieldbutton-quiet-background-color-hover,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-alias-text-color-hover))}.spectrum-FieldButton--quiet.focus-visible,.spectrum-FieldButton--quiet.is-focused{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-FieldButton--quiet.focus-visible.is-placeholder,.spectrum-FieldButton--quiet.is-focused.is-placeholder{color:var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover))}.spectrum-FieldButton--quiet.is-selected,.spectrum-FieldButton--quiet:active{background-color:var(--spectrum-fieldbutton-quiet-background-color-down,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-fieldbutton-quiet-border-color-down,var(--spectrum-alias-border-color-transparent))}.spectrum-FieldButton--quiet.is-selected.focus-visible,.spectrum-FieldButton--quiet.is-selected.is-focused,.spectrum-FieldButton--quiet:active.focus-visible,.spectrum-FieldButton--quiet:active.is-focused{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus))}:host([invalid]) .spectrum-FieldButton--quiet.focus-visible,:host([invalid]) .spectrum-FieldButton--quiet.is-focused{box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-FieldButton--quiet.is-disabled,.spectrum-FieldButton--quiet:disabled{background-color:var(--spectrum-fieldbutton-quiet-background-color-disabled,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-FieldButton--quiet.is-disabled.focus-visible,.spectrum-FieldButton--quiet:disabled.focus-visible{box-shadow:none} | ||
`; | ||
export default styles; | ||
//# sourceMappingURL=spectrum-fieldbutton.css.js.map |
@@ -21,3 +21,3 @@ { | ||
], | ||
"version": "0.2.2", | ||
"version": "0.3.0", | ||
"description": "", | ||
@@ -39,7 +39,10 @@ "main": "lib/index.js", | ||
}, | ||
"devDependencies": { | ||
"@spectrum-css/button": "^2.0.2" | ||
}, | ||
"dependencies": { | ||
"@spectrum-web-components/shared": "^0.2.0", | ||
"@spectrum-web-components/shared": "^0.3.0", | ||
"tslib": "^1.10.0" | ||
}, | ||
"gitHead": "2157014e1c3f8cf184663261e4095eef59011b37" | ||
"gitHead": "bfedd73cfc7ba9b30346ac5dd53013f7630648b0" | ||
} |
@@ -14,11 +14,12 @@ /* | ||
const styles = css` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;position:relative;height:var(--spectrum-actionbutton-height,var(--spectrum-global-dimension-size-400));min-width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));padding:0 calc(var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)) - var(--spectrum-actionbutton-border-size, 1px));border-radius:var(--spectrum-actionbutton-border-radius,var(--spectrum-global-dimension-size-50));font-size:var(--spectrum-actionbutton-text-size,var(--spectrum-global-dimension-font-size-100));font-weight:var(--spectrum-actionbutton-text-font-weight,400);background-color:var(--spectrum-actionbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-actionbutton-border-size,1px) solid var(--spectrum-actionbutton-border-color,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color,var(--spectrum-global-color-gray-800))}#button:focus{outline:none;background-color:var(--spectrum-actionbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}:host([disabled]) #button{cursor:default;background-color:var(--spectrum-actionbutton-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}::slotted([slot=icon]){max-height:100%;color:var(--spectrum-actionbutton-icon-color,var(--spectrum-global-color-gray-700))}slot[name=icon]+#label{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85));padding-right:calc(var(--spectrum-actionbutton-text-padding-x, | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;position:relative;height:var(--spectrum-actionbutton-height,var(--spectrum-alias-single-line-height));min-width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));padding:0 calc(var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)) - var(--spectrum-actionbutton-border-size, | ||
var(--spectrum-alias-border-size-thin)));border-radius:var(--spectrum-actionbutton-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-actionbutton-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-text-font-weight,var(--spectrum-alias-body-text-font-weight));background-color:var(--spectrum-actionbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-actionbutton-border-size,var(--spectrum-alias-border-size-thin)) solid var(--spectrum-actionbutton-border-color,var(--spectrum-alias-border-color));color:var(--spectrum-actionbutton-text-color,var(--spectrum-alias-text-color))}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}:host([disabled]) #button{cursor:default;background-color:var(--spectrum-actionbutton-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}::slotted([slot=icon]){max-height:100%;color:var(--spectrum-actionbutton-icon-color,var(--spectrum-alias-icon-color))}slot[name=icon]+#label{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85));padding-right:calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-global-dimension-size-150)) - var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)))}.spectrum-Icon--sizeS:only-child{position:absolute;top:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-global-dimension-size-225))/2);left:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-global-dimension-size-225))/2)}#label:only-child{padding:0 calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-alias-workflow-icon-size))/2);left:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-alias-workflow-icon-size))/2)}#label:only-child{padding:0 calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-global-dimension-size-150)) - var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)))}#hold-affordance{position:absolute;right:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40));bottom:var(--spectrum-actionbutton-hold-icon-padding-bottom,var(--spectrum-global-dimension-size-40));color:var(--spectrum-actionbutton-hold-icon-color,var(--spectrum-global-color-gray-700))}#label{align-self:center;justify-self:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#label:empty{display:none}:host([quiet]) #button{border-width:var(--spectrum-actionbutton-quiet-border-size,1px);border-radius:var(--spectrum-actionbutton-quiet-border-radius,var(--spectrum-global-dimension-size-50));font-size:var(--spectrum-actionbutton-quiet-text-size,var(--spectrum-global-dimension-font-size-100));font-weight:var(--spectrum-actionbutton-quiet-text-font-weight,400);background-color:var(--spectrum-actionbutton-quiet-background-color,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color,transparent);color:var(--spectrum-actionbutton-quiet-text-color,var(--spectrum-global-color-gray-800))}#button:hover{background-color:var(--spectrum-actionbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-hover,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-hover,var(--spectrum-global-color-gray-900))}#button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-hover,var(--spectrum-global-color-gray-900))}#button:hover #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-hover,var(--spectrum-global-color-gray-900))}#button:focus ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button:focus #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button:active{background-color:var(--spectrum-actionbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-down,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-down,var(--spectrum-global-color-gray-900))}#button:active #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-down,var(--spectrum-global-color-gray-900))}:host([disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([disabled]) #button #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([selected]) #button{background-color:var(--spectrum-actionbutton-background-color-selected,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color-selected,var(--spectrum-global-color-gray-800))}:host([selected]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected,var(--spectrum-global-color-gray-700))}:host([selected]) #button:focus{background-color:var(--spectrum-actionbutton-background-color-selected-key-focus,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-text-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([selected]) #button:focus ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([selected]) #button:hover{background-color:var(--spectrum-actionbutton-background-color-selected-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-hover,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([selected]) #button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([selected]) #button:active{background-color:var(--spectrum-actionbutton-background-color-selected-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-down,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-down,var(--spectrum-global-color-gray-900))}:host([selected]) #button:active ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-down,var(--spectrum-global-color-gray-900))}:host([selected][disabled]) #button{background-color:var(--spectrum-actionbutton-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-selected-disabled,var(--spectrum-global-color-gray-500))}:host([selected][disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-disabled,var(--spectrum-global-color-gray-400))}:host([quiet]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-hover,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color-hover,transparent);color:var(--spectrum-actionbutton-quiet-text-color-hover,var(--spectrum-global-color-gray-900));box-shadow:none}:host([quiet]) #button:focus{background-color:var(--spectrum-actionbutton-quiet-background-color-key-focus,transparent);box-shadow:0 0 0 var(--spectrum-actionbutton-quiet-border-size-key-focus,2px) var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-global-color-blue-400));border-color:var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-quiet-text-color-key-focus,var(--spectrum-global-color-gray-900))}:host([quiet]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-down,var(--spectrum-global-color-gray-900));box-shadow:none}:host([quiet][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-disabled,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color-disabled,transparent);color:var(--spectrum-actionbutton-quiet-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([quiet][selected]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected,var(--spectrum-global-color-gray-800))}:host([quiet][selected]) #button:focus{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-key-focus,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-quiet-text-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([quiet][selected]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-hover,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-hover,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([quiet][selected]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-down,var(--spectrum-global-color-gray-900))}:host([quiet][selected][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-quiet-text-color-selected-disabled,var(--spectrum-global-color-gray-500))}:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}#button:focus,:host(:focus){outline:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)}:host(.spectrum-Dropdown-trigger) #button{text-align:left}::slotted([slot=icon]){flex-shrink:0} | ||
var(--spectrum-global-dimension-size-85)))}#hold-affordance{position:absolute;right:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40));bottom:var(--spectrum-actionbutton-hold-icon-padding-bottom,var(--spectrum-global-dimension-size-40));color:var(--spectrum-actionbutton-hold-icon-color,var(--spectrum-alias-icon-color))}#label{align-self:center;justify-self:center;text-align:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#label:empty{display:none}:host([quiet]) #button{border-width:var(--spectrum-actionbutton-quiet-border-size,var(--spectrum-alias-border-size-thin));border-radius:var(--spectrum-actionbutton-quiet-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-actionbutton-quiet-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-quiet-text-font-weight,var(--spectrum-alias-body-text-font-weight));background-color:var(--spectrum-actionbutton-quiet-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color,var(--spectrum-alias-text-color))}#button:hover{background-color:var(--spectrum-actionbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-hover,var(--spectrum-alias-border-color-hover));box-shadow:none;color:var(--spectrum-actionbutton-text-color-hover,var(--spectrum-alias-text-color-hover))}#button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-hover,var(--spectrum-alias-icon-color-hover))}#button:hover #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-hover,var(--spectrum-alias-icon-color-hover))}#button.focus-visible{background-color:var(--spectrum-actionbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-text-color-key-focus,var(--spectrum-alias-text-color-hover))}#button.focus-visible ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-key-focus,var(--spectrum-alias-icon-color-focus))}#button.focus-visible #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-key-focus,var(--spectrum-alias-icon-color-hover))}#button:active{background-color:var(--spectrum-actionbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-down,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-down,var(--spectrum-alias-text-color-down))}#button:active #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-down,var(--spectrum-alias-icon-color-down))}:host([disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}:host([disabled]) #button #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}:host([selected]) #button{background-color:var(--spectrum-actionbutton-background-color-selected,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color-selected,var(--spectrum-alias-text-color))}:host([selected]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected,var(--spectrum-alias-icon-color))}:host([selected]) #button.focus-visible{background-color:var(--spectrum-actionbutton-background-color-selected-key-focus,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-text-color-selected-key-focus,var(--spectrum-alias-text-color-hover))}:host([selected]) #button.focus-visible ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-key-focus,var(--spectrum-alias-icon-color-hover))}:host([selected]) #button:hover{background-color:var(--spectrum-actionbutton-background-color-selected-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-hover,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-hover,var(--spectrum-alias-text-color-hover))}:host([selected]) #button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-hover,var(--spectrum-alias-icon-color-hover))}:host([selected]) #button:active{background-color:var(--spectrum-actionbutton-background-color-selected-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-down,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-down,var(--spectrum-alias-text-color-down))}:host([selected]) #button:active ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-down,var(--spectrum-alias-icon-color-down))}:host([selected][disabled]) #button{background-color:var(--spectrum-actionbutton-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-selected-disabled,var(--spectrum-alias-text-color-disabled))}:host([selected][disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-disabled,var(--spectrum-alias-icon-color-disabled))}:host([quiet]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-hover,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color-hover,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color-hover,var(--spectrum-alias-text-color-hover));box-shadow:none}:host([quiet]) #button.focus-visible{background-color:var(--spectrum-actionbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 0 0 1px var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus));border-color:var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-quiet-text-color-key-focus,var(--spectrum-alias-text-color-hover))}:host([quiet]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-down,var(--spectrum-alias-text-color-down));box-shadow:none}:host([quiet][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color-disabled,var(--spectrum-alias-text-color-disabled))}:host([quiet][selected]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected,var(--spectrum-alias-text-color))}:host([quiet][selected]) #button.focus-visible{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-key-focus,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-quiet-text-color-selected-key-focus,var(--spectrum-alias-text-color-hover))}:host([quiet][selected]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-hover,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-hover,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-hover,var(--spectrum-alias-text-color-hover))}:host([quiet][selected]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-down,var(--spectrum-alias-text-color-down))}:host([quiet][selected][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-quiet-text-color-selected-disabled,var(--spectrum-alias-text-color-disabled))}:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)}:host(.spectrum-Dropdown-trigger) #button{text-align:left}::slotted([slot=icon]){flex-shrink:0} | ||
`; | ||
export default styles; |
@@ -14,4 +14,4 @@ /* | ||
const styles = css` | ||
:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}#button:focus,:host(:focus){outline:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)} | ||
:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)} | ||
`; | ||
export default styles; |
@@ -14,6 +14,7 @@ /* | ||
const styles = css` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;border-width:var(--spectrum-button-primary-border-size,2px);border-style:solid;border-radius:var(--spectrum-button-primary-border-radius,var(--spectrum-global-dimension-size-200));min-height:var(--spectrum-button-primary-height,var(--spectrum-global-dimension-size-400));height:auto;min-width:var(--spectrum-button-primary-min-width,var(--spectrum-button-cta-min-width));padding:var(--spectrum-global-dimension-size-50) calc(var(--spectrum-button-primary-padding-x, | ||
var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, 2px));padding-bottom:calc(var(--spectrum-global-dimension-size-50) + .5px);padding-top:calc(var(--spectrum-global-dimension-size-50) - .5px);font-size:var(--spectrum-button-primary-text-size,var(--spectrum-global-dimension-font-size-150));font-weight:var(--spectrum-button-primary-text-font-weight,700)}#button:focus{outline:none;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-primary-border-color-key-focus,#1473e6)}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}:host([disabled]) #button{cursor:default}::slotted([slot=icon]){max-height:100%;flex-shrink:0}#button:active,#button:hover{box-shadow:none}slot[name=icon]+#label{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}#label+::slotted([slot=icon]){margin-left:calc(var(--spectrum-button-primary-text-gap, | ||
var(--spectrum-global-dimension-size-100))/2)}#label{align-self:center;justify-self:center;width:100%}#label:empty{display:none}#button:active{box-shadow:none}:host([variant=cta]) #button{background-color:var(--spectrum-button-cta-background-color,#1473e6);border-color:var(--spectrum-button-cta-border-color,#1473e6);color:var(--spectrum-button-cta-text-color,#fff)}:host([variant=cta]) #button:hover{background-color:var(--spectrum-button-cta-background-color-hover,#0d66d0);border-color:var(--spectrum-button-cta-border-color-hover,#0d66d0);color:var(--spectrum-button-cta-text-color-hover,#fff)}:host([variant=cta]) #button:focus{background-color:var(--spectrum-button-cta-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-cta-border-color-key-focus,#1473e6);color:var(--spectrum-button-cta-text-color-key-focus,#fff)}:host([variant=cta]) #button:active{background-color:var(--spectrum-button-cta-background-color-down,#0d66d0);border-color:var(--spectrum-button-cta-border-color-down,#0d66d0);color:var(--spectrum-button-cta-text-color-down,#fff)}:host([variant=cta][disabled]) #button{background-color:var(--spectrum-button-cta-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-cta-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-cta-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=primary]) #button{background-color:var(--spectrum-button-primary-background-color,transparent);border-color:var(--spectrum-button-primary-border-color,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary]) #button:hover{background-color:var(--spectrum-button-primary-background-color-hover,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-primary-border-color-hover,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=primary]) #button:focus{background-color:var(--spectrum-button-primary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-primary-border-color-key-focus,#1473e6);color:var(--spectrum-button-primary-text-color-key-focus,#fff)}:host([variant=primary]) #button:active{background-color:var(--spectrum-button-primary-background-color-down,var(--spectrum-global-color-gray-900));border-color:var(--spectrum-button-primary-border-color-down,var(--spectrum-global-color-gray-900));color:var(--spectrum-button-primary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=primary][disabled]) #button{background-color:var(--spectrum-button-primary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-primary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary]) #button{background-color:var(--spectrum-button-secondary-background-color,transparent);border-color:var(--spectrum-button-secondary-border-color,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary]) #button:hover{background-color:var(--spectrum-button-secondary-background-color-hover,var(--spectrum-global-color-gray-700));border-color:var(--spectrum-button-secondary-border-color-hover,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=secondary]) #button:focus{background-color:var(--spectrum-button-secondary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-secondary-border-color-key-focus,#1473e6);color:var(--spectrum-button-secondary-text-color-key-focus,#fff)}:host([variant=secondary]) #button:active{background-color:var(--spectrum-button-secondary-background-color-down,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-secondary-border-color-down,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-secondary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=secondary][disabled]) #button{background-color:var(--spectrum-button-secondary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-secondary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative]) #button{background-color:var(--spectrum-button-warning-background-color,transparent);border-color:var(--spectrum-button-warning-border-color,var(--spectrum-global-color-red-600));color:var(--spectrum-button-warning-text-color,var(--spectrum-global-color-red-600))}:host([variant=negative]) #button:hover{background-color:var(--spectrum-button-warning-background-color-hover,var(--spectrum-global-color-red-600));border-color:var(--spectrum-button-warning-border-color-hover,var(--spectrum-global-color-red-600));color:var(--spectrum-button-warning-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=negative]) #button:focus{background-color:var(--spectrum-button-warning-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-warning-border-color-key-focus,#1473e6);color:var(--spectrum-button-warning-text-color-key-focus,#fff)}:host([variant=negative]) #button:active{background-color:var(--spectrum-button-warning-background-color-down,var(--spectrum-global-color-red-700));border-color:var(--spectrum-button-warning-border-color-down,var(--spectrum-global-color-red-700));color:var(--spectrum-button-warning-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=negative][disabled]) #button{background-color:var(--spectrum-button-warning-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-warning-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=overBackground]) #button{background-color:var(--spectrum-button-over-background-background-color,transparent);border-color:var(--spectrum-button-over-background-border-color,#fff);color:var(--spectrum-button-over-background-text-color,#fff)}:host([variant=overBackground]) #button:hover{background-color:var(--spectrum-button-over-background-background-color-hover,#fff);border-color:var(--spectrum-button-over-background-border-color-hover,#fff);color:inherit}:host([variant=overBackground]) #button:focus{background-color:var(--spectrum-button-over-background-background-color-key-focus,#fff);border-color:var(--spectrum-button-over-background-border-color-key-focus,#fff);color:inherit;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-over-background-border-color-key-focus,#fff)}:host([variant=overBackground]) #button:active{background-color:var(--spectrum-button-over-background-background-color-down,#fff);border-color:var(--spectrum-button-over-background-border-color-down,#fff);color:inherit;box-shadow:none}:host([variant=overBackground][disabled]) #button{background-color:var(--spectrum-button-over-background-background-color-disabled,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-over-background-border-color-disabled,transparent);color:var(--spectrum-button-over-background-text-color-disabled,hsla(0,0%,100%,.35))}:host([variant=overBackground][quiet]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color,transparent);color:var(--spectrum-button-quiet-over-background-text-color,#fff)}:host([variant=overBackground][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,transparent);color:var(--spectrum-button-quiet-over-background-text-color-hover,#fff)}:host([variant=overBackground][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,#fff);border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff);color:inherit;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff)}:host([variant=overBackground][quiet]) #button:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,transparent);color:var(--spectrum-button-quiet-over-background-text-color-down,#fff);box-shadow:none}:host([variant=overBackground][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,transparent);color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))}:host([variant=primary][quiet]) #button{background-color:var(--spectrum-button-quiet-primary-background-color,transparent);border-color:var(--spectrum-button-quiet-primary-border-color,transparent);color:var(--spectrum-button-quiet-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-primary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-primary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-primary-text-color-hover,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-primary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-primary-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-primary-text-color-key-focus,#fff)}:host([variant=primary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-primary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-primary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-primary-text-color-down,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-primary-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-primary-border-color-disabled,transparent);color:var(--spectrum-button-quiet-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary][quiet]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color,transparent);border-color:var(--spectrum-button-quiet-secondary-border-color,transparent);color:var(--spectrum-button-quiet-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-secondary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-secondary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-secondary-text-color-hover,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-secondary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-secondary-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-secondary-text-color-key-focus,#fff)}:host([variant=secondary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-secondary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-secondary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-secondary-text-color-down,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-secondary-border-color-disabled,transparent);color:var(--spectrum-button-quiet-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative][quiet]) #button{background-color:var(--spectrum-button-quiet-warning-background-color,transparent);border-color:var(--spectrum-button-quiet-warning-border-color,transparent);color:var(--spectrum-button-quiet-warning-text-color,var(--spectrum-global-color-red-500))}:host([variant=negative][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-warning-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-warning-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-warning-text-color-hover,var(--spectrum-global-color-red-600))}:host([variant=negative][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-warning-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-warning-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-warning-text-color-key-focus,#fff)}:host([variant=negative][quiet]) #button:active{background-color:var(--spectrum-button-quiet-warning-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-warning-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-warning-text-color-down,var(--spectrum-global-color-red-600))}:host([variant=negative][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-warning-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-warning-border-color-disabled,transparent);color:var(--spectrum-button-quiet-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}#button:focus,:host(:focus){outline:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)} | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;border-width:var(--spectrum-button-primary-border-size,var(--spectrum-alias-border-size-thick));border-style:solid;border-radius:var(--spectrum-button-primary-border-radius,var(--spectrum-alias-border-radius-large));min-height:var(--spectrum-button-primary-height,var(--spectrum-alias-single-line-height));height:auto;min-width:var(--spectrum-button-primary-min-width);padding:var(--spectrum-global-dimension-size-50) calc(var(--spectrum-button-primary-padding-x, | ||
var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, | ||
var(--spectrum-alias-border-size-thick)));padding-bottom:calc(var(--spectrum-global-dimension-size-50) + .5px);padding-top:calc(var(--spectrum-global-dimension-size-50) - .5px);font-size:var(--spectrum-button-primary-text-size,var(--spectrum-alias-pill-button-text-size));font-weight:var(--spectrum-button-primary-text-font-weight,var(--spectrum-global-font-weight-bold))}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}:host([disabled]) #button{cursor:default}::slotted([slot=icon]){max-height:100%;flex-shrink:0}#button:active,#button:hover{box-shadow:none}slot[name=icon]+#label{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}#label+::slotted([slot=icon]){margin-left:calc(var(--spectrum-button-primary-text-gap, | ||
var(--spectrum-global-dimension-size-100))/2)}#label{align-self:center;justify-self:center;text-align:center;width:100%}#label:empty{display:none}#button.focus-visible{box-shadow:0 0 0 1px var(--spectrum-button-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus))}#button:active{box-shadow:none}:host([variant=cta]) #button{background-color:var(--spectrum-button-cta-background-color,var(--spectrum-semantic-cta-color-background-default));border-color:var(--spectrum-button-cta-border-color,var(--spectrum-semantic-cta-color-background-default));color:var(--spectrum-button-cta-text-color,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button:hover{background-color:var(--spectrum-button-cta-background-color-hover,var(--spectrum-semantic-cta-color-background-hover));border-color:var(--spectrum-button-cta-border-color-hover,var(--spectrum-semantic-cta-color-background-hover));color:var(--spectrum-button-cta-text-color-hover,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button.focus-visible{background-color:var(--spectrum-button-cta-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-cta-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-cta-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button:active{background-color:var(--spectrum-button-cta-background-color-down,var(--spectrum-semantic-cta-color-background-down));border-color:var(--spectrum-button-cta-border-color-down,var(--spectrum-semantic-cta-color-background-down));color:var(--spectrum-button-cta-text-color-down,var(--spectrum-global-color-static-white))}:host([variant=cta][disabled]) #button{background-color:var(--spectrum-button-cta-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-cta-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-cta-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=primary]) #button{background-color:var(--spectrum-button-primary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-primary-border-color,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary]) #button:hover{background-color:var(--spectrum-button-primary-background-color-hover,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-primary-border-color-hover,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=primary]) #button.focus-visible{background-color:var(--spectrum-button-primary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-primary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=primary]) #button:active{background-color:var(--spectrum-button-primary-background-color-down,var(--spectrum-global-color-gray-900));border-color:var(--spectrum-button-primary-border-color-down,var(--spectrum-global-color-gray-900));color:var(--spectrum-button-primary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=primary][disabled]) #button{background-color:var(--spectrum-button-primary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-primary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary]) #button{background-color:var(--spectrum-button-secondary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-secondary-border-color,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary]) #button:hover{background-color:var(--spectrum-button-secondary-background-color-hover,var(--spectrum-global-color-gray-700));border-color:var(--spectrum-button-secondary-border-color-hover,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=secondary]) #button.focus-visible{background-color:var(--spectrum-button-secondary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-secondary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-secondary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=secondary]) #button:active{background-color:var(--spectrum-button-secondary-background-color-down,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-secondary-border-color-down,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-secondary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=secondary][disabled]) #button{background-color:var(--spectrum-button-secondary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-secondary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative]) #button{background-color:var(--spectrum-button-warning-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-warning-border-color,var(--spectrum-semantic-negative-color-text-small));color:var(--spectrum-button-warning-text-color,var(--spectrum-semantic-negative-color-text-small))}:host([variant=negative]) #button:hover{background-color:var(--spectrum-button-warning-background-color-hover,var(--spectrum-semantic-negative-color-text-small));border-color:var(--spectrum-button-warning-border-color-hover,var(--spectrum-semantic-negative-color-text-small));color:var(--spectrum-button-warning-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=negative]) #button.focus-visible{background-color:var(--spectrum-button-warning-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-warning-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-warning-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=negative]) #button:active{background-color:var(--spectrum-button-warning-background-color-down,var(--spectrum-global-color-red-700));border-color:var(--spectrum-button-warning-border-color-down,var(--spectrum-global-color-red-700));color:var(--spectrum-button-warning-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=negative][disabled]) #button{background-color:var(--spectrum-button-warning-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-warning-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=overBackground]) #button{background-color:var(--spectrum-button-over-background-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-over-background-border-color,var(--spectrum-global-color-static-white));color:var(--spectrum-button-over-background-text-color,var(--spectrum-global-color-static-white))}:host([variant=overBackground]) #button:hover{background-color:var(--spectrum-button-over-background-background-color-hover,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-hover,var(--spectrum-global-color-static-white));color:inherit}:host([variant=overBackground]) #button.focus-visible{background-color:var(--spectrum-button-over-background-background-color-key-focus,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-key-focus,var(--spectrum-global-color-static-white));color:inherit;box-shadow:0 0 0 1px var(--spectrum-button-over-background-border-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=overBackground]) #button:active{background-color:var(--spectrum-button-over-background-background-color-down,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-down,var(--spectrum-global-color-static-white));color:inherit;box-shadow:none}:host([variant=overBackground][disabled]) #button{background-color:var(--spectrum-button-over-background-background-color-disabled,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-over-background-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-over-background-text-color-disabled,hsla(0,0%,100%,.35))}:host([variant=overBackground][quiet]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-hover,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white));color:inherit;box-shadow:0 0 0 1px var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-down,var(--spectrum-global-color-static-white));box-shadow:none}:host([variant=overBackground][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))}:host([variant=primary][quiet]) #button{background-color:var(--spectrum-button-quiet-primary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-primary-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-primary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-primary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-primary-text-color-hover,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-primary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-primary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=primary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-primary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-primary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-primary-text-color-down,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-primary-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-primary-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary][quiet]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-secondary-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-secondary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-secondary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-secondary-text-color-hover,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-secondary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-secondary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-secondary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=secondary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-secondary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-secondary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-secondary-text-color-down,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-secondary-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative][quiet]) #button{background-color:var(--spectrum-button-quiet-warning-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-warning-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-warning-text-color,var(--spectrum-semantic-negative-color-text-small))}:host([variant=negative][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-warning-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-warning-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-warning-text-color-hover,var(--spectrum-global-color-red-700))}:host([variant=negative][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-warning-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-warning-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-warning-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=negative][quiet]) #button:active{background-color:var(--spectrum-button-quiet-warning-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-warning-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-warning-text-color-down,var(--spectrum-global-color-red-700))}:host([variant=negative][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-warning-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-warning-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host{display:inline-flex;flex-direction:row;vertical-align:top}#button{display:flex;flex:1 1 auto;-webkit-appearance:none}:host([disabled]){pointer-events:none}slot[name=icon]::slotted(svg){fill:currentColor;stroke:currentColor;width:var(--spectrum-alias-workflow-icon-size,18px);height:var(--spectrum-alias-workflow-icon-size,18px)} | ||
`; | ||
export default styles; |
@@ -14,4 +14,4 @@ /* | ||
const styles = css` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;border-style:solid;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;height:var(--spectrum-dropdown-height,var(--spectrum-global-dimension-size-400));font-family:inherit;font-weight:400;font-size:var(--spectrum-dropdown-text-size,var(--spectrum-global-dimension-font-size-100));line-height:normal;-webkit-font-smoothing:initial;cursor:pointer;margin:0;padding:0 var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));border-radius:var(--spectrum-global-dimension-size-50);transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-global-color-gray-800));background-color:var(--spectrum-fieldbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-dropdown-border-size,1px) solid var(--spectrum-fieldbutton-border-color,var(--spectrum-global-color-gray-300))}#button,#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}#button:disabled{cursor:default}.icon{max-height:100%;flex-shrink:0}#button.is-disabled,#button:disabled{border-width:0;cursor:default}#button.is-open{border-width:var(--spectrum-dropdown-border-size,1px)}.spectrum-FieldButton--quiet{margin:0;padding:0;border-width:0;border-radius:var(--spectrum-fieldbutton-quiet-border-radius,0);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-fieldbutton-quiet-border-color,transparent);background-color:var(--spectrum-fieldbutton-quiet-background-color,transparent)}#button:hover{color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-global-color-gray-900));background-color:var(--spectrum-fieldbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-hover,var(--spectrum-global-color-gray-400))}#button.is-focused,#button:focus{background-color:var(--spectrum-fieldbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-fieldbutton-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button.is-focused.is-placeholder,#button:focus.is-placeholder{color:var(--spectrum-fieldbutton-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button.is-selected,#button:active{background-color:var(--spectrum-fieldbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-fieldbutton-border-color-down,var(--spectrum-global-color-gray-400))}#button.is-selected.is-focused,#button.is-selected:focus,#button:active.is-focused,#button:active:focus{box-shadow:none}:host([invalid]) #button{border-color:var(--spectrum-fieldbutton-border-color-error,var(--spectrum-global-color-red-500))}:host([invalid]) #button:hover{border-color:var(--spectrum-fieldbutton-border-color-error-hover,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-selected,:host([invalid]) #button:active{border-color:var(--spectrum-fieldbutton-border-color-error-down,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-focused,:host([invalid]) #button:focus{border-color:var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-fieldbutton-background-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}#button.is-disabled:focus,#button:disabled:focus{box-shadow:none}#button.is-disabled .icon,#button:disabled .icon{color:var(--spectrum-fieldbutton-icon-color-disabled,var(--spectrum-global-color-gray-400))}.spectrum-FieldButton--quiet:hover{background-color:var(--spectrum-fieldbutton-quiet-background-color-hover,transparent);color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-global-color-gray-900))}.spectrum-FieldButton--quiet.is-focused,.spectrum-FieldButton--quiet:focus{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,transparent);box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400))}.spectrum-FieldButton--quiet.is-focused.is-placeholder,.spectrum-FieldButton--quiet:focus.is-placeholder{color:var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}.spectrum-FieldButton--quiet.is-selected,.spectrum-FieldButton--quiet:active{background-color:var(--spectrum-fieldbutton-quiet-background-color-down,transparent);border-color:var(--spectrum-fieldbutton-quiet-border-color-down,transparent)}.spectrum-FieldButton--quiet.is-selected.is-focused,.spectrum-FieldButton--quiet.is-selected:focus,.spectrum-FieldButton--quiet:active.is-focused,.spectrum-FieldButton--quiet:active:focus{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,transparent);box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400))}:host([invalid]) .spectrum-FieldButton--quiet.is-focused,:host([invalid]) .spectrum-FieldButton--quiet:focus{box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400))}.spectrum-FieldButton--quiet.is-disabled,.spectrum-FieldButton--quiet:disabled{background-color:var(--spectrum-fieldbutton-quiet-background-color-disabled,transparent);color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}.spectrum-FieldButton--quiet.is-disabled:focus,.spectrum-FieldButton--quiet:disabled:focus{box-shadow:none} | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;border-style:solid;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;height:var(--spectrum-dropdown-height,var(--spectrum-global-dimension-size-400));font-family:inherit;font-weight:400;font-size:var(--spectrum-dropdown-text-size,var(--spectrum-alias-font-size-default));line-height:normal;-webkit-font-smoothing:initial;cursor:pointer;margin:0;padding:0 var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));border-radius:var(--spectrum-global-dimension-size-50);transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-alias-text-color));background-color:var(--spectrum-fieldbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin)) solid var(--spectrum-fieldbutton-border-color,var(--spectrum-global-color-gray-300))}#button,#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:disabled{cursor:default}.icon{max-height:100%;flex-shrink:0}#button.is-disabled,#button:disabled{border-width:0;cursor:default}#button.is-open{border-width:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin))}.spectrum-FieldButton--quiet{margin:0;padding:0;border-width:0;border-radius:var(--spectrum-fieldbutton-quiet-border-radius,0);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-alias-text-color));border-color:var(--spectrum-fieldbutton-quiet-border-color,var(--spectrum-alias-border-color-transparent));background-color:var(--spectrum-fieldbutton-quiet-background-color,var(--spectrum-alias-background-color-transparent))}#button:hover{color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-alias-text-color-hover));background-color:var(--spectrum-fieldbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-hover,var(--spectrum-global-color-gray-400))}#button.focus-visible,#button.is-focused{background-color:var(--spectrum-fieldbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-fieldbutton-text-color-key-focus,var(--spectrum-alias-text-color-hover))}#button.focus-visible.is-placeholder,#button.is-focused.is-placeholder{color:var(--spectrum-fieldbutton-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover))}#button.is-selected,#button:active{background-color:var(--spectrum-fieldbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-fieldbutton-border-color-down,var(--spectrum-global-color-gray-400))}#button.is-selected.focus-visible,#button.is-selected.is-focused,#button:active.focus-visible,#button:active.is-focused{box-shadow:none}:host([invalid]) #button{border-color:var(--spectrum-fieldbutton-border-color-error,var(--spectrum-global-color-red-500))}:host([invalid]) #button:hover{border-color:var(--spectrum-fieldbutton-border-color-error-hover,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-selected,:host([invalid]) #button:active{border-color:var(--spectrum-fieldbutton-border-color-error-down,var(--spectrum-global-color-red-600))}:host([invalid]) #button.focus-visible,:host([invalid]) #button.is-focused{border-color:var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-fieldbutton-background-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}#button.is-disabled.focus-visible,#button:disabled.focus-visible{box-shadow:none}#button.is-disabled .icon,#button:disabled .icon{color:var(--spectrum-fieldbutton-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}.spectrum-FieldButton--quiet:hover{background-color:var(--spectrum-fieldbutton-quiet-background-color-hover,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-alias-text-color-hover))}.spectrum-FieldButton--quiet.focus-visible,.spectrum-FieldButton--quiet.is-focused{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-FieldButton--quiet.focus-visible.is-placeholder,.spectrum-FieldButton--quiet.is-focused.is-placeholder{color:var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover))}.spectrum-FieldButton--quiet.is-selected,.spectrum-FieldButton--quiet:active{background-color:var(--spectrum-fieldbutton-quiet-background-color-down,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-fieldbutton-quiet-border-color-down,var(--spectrum-alias-border-color-transparent))}.spectrum-FieldButton--quiet.is-selected.focus-visible,.spectrum-FieldButton--quiet.is-selected.is-focused,.spectrum-FieldButton--quiet:active.focus-visible,.spectrum-FieldButton--quiet:active.is-focused{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus))}:host([invalid]) .spectrum-FieldButton--quiet.focus-visible,:host([invalid]) .spectrum-FieldButton--quiet.is-focused{box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-FieldButton--quiet.is-disabled,.spectrum-FieldButton--quiet:disabled{background-color:var(--spectrum-fieldbutton-quiet-background-color-disabled,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-FieldButton--quiet.is-disabled.focus-visible,.spectrum-FieldButton--quiet:disabled.focus-visible{box-shadow:none} | ||
`; | ||
export default styles; |
@@ -14,11 +14,12 @@ /* | ||
const styles = css` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;position:relative;height:var(--spectrum-actionbutton-height,var(--spectrum-global-dimension-size-400));min-width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));padding:0 calc(var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)) - var(--spectrum-actionbutton-border-size, 1px));border-radius:var(--spectrum-actionbutton-border-radius,var(--spectrum-global-dimension-size-50));font-size:var(--spectrum-actionbutton-text-size,var(--spectrum-global-dimension-font-size-100));font-weight:var(--spectrum-actionbutton-text-font-weight,400);background-color:var(--spectrum-actionbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-actionbutton-border-size,1px) solid var(--spectrum-actionbutton-border-color,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color,var(--spectrum-global-color-gray-800))}#button:focus{outline:none;background-color:var(--spectrum-actionbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}:host([disabled]) #button{cursor:default;background-color:var(--spectrum-actionbutton-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}::slotted([slot=icon]){max-height:100%;flex-shrink:0;color:var(--spectrum-actionbutton-icon-color,var(--spectrum-global-color-gray-700))}slot[name=icon]+#label{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85));padding-right:calc(var(--spectrum-actionbutton-text-padding-x, | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;position:relative;height:var(--spectrum-actionbutton-height,var(--spectrum-alias-single-line-height));min-width:var(--spectrum-actionbutton-min-width,var(--spectrum-global-dimension-size-400));padding:0 calc(var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)) - var(--spectrum-actionbutton-border-size, | ||
var(--spectrum-alias-border-size-thin)));border-radius:var(--spectrum-actionbutton-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-actionbutton-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-text-font-weight,var(--spectrum-alias-body-text-font-weight));background-color:var(--spectrum-actionbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-actionbutton-border-size,var(--spectrum-alias-border-size-thin)) solid var(--spectrum-actionbutton-border-color,var(--spectrum-alias-border-color));color:var(--spectrum-actionbutton-text-color,var(--spectrum-alias-text-color))}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}:host([disabled]) #button{cursor:default;background-color:var(--spectrum-actionbutton-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}::slotted([slot=icon]){max-height:100%;flex-shrink:0;color:var(--spectrum-actionbutton-icon-color,var(--spectrum-alias-icon-color))}slot[name=icon]+#label{padding-left:var(--spectrum-actionbutton-icon-padding-x,var(--spectrum-global-dimension-size-85));padding-right:calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-global-dimension-size-150)) - var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)))}.spectrum-Icon--sizeS:only-child{position:absolute;top:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-global-dimension-size-225))/2);left:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-global-dimension-size-225))/2)}#label:only-child{padding:0 calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-alias-workflow-icon-size))/2);left:calc(50% - var(--spectrum-actionbutton-icon-size, | ||
var(--spectrum-alias-workflow-icon-size))/2)}#label:only-child{padding:0 calc(var(--spectrum-actionbutton-text-padding-x, | ||
var(--spectrum-global-dimension-size-150)) - var(--spectrum-actionbutton-icon-padding-x, | ||
var(--spectrum-global-dimension-size-85)))}#hold-affordance{position:absolute;right:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40));bottom:var(--spectrum-actionbutton-hold-icon-padding-bottom,var(--spectrum-global-dimension-size-40));color:var(--spectrum-actionbutton-hold-icon-color,var(--spectrum-global-color-gray-700))}#label{align-self:center;justify-self:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#label:empty{display:none}:host([quiet]) #button{border-width:var(--spectrum-actionbutton-quiet-border-size,1px);border-radius:var(--spectrum-actionbutton-quiet-border-radius,var(--spectrum-global-dimension-size-50));font-size:var(--spectrum-actionbutton-quiet-text-size,var(--spectrum-global-dimension-font-size-100));font-weight:var(--spectrum-actionbutton-quiet-text-font-weight,400);background-color:var(--spectrum-actionbutton-quiet-background-color,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color,transparent);color:var(--spectrum-actionbutton-quiet-text-color,var(--spectrum-global-color-gray-800))}#button:hover{background-color:var(--spectrum-actionbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-hover,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-hover,var(--spectrum-global-color-gray-900))}#button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-hover,var(--spectrum-global-color-gray-900))}#button:hover #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-hover,var(--spectrum-global-color-gray-900))}#button:focus ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button:focus #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button:active{background-color:var(--spectrum-actionbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-down,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-down,var(--spectrum-global-color-gray-900))}#button:active #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-down,var(--spectrum-global-color-gray-900))}:host([disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([disabled]) #button #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-disabled,var(--spectrum-global-color-gray-400))}:host([selected]) #button{background-color:var(--spectrum-actionbutton-background-color-selected,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color-selected,var(--spectrum-global-color-gray-800))}:host([selected]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected,var(--spectrum-global-color-gray-700))}:host([selected]) #button:focus{background-color:var(--spectrum-actionbutton-background-color-selected-key-focus,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-text-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([selected]) #button:focus ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([selected]) #button:hover{background-color:var(--spectrum-actionbutton-background-color-selected-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-hover,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([selected]) #button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([selected]) #button:active{background-color:var(--spectrum-actionbutton-background-color-selected-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-down,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-down,var(--spectrum-global-color-gray-900))}:host([selected]) #button:active ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-down,var(--spectrum-global-color-gray-900))}:host([selected][disabled]) #button{background-color:var(--spectrum-actionbutton-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-selected-disabled,var(--spectrum-global-color-gray-500))}:host([selected][disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-disabled,var(--spectrum-global-color-gray-400))}:host([quiet]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-hover,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color-hover,transparent);color:var(--spectrum-actionbutton-quiet-text-color-hover,var(--spectrum-global-color-gray-900));box-shadow:none}:host([quiet]) #button:focus{background-color:var(--spectrum-actionbutton-quiet-background-color-key-focus,transparent);box-shadow:0 0 0 var(--spectrum-actionbutton-quiet-border-size-key-focus,2px) var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-global-color-blue-400));border-color:var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-quiet-text-color-key-focus,var(--spectrum-global-color-gray-900))}:host([quiet]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-down,var(--spectrum-global-color-gray-900));box-shadow:none}:host([quiet][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-disabled,transparent);border-color:var(--spectrum-actionbutton-quiet-border-color-disabled,transparent);color:var(--spectrum-actionbutton-quiet-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([quiet][selected]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected,var(--spectrum-global-color-gray-800))}:host([quiet][selected]) #button:focus{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-key-focus,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-actionbutton-quiet-text-color-selected-key-focus,var(--spectrum-global-color-gray-900))}:host([quiet][selected]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-hover,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-hover,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-hover,var(--spectrum-global-color-gray-900))}:host([quiet][selected]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-down,var(--spectrum-global-color-gray-900))}:host([quiet][selected][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-quiet-text-color-selected-disabled,var(--spectrum-global-color-gray-500))} | ||
var(--spectrum-global-dimension-size-85)))}#hold-affordance{position:absolute;right:var(--spectrum-actionbutton-hold-icon-padding-right,var(--spectrum-global-dimension-size-40));bottom:var(--spectrum-actionbutton-hold-icon-padding-bottom,var(--spectrum-global-dimension-size-40));color:var(--spectrum-actionbutton-hold-icon-color,var(--spectrum-alias-icon-color))}#label{align-self:center;justify-self:center;text-align:center;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#label:empty{display:none}:host([quiet]) #button{border-width:var(--spectrum-actionbutton-quiet-border-size,var(--spectrum-alias-border-size-thin));border-radius:var(--spectrum-actionbutton-quiet-border-radius,var(--spectrum-alias-border-radius-regular));font-size:var(--spectrum-actionbutton-quiet-text-size,var(--spectrum-alias-font-size-default));font-weight:var(--spectrum-actionbutton-quiet-text-font-weight,var(--spectrum-alias-body-text-font-weight));background-color:var(--spectrum-actionbutton-quiet-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color,var(--spectrum-alias-text-color))}#button:hover{background-color:var(--spectrum-actionbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-hover,var(--spectrum-alias-border-color-hover));box-shadow:none;color:var(--spectrum-actionbutton-text-color-hover,var(--spectrum-alias-text-color-hover))}#button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-hover,var(--spectrum-alias-icon-color-hover))}#button:hover #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-hover,var(--spectrum-alias-icon-color-hover))}#button.focus-visible{background-color:var(--spectrum-actionbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-actionbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-text-color-key-focus,var(--spectrum-alias-text-color-hover))}#button.focus-visible ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-key-focus,var(--spectrum-alias-icon-color-focus))}#button.focus-visible #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-key-focus,var(--spectrum-alias-icon-color-hover))}#button:active{background-color:var(--spectrum-actionbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-down,var(--spectrum-global-color-gray-400));box-shadow:none;color:var(--spectrum-actionbutton-text-color-down,var(--spectrum-alias-text-color-down))}#button:active #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-down,var(--spectrum-alias-icon-color-down))}:host([disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}:host([disabled]) #button #hold-affordance{color:var(--spectrum-actionbutton-hold-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}:host([selected]) #button{background-color:var(--spectrum-actionbutton-background-color-selected,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-text-color-selected,var(--spectrum-alias-text-color))}:host([selected]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected,var(--spectrum-alias-icon-color))}:host([selected]) #button.focus-visible{background-color:var(--spectrum-actionbutton-background-color-selected-key-focus,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-text-color-selected-key-focus,var(--spectrum-alias-text-color-hover))}:host([selected]) #button.focus-visible ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-key-focus,var(--spectrum-alias-icon-color-hover))}:host([selected]) #button:hover{background-color:var(--spectrum-actionbutton-background-color-selected-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-hover,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-hover,var(--spectrum-alias-text-color-hover))}:host([selected]) #button:hover ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-hover,var(--spectrum-alias-icon-color-hover))}:host([selected]) #button:active{background-color:var(--spectrum-actionbutton-background-color-selected-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-down,var(--spectrum-global-color-gray-400));color:var(--spectrum-actionbutton-text-color-selected-down,var(--spectrum-alias-text-color-down))}:host([selected]) #button:active ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-down,var(--spectrum-alias-icon-color-down))}:host([selected][disabled]) #button{background-color:var(--spectrum-actionbutton-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-text-color-selected-disabled,var(--spectrum-alias-text-color-disabled))}:host([selected][disabled]) #button ::slotted([slot=icon]){color:var(--spectrum-actionbutton-icon-color-selected-disabled,var(--spectrum-alias-icon-color-disabled))}:host([quiet]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-hover,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color-hover,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color-hover,var(--spectrum-alias-text-color-hover));box-shadow:none}:host([quiet]) #button.focus-visible{background-color:var(--spectrum-actionbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 0 0 1px var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus));border-color:var(--spectrum-actionbutton-quiet-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-quiet-text-color-key-focus,var(--spectrum-alias-text-color-hover))}:host([quiet]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-down,var(--spectrum-alias-text-color-down));box-shadow:none}:host([quiet][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-actionbutton-quiet-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-actionbutton-quiet-text-color-disabled,var(--spectrum-alias-text-color-disabled))}:host([quiet][selected]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected,var(--spectrum-alias-text-color))}:host([quiet][selected]) #button.focus-visible{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-key-focus,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-actionbutton-quiet-text-color-selected-key-focus,var(--spectrum-alias-text-color-hover))}:host([quiet][selected]) #button:hover{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-hover,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-hover,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-hover,var(--spectrum-alias-text-color-hover))}:host([quiet][selected]) #button:active{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-actionbutton-quiet-text-color-selected-down,var(--spectrum-alias-text-color-down))}:host([quiet][selected][disabled]) #button{background-color:var(--spectrum-actionbutton-quiet-background-color-selected-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-actionbutton-quiet-border-color-selected-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-actionbutton-quiet-text-color-selected-disabled,var(--spectrum-alias-text-color-disabled))} | ||
`; | ||
export default styles; |
@@ -14,6 +14,7 @@ /* | ||
const styles = css` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;border-width:var(--spectrum-button-primary-border-size,2px);border-style:solid;border-radius:var(--spectrum-button-primary-border-radius,var(--spectrum-global-dimension-size-200));min-height:var(--spectrum-button-primary-height,var(--spectrum-global-dimension-size-400));height:auto;min-width:var(--spectrum-button-primary-min-width,var(--spectrum-button-cta-min-width));padding:var(--spectrum-global-dimension-size-50) calc(var(--spectrum-button-primary-padding-x, | ||
var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, 2px));padding-bottom:calc(var(--spectrum-global-dimension-size-50) + .5px);padding-top:calc(var(--spectrum-global-dimension-size-50) - .5px);font-size:var(--spectrum-button-primary-text-size,var(--spectrum-global-dimension-font-size-150));font-weight:var(--spectrum-button-primary-text-font-weight,700)}#button:focus{outline:none;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-primary-border-color-key-focus,#1473e6)}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}:host([disabled]) #button{cursor:default}::slotted([slot=icon]){max-height:100%;flex-shrink:0}#button:active,#button:hover{box-shadow:none}slot[name=icon]+#label{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}#label+::slotted([slot=icon]){margin-left:calc(var(--spectrum-button-primary-text-gap, | ||
var(--spectrum-global-dimension-size-100))/2)}#label{align-self:center;justify-self:center;width:100%}#label:empty{display:none}#button:active{box-shadow:none}:host([variant=cta]) #button{background-color:var(--spectrum-button-cta-background-color,#1473e6);border-color:var(--spectrum-button-cta-border-color,#1473e6);color:var(--spectrum-button-cta-text-color,#fff)}:host([variant=cta]) #button:hover{background-color:var(--spectrum-button-cta-background-color-hover,#0d66d0);border-color:var(--spectrum-button-cta-border-color-hover,#0d66d0);color:var(--spectrum-button-cta-text-color-hover,#fff)}:host([variant=cta]) #button:focus{background-color:var(--spectrum-button-cta-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-cta-border-color-key-focus,#1473e6);color:var(--spectrum-button-cta-text-color-key-focus,#fff)}:host([variant=cta]) #button:active{background-color:var(--spectrum-button-cta-background-color-down,#0d66d0);border-color:var(--spectrum-button-cta-border-color-down,#0d66d0);color:var(--spectrum-button-cta-text-color-down,#fff)}:host([variant=cta][disabled]) #button{background-color:var(--spectrum-button-cta-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-cta-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-cta-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=primary]) #button{background-color:var(--spectrum-button-primary-background-color,transparent);border-color:var(--spectrum-button-primary-border-color,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary]) #button:hover{background-color:var(--spectrum-button-primary-background-color-hover,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-primary-border-color-hover,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=primary]) #button:focus{background-color:var(--spectrum-button-primary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-primary-border-color-key-focus,#1473e6);color:var(--spectrum-button-primary-text-color-key-focus,#fff)}:host([variant=primary]) #button:active{background-color:var(--spectrum-button-primary-background-color-down,var(--spectrum-global-color-gray-900));border-color:var(--spectrum-button-primary-border-color-down,var(--spectrum-global-color-gray-900));color:var(--spectrum-button-primary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=primary][disabled]) #button{background-color:var(--spectrum-button-primary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-primary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary]) #button{background-color:var(--spectrum-button-secondary-background-color,transparent);border-color:var(--spectrum-button-secondary-border-color,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary]) #button:hover{background-color:var(--spectrum-button-secondary-background-color-hover,var(--spectrum-global-color-gray-700));border-color:var(--spectrum-button-secondary-border-color-hover,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=secondary]) #button:focus{background-color:var(--spectrum-button-secondary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-secondary-border-color-key-focus,#1473e6);color:var(--spectrum-button-secondary-text-color-key-focus,#fff)}:host([variant=secondary]) #button:active{background-color:var(--spectrum-button-secondary-background-color-down,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-secondary-border-color-down,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-secondary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=secondary][disabled]) #button{background-color:var(--spectrum-button-secondary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-secondary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative]) #button{background-color:var(--spectrum-button-warning-background-color,transparent);border-color:var(--spectrum-button-warning-border-color,var(--spectrum-global-color-red-600));color:var(--spectrum-button-warning-text-color,var(--spectrum-global-color-red-600))}:host([variant=negative]) #button:hover{background-color:var(--spectrum-button-warning-background-color-hover,var(--spectrum-global-color-red-600));border-color:var(--spectrum-button-warning-border-color-hover,var(--spectrum-global-color-red-600));color:var(--spectrum-button-warning-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=negative]) #button:focus{background-color:var(--spectrum-button-warning-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-warning-border-color-key-focus,#1473e6);color:var(--spectrum-button-warning-text-color-key-focus,#fff)}:host([variant=negative]) #button:active{background-color:var(--spectrum-button-warning-background-color-down,var(--spectrum-global-color-red-700));border-color:var(--spectrum-button-warning-border-color-down,var(--spectrum-global-color-red-700));color:var(--spectrum-button-warning-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=negative][disabled]) #button{background-color:var(--spectrum-button-warning-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-warning-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=overBackground]) #button{background-color:var(--spectrum-button-over-background-background-color,transparent);border-color:var(--spectrum-button-over-background-border-color,#fff);color:var(--spectrum-button-over-background-text-color,#fff)}:host([variant=overBackground]) #button:hover{background-color:var(--spectrum-button-over-background-background-color-hover,#fff);border-color:var(--spectrum-button-over-background-border-color-hover,#fff);color:inherit}:host([variant=overBackground]) #button:focus{background-color:var(--spectrum-button-over-background-background-color-key-focus,#fff);border-color:var(--spectrum-button-over-background-border-color-key-focus,#fff);color:inherit;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-over-background-border-color-key-focus,#fff)}:host([variant=overBackground]) #button:active{background-color:var(--spectrum-button-over-background-background-color-down,#fff);border-color:var(--spectrum-button-over-background-border-color-down,#fff);color:inherit;box-shadow:none}:host([variant=overBackground][disabled]) #button{background-color:var(--spectrum-button-over-background-background-color-disabled,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-over-background-border-color-disabled,transparent);color:var(--spectrum-button-over-background-text-color-disabled,hsla(0,0%,100%,.35))}:host([variant=overBackground][quiet]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color,transparent);color:var(--spectrum-button-quiet-over-background-text-color,#fff)}:host([variant=overBackground][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,transparent);color:var(--spectrum-button-quiet-over-background-text-color-hover,#fff)}:host([variant=overBackground][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,#fff);border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff);color:inherit;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff)}:host([variant=overBackground][quiet]) #button:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,transparent);color:var(--spectrum-button-quiet-over-background-text-color-down,#fff);box-shadow:none}:host([variant=overBackground][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,transparent);color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))}:host([variant=primary][quiet]) #button{background-color:var(--spectrum-button-quiet-primary-background-color,transparent);border-color:var(--spectrum-button-quiet-primary-border-color,transparent);color:var(--spectrum-button-quiet-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-primary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-primary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-primary-text-color-hover,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-primary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-primary-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-primary-text-color-key-focus,#fff)}:host([variant=primary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-primary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-primary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-primary-text-color-down,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-primary-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-primary-border-color-disabled,transparent);color:var(--spectrum-button-quiet-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary][quiet]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color,transparent);border-color:var(--spectrum-button-quiet-secondary-border-color,transparent);color:var(--spectrum-button-quiet-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-secondary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-secondary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-secondary-text-color-hover,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-secondary-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-secondary-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-secondary-text-color-key-focus,#fff)}:host([variant=secondary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-secondary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-secondary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-secondary-text-color-down,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-secondary-border-color-disabled,transparent);color:var(--spectrum-button-quiet-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative][quiet]) #button{background-color:var(--spectrum-button-quiet-warning-background-color,transparent);border-color:var(--spectrum-button-quiet-warning-border-color,transparent);color:var(--spectrum-button-quiet-warning-text-color,var(--spectrum-global-color-red-500))}:host([variant=negative][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-warning-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-warning-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-warning-text-color-hover,var(--spectrum-global-color-red-600))}:host([variant=negative][quiet]) #button:focus{background-color:var(--spectrum-button-quiet-warning-background-color-key-focus,#1473e6);border-color:var(--spectrum-button-quiet-warning-border-color-key-focus,#1473e6);color:var(--spectrum-button-quiet-warning-text-color-key-focus,#fff)}:host([variant=negative][quiet]) #button:active{background-color:var(--spectrum-button-quiet-warning-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-warning-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-warning-text-color-down,var(--spectrum-global-color-red-600))}:host([variant=negative][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-warning-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-warning-border-color-disabled,transparent);color:var(--spectrum-button-quiet-warning-text-color-disabled,var(--spectrum-global-color-gray-500))} | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;margin:0;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;border-width:var(--spectrum-button-primary-border-size,var(--spectrum-alias-border-size-thick));border-style:solid;border-radius:var(--spectrum-button-primary-border-radius,var(--spectrum-alias-border-radius-large));min-height:var(--spectrum-button-primary-height,var(--spectrum-alias-single-line-height));height:auto;min-width:var(--spectrum-button-primary-min-width);padding:var(--spectrum-global-dimension-size-50) calc(var(--spectrum-button-primary-padding-x, | ||
var(--spectrum-global-dimension-size-200)) - var(--spectrum-button-primary-border-size, | ||
var(--spectrum-alias-border-size-thick)));padding-bottom:calc(var(--spectrum-global-dimension-size-50) + .5px);padding-top:calc(var(--spectrum-global-dimension-size-50) - .5px);font-size:var(--spectrum-button-primary-text-size,var(--spectrum-alias-pill-button-text-size));font-weight:var(--spectrum-button-primary-text-font-weight,var(--spectrum-global-font-weight-bold))}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}:host([disabled]) #button{cursor:default}::slotted([slot=icon]){max-height:100%;flex-shrink:0}#button:active,#button:hover{box-shadow:none}slot[name=icon]+#label{margin-left:var(--spectrum-button-primary-text-gap,var(--spectrum-global-dimension-size-100))}#label+::slotted([slot=icon]){margin-left:calc(var(--spectrum-button-primary-text-gap, | ||
var(--spectrum-global-dimension-size-100))/2)}#label{align-self:center;justify-self:center;text-align:center;width:100%}#label:empty{display:none}#button.focus-visible{box-shadow:0 0 0 1px var(--spectrum-button-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus))}#button:active{box-shadow:none}:host([variant=cta]) #button{background-color:var(--spectrum-button-cta-background-color,var(--spectrum-semantic-cta-color-background-default));border-color:var(--spectrum-button-cta-border-color,var(--spectrum-semantic-cta-color-background-default));color:var(--spectrum-button-cta-text-color,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button:hover{background-color:var(--spectrum-button-cta-background-color-hover,var(--spectrum-semantic-cta-color-background-hover));border-color:var(--spectrum-button-cta-border-color-hover,var(--spectrum-semantic-cta-color-background-hover));color:var(--spectrum-button-cta-text-color-hover,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button.focus-visible{background-color:var(--spectrum-button-cta-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-cta-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-cta-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=cta]) #button:active{background-color:var(--spectrum-button-cta-background-color-down,var(--spectrum-semantic-cta-color-background-down));border-color:var(--spectrum-button-cta-border-color-down,var(--spectrum-semantic-cta-color-background-down));color:var(--spectrum-button-cta-text-color-down,var(--spectrum-global-color-static-white))}:host([variant=cta][disabled]) #button{background-color:var(--spectrum-button-cta-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-cta-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-cta-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=primary]) #button{background-color:var(--spectrum-button-primary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-primary-border-color,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary]) #button:hover{background-color:var(--spectrum-button-primary-background-color-hover,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-primary-border-color-hover,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-primary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=primary]) #button.focus-visible{background-color:var(--spectrum-button-primary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-primary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=primary]) #button:active{background-color:var(--spectrum-button-primary-background-color-down,var(--spectrum-global-color-gray-900));border-color:var(--spectrum-button-primary-border-color-down,var(--spectrum-global-color-gray-900));color:var(--spectrum-button-primary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=primary][disabled]) #button{background-color:var(--spectrum-button-primary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-primary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary]) #button{background-color:var(--spectrum-button-secondary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-secondary-border-color,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary]) #button:hover{background-color:var(--spectrum-button-secondary-background-color-hover,var(--spectrum-global-color-gray-700));border-color:var(--spectrum-button-secondary-border-color-hover,var(--spectrum-global-color-gray-700));color:var(--spectrum-button-secondary-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=secondary]) #button.focus-visible{background-color:var(--spectrum-button-secondary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-secondary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-secondary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=secondary]) #button:active{background-color:var(--spectrum-button-secondary-background-color-down,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-button-secondary-border-color-down,var(--spectrum-global-color-gray-800));color:var(--spectrum-button-secondary-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=secondary][disabled]) #button{background-color:var(--spectrum-button-secondary-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-secondary-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative]) #button{background-color:var(--spectrum-button-warning-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-warning-border-color,var(--spectrum-semantic-negative-color-text-small));color:var(--spectrum-button-warning-text-color,var(--spectrum-semantic-negative-color-text-small))}:host([variant=negative]) #button:hover{background-color:var(--spectrum-button-warning-background-color-hover,var(--spectrum-semantic-negative-color-text-small));border-color:var(--spectrum-button-warning-border-color-hover,var(--spectrum-semantic-negative-color-text-small));color:var(--spectrum-button-warning-text-color-hover,var(--spectrum-global-color-gray-50))}:host([variant=negative]) #button.focus-visible{background-color:var(--spectrum-button-warning-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-warning-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-warning-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=negative]) #button:active{background-color:var(--spectrum-button-warning-background-color-down,var(--spectrum-global-color-red-700));border-color:var(--spectrum-button-warning-border-color-down,var(--spectrum-global-color-red-700));color:var(--spectrum-button-warning-text-color-down,var(--spectrum-global-color-gray-50))}:host([variant=negative][disabled]) #button{background-color:var(--spectrum-button-warning-background-color-disabled,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-warning-border-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-warning-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=overBackground]) #button{background-color:var(--spectrum-button-over-background-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-over-background-border-color,var(--spectrum-global-color-static-white));color:var(--spectrum-button-over-background-text-color,var(--spectrum-global-color-static-white))}:host([variant=overBackground]) #button:hover{background-color:var(--spectrum-button-over-background-background-color-hover,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-hover,var(--spectrum-global-color-static-white));color:inherit}:host([variant=overBackground]) #button.focus-visible{background-color:var(--spectrum-button-over-background-background-color-key-focus,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-key-focus,var(--spectrum-global-color-static-white));color:inherit;box-shadow:0 0 0 1px var(--spectrum-button-over-background-border-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=overBackground]) #button:active{background-color:var(--spectrum-button-over-background-background-color-down,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-over-background-border-color-down,var(--spectrum-global-color-static-white));color:inherit;box-shadow:none}:host([variant=overBackground][disabled]) #button{background-color:var(--spectrum-button-over-background-background-color-disabled,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-over-background-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-over-background-text-color-disabled,hsla(0,0%,100%,.35))}:host([variant=overBackground][quiet]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-hover,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white));color:inherit;box-shadow:0 0 0 1px var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=overBackground][quiet]) #button:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-down,var(--spectrum-global-color-static-white));box-shadow:none}:host([variant=overBackground][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))}:host([variant=primary][quiet]) #button{background-color:var(--spectrum-button-quiet-primary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-primary-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-primary-text-color,var(--spectrum-global-color-gray-800))}:host([variant=primary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-primary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-primary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-primary-text-color-hover,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-primary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-primary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-primary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=primary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-primary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-primary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-primary-text-color-down,var(--spectrum-global-color-gray-900))}:host([variant=primary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-primary-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-primary-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-primary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=secondary][quiet]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-secondary-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-secondary-text-color,var(--spectrum-global-color-gray-700))}:host([variant=secondary][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-secondary-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-secondary-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-secondary-text-color-hover,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-secondary-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-secondary-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-secondary-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=secondary][quiet]) #button:active{background-color:var(--spectrum-button-quiet-secondary-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-secondary-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-secondary-text-color-down,var(--spectrum-global-color-gray-800))}:host([variant=secondary][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-secondary-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-secondary-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-secondary-text-color-disabled,var(--spectrum-global-color-gray-500))}:host([variant=negative][quiet]) #button{background-color:var(--spectrum-button-quiet-warning-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-warning-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-warning-text-color,var(--spectrum-semantic-negative-color-text-small))}:host([variant=negative][quiet]) #button:hover{background-color:var(--spectrum-button-quiet-warning-background-color-hover,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-button-quiet-warning-border-color-hover,var(--spectrum-global-color-gray-200));color:var(--spectrum-button-quiet-warning-text-color-hover,var(--spectrum-global-color-red-700))}:host([variant=negative][quiet]) #button.focus-visible{background-color:var(--spectrum-button-quiet-warning-background-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));border-color:var(--spectrum-button-quiet-warning-border-color-key-focus,var(--spectrum-semantic-cta-color-background-key-focus));color:var(--spectrum-button-quiet-warning-text-color-key-focus,var(--spectrum-global-color-static-white))}:host([variant=negative][quiet]) #button:active{background-color:var(--spectrum-button-quiet-warning-background-color-down,var(--spectrum-global-color-gray-300));border-color:var(--spectrum-button-quiet-warning-border-color-down,var(--spectrum-global-color-gray-300));color:var(--spectrum-button-quiet-warning-text-color-down,var(--spectrum-global-color-red-700))}:host([variant=negative][quiet][disabled]) #button{background-color:var(--spectrum-button-quiet-warning-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-warning-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-warning-text-color-disabled,var(--spectrum-global-color-gray-500))} | ||
`; | ||
export default styles; |
@@ -14,4 +14,4 @@ /* | ||
const styles = css` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;width:var(--spectrum-clearbutton-medium-width,var(--spectrum-global-dimension-size-400));height:var(--spectrum-clearbutton-medium-height,var(--spectrum-global-dimension-size-400));border-radius:100%;padding:0;margin:0;border:none;background-color:var(--spectrum-clearbutton-medium-background-color,transparent);color:var(--spectrum-clearbutton-medium-icon-color,var(--spectrum-global-color-gray-600))}#button:focus{outline:none;background-color:var(--spectrum-clearbutton-medium-background-color-key-focus,transparent);color:var(--spectrum-clearbutton-medium-icon-color-key-focus,var(--spectrum-global-color-gray-900))}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}#button:disabled{cursor:default}.spectrum-Icon{max-height:100%;flex-shrink:0}.spectrum-ClearButton--small{width:var(--spectrum-clearbutton-small-width,var(--spectrum-global-dimension-size-300));height:var(--spectrum-clearbutton-small-height,var(--spectrum-global-dimension-size-300))}#button:hover{background-color:var(--spectrum-clearbutton-medium-background-color-hover,transparent);color:var(--spectrum-clearbutton-medium-icon-color-hover,var(--spectrum-global-color-gray-900))}#button:active{background-color:var(--spectrum-clearbutton-medium-background-color-down,transparent);color:var(--spectrum-clearbutton-medium-icon-color-down,var(--spectrum-global-color-gray-900))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-clearbutton-medium-background-color-disabled,transparent);color:var(--spectrum-clearbutton-medium-icon-color-disabled,var(--spectrum-global-color-gray-500))}.spectrum-ClearButton--overBackground{background-color:var(--spectrum-button-quiet-over-background-background-color,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color,transparent);color:var(--spectrum-button-quiet-over-background-text-color,#fff)}.spectrum-ClearButton--overBackground:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,transparent);color:var(--spectrum-button-quiet-over-background-text-color-hover,#fff)}.spectrum-ClearButton--overBackground:focus{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,#fff);border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff);color:inherit;box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-button-quiet-over-background-border-color-key-focus,#fff)}.spectrum-ClearButton--overBackground:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,transparent);color:var(--spectrum-button-quiet-over-background-text-color-down,#fff);box-shadow:none}.spectrum-ClearButton--overBackground.is-disabled,.spectrum-ClearButton--overBackground:disabled{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,transparent);border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,transparent);color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))} | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;cursor:pointer;width:var(--spectrum-clearbutton-medium-width,var(--spectrum-alias-single-line-height));height:var(--spectrum-clearbutton-medium-height,var(--spectrum-alias-single-line-height));border-radius:100%;padding:0;margin:0;border:none;background-color:var(--spectrum-clearbutton-medium-background-color,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-clearbutton-medium-icon-color,var(--spectrum-alias-icon-color))}#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:disabled{cursor:default}.spectrum-Icon{max-height:100%;flex-shrink:0}.spectrum-ClearButton--small{width:var(--spectrum-clearbutton-small-width,var(--spectrum-global-dimension-size-300));height:var(--spectrum-clearbutton-small-height,var(--spectrum-global-dimension-size-300))}#button:hover{background-color:var(--spectrum-clearbutton-medium-background-color-hover,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-clearbutton-medium-icon-color-hover,var(--spectrum-alias-icon-color-hover))}#button:active{background-color:var(--spectrum-clearbutton-medium-background-color-down,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-clearbutton-medium-icon-color-down,var(--spectrum-alias-icon-color-down))}#button.focus-visible{background-color:var(--spectrum-clearbutton-medium-background-color-key-focus,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-clearbutton-medium-icon-color-key-focus,var(--spectrum-alias-icon-color-focus))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-clearbutton-medium-background-color-disabled,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-clearbutton-medium-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}.spectrum-ClearButton--overBackground{background-color:var(--spectrum-button-quiet-over-background-background-color,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color,var(--spectrum-global-color-static-white))}.spectrum-ClearButton--overBackground:hover{background-color:var(--spectrum-button-quiet-over-background-background-color-hover,hsla(0,0%,100%,.1));border-color:var(--spectrum-button-quiet-over-background-border-color-hover,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-hover,var(--spectrum-global-color-static-white))}.spectrum-ClearButton--overBackground.focus-visible{background-color:var(--spectrum-button-quiet-over-background-background-color-key-focus,var(--spectrum-global-color-static-white));border-color:var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white));color:inherit;box-shadow:0 0 0 1px var(--spectrum-button-quiet-over-background-border-color-key-focus,var(--spectrum-global-color-static-white))}.spectrum-ClearButton--overBackground:active{background-color:var(--spectrum-button-quiet-over-background-background-color-down,hsla(0,0%,100%,.15));border-color:var(--spectrum-button-quiet-over-background-border-color-down,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-down,var(--spectrum-global-color-static-white));box-shadow:none}.spectrum-ClearButton--overBackground.is-disabled,.spectrum-ClearButton--overBackground:disabled{background-color:var(--spectrum-button-quiet-over-background-background-color-disabled,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-button-quiet-over-background-border-color-disabled,var(--spectrum-alias-border-color-transparent));color:var(--spectrum-button-quiet-over-background-text-color-disabled,hsla(0,0%,100%,.15))} | ||
`; | ||
export default styles; |
@@ -14,4 +14,4 @@ /* | ||
const styles = css` | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;border-style:solid;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;height:var(--spectrum-dropdown-height,var(--spectrum-global-dimension-size-400));font-family:inherit;font-weight:400;font-size:var(--spectrum-dropdown-text-size,var(--spectrum-global-dimension-font-size-100));line-height:normal;-webkit-font-smoothing:initial;cursor:pointer;margin:0;padding:0 var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));border-radius:var(--spectrum-global-dimension-size-50);transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-global-color-gray-800));background-color:var(--spectrum-fieldbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-dropdown-border-size,1px) solid var(--spectrum-fieldbutton-border-color,var(--spectrum-global-color-gray-300))}#button,#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:-moz-focusring{outline:1px dotted ButtonText}#button:disabled{cursor:default}.icon{max-height:100%;flex-shrink:0}#button.is-disabled,#button:disabled{border-width:0;cursor:default}#button.is-open{border-width:var(--spectrum-dropdown-border-size,1px)}.spectrum-FieldButton--quiet{margin:0;padding:0;border-width:0;border-radius:var(--spectrum-fieldbutton-quiet-border-radius,0);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-global-color-gray-800));border-color:var(--spectrum-fieldbutton-quiet-border-color,transparent);background-color:var(--spectrum-fieldbutton-quiet-background-color,transparent)}#button:hover{color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-global-color-gray-900));background-color:var(--spectrum-fieldbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-hover,var(--spectrum-global-color-gray-400))}#button.is-focused,#button:focus{background-color:var(--spectrum-fieldbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400));color:var(--spectrum-fieldbutton-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button.is-focused.is-placeholder,#button:focus.is-placeholder{color:var(--spectrum-fieldbutton-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}#button.is-selected,#button:active{background-color:var(--spectrum-fieldbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-fieldbutton-border-color-down,var(--spectrum-global-color-gray-400))}#button.is-selected.is-focused,#button.is-selected:focus,#button:active.is-focused,#button:active:focus{box-shadow:none}:host([invalid]) #button{border-color:var(--spectrum-fieldbutton-border-color-error,var(--spectrum-global-color-red-500))}:host([invalid]) #button:hover{border-color:var(--spectrum-fieldbutton-border-color-error-hover,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-selected,:host([invalid]) #button:active{border-color:var(--spectrum-fieldbutton-border-color-error-down,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-focused,:host([invalid]) #button:focus{border-color:var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400));box-shadow:0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus,1px) var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-fieldbutton-background-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}#button.is-disabled:focus,#button:disabled:focus{box-shadow:none}#button.is-disabled .icon,#button:disabled .icon{color:var(--spectrum-fieldbutton-icon-color-disabled,var(--spectrum-global-color-gray-400))}.spectrum-FieldButton--quiet:hover{background-color:var(--spectrum-fieldbutton-quiet-background-color-hover,transparent);color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-global-color-gray-900))}.spectrum-FieldButton--quiet.is-focused,.spectrum-FieldButton--quiet:focus{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,transparent);box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400))}.spectrum-FieldButton--quiet.is-focused.is-placeholder,.spectrum-FieldButton--quiet:focus.is-placeholder{color:var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus,var(--spectrum-global-color-gray-900))}.spectrum-FieldButton--quiet.is-selected,.spectrum-FieldButton--quiet:active{background-color:var(--spectrum-fieldbutton-quiet-background-color-down,transparent);border-color:var(--spectrum-fieldbutton-quiet-border-color-down,transparent)}.spectrum-FieldButton--quiet.is-selected.is-focused,.spectrum-FieldButton--quiet.is-selected:focus,.spectrum-FieldButton--quiet:active.is-focused,.spectrum-FieldButton--quiet:active:focus{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,transparent);box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-global-color-blue-400))}:host([invalid]) .spectrum-FieldButton--quiet.is-focused,:host([invalid]) .spectrum-FieldButton--quiet:focus{box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-global-color-blue-400))}.spectrum-FieldButton--quiet.is-disabled,.spectrum-FieldButton--quiet:disabled{background-color:var(--spectrum-fieldbutton-quiet-background-color-disabled,transparent);color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-global-color-gray-500))}.spectrum-FieldButton--quiet.is-disabled:focus,.spectrum-FieldButton--quiet:disabled:focus{box-shadow:none} | ||
#button{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;overflow:visible;border-style:solid;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:button;vertical-align:top;transition:background var(--spectrum-global-animation-duration-100,.13s) ease-out,border-color var(--spectrum-global-animation-duration-100,.13s) ease-out,color var(--spectrum-global-animation-duration-100,.13s) ease-out,box-shadow var(--spectrum-global-animation-duration-100,.13s) ease-out;text-decoration:none;font-family:adobe-clean-ux,adobe-clean,Source Sans Pro,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3;height:var(--spectrum-dropdown-height,var(--spectrum-global-dimension-size-400));font-family:inherit;font-weight:400;font-size:var(--spectrum-dropdown-text-size,var(--spectrum-alias-font-size-default));line-height:normal;-webkit-font-smoothing:initial;cursor:pointer;margin:0;padding:0 var(--spectrum-dropdown-padding-x,var(--spectrum-global-dimension-size-150));border-radius:var(--spectrum-global-dimension-size-50);transition:background-color var(--spectrum-global-animation-duration-100,.13s),box-shadow var(--spectrum-global-animation-duration-100,.13s),border-color var(--spectrum-global-animation-duration-100,.13s);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-alias-text-color));background-color:var(--spectrum-fieldbutton-background-color,var(--spectrum-global-color-gray-75));border:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin)) solid var(--spectrum-fieldbutton-border-color,var(--spectrum-global-color-gray-300))}#button,#button:focus{outline:none}#button::-moz-focus-inner{border:0;border-style:none;padding:0;margin-top:-2px;margin-bottom:-2px}#button:disabled{cursor:default}.icon{max-height:100%;flex-shrink:0}#button.is-disabled,#button:disabled{border-width:0;cursor:default}#button.is-open{border-width:var(--spectrum-dropdown-border-size,var(--spectrum-alias-border-size-thin))}.spectrum-FieldButton--quiet{margin:0;padding:0;border-width:0;border-radius:var(--spectrum-fieldbutton-quiet-border-radius,0);color:var(--spectrum-fieldbutton-text-color,var(--spectrum-alias-text-color));border-color:var(--spectrum-fieldbutton-quiet-border-color,var(--spectrum-alias-border-color-transparent));background-color:var(--spectrum-fieldbutton-quiet-background-color,var(--spectrum-alias-background-color-transparent))}#button:hover{color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-alias-text-color-hover));background-color:var(--spectrum-fieldbutton-background-color-hover,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-hover,var(--spectrum-global-color-gray-400))}#button.focus-visible,#button.is-focused{background-color:var(--spectrum-fieldbutton-background-color-key-focus,var(--spectrum-global-color-gray-50));border-color:var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus));color:var(--spectrum-fieldbutton-text-color-key-focus,var(--spectrum-alias-text-color-hover))}#button.focus-visible.is-placeholder,#button.is-focused.is-placeholder{color:var(--spectrum-fieldbutton-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover))}#button.is-selected,#button:active{background-color:var(--spectrum-fieldbutton-background-color-down,var(--spectrum-global-color-gray-200));border-color:var(--spectrum-fieldbutton-border-color-down,var(--spectrum-global-color-gray-400))}#button.is-selected.focus-visible,#button.is-selected.is-focused,#button:active.focus-visible,#button:active.is-focused{box-shadow:none}:host([invalid]) #button{border-color:var(--spectrum-fieldbutton-border-color-error,var(--spectrum-global-color-red-500))}:host([invalid]) #button:hover{border-color:var(--spectrum-fieldbutton-border-color-error-hover,var(--spectrum-global-color-red-600))}:host([invalid]) #button.is-selected,:host([invalid]) #button:active{border-color:var(--spectrum-fieldbutton-border-color-error-down,var(--spectrum-global-color-red-600))}:host([invalid]) #button.focus-visible,:host([invalid]) #button.is-focused{border-color:var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus));box-shadow:0 0 0 1px var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus))}#button.is-disabled,#button:disabled{background-color:var(--spectrum-fieldbutton-background-color-disabled,var(--spectrum-global-color-gray-200));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}#button.is-disabled.focus-visible,#button:disabled.focus-visible{box-shadow:none}#button.is-disabled .icon,#button:disabled .icon{color:var(--spectrum-fieldbutton-icon-color-disabled,var(--spectrum-alias-icon-color-disabled))}.spectrum-FieldButton--quiet:hover{background-color:var(--spectrum-fieldbutton-quiet-background-color-hover,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-fieldbutton-text-color-hover,var(--spectrum-alias-text-color-hover))}.spectrum-FieldButton--quiet.focus-visible,.spectrum-FieldButton--quiet.is-focused{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-FieldButton--quiet.focus-visible.is-placeholder,.spectrum-FieldButton--quiet.is-focused.is-placeholder{color:var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus,var(--spectrum-alias-placeholder-text-color-hover))}.spectrum-FieldButton--quiet.is-selected,.spectrum-FieldButton--quiet:active{background-color:var(--spectrum-fieldbutton-quiet-background-color-down,var(--spectrum-alias-background-color-transparent));border-color:var(--spectrum-fieldbutton-quiet-border-color-down,var(--spectrum-alias-border-color-transparent))}.spectrum-FieldButton--quiet.is-selected.focus-visible,.spectrum-FieldButton--quiet.is-selected.is-focused,.spectrum-FieldButton--quiet:active.focus-visible,.spectrum-FieldButton--quiet:active.is-focused{background-color:var(--spectrum-fieldbutton-quiet-background-color-key-focus,var(--spectrum-alias-background-color-transparent));box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus,var(--spectrum-alias-border-color-focus))}:host([invalid]) .spectrum-FieldButton--quiet.focus-visible,:host([invalid]) .spectrum-FieldButton--quiet.is-focused{box-shadow:0 2px 0 0 var(--spectrum-fieldbutton-border-color-error-key-focus,var(--spectrum-alias-border-color-focus))}.spectrum-FieldButton--quiet.is-disabled,.spectrum-FieldButton--quiet:disabled{background-color:var(--spectrum-fieldbutton-quiet-background-color-disabled,var(--spectrum-alias-background-color-transparent));color:var(--spectrum-fieldbutton-text-color-disabled,var(--spectrum-alias-text-color-disabled))}.spectrum-FieldButton--quiet.is-disabled.focus-visible,.spectrum-FieldButton--quiet:disabled.focus-visible{box-shadow:none} | ||
`; | ||
export default styles; |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
394862
3662
1
+ Added@spectrum-web-components/shared@0.3.3(transitive)
+ Addedfocus-visible@5.2.1(transitive)
- Removed@spectrum-web-components/shared@0.2.0(transitive)