UNPKG

@bookbox/view-html

Version:

Bookbox view for html

2 lines (1 loc) 22.9 kB
export declare const BOOK_TEMPLATE_HTML = "<!DOCTYPE html>\n<html>\n <head>\n <meta charset=\"utf8\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n <title>%TITLE</title>\n <link rel=\"icon\" href=\"data:image/svg+xml,%3Csvg width='120' height='120' viewBox='0 0 120 120' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M36 120C32.6863 120 30 117.314 30 114L30 6C30 2.68629 32.6863 0 36 0H90V120H36Z' fill='%2365B0ED'/%3E%3Ccircle cx='90' cy='30' r='30' fill='%2365B0ED'/%3E%3Ccircle cx='90' cy='90' r='30' fill='%2365B0ED'/%3E%3Cpath d='M13 120C9.68629 120 7 117.314 7 114L7 6C7 2.68629 9.68629 0 13 0H67V120H13Z' fill='%23DE6D77'/%3E%3Ccircle cx='67' cy='30' r='30' fill='%23DE6D77'/%3E%3Ccircle cx='67' cy='90' r='30' fill='%23DE6D77'/%3E%3Cpath d='M6 120C2.68629 120 0 117.314 0 114L0 6C0 2.68629 2.68629 0 6 0H45L45 120H6Z' fill='%2399C27C'/%3E%3Ccircle cx='45' cy='30' r='30' fill='%2399C27C'/%3E%3Ccircle cx='45' cy='90' r='30' fill='%2399C27C'/%3E%3C/svg%3E%0A\" type=\"image/svg+xml\" />\n <!-- main css -->\n <style>\n body {\n margin: 0;\n padding: 0;\n }\n </style>\n %FONT_STYLE\n \n %INLINE_HEAD\n <script type=\"module\" crossorigin>(function(){const e=document.createElement(\"link\").relList;if(e&&e.supports&&e.supports(\"modulepreload\"))return;for(const t of document.querySelectorAll('link[rel=\"modulepreload\"]'))r(t);new MutationObserver(t=>{for(const n of t)if(n.type===\"childList\")for(const i of n.addedNodes)i.tagName===\"LINK\"&&i.rel===\"modulepreload\"&&r(i)}).observe(document,{childList:!0,subtree:!0});function s(t){const n={};return t.integrity&&(n.integrity=t.integrity),t.referrerPolicy&&(n.referrerPolicy=t.referrerPolicy),t.crossOrigin===\"use-credentials\"?n.credentials=\"include\":t.crossOrigin===\"anonymous\"?n.credentials=\"omit\":n.credentials=\"same-origin\",n}function r(t){if(t.ep)return;t.ep=!0;const n=s(t);fetch(t.href,n)}})();const I=\".book-box_layout-settings-contents\",g=\"book-box_layout-settings-contents-item-current\",k=`.${g}`,E=o=>e=>{document.querySelectorAll(I).forEach(r=>{const t=Array.from(r.querySelectorAll('[data-name=\"header\"]')),n=t.map(a=>a.parentElement),i=new Map(t.map((a,f)=>[a.dataset.key,f])),{targetIndex:d}=x({listMap:i,current:o,entries:e}),u=n[d];r.querySelectorAll(k).forEach(a=>{a.classList.remove(g)}),u.classList.add(g),u.parentElement.scrollTop=u.offsetTop-50,o.index=d})},O=(o,e)=>s=>{const{targetIndex:r}=x({listMap:o,current:e,entries:s});r!==e.index&&(v({hash:`page-${r}`}),e.index=r)};function y(o,e){const s=typeof o==\"string\"?new URL(o):o;return Object.assign(s,e??{}),s}function v(o){window.history.replaceState(null,\"\",y(window.location.toString(),o))}function L(o){window.history.pushState(null,\"\",y(window.location.toString(),o))}function x({listMap:o,current:e,entries:s}){let r=-1/0,t=1/0;for(const i of s){const{isIntersecting:d,target:u,boundingClientRect:m,intersectionRect:a}=i,f=M({boundingClientRect:m,intersectionRect:a}),b=u.dataset.key??\"\",l=o.get(b)??0;d?e.visible.add(l):(e.visible.delete(l),f===\"top\"?l>r&&(r=l):f===\"bottom\"&&l<t&&(t=l))}let n=e.index;if(e.visible.size>0)n=Math.min(...e.visible);else{const i=[];n!==null&&i.push(n),t!==1/0&&i.push(t-1),r!==-1/0&&i.push(r),n=Math.max(0,Math.min(...i))}return{targetIndex:n}}function M({boundingClientRect:o,intersectionRect:e}){const{top:s,bottom:r}=o,{top:t,bottom:n}=e;return(s^0)===(t^0)?\"bottom\":\"top\"}const w=5;function A(){const e=+window.location.hash.slice(w+1);return Number.isNaN(e)?null:e}function C(o=document.body){const e=o.querySelectorAll('.book-box_content [data-name=\"header\"]'),r=E({index:null,visible:new Set}),t=new IntersectionObserver(r,{threshold:.5}),n=()=>{for(const c of Array.from(e))t.observe(c)},i=Array.from(o.querySelectorAll('.book-box_content [data-name=\".page\"]')),d=new Map(i.map(c=>c.dataset.key).filter(c=>!!c).map(c=>[c,+c.slice(w)])),m=O(d,{index:null,visible:new Set}),a=new IntersectionObserver(m,{threshold:.5}),f=()=>{for(const c of i)a.observe(c)};return{headersObserver:t,pageObserver:a,observeNavigation:()=>{n(),f()},disconnectNavigation:()=>{t.disconnect(),a.disconnect()}}}const N=\"book-box-theme\";function H(o){const{element:e,selector:s=\".book-box\"}=o??{};return e?[e]:Array.from(document.querySelectorAll(s))}const p={light:\"\",dark:\"book-box_theme-dark\",sepia:\"book-box_theme-sepia\"};function S(o){const{theme:e,storageKey:s}=o;for(const r of H(o))for(const t of Object.keys(p)){const n=p[t];t===e?n&&r.classList.add(n):n!==\"\"&&r.classList.remove(n)}localStorage.setItem(s??N,e)}function P(o){const{storageKey:e}={},s=localStorage.getItem(e??N);s&&p.hasOwnProperty(s)&&S({theme:s})}const _={push:L,replace:v},h=\"book-box_highlight\";function T(o,e){const s=document.querySelector(o);if(!s)return;const{useHistory:r=!1,url:t}=e??{};s.scrollIntoView(),r&&t&&_[typeof r==\"string\"?r:\"replace\"](t),s.classList.add(h),setTimeout(()=>s?s.classList.remove(h):void 0,1e3)}function q(o,e){T(`.book-box_content *[data-layout='top'][data-key='${o}']`,e)}function K(){window.bbx={gotoKey:q,setTheme:S,getCurrentPage:A}}function R(){K(),document.addEventListener(\"DOMContentLoaded\",()=>{P();const{observeNavigation:o}=C();o()})}R();</script>\n <style rel=\"stylesheet\" crossorigin>:root{--book-box-color-name-black: #181a1f;--book-box-color-name-dark: #292d34;--book-box-color-name-dark-black: #21252b;--book-box-color-name-dark-gray: #343942;--book-box-color-name-light-white: #fafafa;--book-box-color-name-light: #f1f3f5;--book-box-color-name-light-gray: #ebebec;--book-box-color-name-light-gray-medium: #e8e8e8;--book-box-color-name-gray-light: #abb2be;--book-box-color-name-gray-light-medium: #9da5b3;--book-box-color-name-gray: #5c6370;--book-box-color-name-gray-dark: #4c5363;--book-box-color-name-gray-blue: #7587a6;--book-box-color-name-blue: #558efc;--book-box-color-name-blue-light: #598cef;--book-box-color-name-blue-dark: #507ac9;--book-box-color-name-blue-sky: #65b0ed;--book-box-color-name-cyan: #5bb6c1;--book-box-color-name-red: #bc514a;--book-box-color-name-red-light: #de6d77;--book-box-color-name-green-light: #99c27c;--book-box-color-name-green-herbal: #5c893c;--book-box-color-name-orange-light: #d0996a;--book-box-color-name-orange-dark: #ac885b;--book-box-color-name-yellow-light: #e4bf7f;--book-box-color-name-yellow: #e9c062;--book-box-color-name-violet-light: #c57bdb;--book-box-color-name-violet: #9545ad;--book-box-color-name-white: #ffffff;--book-box-color-label-dark: rgb(29, 29, 29);--book-box-color-label-sepia: rgb(241, 226, 192)}.book-box{--book-box-color-background: white;--book-box-color-background-hover: rgb(239, 246, 255);--book-box-color-background-accent: rgb(221, 236, 255);--book-box-color-text: black;--book-box-color-text-secondary: gray;--book-box-color-text-accent: rgb(0, 96, 185);--book-box-color-page: var(--book-box-color-text-secondary);--book-box-color-shadow: gray;--book-box-color-divider: rgb(222, 225, 231);--book-box-size-text: 1em;--book-box-size-text-small: .9em;--book-box-size-text-control: 1rem;--book-box-size-text-line: calc(1.5 * var(--book-box-size-text));--book-box-size-elem-control: 2rem;--book-box-size-offset: 2em;--book-box-size-offset-small: 8px;--book-box-size-page-column-width: 2em;--book-box-size-offset-right: max(var(--book-box-size-offset), var(--book-box-size-page-column-width)) ;--book-box-size-content-max-width: 800px;--book-box-size-page-max-width: calc(100vw - var(--book-box-size-offset) - var(--book-box-size-offset-right));--book-box-z-index-content: 10000;--book-box-z-index-settings: 10001;--book-box-z-index-settings-view: 10001;--book-box-z-index-panel: 10003;color:var(--book-box-color-text);background-color:var(--book-box-color-background);position:relative;line-height:var(--book-box-size-text-line);font-family:var(--book-box-font, sans-serif);-webkit-hyphens:auto;hyphens:auto}.book-box:fullscreen{overflow:auto}.book-box_theme-dark{--book-box-color-background: var(--book-box-color-label-dark);--book-box-color-background-hover: rgb(41, 45, 49);--book-box-color-background-accent: rgb(67, 73, 82);--book-box-color-text: rgb(224, 224, 224);--book-box-color-text-secondary: rgb(167, 164, 164);--book-box-color-text-accent: rgb(57, 144, 224);--book-box-color-page: var(--book-box-color-text-secondary);--book-box-color-shadow: rgb(82, 81, 81);--book-box-color-divider: rgb(114, 115, 117)}.book-box_theme-sepia{--book-box-color-background: var(--book-box-color-label-sepia);--book-box-color-background-hover: rgb(221, 205, 169);--book-box-color-background-accent: rgb(216, 196, 149);--book-box-color-text: rgb(33, 24, 24);--book-box-color-text-secondary: rgb(107, 81, 81);--book-box-color-text-accent: rgb(154, 55, 55);--book-box-color-page: var(--book-box-color-text-secondary);--book-box-color-shadow: rgb(126, 95, 95);--book-box-color-divider: rgb(105, 77, 77)}.book-box span{line-height:var(--book-box-size-text-line)}.book-box_layout{position:relative}.book-box_content-container{display:grid;grid-template-columns:auto 1fr;position:relative;max-width:var(--book-box-size-page-max-width)}.book-box_content-container>.book-box_layout-tabs{position:sticky;top:0;--h: var(--book-box-size-settings-height, 100vh);max-height:var(--h);height:var(--h);width:300px;max-width:100vw;min-width:200px;border-right:1px solid var(--book-box-color-divider);background:var(--book-box-color-background);overflow:auto;resize:horizontal;z-index:var(--book-box-z-index-settings)}.book-box_content-container>.book-box_layout-tabs .book-box_layout-settings-contents-item{font-size:.7em}.book-box_content-container>.book-box_layout-tabs .book-box_layout-settings-contents-item :is(h1,h2,h3,h4,h5,h6){margin:.1em}@media (max-width: 1200px){.book-box_content-container{grid-template-columns:1fr}.book-box_content-container>.book-box_layout-tabs{border-top:1px solid var(--book-box-color-divider);border-top-right-radius:8px;position:fixed;margin-top:3rem;--sh: calc(var(--h) - 3rem);max-height:var(--sh);height:var(--h)}}.book-box_layout-settings{position:fixed;bottom:0;left:0;z-index:var(--book-box-z-index-settings);display:flex;flex-direction:column;gap:8px;margin:.5rem}.book-box_layout-settings-item{display:block;padding:4px;background-color:var(--book-box-color-background-accent);border-radius:4px;cursor:pointer;text-align:center;width:1.2rem;height:1.2rem;line-height:1.2rem;font-size:1.4rem}.book-box_layout-settings-panel .book-box_layout-panel-header{position:sticky;top:0}.book-box_layout-settings-namespace .book-box_layout-panel{grid-template-columns:1fr auto}.book-box_layout-settings-navigation_item{padding:4px 1rem}.book-box_layout-settings-navigation_item:hover{background-color:var(--book-box-color-background-hover);color:var(--book-box-color-text-accent);cursor:pointer}.book-box_layout-settings-contents .book-box_layout-panel{grid-template-columns:1fr auto}.book-box_layout-settings-contents .book-box_layout-panel-content{max-width:max(50vw,300px);font-size:.8em;overflow:auto}.book-box_layout-settings-contents-item{padding:4px 1rem}.book-box_layout-settings-contents-item:hover{background-color:var(--book-box-color-background-hover);color:var(--book-box-color-text-accent);cursor:pointer}.book-box_layout-settings-contents-item-current{background-color:var(--book-box-color-background-accent);color:var(--book-box-color-text-accent)}.book-box_layout-settings-media .book-box_layout-panel{grid-template-columns:1fr auto}.book-box_layout-settings-media-grid{width:100%;display:grid;grid-template-columns:repeat(auto-fit,100px)}.book-box_layout-settings-media-item{overflow:hidden;padding:4px;border-radius:4px}.book-box_layout-settings-media-item:hover{background-color:var(--book-box-color-background-hover);cursor:pointer}.book-box_layout-settings-design .book-box_layout-panel{grid-template-columns:1fr auto}.book-box_layout-settings-design .book-box_layout-panel-content>div:last-child{padding:var(--book-box-size-offset-small)}.book-box_layout-settings-design-theme{border:1px solid var(--book-box-color-divider);padding:4px 8px;border-radius:var(--book-box-size-offset-small);display:inline-flex;gap:8px;cursor:pointer}.book-box_layout-settings-design-theme>div:first-child{border-radius:50%;border:1px solid var(--book-box-color-divider);height:1.5em;width:1.5em;display:flex;justify-content:center;align-items:center}.book-box_layout-settings-design-theme:nth-child(1)>div:after,.book-box_theme-dark .book-box_layout-settings-design-theme:nth-child(2)>div:after,.book-box_theme-sepia .book-box_layout-settings-design-theme:nth-child(3)>div:after{content:\"\";display:block;background-color:var(--book-box-color-text);width:.5em;height:.5em;border-radius:50%}.book-box_theme-dark .book-box_layout-settings-design-theme:not(:nth-child(2))>div:after,.book-box_theme-sepia .book-box_layout-settings-design-theme:not(:nth-child(3))>div:after{display:none}.book-box_layout-panel-tumbler{display:none}.book-box_layout-panel-tumbler:checked+label+.book-box_layout-panel{display:grid;opacity:1;pointer-events:unset}.book-box_layout-panel-tumbler-fast+label+.book-box_layout-panel{display:grid;opacity:0;pointer-events:none}.book-box_layout-panel{display:none;position:fixed;z-index:var(--book-box-z-index-panel);top:0;left:0;bottom:0;right:0;width:100vw;height:100vh}.book-box_layout-panel .book-box_layout-panel-content{background-color:var(--book-box-color-background);box-shadow:0 0 10px var(--book-box-color-shadow);overscroll-behavior:none;overflow:scroll;min-width:300px;max-width:100vw}.book-box_layout-panel .book-box_layout-panel-tumbler,.book-box_layout-panel-content .book-box-header-mark,.book-box_layout-panel-content .book-box-page{display:none}.book-box_layout-panel-header{max-height:var(--book-box-size-elem-control);display:grid;grid-template-columns:1fr auto;background:var(--book-box-color-background);border-bottom:1px solid var(--book-box-color-divider);z-index:var(--book-box-z-index-panel)}.book-box_layout-panel-header>div{overflow:hidden;text-overflow:ellipsis;line-height:var(--book-box-size-elem-control);padding:0 var(--book-box-size-offset-small);font-size:var(--book-box-size-text-control)}.book-box_control-close{width:var(--book-box-size-elem-control);height:var(--book-box-size-elem-control);line-height:var(--book-box-size-elem-control);font-size:1.8rem;text-align:center}.book-box_layout-tabs{background:var(--book-box-color-background);display:flex;flex-wrap:wrap;position:relative}.book-box_layout-tabs>input{display:none}.book-box_layout-tabs>label{display:flex;height:2.5rem;flex-grow:2;cursor:pointer;justify-content:center;align-items:center}.book-box_layout-tabs>label:hover{background-color:var(--book-box-color-background-hover)}.book-box_layout-tabs>input:checked+label{background-color:var(--book-box-color-background-accent)}.book-box_layout-tabs>div{opacity:0;display:none;left:0;position:absolute;top:2.5rem;width:100%;z-index:-1}.book-box_layout-tabs>input:checked:nth-of-type(1)~div:nth-of-type(1),.book-box_layout-tabs>input:checked:nth-of-type(2)~div:nth-of-type(2),.book-box_layout-tabs>input:checked:nth-of-type(3)~div:nth-of-type(3),.book-box_layout-tabs>input:checked:nth-of-type(4)~div:nth-of-type(4),.book-box_layout-tabs>input:checked:nth-of-type(5)~div:nth-of-type(5),.book-box_layout-tabs>input:checked:nth-of-type(6)~div:nth-of-type(6),.book-box_layout-tabs>input:checked:nth-of-type(7)~div:nth-of-type(7),.book-box_layout-tabs>input:checked:nth-of-type(8)~div:nth-of-type(8),.book-box_layout-tabs>input:checked:nth-of-type(9)~div:nth-of-type(9),.book-box_layout-tabs>input:checked:nth-of-type(10)~div:nth-of-type(10){display:block;opacity:1;z-index:1;border-top:1px solid var(--book-box-color-divider)}.book-box_layout-settings-view{position:fixed;top:0;right:0;z-index:var(--book-box-z-index-settings-view);margin:.5rem}.book-box_layout-settings-view-tumbler{display:none}.book-box_layout-settings-view-tumbler+label:after{content:\"\u2922\"}.book-box:fullscreen .book-box_layout-settings-view-tumbler+label:after{content:\"\u2926\"}.book-box_layout-settings-settings{position:sticky;top:.5rem;left:0;z-index:var(--book-box-z-index-settings-view);margin:.5rem}.book-box_layout-settings-settings:after{content:\"\u2699\"}.book-box_layout-settings-settings-tumbler:checked+div .book-box_layout-settings-settings:after{content:\"\u00AB\"}.book-box_layout-settings-settings-tumbler:not(:checked)+.book-box_content-container{grid-template-columns:1fr}.book-box_layout-settings-settings-tumbler:not(:checked)+div>.book-box_layout-tabs{display:none}.book-box_content{color:var(--book-box-color-text);background-color:var(--book-box-color-background);overflow:hidden}.book-box_content>div{position:relative;max-width:min(var(--book-box-size-content-max-width),var(--book-box-size-page-max-width));padding:16px var(--book-box-size-offset);padding-right:var(--book-box-size-offset-right);margin:auto}@media (max-width: 400px){.book-box{--book-box-size-offset: 1em}}.book-box_media-figure{margin:0;width:100%}.book-box_media-figure>div{width:100%;display:flex}.book-box_media-figure picture{width:100%;display:flex}.book-box_media-figure-caption{display:flex;text-align:center;font-size:.9em;font-style:italic}.book-box_media-inline{display:inline-block;width:auto}.book-box_media-inline>figure>div{display:inline-block;width:auto}.book-box_media-block{display:flex}.book-box_media-full{justify-content:stretch}.book-box_media-center>figure>div{justify-content:center}.book-box_media-center>figure>figcaption{justify-content:center}.book-box_media-center>figure picture{justify-content:center}.book-box_media-start>figure>div{justify-content:flex-start}.book-box_media-start>figure>figcaption{justify-content:flex-start}.book-box_media-start>figure picture{justify-content:flex-start}.book-box_media-end>figure>div{justify-content:flex-end}.book-box_media-end>figure>figcaption{justify-content:flex-end}.book-box_media-end>figure picture{justify-content:flex-end}.book-box_align-center{text-align:center}.book-box_align-start{text-align:start}.book-box_align-end{text-align:end}.book-box_loadable-content{display:none;opacity:0;pointer-events:none}.book-box_loadable-loaded .book-box_loadable-content{display:block;opacity:1;pointer-events:inherit}.book-box_loadable-progress{background-color:#d3d3d3;color:#000;height:100%;width:100%;overflow:scroll;word-wrap:break-word}.book-box_loadable-loaded .book-box_loadable-progress{display:none}.book-box_loadable-error{background-color:#f08080;display:none}.book-box_loadable-error-loaded .book-box_loadable-error{display:block}.book-box_loadable{background:var(--book-box-color-background-hover);padding:8px;border-radius:8px}.book-box_layout-offline .book-box_loadable{box-shadow:5px 5px gray}.book-box_clickable:hover{cursor:pointer;color:var(--book-box-color-text-accent)}.book-box_highlight{color:var(--book-box-color-text-accent);transition:color 1s}.book-box-title{text-align:center}.book-box-authors{text-align:center;padding:1rem}.book-box-draft{display:inline-block;border:5px solid red;padding:2px;--yellow: rgb(255, 255, 161);--red: rgb(255, 217, 179);background-color:var(--yellow);color:#000;background:repeating-linear-gradient(-45deg,var(--yellow),var(--yellow) 20px,var(--red) 20px,var(--red) 40px)}.book-box-header{display:inline-block}.book-box-header-mark{display:inline-block;min-height:1rem;max-height:2rem;font-size:1rem;line-height:1em;font-weight:400;padding:4px;color:var(--book-box-color-text-secondary);opacity:0}.book-box-header-container:hover .book-box-header-mark{opacity:1}.book-box-label{display:inline-block}.book-box-label-mark{cursor:pointer;border:1px solid var(--book-box-color-divider)}.book-box-label-panel-mark{display:inline-block;font-style:italic;color:var(--book-box-color-text-secondary)}.book-box-label-panel-content{padding:var(--book-box-size-offset-small)}.book-box-label-panel-header{padding:0 var(--book-box-size-offset-small);height:100%}.book-box-label-panel-goto{font-size:.9em;padding:2px 4px;margin:4px 0;border:1px solid var(--book-box-color-divider);border-radius:4px;display:inline-flex;justify-content:center;align-items:center;height:1.2em}.book-box-label-panel-header .book-box-label-panel-goto{margin-left:4px}.book-box-label-panel-goto:hover{color:var(--book-box-color-text-accent);cursor:pointer}.book-box-label-input+label{padding:2px 4px;border-radius:2px}.book-box-label-input:checked+label{background:var(--book-box-color-background-accent);color:var(--book-box-color-text-accent);border-color:transparent}.book-box-label-data{grid-template-rows:1fr auto}.book-box-label-data .book-box_layout-panel-content{max-height:70vh}.book-box-label-data .book-box-page,.book-box-label-data .book-box-header-mark{display:none}.book-box-format-small{font-size:var(--book-box-size-text-small)}.book-box-external{border:1px solid var(--book-box-color-divider);padding:var(--book-box-size-offset-small);border-radius:var(--book-box-size-offset-small)}.book-box-page{position:absolute;background-color:var(--book-box-color-background);color:var(--book-box-color-page);font-size:calc(var(--book-box-size-text) * .8);font-weight:400;font-style:normal;font-family:sans-serif;line-height:1.5rem;right:0;max-width:var(--book-box-size-offset-right);text-align:right;padding:0 8px}.book-box-area{display:block}.book-box-area.book-box-area-inline{display:inline-block}.book-box-link{color:var(--book-box-color-text-accent)}.book-box-audio audio{max-width:100%}.book-box-code pre{font-family:Menlo,monospace;border:1px solid var(--book-box-color-divider);border-radius:var(--book-box-size-offset-small);padding:2px 4px;margin:0;width:100%}.book-box-code-with-lang pre{border-top-left-radius:0}.book-box-code-lang-mark{display:inline-block;padding:2px 4px;font-size:.9em;font-style:italic;color:var(--book-box-color-text-secondary);border:1px solid var(--book-box-color-divider);border-bottom:none;border-radius:var(--book-box-size-offset-small) var(--book-box-size-offset-small) 0 0}.book-box-list{margin:var(--book-box-size-offset-small) 0}.book-box-separator{height:2px;background-color:var(--book-box-color-divider);border:none}.book-box-table>figure>div>div{max-width:100%;overflow-x:auto;justify-content:unset}.book-box-table table{border:1px solid var(--book-box-color-divider);border-collapse:collapse;padding:0;margin:0}.book-box-table thead{white-space:nowrap}.book-box-table th{font-weight:400}.book-box-table [data-name=cell]{border:1px solid var(--book-box-color-divider);padding:0 1em;min-width:1em}.book-box--error{border:1px solid red;border-radius:var(--book-box-size-offset-small);padding:var(--book-box-size-offset-small);margin:var(--book-box-size-offset-small) 0}.book-box--error pre{word-break:break-all;white-space:pre-wrap}</style>\n </head>\n <body>\n %BOOK\n <script>window.data = JSON.parse(`%SCHEMA`)</script>\n </body>\n</html>\n";