X-Git-Url: https://git.piment-noir.org/?a=blobdiff_plain;ds=sidebyside;f=docs%2Fassets%2Fstyle.css;h=072daed853175b4e9bcfc7f10a042b1413c9121e;hb=773881ea2c1b9aa8cd9698cc3ccc1978609ad98f;hp=0db60927435bdb5532c2826b2cf3c88b85fc5b5a;hpb=ec06e4dd01adf7aa4bab470c59da42c19d863d0b;p=poolifier.git diff --git a/docs/assets/style.css b/docs/assets/style.css index 0db60927..072daed8 100644 --- a/docs/assets/style.css +++ b/docs/assets/style.css @@ -6,17 +6,36 @@ --light-color-background-warning: #e6e600; --light-color-icon-background: var(--light-color-background); --light-color-accent: #c5c7c9; + --light-color-active-menu-item: var(--light-color-accent); --light-color-text: #222; - --light-color-text-aside: #707070; - --light-color-link: #4da6ff; - --light-color-ts: #db1373; - --light-color-ts-interface: #139d2c; - --light-color-ts-enum: #9c891a; - --light-color-ts-class: #2484e5; + --light-color-text-aside: #6e6e6e; + --light-color-link: #1f70c2; + + --light-color-ts-keyword: #056bd6; + --light-color-ts-project: #b111c9; + --light-color-ts-module: var(--light-color-ts-project); + --light-color-ts-namespace: var(--light-color-ts-project); + --light-color-ts-enum: #7e6f15; + --light-color-ts-enum-member: var(--light-color-ts-enum); + --light-color-ts-variable: #4760ec; --light-color-ts-function: #572be7; - --light-color-ts-namespace: #b111c9; - --light-color-ts-private: #707070; - --light-color-ts-variable: #4d68ff; + --light-color-ts-class: #1f70c2; + --light-color-ts-interface: #108024; + --light-color-ts-constructor: var(--light-color-ts-class); + --light-color-ts-property: var(--light-color-ts-variable); + --light-color-ts-method: var(--light-color-ts-function); + --light-color-ts-call-signature: var(--light-color-ts-method); + --light-color-ts-index-signature: var(--light-color-ts-property); + --light-color-ts-constructor-signature: var(--light-color-ts-constructor); + --light-color-ts-parameter: var(--light-color-ts-variable); + /* type literal not included as links will never be generated to it */ + --light-color-ts-type-parameter: #a55c0e; + --light-color-ts-accessor: var(--light-color-ts-property); + --light-color-ts-get-signature: var(--light-color-ts-accessor); + --light-color-ts-set-signature: var(--light-color-ts-accessor); + --light-color-ts-type-alias: #d51270; + /* reference not included as links will be colored with the kind that it points to */ + --light-external-icon: url("data:image/svg+xml;utf8,"); --light-color-scheme: light; @@ -27,17 +46,36 @@ --dark-color-warning-text: #222; --dark-color-icon-background: var(--dark-color-background-secondary); --dark-color-accent: #9096a2; + --dark-color-active-menu-item: #5d5d6a; --dark-color-text: #f5f5f5; --dark-color-text-aside: #dddddd; --dark-color-link: #00aff4; - --dark-color-ts: #ff6492; - --dark-color-ts-interface: #6cff87; + + --dark-color-ts-keyword: #3399ff; + --dark-color-ts-project: #e358ff; + --dark-color-ts-module: var(--dark-color-ts-project); + --dark-color-ts-namespace: var(--dark-color-ts-project); --dark-color-ts-enum: #f4d93e; - --dark-color-ts-class: #61b0ff; - --dark-color-ts-function: #9772ff; - --dark-color-ts-namespace: #e14dff; - --dark-color-ts-private: #e2e2e2; - --dark-color-ts-variable: #4d68ff; + --dark-color-ts-enum-member: var(--dark-color-ts-enum); + --dark-color-ts-variable: #798dff; + --dark-color-ts-function: #a280ff; + --dark-color-ts-class: #8ac4ff; + --dark-color-ts-interface: #6cff87; + --dark-color-ts-constructor: var(--dark-color-ts-class); + --dark-color-ts-property: var(--dark-color-ts-variable); + --dark-color-ts-method: var(--dark-color-ts-function); + --dark-color-ts-call-signature: var(--dark-color-ts-method); + --dark-color-ts-index-signature: var(--dark-color-ts-property); + --dark-color-ts-constructor-signature: var(--dark-color-ts-constructor); + --dark-color-ts-parameter: var(--dark-color-ts-variable); + /* type literal not included as links will never be generated to it */ + --dark-color-ts-type-parameter: #e07d13; + --dark-color-ts-accessor: var(--dark-color-ts-property); + --dark-color-ts-get-signature: var(--dark-color-ts-accessor); + --dark-color-ts-set-signature: var(--dark-color-ts-accessor); + --dark-color-ts-type-alias: #ff6492; + /* reference not included as links will be colored with the kind that it points to */ + --dark-external-icon: url("data:image/svg+xml;utf8,"); --dark-color-scheme: dark; } @@ -50,17 +88,35 @@ --color-warning-text: var(--light-color-warning-text); --color-icon-background: var(--light-color-icon-background); --color-accent: var(--light-color-accent); + --color-active-menu-item: var(--light-color-active-menu-item); --color-text: var(--light-color-text); --color-text-aside: var(--light-color-text-aside); --color-link: var(--light-color-link); - --color-ts: var(--light-color-ts); - --color-ts-interface: var(--light-color-ts-interface); - --color-ts-enum: var(--light-color-ts-enum); - --color-ts-class: var(--light-color-ts-class); - --color-ts-function: var(--light-color-ts-function); + + --color-ts-keyword: var(--light-color-ts-keyword); + --color-ts-module: var(--light-color-ts-module); --color-ts-namespace: var(--light-color-ts-namespace); - --color-ts-private: var(--light-color-ts-private); + --color-ts-enum: var(--light-color-ts-enum); + --color-ts-enum-member: var(--light-color-ts-enum-member); --color-ts-variable: var(--light-color-ts-variable); + --color-ts-function: var(--light-color-ts-function); + --color-ts-class: var(--light-color-ts-class); + --color-ts-interface: var(--light-color-ts-interface); + --color-ts-constructor: var(--light-color-ts-constructor); + --color-ts-property: var(--light-color-ts-property); + --color-ts-method: var(--light-color-ts-method); + --color-ts-call-signature: var(--light-color-ts-call-signature); + --color-ts-index-signature: var(--light-color-ts-index-signature); + --color-ts-constructor-signature: var( + --light-color-ts-constructor-signature + ); + --color-ts-parameter: var(--light-color-ts-parameter); + --color-ts-type-parameter: var(--light-color-ts-type-parameter); + --color-ts-accessor: var(--light-color-ts-accessor); + --color-ts-get-signature: var(--light-color-ts-get-signature); + --color-ts-set-signature: var(--light-color-ts-set-signature); + --color-ts-type-alias: var(--light-color-ts-type-alias); + --external-icon: var(--light-external-icon); --color-scheme: var(--light-color-scheme); } @@ -74,17 +130,35 @@ --color-warning-text: var(--dark-color-warning-text); --color-icon-background: var(--dark-color-icon-background); --color-accent: var(--dark-color-accent); + --color-active-menu-item: var(--dark-color-active-menu-item); --color-text: var(--dark-color-text); --color-text-aside: var(--dark-color-text-aside); --color-link: var(--dark-color-link); - --color-ts: var(--dark-color-ts); - --color-ts-interface: var(--dark-color-ts-interface); - --color-ts-enum: var(--dark-color-ts-enum); - --color-ts-class: var(--dark-color-ts-class); - --color-ts-function: var(--dark-color-ts-function); + + --color-ts-keyword: var(--dark-color-ts-keyword); + --color-ts-module: var(--dark-color-ts-module); --color-ts-namespace: var(--dark-color-ts-namespace); - --color-ts-private: var(--dark-color-ts-private); + --color-ts-enum: var(--dark-color-ts-enum); + --color-ts-enum-member: var(--dark-color-ts-enum-member); --color-ts-variable: var(--dark-color-ts-variable); + --color-ts-function: var(--dark-color-ts-function); + --color-ts-class: var(--dark-color-ts-class); + --color-ts-interface: var(--dark-color-ts-interface); + --color-ts-constructor: var(--dark-color-ts-constructor); + --color-ts-property: var(--dark-color-ts-property); + --color-ts-method: var(--dark-color-ts-method); + --color-ts-call-signature: var(--dark-color-ts-call-signature); + --color-ts-index-signature: var(--dark-color-ts-index-signature); + --color-ts-constructor-signature: var( + --dark-color-ts-constructor-signature + ); + --color-ts-parameter: var(--dark-color-ts-parameter); + --color-ts-type-parameter: var(--dark-color-ts-type-parameter); + --color-ts-accessor: var(--dark-color-ts-accessor); + --color-ts-get-signature: var(--dark-color-ts-get-signature); + --color-ts-set-signature: var(--dark-color-ts-set-signature); + --color-ts-type-alias: var(--dark-color-ts-type-alias); + --external-icon: var(--dark-external-icon); --color-scheme: var(--dark-color-scheme); } @@ -105,17 +179,35 @@ body { --color-warning-text: var(--light-color-warning-text); --color-icon-background: var(--light-color-icon-background); --color-accent: var(--light-color-accent); + --color-active-menu-item: var(--light-color-active-menu-item); --color-text: var(--light-color-text); --color-text-aside: var(--light-color-text-aside); --color-link: var(--light-color-link); - --color-ts: var(--light-color-ts); - --color-ts-interface: var(--light-color-ts-interface); - --color-ts-enum: var(--light-color-ts-enum); - --color-ts-class: var(--light-color-ts-class); - --color-ts-function: var(--light-color-ts-function); + + --color-ts-keyword: var(--light-color-ts-keyword); + --color-ts-module: var(--light-color-ts-module); --color-ts-namespace: var(--light-color-ts-namespace); - --color-ts-private: var(--light-color-ts-private); + --color-ts-enum: var(--light-color-ts-enum); + --color-ts-enum-member: var(--light-color-ts-enum-member); --color-ts-variable: var(--light-color-ts-variable); + --color-ts-function: var(--light-color-ts-function); + --color-ts-class: var(--light-color-ts-class); + --color-ts-interface: var(--light-color-ts-interface); + --color-ts-constructor: var(--light-color-ts-constructor); + --color-ts-property: var(--light-color-ts-property); + --color-ts-method: var(--light-color-ts-method); + --color-ts-call-signature: var(--light-color-ts-call-signature); + --color-ts-index-signature: var(--light-color-ts-index-signature); + --color-ts-constructor-signature: var( + --light-color-ts-constructor-signature + ); + --color-ts-parameter: var(--light-color-ts-parameter); + --color-ts-type-parameter: var(--light-color-ts-type-parameter); + --color-ts-accessor: var(--light-color-ts-accessor); + --color-ts-get-signature: var(--light-color-ts-get-signature); + --color-ts-set-signature: var(--light-color-ts-set-signature); + --color-ts-type-alias: var(--light-color-ts-type-alias); + --external-icon: var(--light-external-icon); --color-scheme: var(--light-color-scheme); } @@ -127,17 +219,35 @@ body { --color-warning-text: var(--dark-color-warning-text); --color-icon-background: var(--dark-color-icon-background); --color-accent: var(--dark-color-accent); + --color-active-menu-item: var(--dark-color-active-menu-item); --color-text: var(--dark-color-text); --color-text-aside: var(--dark-color-text-aside); --color-link: var(--dark-color-link); - --color-ts: var(--dark-color-ts); - --color-ts-interface: var(--dark-color-ts-interface); - --color-ts-enum: var(--dark-color-ts-enum); - --color-ts-class: var(--dark-color-ts-class); - --color-ts-function: var(--dark-color-ts-function); + + --color-ts-keyword: var(--dark-color-ts-keyword); + --color-ts-module: var(--dark-color-ts-module); --color-ts-namespace: var(--dark-color-ts-namespace); - --color-ts-private: var(--dark-color-ts-private); + --color-ts-enum: var(--dark-color-ts-enum); + --color-ts-enum-member: var(--dark-color-ts-enum-member); --color-ts-variable: var(--dark-color-ts-variable); + --color-ts-function: var(--dark-color-ts-function); + --color-ts-class: var(--dark-color-ts-class); + --color-ts-interface: var(--dark-color-ts-interface); + --color-ts-constructor: var(--dark-color-ts-constructor); + --color-ts-property: var(--dark-color-ts-property); + --color-ts-method: var(--dark-color-ts-method); + --color-ts-call-signature: var(--dark-color-ts-call-signature); + --color-ts-index-signature: var(--dark-color-ts-index-signature); + --color-ts-constructor-signature: var( + --dark-color-ts-constructor-signature + ); + --color-ts-parameter: var(--dark-color-ts-parameter); + --color-ts-type-parameter: var(--dark-color-ts-type-parameter); + --color-ts-accessor: var(--dark-color-ts-accessor); + --color-ts-get-signature: var(--dark-color-ts-get-signature); + --color-ts-set-signature: var(--dark-color-ts-set-signature); + --color-ts-type-alias: var(--dark-color-ts-type-alias); + --external-icon: var(--dark-external-icon); --color-scheme: var(--dark-color-scheme); } @@ -156,6 +266,16 @@ h6 { line-height: 1.2; } +h1 > a:not(.link), +h2 > a:not(.link), +h3 > a:not(.link), +h4 > a:not(.link), +h5 > a:not(.link), +h6 > a:not(.link) { + text-decoration: none; + color: var(--color-text); +} + h1 { font-size: 1.875rem; margin: 0.67rem 0; @@ -190,12 +310,6 @@ h6 { text-transform: uppercase; } -pre { - white-space: pre; - white-space: pre-wrap; - word-wrap: break-word; -} - dl, menu, ol, @@ -291,7 +405,8 @@ dd { } body { background: var(--color-background); - font-family: "Segoe UI", sans-serif; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", + Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; font-size: 16px; color: var(--color-text); } @@ -320,13 +435,29 @@ pre { } pre { + position: relative; + white-space: pre; + white-space: pre-wrap; + word-wrap: break-word; padding: 10px; - border: 0.1em solid var(--color-accent); + border: 1px solid var(--color-accent); } pre code { padding: 0; font-size: 100%; } +pre > button { + position: absolute; + top: 10px; + right: 10px; + opacity: 0; + transition: opacity 0.1s; + box-sizing: border-box; +} +pre:hover > button, +pre > button.visible { + opacity: 1; +} blockquote { margin: 1em 0; @@ -342,13 +473,12 @@ blockquote { padding: 0 0 0 20px; margin: 0; } -.tsd-typography h4, .tsd-typography .tsd-index-panel h3, .tsd-index-panel .tsd-typography h3, +.tsd-typography h4, .tsd-typography h5, .tsd-typography h6 { font-size: 1em; - margin: 0; } .tsd-typography h5, .tsd-typography h6 { @@ -359,6 +489,19 @@ blockquote { .tsd-typography ol { margin: 1em 0; } +.tsd-typography table { + border-collapse: collapse; + border: none; +} +.tsd-typography td, +.tsd-typography th { + padding: 6px 13px; + border: 1px solid var(--color-accent); +} +.tsd-typography thead, +.tsd-typography tr:nth-child(even) { + background-color: var(--color-background-secondary); +} .tsd-breadcrumb { margin: 0; @@ -507,6 +650,28 @@ input[type="checkbox"]:checked ~ svg .tsd-checkbox-checkmark { font-weight: bold; } +.tsd-full-hierarchy:not(:last-child) { + margin-bottom: 1em; + padding-bottom: 1em; + border-bottom: 1px solid var(--color-accent); +} +.tsd-full-hierarchy, +.tsd-full-hierarchy ul { + list-style: none; + margin: 0; + padding: 0; +} +.tsd-full-hierarchy ul { + padding-left: 1.5rem; +} +.tsd-full-hierarchy a { + padding: 0.25rem 0 !important; + font-size: 1rem; + display: inline-flex; + align-items: center; + color: var(--color-text); +} + .tsd-panel-group.tsd-index-group { margin-bottom: 0; } @@ -538,43 +703,6 @@ input[type="checkbox"]:checked ~ svg .tsd-checkbox-checkmark { -o-page-break-inside: avoid; page-break-inside: avoid; } -.tsd-index-panel a, -.tsd-index-panel a.tsd-parent-kind-module { - color: var(--color-ts); -} -.tsd-index-panel a.tsd-parent-kind-interface { - color: var(--color-ts-interface); -} -.tsd-index-panel a.tsd-parent-kind-enum { - color: var(--color-ts-enum); -} -.tsd-index-panel a.tsd-parent-kind-class { - color: var(--color-ts-class); -} -.tsd-index-panel a.tsd-kind-module { - color: var(--color-ts-namespace); -} -.tsd-index-panel a.tsd-kind-interface { - color: var(--color-ts-interface); -} -.tsd-index-panel a.tsd-kind-enum { - color: var(--color-ts-enum); -} -.tsd-index-panel a.tsd-kind-class { - color: var(--color-ts-class); -} -.tsd-index-panel a.tsd-kind-function { - color: var(--color-ts-function); -} -.tsd-index-panel a.tsd-kind-namespace { - color: var(--color-ts-namespace); -} -.tsd-index-panel a.tsd-kind-variable { - color: var(--color-ts-variable); -} -.tsd-index-panel a.tsd-is-private { - color: var(--color-ts-private); -} .tsd-flag { display: inline-block; @@ -603,44 +731,30 @@ input[type="checkbox"]:checked ~ svg .tsd-checkbox-checkmark { margin-bottom: 0; border-bottom: none; } -.tsd-member [data-tsd-kind] { - color: var(--color-ts); -} -.tsd-member [data-tsd-kind="Interface"] { - color: var(--color-ts-interface); -} -.tsd-member [data-tsd-kind="Enum"] { - color: var(--color-ts-enum); -} -.tsd-member [data-tsd-kind="Class"] { - color: var(--color-ts-class); -} -.tsd-member [data-tsd-kind="Private"] { - color: var(--color-ts-private); -} .tsd-navigation.settings { margin: 1rem 0; } +.tsd-navigation > a, +.tsd-navigation .tsd-accordion-summary { + width: calc(100% - 0.25rem); + display: flex; + align-items: center; +} .tsd-navigation a, +.tsd-navigation summary > span, .tsd-page-navigation a { - display: inline-flex; + display: flex; + width: calc(100% - 0.25rem); align-items: center; - padding: 0.25rem 0; + padding: 0.25rem; color: var(--color-text); text-decoration: none; -} -.tsd-navigation a { - /* why 3rem? No idea, but it seems to work. */ - width: calc(100% - 3rem); -} -.tsd-page-navigation a { - /* why is this different? */ - width: 100%; + box-sizing: border-box; } .tsd-navigation a.current, .tsd-page-navigation a.current { - background: var(--color-accent); + background: var(--color-active-menu-item); } .tsd-navigation a:hover, .tsd-page-navigation a:hover { @@ -648,7 +762,8 @@ input[type="checkbox"]:checked ~ svg .tsd-checkbox-checkmark { } .tsd-navigation ul, .tsd-page-navigation ul { - margin: 0; + margin-top: 0; + margin-bottom: 0; padding: 0; list-style: none; } @@ -657,18 +772,19 @@ input[type="checkbox"]:checked ~ svg .tsd-checkbox-checkmark { padding: 0; max-width: 100%; } -.tsd-nested-navigation > li > a { +.tsd-nested-navigation { margin-left: 3rem; } .tsd-nested-navigation > li > details { - margin-left: 1.5rem; + margin-left: -1.5rem; } -.tsd-small-nested-navigation > li > a { +.tsd-small-nested-navigation { margin-left: 1.5rem; } .tsd-small-nested-navigation > li > details { - margin-left: 0; + margin-left: -1.5rem; } + .tsd-page-navigation ul { padding-left: 1.75rem; } @@ -688,6 +804,14 @@ a.tsd-index-link { line-height: 1.25rem; display: inline-flex; align-items: center; + color: var(--color-text); +} +.tsd-accordion-summary { + list-style-type: none; /* hide marker on non-safari */ + outline: none; /* broken on safari, so just hide it */ +} +.tsd-accordion-summary::-webkit-details-marker { + display: none; /* hide marker on safari */ } .tsd-accordion-summary, .tsd-accordion-summary a { @@ -696,21 +820,19 @@ a.tsd-index-link { -webkit-user-select: none; -ms-user-select: none; - display: flex; - align-items: center; cursor: pointer; } +.tsd-accordion-summary a { + width: calc(100% - 1.5rem); +} .tsd-accordion-summary > * { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } -.tsd-accordion-summary::-webkit-details-marker { - display: none; -} -.tsd-index-accordion .tsd-accordion-summary svg { - margin-right: 0.25rem; +.tsd-index-accordion .tsd-accordion-summary > svg { + margin-left: 0.25rem; } .tsd-index-content > :not(:first-child) { margin-top: 0.75rem; @@ -815,8 +937,9 @@ a.tsd-index-link { box-shadow: 0 0 4px rgba(0, 0, 0, 0.25); } #tsd-search .results li { - padding: 0 10px; background-color: var(--color-background); + line-height: initial; + padding: 4px; } #tsd-search .results li:nth-child(even) { background-color: var(--color-background-secondary); @@ -824,12 +947,15 @@ a.tsd-index-link { #tsd-search .results li.state { display: none; } -#tsd-search .results li.current, -#tsd-search .results li:hover { +#tsd-search .results li.current:not(.no-results), +#tsd-search .results li:hover:not(.no-results) { background-color: var(--color-accent); } #tsd-search .results a { - display: block; + display: flex; + align-items: center; + padding: 0.25rem; + box-sizing: border-box; } #tsd-search .results a:before { top: 10px; @@ -885,6 +1011,11 @@ a.tsd-index-link { overflow-x: auto; } +.tsd-signature-keyword { + color: var(--color-ts-keyword); + font-weight: normal; +} + .tsd-signature-symbol { color: var(--color-text-aside); font-weight: normal; @@ -985,7 +1116,9 @@ ul.tsd-type-parameter-list h5 { overflow: hidden; opacity: 0.8; height: 40px; - transition: opacity 0.1s, background-color 0.2s; + transition: + opacity 0.1s, + background-color 0.2s; vertical-align: bottom; cursor: pointer; } @@ -1037,7 +1170,7 @@ img { } .deprecated { - text-decoration: line-through; + text-decoration: line-through !important; } .warning { @@ -1046,6 +1179,78 @@ img { background: var(--color-background-warning); } +.tsd-kind-project { + color: var(--color-ts-project); +} +.tsd-kind-module { + color: var(--color-ts-module); +} +.tsd-kind-namespace { + color: var(--color-ts-namespace); +} +.tsd-kind-enum { + color: var(--color-ts-enum); +} +.tsd-kind-enum-member { + color: var(--color-ts-enum-member); +} +.tsd-kind-variable { + color: var(--color-ts-variable); +} +.tsd-kind-function { + color: var(--color-ts-function); +} +.tsd-kind-class { + color: var(--color-ts-class); +} +.tsd-kind-interface { + color: var(--color-ts-interface); +} +.tsd-kind-constructor { + color: var(--color-ts-constructor); +} +.tsd-kind-property { + color: var(--color-ts-property); +} +.tsd-kind-method { + color: var(--color-ts-method); +} +.tsd-kind-call-signature { + color: var(--color-ts-call-signature); +} +.tsd-kind-index-signature { + color: var(--color-ts-index-signature); +} +.tsd-kind-constructor-signature { + color: var(--color-ts-constructor-signature); +} +.tsd-kind-parameter { + color: var(--color-ts-parameter); +} +.tsd-kind-type-literal { + color: var(--color-ts-type-literal); +} +.tsd-kind-type-parameter { + color: var(--color-ts-type-parameter); +} +.tsd-kind-accessor { + color: var(--color-ts-accessor); +} +.tsd-kind-get-signature { + color: var(--color-ts-get-signature); +} +.tsd-kind-set-signature { + color: var(--color-ts-set-signature); +} +.tsd-kind-type-alias { + color: var(--color-ts-type-alias); +} + +/* if we have a kind icon, don't color the text by kind */ +.tsd-kind-icon ~ span { + color: var(--color-text); +} + * { scrollbar-width: thin; scrollbar-color: var(--color-accent) var(--color-icon-background); @@ -1172,6 +1377,9 @@ img { top: 42px; padding-top: 1rem; } + .site-menu { + margin-top: 1rem; + } } /* two sidebars */