@stencila/style-stencila
Version:
Custom designed theme for Stencila components
8 lines (5 loc) • 1.66 kB
CSS
:host,stencila-code-fragment{
/** @prop --background: Background color of the Code Fragment */--background:var(--color-stock,#fff);
/** @prop --background-buttons: Background color of the Code Editor section */--background-buttons:var(--color-neutral-50,#edf2f7);
/** @prop --border: Border color around the component as well as internal section dividers */--border:var(--color-neutral-100,#e2e8f0);background-color:var(--background);border-color:var(--border);border-radius:.25rem;border-style:solid;border-width:1px;color:#4a4a4a;color:var(--color-key,#4a4a4a);display:inline-flex;font-size:.875rem;line-height:1.25rem;line-height:1;padding:0;vertical-align:text-bottom;white-space:nowrap}:host .actionsSecondary,stencila-code-fragment .actionsSecondary{background-color:var(--background-buttons);cursor:default;display:inline-block;overflow:hidden;transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:cubic-bezier(0,0,.2,1);width:0}:host(.hover) .actionsSecondary,:host(:focus) .actionsSecondary,:host(:focus-within) .actionsSecondary,:host(:hover) .actionsSecondary,stencila-code-fragment.hover .actionsSecondary,stencila-code-fragment:focus .actionsSecondary,stencila-code-fragment:focus-within .actionsSecondary,stencila-code-fragment:hover .actionsSecondary{display:inline-flex;max-width:100%;width:1.25rem}:host .text,stencila-code-fragment .text{background-color:var(--background-editor);padding:.25rem}
/*# sourceMappingURL=codeFragment.css.map */