@stencila/style-stencila/dist/molecules/parameter.css.map

Custom designed theme for Stencila components

{"mappings":"AAAA;EAEE,qEAAqE,CACrE,oCAAsC;;EAEtC,qFAAqF,CACrF,oDAAsD;;EAEtD,4FAA4F,CAC5F,yCAA2C,CAG3C,kCAAmC,CACnC,0BAA2B,CCb7B,qBAAA,mBAAA,iBAAA,cAAA,+BAAA,oBAAA,kBAAA,oBAAA,cAAA,UAAA,2BAAA,kBDgFA,CChFA,2CDiBI,0CAA2C,CCjB/C,eAAA,qBAAA,gBAAA,yBAAA,8IAAA,mDAAA,kDAAA,QAAA,0UAAA,oBAAA,eAAA,WAAA,qDAAA,aAAA,sBAAA,cAAA,iEDmCQ,8BAA+B,CCnCvC,cAAA,uBAAA,+CAAA,iBAAA,iBAAA,yGAAA,iBAAA,4JD4CU,0BAA2B,CC5CrC,qBAAA,mBAAA,iBAAA,cAAA,sBAAA,8CAAA,kBAAA,oBAAA,kBAAA,WAAA,qCDoDI,0CAA2C,CCpD/C,YAAA,sBAAA,8CAAA,eAAA,qEAAA,YAAA,uCD6DI,kCAAmC,CC7DvC,sBAAA,8CAAA,SAAA,iBAAA,gJAAA,eAAA,qBAAA,sBAAA,8CAAA,ADqEE,gGAGE,cACF,CCzEF,gIAAA,qBAAA,AD8EI,6CC9EJ","sources":["src/molecules/parameter.css","<no source>"],"sourcesContent":[":host,\nstencila-parameter {\n  /** @prop --background: Background color of the Parameter component */\n  --background: var(--color-stock, #fff);\n\n  /** @prop --background-buttons: Background color of the parameter validator section */\n  --background-buttons: var(--color-neutral-50, #edf2f7);\n\n  /** @prop --border: Border color around the component as well as internal section dividers */\n  --border: var(--color-neutral-100, #e2e8f0);\n\n  @apply inline-flex text-sm p-0 leading-none whitespace-nowrap align-text-bottom text-key border border-solid rounded;\n  background-color: var(--background);\n  border-color: var(--border);\n\n  .actions {\n    @apply inline-block w-0 overflow-hidden cursor-default transition ease-out duration-150;\n    background-color: var(--background-buttons);\n  }\n\n  &[mode='edit'].hover,\n  &[mode='edit']:focus,\n  &[mode='edit']:focus-within,\n  &[mode='edit']:hover {\n    .actions {\n      @apply inline-flex w-full max-w-full;\n    }\n  }\n\n  .actions {\n    form {\n      @apply flex flex-col p-2;\n\n      label {\n        @apply block text-xs font-body;\n        color: var(--color-neutral-600);\n\n        &:not(:first-of-type) {\n          @apply mt-2;\n        }\n\n        input,\n        select {\n          @apply block text-sm font-mono mt-1 border border-solid rounded w-full;\n          border-color: var(--border);\n        }\n      }\n    }\n  }\n\n  .name {\n    @apply p-1 font-mono cursor-text;\n    background-color: var(--background-buttons);\n\n    &::slotted(label) {\n      @apply cursor-text;\n    }\n  }\n\n  .value {\n    @apply py-0 px-1 m-0 font-mono;\n    background-color: var(--background);\n\n    &::slotted(input),\n    &::slotted(select) {\n      @apply inline-block font-mono border-0;\n    }\n  }\n\n  ::slotted(input),\n  input {\n    /* Avoid inputs being too small to usefully use e.g. when size=1 because a single digit number */\n    min-width: 4rem;\n  }\n\n  ::slotted(input:invalid),\n  input:invalid {\n    @apply rounded;\n    box-shadow: 0px 0px 0px 2px var(--color-danger-500);\n  }\n}\n",null],"names":[],"version":3,"file":"parameter.css.map"}