@stencila/style-stencila/dist/atoms/button/button.css

Custom designed theme for Stencila components

a.button,button{background-image:none;border-style:none;display:inline-block;font-family:sans-serif;font-family:var(--font-family-display,sans-serif);font-size:.875rem;font-weight:600;line-height:1.25rem;line-height:1;margin:0;padding:.5rem .75rem;text-decoration-line:none;transition:color .12s ease-out,background-color .12s ease-out;white-space:nowrap}@media (min-width:768px){a.button,button{font-size:1rem;line-height:1.5rem;line-height:1;padding-bottom:.5rem;padding-left:1rem;padding-right:1rem;padding-top:.5rem}}a.button.xsmall,a.button[size=xsmall],button.xsmall,button[size=xsmall]{border-radius:.125rem;font-size:.75rem;line-height:1rem;line-height:1;padding:.25rem .5rem}a.button.small,a.button[size=small],button.small,button[size=small]{font-size:.875rem;line-height:1.25rem;line-height:1;padding:.5rem .75rem}a.button.large,a.button[size=large],button.large,button[size=large]{font-size:1.5rem;line-height:2rem;line-height:1;padding:.75rem 1.5rem}a.button:hover,button:hover{cursor:pointer}a.button[disabled],a.button[disabled]:active,a.button[disabled]:hover,button[disabled],button[disabled]:active,button[disabled]:hover{cursor:not-allowed}a.button.fill,button.fill{width:100%}a.button>*,button>*{vertical-align:middle}a.button *,button *{pointer-events:none}a.button stencila-icon,button stencila-icon{--width:1.25em;--height:1.25em;padding-right:.25rem}a.button>img,a.button>svg,button>img,button>svg{display:inline-block;height:1.25em;padding-right:.25rem;width:1.25em}a.button.iconOnly,button.iconOnly{padding:.25rem}a.button.iconOnly stencila-icon,a.button.iconOnly>img,a.button.iconOnly>svg,button.iconOnly stencila-icon,button.iconOnly>img,button.iconOnly>svg{padding-right:0}a.button.iconOnly .label,button.iconOnly .label{clip:rect(0,0,0,0);border-width:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}:host(::slotted(button)>*){vertical-align:middle}:host(::slotted(button)>img),:host(::slotted(button)>svg){display:inline-block;height:1.25em;padding-right:.25rem;width:1.25em}:host[size=xsmall] stencila-icon{--width:1.125em;--height:1.125em}:host[size=xsmall]::slotted(button>img),:host[size=xsmall]::slotted(button>svg){height:1.125em;width:1.125em}:host([icon-only=true]::slotted(button)>img),:host([icon-only=true]::slotted(button)>svg){padding-right:0}a.button:not(.secondary),button:not(.secondary){border-radius:.125rem;color:#fff;color:var(--color-stock,#fff)}a.button:not(.secondary).xsmall,a.button:not(.secondary)[size=xsmall],button:not(.secondary).xsmall,button:not(.secondary)[size=xsmall]{border-radius:.125rem}a.button:not(.secondary).color-stock,button:not(.secondary).color-stock{background-color:#fff;background-color:var(--color-stock,#fff);color:#4a4a4a;color:var(--color-key,#4a4a4a)}a.button:not(.secondary).color-stock:hover,button:not(.secondary).color-stock:hover{background-color:#cfd2e1;background-color:var(--color-neutral-100,#cfd2e1)}a.button:not(.secondary).color-stock[disabled],a.button:not(.secondary).color-stock[disabled]:active,a.button:not(.secondary).color-stock[disabled]:focus,a.button:not(.secondary).color-stock[disabled]:hover,button:not(.secondary).color-stock[disabled],button:not(.secondary).color-stock[disabled]:active,button:not(.secondary).color-stock[disabled]:focus,button:not(.secondary).color-stock[disabled]:hover{background-color:#b6bacf;background-color:var(--color-neutral-200,#b6bacf);color:#444a5e;color:var(--color-neutral-700,#444a5e)}a.button:not(.secondary).color-danger,button:not(.secondary).color-danger{background-color:#cf445e;background-color:var(--color-danger-500,#cf445e);color:#fff;color:var(--color-stock,#fff)}a.button:not(.secondary).color-danger:hover,button:not(.secondary).color-danger:hover{background-color:#b02d4a;background-color:var(--color-danger-600,#b02d4a)}a.button:not(.secondary).color-danger[disabled],a.button:not(.secondary).color-danger[disabled]:active,a.button:not(.secondary).color-danger[disabled]:focus,a.button:not(.secondary).color-danger[disabled]:hover,button:not(.secondary).color-danger[disabled],button:not(.secondary).color-danger[disabled]:active,button:not(.secondary).color-danger[disabled]:focus,button:not(.secondary).color-danger[disabled]:hover{background-color:#ffa6ae;background-color:var(--color-danger-200,#ffa6ae);color:#e76276;color:var(--color-danger-400,#e76276)}a.button:not(.secondary).color-neutral,button:not(.secondary).color-neutral{background-color:#6e7591;background-color:var(--color-neutral-500,#6e7591);color:#fff;color:var(--color-stock,#fff)}a.button:not(.secondary).color-neutral:hover,button:not(.secondary).color-neutral:hover{background-color:#595f78;background-color:var(--color-neutral-600,#595f78)}a.button:not(.secondary).color-neutral[disabled],a.button:not(.secondary).color-neutral[disabled]:active,a.button:not(.secondary).color-neutral[disabled]:focus,a.button:not(.secondary).color-neutral[disabled]:hover,button:not(.secondary).color-neutral[disabled],button:not(.secondary).color-neutral[disabled]:active,button:not(.secondary).color-neutral[disabled]:focus,button:not(.secondary).color-neutral[disabled]:hover{background-color:#b6bacf;background-color:var(--color-neutral-200,#b6bacf);color:#858ca8;color:var(--color-neutral-400,#858ca8)}a.button:not(.secondary).color-primary,button:not(.secondary).color-primary{background-color:#2069f2;background-color:var(--color-primary-500,#2069f2);color:#fff;color:var(--color-stock,#fff)}a.button:not(.secondary).color-primary:hover,button:not(.secondary).color-primary:hover{background-color:#0054cf;background-color:var(--color-primary-600,#0054cf)}a.button:not(.secondary).color-primary[disabled],a.button:not(.secondary).color-primary[disabled]:active,a.button:not(.secondary).color-primary[disabled]:focus,a.button:not(.secondary).color-primary[disabled]:hover,button:not(.secondary).color-primary[disabled],button:not(.secondary).color-primary[disabled]:active,button:not(.secondary).color-primary[disabled]:focus,button:not(.secondary).color-primary[disabled]:hover{background-color:#a7b3ff;background-color:var(--color-primary-200,#a7b3ff);color:#527fff;color:var(--color-primary-400,#527fff)}a.button:not(.secondary).color-success,button:not(.secondary).color-success{background-color:#3c8455;background-color:var(--color-success-500,#3c8455);color:#fff;color:var(--color-stock,#fff)}a.button:not(.secondary).color-success:hover,button:not(.secondary).color-success:hover{background-color:#286c41;background-color:var(--color-success-600,#286c41)}a.button:not(.secondary).color-success[disabled],a.button:not(.secondary).color-success[disabled]:active,a.button:not(.secondary).color-success[disabled]:focus,a.button:not(.secondary).color-success[disabled]:hover,button:not(.secondary).color-success[disabled],button:not(.secondary).color-success[disabled]:active,button:not(.secondary).color-success[disabled]:focus,button:not(.secondary).color-success[disabled]:hover{background-color:#9dcaa9;background-color:var(--color-success-200,#9dcaa9);color:#589c6d;color:var(--color-success-400,#589c6d)}a.button:not(.secondary).color-warn,button:not(.secondary).color-warn{background-color:#f6bc4d;background-color:var(--color-warn-400,#f6bc4d);color:#674c15;color:var(--color-warn-800,#674c15)}a.button:not(.secondary).color-warn:hover,button:not(.secondary).color-warn:hover{background-color:#dca435;background-color:var(--color-warn-500,#dca435)}a.button:not(.secondary).color-warn[disabled],a.button:not(.secondary).color-warn[disabled]:active,a.button:not(.secondary).color-warn[disabled]:focus,a.button:not(.secondary).color-warn[disabled]:hover,button:not(.secondary).color-warn[disabled],button:not(.secondary).color-warn[disabled]:active,button:not(.secondary).color-warn[disabled]:focus,button:not(.secondary).color-warn[disabled]:hover{background-color:#ffde88;background-color:var(--color-warn-200,#ffde88);color:#f6bc4d;color:var(--color-warn-400,#f6bc4d)}
/*# sourceMappingURL=button.css.map */