bbpro/dist/image.a05aaebc.css.map

BrowserBox - remote browser isolation tool

{"mappings":"AACE;;;;AAAA;;;;AAME;;;;AAeE;;;;AAKA;;;;AAIF;;;;;;;AAOA;;;;;AAMA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDA;EACE;;;;;;;;;;;;;;;EAeA;;;;EAIA;;;;;AAOF;;;;;;;;;;;AAYA;;;;;AAKA;;;;AAIA;;;;;AAKA;;;;;AAKA;;;;;;;;;;;AAWA;;;;;AAMA;;;;AAIA;;;;;;;AAOA;;;;AAIA;;;;;AAKA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAKA;;;;AAKF;;;;;AAKA;;;;;;;AAOA;;;;AAIA;;;;AAIA;;;;AAIA;;;;;AAKA;;;;;;;;;AAYA;;;;;;;;;AAYA;;;;AAIA;;;;;AAKA;;;;;;AAMA;;;;;;AAMA;;;;AAIA;;;;AAIA;;;;;AAKA;;;;;AAKA;;;;;;AAMA;;;;;;;AAQA;;;;AAIA;;;;;;;;AAQA;;;;;;;;;;;;AAYA;;;;AAIA;;;;AAIA;;;;;AAKA;;;;;;AAMA;;;;AAIA;;;;;;;;;;AAUA;;;;AAIA;;;;AAIA;;;;;;;AAOA;;;;;AAKA;;;;;;;;;AASA;;;;;;;AAOA;;;;AAIA;;;;;;AAMA;;;;;;AAMA;;;;;AAKA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;;;AAMA;;;;;AAKA;;;;;;AAOA;;;;;;;AAOA;;;;;;;AAOA;;;;;;;;;;;;;AAaA;;;;AAIA;;;;;;;;AAWA;;;;AAIA;;;;AAIA;;;;;;;;;;;AAWA;;;;AAIA;;;;AAIA;;;;AAIA;;;;;;AAUA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;;;;AAcE;;;;;;;;;;;;;;;AAgBA;;;;;AAKA;;;;;;AAMA;;;;AAIA;;;;AAIA;;;;AAKA;;;;;;;;;;;;;AAaA;;;;;;;;;;;;;;;;;AAkBA;;;;AAIA;;;;;AAKA;;;;;AAKA;;;;AAKA;;;;;;;AAOA;;;;;AAKA;;;;;;AAMA;;;;;;;AAOA;;;;;AAKA;;;;;;;;AAQA;;;;AAIA;;;;AAQA;;;;;AAKA;;;;AAIA;;;;AAKF;;;;;AAMA;;;;;;;;;AASA;;;;AAME;;;;;;;AAQA;;;;;;AAOA;;;;;;;;AAYA;;;;;;;;;;;AAYA;;;;AAIA;;;;AAIA;;;;AAOA;;;;AAIA;;;;AAKF","sources":["src/public/themes/blank.css","src/public/style.css"],"sourcesContent":["/* basic bang */\n  :not(:defined), .bang-el:not(.bang-styled):not([incremental-load]) {\n    visibility: hidden;\n  }\n  \n/* basic visual appearance */\n  /* reset clause */\n    *:not(script, noscript, style, datalist, option, head, head *, select, meter, input, label) {\n      all: unset;\n    }\n\n    input:not([type=\"radio\"], input[type=\"checkbox\"], input[type=\"range\"]) {\n      all: unset;\n    }\n\n    /*\n    :is(ul, button, input, select, textarea) {\n      all: unset;\n    }\n    */\n\n  /* basic */\n      p, h1, h2, h3, h4, h5, h6, blockquote, div, article, section, nav, header, main, aside, footer,\n      br, hr {\n        display: block;\n      }\n\n      p {\n        padding: 0.5em 0;\n      }\n\n    :root, body {\n      margin: 0;\n      padding: 0;\n      width: 100%;\n      height: 100%;\n    }\n\n    form fieldset {\n      display: flex;\n      flex-direction: column;\n    }\n\n  /* color scheme and light / dark variants */\n    :root {\n      /* nice light colors */\n      --special: pink;\n      --special: peachpuff;\n      --special: lavendar;\n      /* other colors */\n      --special: deepskyblue;\n      --special: gold;\n      --special: turquoise;\n      --special: darkturquoise;\n      --special: lightsteelblue;\n      --special: mediumaquamarine;\n      --special: mediumturquoise;\n      --special: palegreen;\n      --special: paleturquoise;\n      --special: thistle;\n      --special: tomato;\n      --special: whitesmoke;\n      --special: skyblue;\n      --special-contrast: dodgerblue;\n      --neutral: whitesmoke;\n      --light-contrast: whitesmoke;\n      --light-super-contrast: lavender;\n      --light-ultra-contrast: silver;\n      --dark-contrast: #28292a; /*#272a47;*/\n      --dark-super-contrast: #38393a; /*#272a47;*/\n      --dark-ultra-contrast: #464848; /*#272a47;*/\n      --contrast: var(--light-contrast);\n      --super-contrast: var(--light-super-contrast);\n      --ultra-contrast: var(--light-ultra-contrast);\n      --light-text: var(--dark-super-contrast);\n      --inactive-bg: silver;\n      --inactive-fg: darkslategray;\n      --ft: 16px;\n      --lh: 1.618;\n      --dark: #15141a;\n      --light: #fbfbfe;\n      --bg: var(--light);\n      --fg: var(--dark);\n      --fg-pure: black;\n      --bg-pure: white;\n      --nav-loading-gap: 2px;\n      --mid: gray;\n      accent-color: var(--special);\n      font: normal normal 400 var(--ft)/var(--lh) system-ui;\n      color: var(--fg);\n      background: var(--bg);\n    }\n\n    @media screen and (prefers-color-scheme:dark) {\n      :root {\n        --special: teal;\n        --special: darkcyan;\n        --special: steelblue;\n        --bg: var(--dark);\n        --fg: var(--light);\n        --special: royalblue;\n        --light-text: var(--light-super-contrast);\n        --contrast: var(--dark-contrast);\n        --super-contrast: var(--dark-super-contrast);\n        --ultra-contrast: var(--dark-ultra-contrast);\n        --fg-pure: white;\n        --bg-pure: black;\n      }\n\n      span.tab-selector bb-favicon {\n        filter: invert(100%);\n      }\n\n      aside.modals legend img,\n      button img {\n        filter: invert(1.0);\n      }\n    }\n\n  /* button, input, and link overrides */\n    button {\n      cursor: default;\n      background: transparent;\n      border: thin solid transparent;\n      box-sizing: border-box;\n      padding: 0;\n      text-align: center;\n      margin: 2px 0;\n      transition: all 0.1s ease;\n      margin: 0 0.5em;\n    }\n\n    nav button {\n      border-radius: 100%;\n      aspect-ratio: 1 / 1;\n    }\n\n    button:hover:not([disabled]) {\n      background: radial-gradient(var(--contrast) 90%, var(--super-contrast));\n    }\n\n    input {\n      background: var(--super-contrast) !important;\n      padding: 1px 0.25rem;\n    }\n\n    a, a:link, a:visited {\n      cursor: pointer;\n      color: var(--special-contrast);\n    }\n\n    input[type=\"search\"]::-webkit-search-cancel-button {\n      -webkit-appearance: none;\n      color: var(--fg);\n      accent-color: var(--fg);\n      height: 24px;\n      width: 24px;\n      margin-left: .4em;\n      background-image: url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23777'><path d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/></svg>\");\n      cursor: pointer;\n    }\n    \n    form.url input[type=\"search\"] {\n      padding: 0 1em;\n      border-radius: 2em;\n    }\n\n  /* hidden, disabled, active, focus and hover states */\n    [hidden] {\n      display: none;\n    }\n\n    [disabled] {\n      cursor: not-allowed;\n      background: var(--contrast);\n      filter: grayscale(1.0);\n      opacity: 0.6;\n    }\n\n    input:focus {\n      background: var(--contrast);\n    }\n\n    button, bb-select-tab {\n      box-sizing: border-box;\n      border: thin solid transparent;\n    }\n\n    :is(button, bb-select-tab):active:not([disabled]) {\n      background: var(--special);\n    }\n\n    :is(button, bb-select-tab):focus:not(:active) {\n      border: thin dotted var(--special);\n    }\n\n    a:hover {\n      text-decoration: underline;\n    }\n\n    button:not(:active, :hover, :focus) {\n      opacity: 0.618;\n    }\n\n  /* selection and other general pseudo classes */\n    ::selection {\n      background-color: var(--special);\n    }\n\n/* basic layout */\n  :root, body, main, bb-view {\n    height: 100%;\n    max-height: 100%;\n  }\n\n  :root {\n    display: block;\n    position: relative;\n    overscroll-behavior: none;\n    overflow: hidden;\n  }\n\n  body {\n    display: flex;\n  }\n\n  iframe {\n    display: none;\n  }\n\n  hr {\n    border-bottom: thin solid var(--ultra-contrast);\n  }\n\n  main, bb-view {\n    position: relative;\n    width: 100%;\n  }\n\n  main {\n    display: grid;\n    grid-template-areas:\n      \"info     info    info    info    info\"\n      \"tabs     tabs    tabs    tabs    tabs\"\n      \"ctrl     ctrl    ctrl    ctrl    ctrl\"\n      \"screen   screen  screen  screen  screen\"\n    ;\n    grid-template-columns: auto 1fr auto auto auto;\n    grid-template-rows: 1rem 2rem 2rem /*calc(2rem - var(--nav-loading-gap))*/ minmax(0,1fr);\n  }\n\n  main.no-chrome {\n    position: relative;\n    display: grid;\n    grid-template-areas:\n      \"screen screen screen screen screen\"\n    ;\n    grid-template-columns: auto 1fr auto auto auto;\n    grid-template-rows: 1fr;\n    width: 100%;\n    height: 100%;\n  }\n\n  main.no-chrome :is(header, nav) {\n    display: none;\n  }\n\n  bb-top-bar {\n    grid-area: info;\n    max-height: 1rem;\n  } \n\n  header.topbar {\n    font-size: smaller;\n    max-height: 100%;\n    color: #555555;\n  }\n\n  header.topbar span {\n    font-size: 0.8rem;\n    line-height: 1.3;\n    vertical-align: super;\n  }\n\n  header.topbar span.network-status.offline {\n    color: red;\n  }\n\n  header.topbar span.connection-status {\n    color: orange;\n  }\n\n  header.topbar span.webrtc-status {\n    color: dodgerblue;\n    opacity: 0.8;\n  }\n\n  header.topbar span.audio-status {\n    color: purple;\n    opacity: 0.8;\n  }\n\n  bb-tabs {\n    grid-area: tabs;\n    position: relative;\n    max-width: 100%;\n  }\n\n  nav.targets {\n    overflow-x: scroll;\n    overflow-y: hidden;\n    scroll-behavior: smooth;\n    scrollbar-width: none;\n    -ms-overflow-style: none;\n  }\n\n  nav.targets::-webkit-scrollbar {\n    display: none;\n  }\n\n  nav.targets {\n    display: flex;\n    max-height: 100%;\n    height: 100%;\n    width: auto;\n    white-space: nowrap;\n  }\n\n  nav.targets bb-select-tab {\n    width: min(30%, 300px);\n    border-top: thin solid var(--ultra-contrast);\n    border-right: thin solid var(--ultra-contrast);\n    background: var(--contrast);\n    overflow: hidden;\n    min-width: 125px;\n    padding-left: 0.5em;\n    border-top-left-radius: 0.25em;\n    border-top-right-radius: 0.25em;\n  }\n\n  nav.targets bb-select-tab.active {\n    background: var(--super-contrast);\n  }\n\n  nav.targets span:not(.new) {\n    padding-left: 0.25rem;\n  }\n\n  nav.targets span.new button {\n    box-sizing: border-box;\n    width: 2rem;\n  }\n\n  span.tab-selector button.close {\n    border-color: transparent;\n    background: transparent;\n    opacity: 0.618;\n  }\n\n  span.tab-selector button.close:is(:active, :hover, :focus) {\n    opacity: 1.0;\n  }\n\n  span.tab-selector {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    width: 100%;\n    height: 100%;\n  }\n\n  span.tab-selector:not(.active) {\n    opacity: 0.618;\n  }\n\n  span.tab-selector:not(.active):hover {\n    opacity: 0.85;\n  }\n\n  span.tab-selector a {\n    max-width: 100%;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    flex-grow: 1;\n  }\n\n  bb-favicon, img.favicon {\n    width: 1.25rem;\n    vertical-align: middle;\n  }\n\n  button img {\n    pointer-events: none;\n    display: block;\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    transform: scale(0.618);\n  }\n\n  bb-favicon {\n    margin-right: 0.25rem;\n    height: 100%;\n    display: flex;\n    align-items: center;\n  }\n\n  bb-omni-box {\n    grid-area: omni;\n  }\n\n  nav.history {\n    grid-area: history;\n    width: calc(2px + 4rem);\n    padding-left: 2px;\n  }\n\n  nav.url {\n    display: flex;\n    align-items: center;\n    height: 100%;\n  }\n\n  nav.url form {\n    display: flex;\n    width: 100%;\n  }\n\n  nav.url form input:not(:focus) {\n    opacity: 0.618;\n  }\n\n  nav.url form input {\n    flex-grow: 1;\n  }\n\n  nav.url form * {\n    margin: 0;\n  }\n  \n  bb-resize-button {\n    grid-area: reset;\n  }\n\n  bb-settings-button {\n    grid-area: menu;\n    height: 100%;\n    padding-right: 1px;\n  }\n\n  nav.viewport-reset-button {\n    height: 100%;\n    width: 2rem;\n  }\n\n  nav.settings-button, \n  nav.sidebar-menu-button {\n    grid-area: menu;\n    height: 100%;\n    width: 2rem;\n  }\n\n  article.tab-viewport {\n    grid-area: screen;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n  }\n\n  article.tab-viewport canvas {\n    height: 100%;\n    user-select: none;\n      -webkit-user-select: none;\n      -webkit-touch-callout: none;\n  }\n\n  article.tab-viewport select {\n    position: absolute;\n    left: 50%;\n    top: 19.1%;\n    transform: translate(-50%, -50%);\n    font-size: xx-large;\n    opacity: 0.75;\n    z-index: 1000;\n    min-width: 10em;\n    text-align: center;\n    padding: 0.5em;\n  }\n\n  article.tab-viewport select:not(.open) {\n    display: none;\n  }\n\n  bb-loading-indicator, aside.loading-indicator {\n    position: absolute;\n    width: 100%;\n    max-height: var(--nav-loading-gap);\n    height: var(--nav-loading-gap);\n    /*\n    transform: translate(0,-100%);\n    */\n    top: 0;\n  }\n\n  bb-loading-indicator {\n    transform: translate(0,-150%);\n  }\n\n  aside.loading-indicator {\n    overflow: hidden;\n  }\n\n  aside.loading-indicator meter {\n    height: var(--nav-loading-gap);\n    vertical-align: top;\n    width: 105%;\n    position: absolute;\n    height: 30px;\n    top: -14px;\n    left: -2.5%;\n    background: transparent;\n  }\n\n  aside.loading-indicator meter::-webkit-meter-bar {\n    background: transparent;\n  }\n\n  aside.loading-indicator meter::-webkit-meter-optimum-value {\n    background: var(--special-contrast);\n  }\n\n  aside.loading-indicator meter::-moz-meter-optimum-value {\n    background: var(--special-contrast);\n  }\n\n  nav.keyinput {\n    position: absolute;\n    top: 0;\n    right: 0;\n    /*\n    visibility: hidden;\n    z-index: -1;\n    */\n  }\n\n  nav.sidebar-menu {\n    display: none;\n  }\n\n  nav :is(form, button) {\n    height: 100%;\n  }\n\n  nav button {\n    margin: 0;\n  }\n\n  bb-ctrl {\n    grid-area: ctrl;\n  }\n\n  div.ctrl {\n    display: grid;\n    grid-template-areas:\n      \"history  omni    omni    reset   menu\"\n    ;\n    grid-template-columns: auto 1fr 1fr auto auto;\n    grid-template-rows: calc(2rem - var(--nav-loading-gap));\n  }\n\n  div.ctrl nav {\n  }\n\n/* special sections */\n  /* context menu */\n    bb-context-menu { \n      position: fixed;\n      display: flex;\n      visibility: hidden;\n      flex-direction: column;\n      z-index: 10;\n      background: var(--bg);\n      color: var(--fg);\n      user-select: none;\n      padding: 0.25rem 0;\n      box-shadow: 1px 1px 1px var(--fg);\n      /* -webkit */\n        -webkit-user-select: none;\n        -webkit-touch-callout: none;\n    }\n\n    aside.context-menu menu {\n      display: flex;\n      flex-direction: column;\n    }\n\n    aside.context-menu li {\n      cursor: default; \n      font-size: smaller; \n      padding: 0 1.5rem;\n    }\n\n    aside.context-menu li:hover {\n      background-color: var(--ultra-contrast);\n    }\n\n    aside.context-menu li:active {\n      background-color: var(--special);\n    }\n\n    aside.context-menu #load-test {\n      display: contents;\n    }\n  \n  /* modal dialogs */\n    bb-modals, aside.modals, ::backdrop, dialog::backdrop {\n      display: flex;\n      position: absolute;\n      top: 0;\n      left: 0;\n      z-index: 10000000000;\n      width: 100%;\n      height: 100%;\n      align-items: center;\n      justify-content: center;\n      background: rgba(30,30,30,0.5);\n    }\n\n    aside.modals :is(article, dialog) {\n      display: flex;\n      flex-direction: row;\n      justify-content: space-around;\n      position: relative;\n      margin: 0 auto;\n      padding: 0.81em 0.81em 0.4em 1.31em;\n      box-sizing: border-box;\n      min-width: max(30%, 300px);\n      min-height: 130px;\n      max-width: min(600px, 61.8%);\n      max-height: min(61.8%, 400px);\n      box-shadow: 1px 1px 1px var(--contrast);\n      background: var(--bg);\n      overflow-x: hidden;\n      overflow-y: auto;\n    }\n\n    aside.modals :is(article, dialog):not(.notice) {\n      word-break: break-all;\n    }\n\n    aside.modals p:last-of-type {\n      display: flex;\n      justify-content: end;\n    }\n\n    aside.modals :is(a, button) {\n      padding: 0.25em 0.81em;\n      margin: 0 2px;\n    }\n\n    bb-modals:not(.open), \n    aside.modals :is(article, dialog):not(.open) {\n      display: none;\n    }\n\n    aside.modals :is(article, dialog) :is(form, fieldset) {\n      display: flex;\n      width: 100%;\n      height: 100%;\n      border: 0;\n    }\n\n    aside.modals :is(article, dialog) fieldset {\n      flex-direction: column;\n      justify-content: space-between;\n    }\n\n    aside.modals legend {\n      color: var(--contrast);\n      width: 100%;\n      margin-bottom: 1em;\n    }\n\n    aside.modals legend h1 {\n      display: flex;\n      align-items: center;\n      color: var(--fg);\n      filter: contrast(0.4);\n    }\n\n    aside.modals legend h1 img {\n      padding-right: 0.5em;\n      margin-top: -2px;\n    }\n\n    aside.modals legend i {\n      color: var(--mid);\n      font-size: smaller;\n      font-style: italic;\n      display: block;\n      margin-top: 1.5em;\n    }\n\n    aside.modals h1 {\n      color: var(--light-text);\n    }\n\n    aside.modals:not(.active) {\n      display: none;\n    }\n\n    aside.modals > article:not(.open) {\n      display: none;\n    }\n\n    aside.modals :is(textarea, input:not([type=\"checkbox\"], [type=\"radio\"], [type=\"range\"]), select) {\n      width: 100%;\n      box-sizing: border-box;\n    }\n\n    aside.modals input[type=\"range\"].radio {\n      width: 2rem;\n    }\n\n    aside.modals form p:last-of-type {\n      text-align: right;\n    }\n\n/* text input overrides */\n  nav.keyinput {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n/* mobile ovverides */\n  span.tab-selector button.close {\n    flex-shrink: 0;\n    width: 1.2rem;\n    aspect-ratio: 1 / 1;\n    padding: 0;\n    margin: 0.5rem;\n    box-sizing: border-box;\n  }\n\n  span.tab-selector button.close img {\n    transform: scale(0.7);\n  }\n\n/* custom checkbox input toggle */\n  /* The switch - the box around the slider */\n    .switch {\n      position: relative;\n      display: inline-block;\n      width: 60px;\n      height: 34px;\n    }\n\n    /* Hide default HTML checkbox */\n    .switch input {\n      opacity: 0;\n      width: 0;\n      height: 0;\n    }\n\n    /* The slider */\n    .slider {\n      position: absolute;\n      cursor: pointer;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      background-color: #ccc;\n      -webkit-transition: .2s;\n      transition: .2s;\n    }\n\n    .slider:before {\n      position: absolute;\n      content: \"\";\n      height: 26px;\n      width: 26px;\n      left: 4px;\n      bottom: 4px;\n      background-color: white;\n      -webkit-transition: .2s;\n      transition: .2s;\n    }\n\n    input:checked + .slider {\n      background-color: #2196F3;\n    }\n\n    input:focus + .slider {\n      box-shadow: 0 0 1px #2196F3;\n    }\n\n    input:checked + .slider:before {\n      -webkit-transform: translateX(26px);\n      -ms-transform: translateX(26px);\n      transform: translateX(26px);\n    }\n\n    /* Rounded sliders */\n    .slider.round {\n      border-radius: 34px;\n    }\n\n    .slider.round:before {\n      border-radius: 50%;\n    } \n\n/* other */\n  #debugBox {\n    display: none;\n  }\n","/*\n@import url(\"themes/reset.css\");\n@import url(\"themes/normalize.css\");\n@import url(\"themes/sakura.css\");\n@import url(\"themes/water.css\");\n@import url(\"themes/main.css\");\n@import url(\"themes/98.css\");\n@import url(\"themes/macos.css\");\n*/\n@import url(\"themes/blank.css\");\n\n"],"names":[],"version":3,"file":"image.a05aaebc.css.map"}