@stencila/style-material/dist/molecules/toolbar.css.map

Material Design theme for Stencila components

{"mappings":"AAAA;;ECGE,qEAAqE,CACrE,yCAA6D,CAA7D,2DAA6D,CDJ/D,cAAA,YAAA,WAAA,wBAAA,OAAA,eAAA,MAAA,WAAA,WAAA,0BAAA,gBAAA,yBAAA,sBAAA,yCAAA,uBAAA,yBAAA,0CAAA,2BAAA,yBAAA,kDAAA,2BAAA,yBAAA,kDAAA,2BAAA,yBAAA,kDAAA,wBAAA,yBAAA,+CAAA,0BAAA,yBAAA,iDAAA,UAAA,mBAAA,AC4CI,kCAAmC,CD5CvC,WAAA,8BAAA,aAAA,mBAAA,uBAAA,+CAAA,YAAA,8BAAA,cAAA,SAAA,qBAAA,sBAAA,YAAA,sBAAA,+BAAA,YAAA,kBAAA,mBAAA,ACyDE,mFAGE,mCACF","sources":["<no source>","src/molecules/toolbar.css"],"sourcesContent":[null,":host {\n  @apply block h-12 z-40;\n\n  /** @prop --background: Sets the background color of the component. */\n  background-color: var(--background, var(--color-neutral-300));\n\n  &[position='fixed'] {\n    @apply fixed top-0 left-0 z-30 w-full;\n\n    & + * {\n      @apply mt-12;\n    }\n  }\n\n  &[color='stock'] div {\n    @apply bg-stock;\n  }\n\n  &[color='key'] div {\n    @apply bg-key;\n  }\n\n  &[color='primary'] div {\n    @apply bg-primary-500;\n  }\n\n  &[color='neutral'] div {\n    @apply bg-neutral-500;\n  }\n\n  &[color='success'] div {\n    @apply bg-success-500;\n  }\n\n  &[color='warn'] div {\n    @apply bg-warn-500;\n  }\n\n  &[color='danger'] div {\n    @apply bg-danger-500;\n  }\n\n  div {\n    @apply h-full flex flex-row items-center justify-between px-1 py-2 m-0 leading-none align-middle text-stock font-body;\n    background-color: var(--background);\n\n    & > * {\n      @apply align-middle;\n    }\n  }\n\n  ::slotted([slot='middle']) {\n    @apply flex-grow px-4;\n  }\n\n  /* Use lighter backdrop on dark backgrounds */\n  /* TODO: Make this work when `key` color is light */\n  &[color='key']::slotted(*)\n    stencila-button:not([disabled]):hover\n    button.iconOnly {\n    background-color: rgba(255, 255, 255, 0.2);\n  }\n}\n"],"names":[],"version":3,"file":"toolbar.css.map"}