UNPKG

@stencila/style-stencila

Version:

Custom designed theme for Stencila components

1 lines 4.5 kB
{"mappings":"AAAA;EAEE,gEAAgE,CAChE,4CAA8C;;EAE9C,4EAA4E,CAC5E,2CAA6C;;EAE7C,uEAAuE,CACvE,2CAA6C;;EAE7C,qFAAqF,CACrF,yCAA2C,CCZ7C,mBAAA,ADeE,kCAAmC,CACnC,0BAA2B,CChB7B,qBAAA,mBAAA,iBAAA,oBAAA,kBAAA,oBAAA,cAAA,UAAA,kBAAA,0BDqHA,CCrHA,iEAAA,oBAAA,oBAAA,cAAA,gBAAA,UAAA,sBAAA,iDAAA,iCAAA,8BAAA,oBAAA,cAAA,kBAAA,mBAAA,iFAAA,oBAAA,sBAAA,eAAA,oBAAA,cAAA,gBAAA,yBAAA,8IAAA,AD2BM,2CAA8C,CC3BpD,mDAAA,kDAAA,mFAAA,eAAA,qBAAA,gBAAA,yBAAA,8IAAA,mDAAA,kDAAA,QAAA,mgBAAA,oBAAA,eAAA,cAAA,AD6CE,6DACE,iBAAkB,CAClB,gBAAiB,CC/CrB,eAAA,cDqDE,CCrDF,iFAAA,YAAA,2CDyDI,yCAA0C,CAC1C,0BAA2B,CC1D/B,cAAA,+BAAA,qBAAA,sBAAA,8CAAA,kBAAA,oBAAA,cAAA,YAAA,gBAAA,UAAA,yBAAA,AD2DI,yBAA0B,CC3D9B,kDAAA,mBAAA,QAAA,yEAAA,qBAAA,iBAAA,qBAAA,oBAAA,cAAA,qBAAA,qBAAA,WAAA,ADoEE,4IAEE,YAWF,CCjFF,4ND0EM,eAAgB,CC1EtB,kBAAA,sBAAA,8CAAA,kBAAA,oBAAA,gBAAA,UAAA,AD4EM,ojBAEE,YACF,CAKF,oMAEE,oBACF,CCvFJ,iDD6FI,sBAAuB,CC7F3B,kBAAA,AD8FI,yCAA0C,CC9F9C,qBAAA,AD4FI,YAAa,CC5FjB,YAAA,ADiGE,6EACE,oBACF,CCnGF,4IAAA,sBAAA,yCAAA,ADyGI,yCAA0C,CCzG9C,kBAAA,cAAA,+BAAA,qBAAA,eAAA,mBAAA,gBAAA,SAAA,yBAAA,AD0GI,gCAAkC,CC1GtC,mBAAA,AD4GI,oKACE,YACF,CC9GJ,oJAAA,sBAAA,yCAAA,kBAAA,cAAA,+BAAA,eAAA,eAAA,mBAAA,gBAAA,SAAA,UAAA,mBAAA","sources":["src/molecules/codeExpression.css","<no source>"],"sourcesContent":[":host,\nstencila-code-expression {\n /** @prop --background: Background color of element as a whole */\n --background: var(--color-neutral-50, #edf2f7);\n\n /** @prop --background-editor: Background color of the code editor section */\n --background-editor: var(--color-stock, #fff);\n\n /** @prop --background-output: Background color of the output section */\n --background-output: var(--color-stock, #fff);\n\n /** @prop --border: Border color around the component and internal section dividers */\n --border: var(--color-neutral-100, #e2e8f0);\n\n @apply inline-flex relative items-center p-0 text-sm leading-none align-text-bottom border border-solid rounded;\n background-color: var(--background);\n border-color: var(--border);\n\n stencila-tooltip {\n @apply inline-flex items-stretch p-0 overflow-hidden leading-none align-bottom;\n }\n\n .actions {\n @apply relative inline-flex flex-initial whitespace-nowrap rounded-l;\n\n stencila-button {\n @apply inline-flex items-stretch self-start flex-shrink-0 overflow-hidden cursor-default transition ease-out duration-150;\n transition-property: padding, width, max-width;\n }\n\n .secondaryAction {\n @apply inline-block w-0 overflow-hidden cursor-default transition ease-out duration-150;\n }\n }\n\n &.hover,\n &:focus,\n &:focus-within,\n &:hover,\n &.isCodeVisible {\n .actions .secondaryAction {\n @apply inline-flex w-5 max-w-full;\n }\n }\n\n .executeStatus {\n --height: 0.875rem;\n --width: 0.875rem;\n @apply p-1 cursor-pointer;\n\n &.scheduled {\n @apply cursor-wait;\n }\n }\n\n .text {\n @apply inline-block w-0 min-w-0 px-0 py-0 overflow-hidden font-mono text-sm leading-none whitespace-nowrap duration-150 ease-out text-key;\n background-color: var(--background-editor);\n border-color: var(--border);\n transition-property: width;\n }\n\n &.isCodeVisible {\n .text {\n @apply inline-block w-auto px-2 py-1 whitespace-pre-line min-w-em rounded border mr-1;\n }\n }\n\n ::slotted([slot='errors']),\n [slot='errors'] {\n display: none;\n\n stencila-code-error {\n @apply border-none p-0 font-mono text-sm leading-normal;\n background: none;\n\n stencila-icon,\n stencila-details {\n display: none;\n }\n }\n }\n\n &.isCodeVisible {\n ::slotted([slot='errors']),\n [slot='errors'] {\n display: inline-block;\n }\n }\n\n .divider {\n @apply self-center inline-block w-2;\n display: none;\n fill: var(--background);\n background-color: var(--background-output);\n }\n\n &.isCodeVisible .divider {\n display: inline-block;\n }\n\n ::slotted([slot='output']),\n [slot='output'] {\n @apply inline-block m-0 py-0 pl-2 pr-1 border-none bg-stock leading-normal text-base text-key whitespace-normal;\n\n background-color: var(--background-output);\n transition: padding 120ms ease-out;\n\n &:empty {\n display: none;\n }\n\n /* All children are forced to be as inliny as possible */\n & * {\n @apply inline p-0 m-0 border-none bg-stock leading-normal text-base text-key whitespace-normal;\n }\n }\n}\n",null],"names":[],"version":3,"file":"codeExpression.css.map"}