@stencila/style-stencila/dist/molecules/codeExpression.css

Custom designed theme for Stencila components

:host,stencila-code-expression{
  /** @prop --background: Background color of element as a whole */--background:var(--color-neutral-50,#edf2f7);

  /** @prop --background-editor: Background color of the code editor section */--background-editor:var(--color-stock,#fff);

  /** @prop --background-output: Background color of the output section */--background-output:var(--color-stock,#fff);

  /** @prop --border: Border color around the component and internal section dividers */--border:var(--color-neutral-100,#e2e8f0);align-items:center;background-color:var(--background);border-color:var(--border);border-radius:.25rem;border-style:solid;border-width:1px;display:inline-flex;font-size:.875rem;line-height:1.25rem;line-height:1;padding:0;position:relative;vertical-align:text-bottom}:host stencila-tooltip,stencila-code-expression stencila-tooltip{align-items:stretch;display:inline-flex;line-height:1;overflow:hidden;padding:0;vertical-align:bottom}:host .actions,stencila-code-expression .actions{border-bottom-left-radius:.25rem;border-top-left-radius:.25rem;display:inline-flex;flex:0 1 auto;position:relative;white-space:nowrap}:host .actions stencila-button,stencila-code-expression .actions stencila-button{align-items:stretch;align-self:flex-start;cursor:default;display:inline-flex;flex-shrink:0;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-property:padding,width,max-width;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:cubic-bezier(0,0,.2,1)}:host .actions .secondaryAction,stencila-code-expression .actions .secondaryAction{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) .actions .secondaryAction,:host(.isCodeVisible) .actions .secondaryAction,:host(:focus) .actions .secondaryAction,:host(:focus-within) .actions .secondaryAction,:host(:hover) .actions .secondaryAction,stencila-code-expression.hover .actions .secondaryAction,stencila-code-expression.isCodeVisible .actions .secondaryAction,stencila-code-expression:focus .actions .secondaryAction,stencila-code-expression:focus-within .actions .secondaryAction,stencila-code-expression:hover .actions .secondaryAction{display:inline-flex;max-width:100%;width:1.25rem}:host .executeStatus,stencila-code-expression .executeStatus{--height:0.875rem;--width:0.875rem;cursor:pointer;padding:.25rem}:host .executeStatus.scheduled,stencila-code-expression .executeStatus.scheduled{cursor:wait}:host .text,stencila-code-expression .text{background-color:var(--background-editor);border-color:var(--border);color:#4a4a4a;color:var(--color-key,#4a4a4a);display:inline-block;font-family:monospace;font-family:var(--font-family-mono,monospace);font-size:.875rem;line-height:1.25rem;line-height:1;min-width:0;overflow:hidden;padding:0;transition-duration:.15s;transition-property:width;transition-timing-function:cubic-bezier(0,0,.2,1);white-space:nowrap;width:0}:host(.isCodeVisible) .text,stencila-code-expression.isCodeVisible .text{border-radius:.25rem;border-width:1px;display:inline-block;margin-right:.25rem;min-width:1em;padding:.25rem .5rem;white-space:pre-line;width:auto}:host ::slotted([slot=errors]),:host [slot=errors],stencila-code-expression ::slotted([slot=errors]),stencila-code-expression [slot=errors]{display:none}:host ::slotted([slot=errors]) stencila-code-error,:host [slot=errors] stencila-code-error,stencila-code-expression ::slotted([slot=errors]) stencila-code-error,stencila-code-expression [slot=errors] stencila-code-error{background:none;border-style:none;font-family:monospace;font-family:var(--font-family-mono,monospace);font-size:.875rem;line-height:1.25rem;line-height:1.5;padding:0}:host ::slotted([slot=errors]) stencila-code-error stencila-details,:host ::slotted([slot=errors]) stencila-code-error stencila-icon,:host [slot=errors] stencila-code-error stencila-details,:host [slot=errors] stencila-code-error stencila-icon,stencila-code-expression ::slotted([slot=errors]) stencila-code-error stencila-details,stencila-code-expression ::slotted([slot=errors]) stencila-code-error stencila-icon,stencila-code-expression [slot=errors] stencila-code-error stencila-details,stencila-code-expression [slot=errors] stencila-code-error stencila-icon{display:none}:host.isCodeVisible ::slotted([slot=errors]),:host.isCodeVisible [slot=errors],stencila-code-expression.isCodeVisible ::slotted([slot=errors]),stencila-code-expression.isCodeVisible [slot=errors]{display:inline-block}:host .divider,stencila-code-expression .divider{fill:var(--background);align-self:center;background-color:var(--background-output);display:inline-block;display:none;width:.5rem}:host.isCodeVisible .divider,stencila-code-expression.isCodeVisible .divider{display:inline-block}:host ::slotted([slot=output]),:host [slot=output],stencila-code-expression ::slotted([slot=output]),stencila-code-expression [slot=output]{background-color:#fff;background-color:var(--color-stock,#fff);background-color:var(--background-output);border-style:none;color:#4a4a4a;color:var(--color-key,#4a4a4a);display:inline-block;font-size:1rem;line-height:1.5rem;line-height:1.5;margin:0;padding:0 .25rem 0 .5rem;transition:padding .12s ease-out;white-space:normal}:host ::slotted([slot=output]):empty,:host [slot=output]:empty,stencila-code-expression ::slotted([slot=output]):empty,stencila-code-expression [slot=output]:empty{display:none}:host ::slotted([slot=output]) *,:host [slot=output] *,stencila-code-expression ::slotted([slot=output]) *,stencila-code-expression [slot=output] *{background-color:#fff;background-color:var(--color-stock,#fff);border-style:none;color:#4a4a4a;color:var(--color-key,#4a4a4a);display:inline;font-size:1rem;line-height:1.5rem;line-height:1.5;margin:0;padding:0;white-space:normal}
/*# sourceMappingURL=codeExpression.css.map */