@nanoporetech-digital/components 8.0.0 → 8.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/nano-algolia-results.cjs.entry.js +24 -26
- package/dist/cjs/nano-algolia.cjs.entry.js +4 -0
- package/dist/cjs/nano-avatar_5.cjs.entry.js +120 -117
- package/dist/cjs/nano-dropdown_2.cjs.entry.js +10 -6
- package/dist/cjs/nano-icon_3.cjs.entry.js +1 -1
- package/dist/cjs/nano-in-page-nav.cjs.entry.js +1 -1
- package/dist/cjs/nano-tab-group.cjs.entry.js +1 -1
- package/dist/cjs/{popover-D_uJstEp.js → popover-BxNxwqMv.js} +5 -3
- package/dist/collection/components/algolia/algolia-results.js +25 -27
- package/dist/collection/components/algolia/lib/template.js +4 -0
- package/dist/collection/components/breadcrumb/breadcrumb.js +1 -1
- package/dist/collection/components/dropdown/dropdown.js +9 -5
- package/dist/collection/components/global-search-results/global-search-results.css +121 -189
- package/dist/collection/components/global-search-results/global-search-results.js +121 -117
- package/dist/collection/components/in-page-nav/in-page-nav.css +3 -1
- package/dist/collection/components/tabs/tab-group.js +1 -1
- package/dist/collection/utils/popover.js +5 -3
- package/dist/components/algolia.js +4 -0
- package/dist/components/dropdown.js +9 -5
- package/dist/components/global-search-results.js +122 -118
- package/dist/components/nano-algolia-results.js +25 -27
- package/dist/components/nano-in-page-nav.js +1 -1
- package/dist/components/nano-tab-group.js +1 -1
- package/dist/components/popover.js +5 -3
- package/dist/esm/nano-algolia-results.entry.js +25 -27
- package/dist/esm/nano-algolia.entry.js +4 -0
- package/dist/esm/nano-avatar_5.entry.js +120 -117
- package/dist/esm/nano-dropdown_2.entry.js +10 -6
- package/dist/esm/nano-icon_3.entry.js +1 -1
- package/dist/esm/nano-in-page-nav.entry.js +1 -1
- package/dist/esm/nano-tab-group.entry.js +1 -1
- package/dist/esm/{popover-BKomgCqQ.js → popover-CWVbjtKn.js} +5 -3
- package/dist/nano-components/nano-algolia-results.entry.js +1 -1
- package/dist/nano-components/nano-algolia.entry.js +1 -1
- package/dist/nano-components/nano-avatar_5.entry.js +1 -1
- package/dist/nano-components/nano-components.css +8 -6
- package/dist/nano-components/nano-dropdown_2.entry.js +1 -1
- package/dist/nano-components/nano-icon_3.entry.js +1 -1
- package/dist/nano-components/nano-in-page-nav.entry.js +1 -1
- package/dist/nano-components/nano-tab-group.entry.js +1 -1
- package/dist/nano-components/{popover-BKomgCqQ.js → popover-CWVbjtKn.js} +1 -1
- package/dist/style/components.css +1 -1
- package/dist/style/components.css.map +1 -1
- package/dist/style/core.css +1 -1
- package/dist/style/core.css.map +1 -1
- package/dist/style/nano.css +1 -1
- package/dist/style/nano.css.map +1 -1
- package/dist/types/{Users/John.Jenkins/projects → builds/W1hp42tj/0/Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/generate-vue-component.d.ts +1 -1
- package/dist/types/{Users/John.Jenkins/projects → builds/W1hp42tj/0/Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/output-vue.d.ts +1 -1
- package/dist/types/{Users/John.Jenkins/projects → builds/W1hp42tj/0/Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/plugin.d.ts +1 -1
- package/dist/types/builds/W1hp42tj/0/Digital/nano-components/packages/components/.stencil/stencil.config.d.ts +2 -0
- package/dist/types/builds/W1hp42tj/0/Digital/nano-components/packages/components/.stencil/stencil.config.prod.d.ts +2 -0
- package/dist/types/components/global-search-results/global-search-results.d.ts +2 -0
- package/docs-json.json +2 -2
- package/hydrate/index.js +162 -153
- package/hydrate/index.mjs +162 -153
- package/package.json +2 -2
- package/dist/types/Users/John.Jenkins/projects/nano-components/packages/components/.stencil/stencil.config.d.ts +0 -2
- package/dist/types/Users/John.Jenkins/projects/nano-components/packages/components/.stencil/stencil.config.prod.d.ts +0 -2
- /package/dist/types/{Users/John.Jenkins/projects → builds/W1hp42tj/0/Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/index.d.ts +0 -0
- /package/dist/types/{Users/John.Jenkins/projects → builds/W1hp42tj/0/Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/types.d.ts +0 -0
- /package/dist/types/{Users/John.Jenkins/projects → builds/W1hp42tj/0/Digital}/nano-components/packages/components/.stencil/plugins/stencil/vue-output/utils.d.ts +0 -0
- /package/dist/types/{Users/John.Jenkins/projects → builds/W1hp42tj/0/Digital}/nano-components/packages/components/.stencil/testing/mocks/intersection-observer.d.ts +0 -0
- /package/dist/types/{Users/John.Jenkins/projects → builds/W1hp42tj/0/Digital}/nano-components/packages/components/.stencil/wdio.conf.d.ts +0 -0
|
@@ -12,6 +12,7 @@ import { g as getActiveElement } from './active-element-CKJIkX0R.js';
|
|
|
12
12
|
import { d as drag } from './drag-BLOEuv-q.js';
|
|
13
13
|
import { g as getTabbableElements } from './tabbable-DbW4RUw6.js';
|
|
14
14
|
import { s as searchInsight } from './search-insights-8OL2oeQN.js';
|
|
15
|
+
import { a as addGlobalStylesheetToShadow } from './style-Ds52s5za.js';
|
|
15
16
|
import { c as closestElement } from './dom-CrrHp_I_.js';
|
|
16
17
|
import { a as debounceEvent } from './throttle-C93FMm2Z.js';
|
|
17
18
|
import { F as FormControlWrap, a as FormControl } from './form-control-D4EZD4gc.js';
|
|
@@ -368,7 +369,7 @@ const Drawer = class {
|
|
|
368
369
|
};
|
|
369
370
|
Drawer.style = drawerCss;
|
|
370
371
|
|
|
371
|
-
const globalSearchResultsCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:block;flex:1 1 100%}.main-search{display:flex;background:white;font-size:14px;min-block-size:calc(100vh - 63px);justify-content:space-between}.main-search__wrap{display:contents;block-size:100%}.main-search ul{margin:0;padding:0;list-style:none}.main-search li{margin:0;padding:0}.main-search button:not(.result__tags-tag){appearance:none;border:none;background:none;position:relative;inset-block-start:-2px}.main-search .icon-button{color:inherit;align-self:normal;padding:9px 7px;cursor:pointer;display:flex;align-items:center}.main-search__topbar{display:flex;align-items:center;flex-wrap:wrap;margin-block-end:1em}.main-search__topbar::after{content:\"\";inline-size:calc(100% - 30px);inset-inline-start:30px;position:relative;border-block-end:1px solid #e5eef1;padding-block-start:0.9em}.main-search__applied-filters{border:solid 1px #e4e6e8;text-transform:uppercase;border-radius:3px;font-weight:bold;display:flex;align-items:center;line-height:0.9;padding:5px 5px 0;letter-spacing:2px;flex-wrap:wrap;margin-block-end:0.5rem}.main-search__applied-filters span{display:flex;align-items:center}:host(.small) .main-search__applied-filters{display:none}.main-search__applied-nofilter{margin-inline:0 5px;margin-block:0 3px;padding-inline:7px;padding-block:10px;font-size:12px;color:rgba(69, 85, 86, 0.85)}.main-search__applied-filter{padding-inline:8px 2px;padding-block:5px 3px;margin-inline:0 5px;margin-block:0 5px;color:#455556;font-size:11px;border-radius:2px;border:solid 1px rgba(0, 132, 169, 0.5);background-color:rgba(0, 132, 169, 0.2);line-height:1}.main-search__applied-filter .icon-button{padding-inline:10px 4px;padding-block:2px 1px}.main-search__applied-filter .icon-button .nano-icon{pointer-events:none}.main-search .topbar__bkbtn{position:relative;inset-inline-start:-7px}:host(.small) .main-search .topbar__query{display:none}.main-search .topbar__filtering{display:flex;align-items:center;margin-block:0;margin-inline:1em 0;flex:1}.main-search .topbar__order{min-inline-size:175px;max-inline-size:200px;margin-inline-start:auto}:host(.small) .main-search .topbar__order{max-inline-size:300px}.main-search .topbar .nano-select{opacity:1;transition:0.1s ease opacity}.main-search .topbar .nano-select:not(.hydrated){opacity:0}.main-search .topbar__show-filters{margin-inline-start:0.5em;text-transform:uppercase;display:none;flex-direction:column;align-items:center}.main-search .topbar__show-filters .nano-icon{font-size:20px}:host(.small) .main-search .topbar__show-filters{display:flex}.main-search .topbar__filter-count{inline-size:12px;block-size:12px;box-shadow:inset 0 3px 4px 0 rgba(0, 0, 0, 0.2);border:solid 1px #005c76;background-color:#005c76;color:white;font-size:7px;border-radius:50%;display:flex;align-items:center;justify-content:center;line-height:1;margin-block-end:3px}.main-search__results{font-size:14px;padding:1em 40px;color:rgba(69, 85, 86, 0.85);inline-size:70%;block-size:100%}@media (max-width: 576px){.main-search__results{padding:1em 20px}}:host(.small) .main-search__results{inline-size:100%}.main-search__filters{outline:none;padding-inline:0 40px;padding-block:1.8em 1em;flex:1 1 30%;box-sizing:border-box}@media (max-width: 576px){.main-search__filters{padding-inline-end:20px}}:host(:not(.small)) .main-search__filters{max-inline-size:350px;min-inline-size:220px}.filters{color:#455556;background:white;font-size:14px}:host(.small) .filters{position:fixed;inline-size:0;block-size:0;z-index:10;inset-block-start:0;inset-inline-end:0;transition:all 0s ease 0.5s;background:none}:host(.small) .filters.show{block-size:100vh;inline-size:100vw;transition:all 0s ease 0s}:host(.small) .filters.show::after{opacity:1}:host(.small) .filters::after{content:\"\";background:rgba(0, 0, 0, 0.5);position:absolute;inset:0;z-index:-1;opacity:0;transition:0.1s ease opacity}.filters__close-filters{display:none !important;font-size:1.4em}:host(.small) .filters__close-filters{display:inline-block !important;margin-inline:auto 0;margin-block:0}.filters__old-posts{margin-inline-start:1rem}:host(.small) .filters-wrap{position:absolute;inset-block-start:0;inset-inline-end:0;background:rgb(247, 246, 246);transform:translateX(100%);inline-size:300px;min-inline-size:200px;max-inline-size:80vw;transition:transform 0.3s ease;padding:1em;color:black;overflow:auto;block-size:100vh}:host(.small) .filters.show .filters-wrap{transform:translateX(0%);box-shadow:-3px -3px 7px rgba(0, 0, 0, 0.1)}.filters ul{margin:0;padding:0;list-style:none}.filters li{margin:0;padding:0}.filters .nano-details{--padding:0.8em;margin:0.8em 0}.filters .nano-details strong[slot]{display:block;padding-inline-start:calc(20px - 0.8em)}.filters .nano-details .nano-icon[slot=icon-end]{padding-inline:calc(20px - 0.8em)}.filters li:last-child .filter-label{margin-block-end:0}.filters .filter-label{display:flex;align-items:center;position:relative;margin:0.5em 0;line-height:1.4;z-index:0}.filters .filter-label::before{margin-inline:0 1em;margin-block:0;content:\"\";border:1px solid #007495;background:#fff;border-radius:3px;block-size:1em;inline-size:1em;min-inline-size:1em;min-block-size:1em;display:inline-block}.filters .filter-label::after{background-image:url(\"data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='%23ffffff'%20d='M173.898%20439.404l-166.4-166.4c-9.997-9.997-9.997-26.206%200-36.204l36.203-36.204c9.997-9.998%2026.207-9.998%2036.204%200L192%20312.69%20432.095%2072.596c9.997-9.997%2026.207-9.997%2036.204%200l36.203%2036.204c9.997%209.997%209.997%2026.206%200%2036.204l-294.4%20294.401c-9.998%209.997-26.207%209.997-36.204-.001z'/></svg>\");content:\"\";block-size:0.7em;inline-size:0.7em;position:absolute;inset-inline-start:2px;inset-block-start:50%;transform:translateY(-50%);z-index:1;display:block;background-size:100%;background-position:center center;background-repeat:no-repeat}.filters .filter-cb{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.filters .filter-cb:checked+.filter-label::before{background:#245a6f}.filters .filter-cb:focus+.filter-label::before{box-shadow:0 0 0 1px rgba(0, 0, 0, 0.7)}.filters-header{display:flex;align-items:center;border-block-end:1px solid #90c6e7;padding-block-end:0.5rem;margin-block-end:0.5rem}.filters-reset{color:#007495;font-size:12px;text-decoration:underline;margin-inline:auto 0;margin-block:0}:host(.small) .filters-reset{margin:0}.filters-title{margin:0;text-transform:uppercase;color:rgba(69, 85, 86, 0.85);font-weight:bold;font-size:14px}:host(.small) .filters-title{display:none}.result{text-decoration:none;display:flex;flex-flow:row wrap;padding-block-end:14px;border-block-end:1px solid #90c6e7}.result *{word-wrap:break-word;overflow-wrap:break-word}.result__title{margin:1em 0 0.5em;inline-size:70%;display:flex}.result__title a{color:#0084a9;font-size:14px;line-height:1.43;text-decoration:none;font-weight:600}.result__title .nano-icon{margin-inline:0 0.5em;margin-block:0;min-inline-size:20px;min-block-size:20px;opacity:0.8}@media (max-width: 992px){.result__title{inline-size:100%}}.result__body{color:#455556;font-size:13px;inline-size:70%;text-decoration:none}@media (max-width: 992px){.result__body{inline-size:100%}}.result__pdf{display:inline-block;margin-inline-start:0.5rem;color:#b5aea7}.result__meta{display:flex;flex-flow:row wrap;color:#455556;font-size:11px;line-height:13px;inline-size:100%;align-items:center}.result__meta>*{margin-block-start:0.5rem}.result__meta>*:not(:last-child){padding-inline-end:0}.result__meta>*:not(:last-child)::after{content:\"\";block-size:1rem;inline-size:1px;background:#90c6e7;display:inline-block;margin-inline:0.7rem}@media (max-width: 576px){.result__meta>*:not(:last-child)::after{display:none}}@media (max-width: 576px){.result__meta{flex-flow:column;align-items:flex-start}}.result__tags{display:flex;flex-flow:row wrap}@media (max-width: 576px){.result__tags{padding-inline-start:0}}.result__tags-tag{color:#455556;display:inline-block;font-size:0.4375rem;letter-spacing:1.4px;background:#fff;border-radius:2px;text-transform:uppercase;padding:0 4px 1px 5px;font-weight:600;margin:3px 0.25rem 0.25rem 0;border:1px solid #b5aea7;white-space:nowrap;line-height:13px}.result__type{font-weight:600;text-transform:capitalize;white-space:nowrap;display:flex;align-items:center}.result__date{display:flex;align-items:center;color:#455556}.result__source{color:#455556;padding-inline-end:0.75rem}.result__authors{font-size:12px;color:#455556;margin-block-end:0.25rem;text-decoration:none;inline-size:70%}.result__buttons{inline-size:70%;margin-block-end:0.5rem}.result__buttons-button{background-color:#007495;color:#fff;padding:5px 8px 1px;border-radius:4px;display:inline-block;font-size:11px;text-decoration:none;border:none}.result__promo{inline-size:70%;margin-block-end:0.5rem;text-decoration:none;color:#455556}.result__promo-box{inline-size:300px;background-color:#e3eef1;padding:12px 12px 8px 4px;display:flex;flex-flow:row nowrap;margin-block-start:1rem}.result__promo-bigdate{flex:0 1 60px;text-align:center;font-weight:600;color:#007495;text-transform:uppercase;line-height:1;letter-spacing:1.5px}@media (max-width: 992px){.result__promo-bigdate{inline-size:100%}}.result__promo-bigdate span{color:#455556;display:block}.result__promo-bigdate~div{padding-inline-start:1rem;border-inline-start:1px solid #c5dbe1}.result__promo-date{font-size:12px}.result__promo-venue{font-size:12px}.result__promo .nano-icon{color:#007495;position:relative;inset-block-start:1px;padding-inline-end:2px}.result__image{display:block;background-size:cover;background-repeat:no-repeat;background-position:center;border-radius:4px;position:relative;inline-size:100%;block-size:150px;margin-block-end:0.5rem}@media (min-width: 576px){.result__image{inline-size:142px;block-size:80px}}.result__image .nano-icon{position:absolute;inset-block-start:calc(50% - 0.75rem);inset-inline-start:calc(50% - 0.75rem);font-size:1.5rem;color:#0084a9;--primary-color:#fff;--secondary-color:#0084a9;--primary-opacity:1}@media (max-width: 576px){.result__image .nano-icon{font-size:3rem;inset-block-start:calc(50% - 1.5rem);inset-inline-start:calc(50% - 1.5rem)}}.result__video-body{inline-size:70%;text-decoration:none;display:flex;flex-flow:row wrap}@media (max-width: 992px){.result__video-body{inline-size:100%}}@media (max-width: 576px){.result__video-body{flex-flow:column}}.result__video-body .result__body{padding-inline-start:1rem;display:flex;flex-direction:column;margin-block-end:0;flex:1}@media (max-width: 576px){.result__video-body .result__body{padding-inline-start:0}}.result__video-body .result__body p{display:inline;margin:0}.result__video-body .result__body u,.result__video-body .result__body li,.result__video-body .result__body a{text-decoration:none}.result__video-body .result__body .result__meta{margin-block-start:0.5rem}.result__video-body .result__body .result__description{flex:1 0 auto}.search-empty{padding:3rem 0;text-align:center;border-block-start:1px solid #e5eef1}.search-empty h2{color:#455556;font-size:1.125rem;margin-block-end:0.5rem}.search-empty-icon{font-size:7rem;--icon-color:#e4e6e8;margin-block-end:2rem}.search__highlight{background:#fbffbf;font-style:normal}";
|
|
372
|
+
const globalSearchResultsCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:block;flex:1 1 100%}.main-search{display:flex;background:white;font-size:14px;min-block-size:calc(100vh - 63px);justify-content:space-between;max-inline-size:1266px;margin:auto}.main-search__wrap{display:contents;block-size:100%}.main-search ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--nano-spacing-xl)}.main-search li{margin:0;padding:0}.main-search button:not(.result__tags-tag){appearance:none;border:none;background:none;position:relative;cursor:pointer}.main-search button:not(.result__tags-tag):focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.main-search a:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.main-search .icon-button{color:inherit;align-self:normal;padding:9px 7px;cursor:pointer;display:flex;align-items:center}.main-search div[slot=start-output]{border-block-end:1px solid var(--nano-color-neutral-300);margin-block-end:var(--nano-spacing-md)}.main-search__topbar{display:flex;align-items:center;flex-wrap:wrap;margin-block-end:1em}.main-search__applied-filters{display:flex;flex-wrap:wrap;gap:var(--nano-spacing-sm);margin-block-end:var(--nano-spacing-md)}.main-search .topbar__bkbtn{position:relative;inset-inline-start:-7px}:host(.small) .main-search .topbar__query{display:none}.main-search .topbar__filtering{display:flex;align-items:center;margin-block:0;margin-inline:1em 0;flex:1}.main-search .topbar__order{min-inline-size:175px;max-inline-size:200px;margin-inline-start:auto}:host(.small) .main-search .topbar__order{max-inline-size:300px}.main-search .topbar .nano-select{opacity:1;transition:0.1s ease opacity}.main-search .topbar .nano-select:not(.hydrated){opacity:0}.main-search .topbar__show-filters{margin-inline-start:0.5em;text-transform:uppercase;display:none;flex-direction:column;align-items:center}.main-search .topbar__show-filters .nano-icon{font-size:20px}:host(.small) .main-search .topbar__show-filters{display:flex}.main-search .topbar__filter-count{inline-size:12px;block-size:12px;box-shadow:inset 0 3px 4px 0 rgba(0, 0, 0, 0.2);border:solid 1px #005c76;background-color:#005c76;color:white;font-size:7px;border-radius:50%;display:flex;align-items:center;justify-content:center;line-height:1;margin-block-end:3px}.main-search__results{font-size:14px;padding:var(--nano-spacing-md) var(--nano-spacing-l1-default);color:var(--nano-color-neutral-1400);inline-size:70%;block-size:100%}:host(.small) .main-search__results{inline-size:100%}.main-search__filters{outline:none;padding-inline:0 var(--nano-spacing-l1-default);padding-block:var(--nano-spacing-l) var(--nano-spacing-md);flex:1 1 30%;box-sizing:border-box}:host(:not(.small)) .main-search__filters{max-inline-size:350px;min-inline-size:220px}.filters{color:var(--nano-color-neutral-1400);font-size:var(--nano-font-size-xs)}:host(.small) .filters{position:fixed;inline-size:0;block-size:0;z-index:10;inset-block-start:0;inset-inline-end:0;transition:all 0s ease 0.5s;background:none}:host(.small) .filters.show{block-size:100vh;inline-size:100vw;transition:all 0s ease 0s}:host(.small) .filters.show::after{opacity:1}:host(.small) .filters::after{content:\"\";background:rgba(0, 0, 0, 0.5);position:absolute;inset:0;z-index:-1;opacity:0;transition:0.1s ease opacity}.filters__close-filters{display:none !important;font-size:1.4em}:host(.small) .filters__close-filters{display:inline-block !important;margin-inline:auto 0;margin-block:0}.filters__old-posts{margin-inline-start:1rem}:host(.small) .filters-wrap{position:absolute;inset-block-start:0;inset-inline-end:0;transform:translateX(120%);inline-size:300px;min-inline-size:200px;max-inline-size:80vw;transition:transform 0.3s ease;padding:var(--nano-spacing-md);overflow:auto;block-size:100vh;background-color:var(--nano-color-surface-200);box-shadow:var(--nano-shadow-l2)}:host(.small) .filters.show .filters-wrap{transform:translateX(0%);box-shadow:-3px -3px 7px rgba(0, 0, 0, 0.1)}.filters ul{margin:0;padding:0;list-style:none;gap:var(--nano-spacing-sm);display:flex;flex-direction:column}.filters li{margin:0;padding:0}.filters li:last-child .filter-label{margin-block-end:0}.filters .filter-label{display:grid;place-items:center center;grid-template-columns:1.125em 1fr;gap:var(--nano-spacing-sm);cursor:pointer}.filters .filter-label>*{justify-self:start;font-size:var(--nano-font-size-2xs)}.filters .filter-label::before{content:\"\";grid-column:1;grid-row:1;border-radius:1px;block-size:1.125em;inline-size:1.125em;border:1px solid var(--nano-color-primary-1000);font-size:1rem}.filters .filter-label::after{content:\"\";grid-column:1;grid-row:1;border:solid var(--nano-color-basic-white);border-width:0 0.125em 0.125em 0;opacity:1;transition:scale var(--nano-transition-x-fast) ease-out;transform-origin:center;rotate:45deg;scale:0;inline-size:0.325em;block-size:0.5625em;margin-block-start:-0.1875em;font-size:1rem}.filters .filter-cb{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.filters .filter-cb:checked~.filter-label::before{background-color:var(--nano-color-primary-1000)}.filters .filter-cb:checked~.filter-label::after{scale:1}.filters .filter-cb:focus-visible:focus~.filter-label::before{outline:var(--nano-focus-ring);outline-offset:1px}.filters-header{display:flex;align-items:center;border-block-end:1px solid var(--nano-color-neutral-300);padding-block-end:var(--nano-spacing-md);margin-block-end:var(--nano-spacing-md)}.filters-reset{color:var(--nano-color-primary-1000);font-size:var(--nano-font-size-xs);text-decoration:underline;margin-inline:auto 0;margin-block:0;appearance:none;background:none;border:none}:host(.small) .filters-reset{margin:0}.filters-title{margin:0;text-transform:uppercase;color:rgba(69, 85, 86, 0.85);font-weight:bold;font-size:var(--nano-font-size-xs)}:host(.small) .filters-title{display:none}.filters-list{display:flex;flex-direction:column;gap:var(--nano-spacing-md)}.result{text-decoration:none;display:flex;flex-flow:row wrap;gap:var(--nano-spacing-sm);color:var(--nano-color-neutral-1400)}.result *{word-wrap:break-word;overflow-wrap:break-word}.result__title{inline-size:70%;display:flex}.result__title a{font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);font-weight:var(--nano-font-weight-bold);text-decoration:none;color:var(--nano-color-neutral-1400)}.result__title .nano-icon{margin-inline:0 0.5em;margin-block:0;min-inline-size:20px;min-block-size:20px;opacity:0.8}@media (max-width: 992px){.result__title{inline-size:100%}}.result__body{font-size:var(--nano-font-size-xs);inline-size:70%;text-decoration:none;color:var(--nano-color-neutral-1400)}@media (max-width: 992px){.result__body{inline-size:100%}}.result__pdf{display:inline-block;margin-inline-start:0.5rem;color:var(--nano-color-neutral-300)}.result__meta{display:flex;flex-flow:row wrap;font-size:var(--nano-font-size-2xs);line-height:13px;inline-size:100%;align-items:center}.result__meta>*:not(:last-child){padding-inline-end:0}.result__meta>*:not(:last-child)::after{content:\"\";block-size:1rem;inline-size:1px;background:var(--nano-color-neutral-300);display:inline-block;margin-inline:0.7rem}@media (max-width: 576px){.result__meta>*:not(:last-child)::after{display:none}}@media (max-width: 576px){.result__meta{flex-flow:column;align-items:flex-start}}.result__tags{display:flex;flex-flow:row wrap;gap:var(--nano-spacing-sm)}@media (max-width: 576px){.result__tags{padding-inline-start:0}}.result__type{text-transform:capitalize;white-space:nowrap;display:flex;align-items:center}.result__date{display:flex;align-items:center}.result__source{padding-inline-end:0.75rem}.result__authors{font-size:var(--nano-font-size-2xs);margin-block-end:var(--nano-spacing-xs);text-decoration:none;inline-size:70%;color:var(--nano-color-neutral-1400)}.result__buttons{inline-size:70%;margin-block-end:0.5rem}.result__promo{inline-size:70%;margin-block-end:0.5rem;text-decoration:none;color:var(--nano-color-neutral-1400)}.result__promo-box{inline-size:300px;background-color:#e3eef1;padding:12px 12px 8px 4px;display:flex;flex-flow:row nowrap;margin-block-start:1rem}.result__promo-bigdate{flex:0 1 60px;text-align:center;font-weight:600;color:var(--nano-color-primary-1000);text-transform:uppercase;line-height:1;letter-spacing:1.5px}@media (max-width: 992px){.result__promo-bigdate{inline-size:100%}}.result__promo-bigdate span{color:var(--nano-color-neutral-1400);display:block}.result__promo-bigdate~div{padding-inline-start:1rem;border-inline-start:1px solid var(--nano-color-neutral-300)}.result__promo-date{font-size:var(--nano-font-size-2xs)}.result__promo-venue{font-size:var(--nano-font-size-2xs)}.result__promo .nano-icon{color:var(--nano-color-primary-1000);position:relative;inset-block-start:1px;padding-inline-end:2px}.result__image{display:block;background-size:cover;background-repeat:no-repeat;background-position:center;border-radius:4px;position:relative;inline-size:100%;block-size:150px;margin-block-end:var(--nano-spacing-xs)}@media (min-width: 576px){.result__image{inline-size:142px;block-size:80px}}.result__image .nano-icon{position:absolute;inset-block-start:calc(50% - 0.75rem);inset-inline-start:calc(50% - 0.75rem);font-size:var(--nano-pictogram-size-small);color:var(--nano-color-primary-1000);--primary-color:var(--nano-color-base-0);--secondary-color:var(--nano-color-primary-1000);--primary-opacity:1}@media (max-width: 576px){.result__image .nano-icon{font-size:3rem;inset-block-start:calc(50% - 1.5rem);inset-inline-start:calc(50% - 1.5rem)}}.result__video-body{inline-size:70%;text-decoration:none;display:flex;flex-flow:row wrap}@media (max-width: 992px){.result__video-body{inline-size:100%}}@media (max-width: 576px){.result__video-body{flex-flow:column}}.result__video-body .result__body{padding-inline-start:var(--nano-spacing-md);display:flex;flex-direction:column;margin-block-end:0;flex:1}@media (max-width: 576px){.result__video-body .result__body{padding-inline-start:0}}.result__video-body .result__body p{display:inline;margin:0}.result__video-body .result__body u,.result__video-body .result__body li,.result__video-body .result__body a{text-decoration:none}.result__video-body .result__body .result__meta{margin-block-start:0.5rem}.result__video-body .result__body .result__description{flex:1 0 auto}.search-empty{padding:var(--nano-spacing-xl) 0;text-align:center;border-block-start:1px solid var(--nano-color-neutral-300)}.search-empty h2{font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-xl);line-height:var(--nano-line-height-denser);text-wrap:balance}.search-empty-icon{font-size:7rem;--icon-color:#e4e6e8;margin-block-end:2rem}.search__highlight{background:var(--nano-color-highlight);font-style:normal}";
|
|
372
373
|
|
|
373
374
|
const filterOldPosts = 'created > ' + Math.floor((Date.now() - 63115200000) / 1000);
|
|
374
375
|
let searchResultIds = 0;
|
|
@@ -431,6 +432,9 @@ const GlobalSearchResults = class {
|
|
|
431
432
|
};
|
|
432
433
|
this.algoliaEle.query = meta.query;
|
|
433
434
|
};
|
|
435
|
+
handleNanoFilterChanged() {
|
|
436
|
+
this.el.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
|
437
|
+
}
|
|
434
438
|
handleReorder(e) {
|
|
435
439
|
if (e
|
|
436
440
|
.composedPath()
|
|
@@ -468,7 +472,7 @@ const GlobalSearchResults = class {
|
|
|
468
472
|
this.filtersDiv = this.algoliaEle.querySelector('#main-search-filters');
|
|
469
473
|
const oldResults = this.algoliaEle.querySelector('.old-posts');
|
|
470
474
|
if (oldResults) {
|
|
471
|
-
oldResults.addEventListener('
|
|
475
|
+
oldResults.addEventListener('nanoChange', (e) => {
|
|
472
476
|
this.toggleOldResults(e.target.checked);
|
|
473
477
|
});
|
|
474
478
|
}
|
|
@@ -485,8 +489,8 @@ const GlobalSearchResults = class {
|
|
|
485
489
|
this.algoliaResultsEle.addEventListener('click', this.resultClick);
|
|
486
490
|
// wire up remove filter event listener
|
|
487
491
|
resultEle.querySelectorAll('.remove-filter').forEach((item) => {
|
|
488
|
-
item.removeEventListener('
|
|
489
|
-
item.addEventListener('
|
|
492
|
+
item.removeEventListener('nanoClose', this.removeFilterClick);
|
|
493
|
+
item.addEventListener('nanoClose', this.removeFilterClick);
|
|
490
494
|
});
|
|
491
495
|
// wire up the back button event listener
|
|
492
496
|
resultEle.querySelectorAll('.back-btn').forEach((item) => {
|
|
@@ -530,7 +534,8 @@ const GlobalSearchResults = class {
|
|
|
530
534
|
setTimeout(() => this.filtersDiv.focus(), 20);
|
|
531
535
|
};
|
|
532
536
|
removeFilterClick = (e) => {
|
|
533
|
-
|
|
537
|
+
const target = e.target.closest('[data-filter-val]');
|
|
538
|
+
this.removeFilter(target?.dataset.filter, target?.dataset.filterVal);
|
|
534
539
|
};
|
|
535
540
|
tagClick = (e) => {
|
|
536
541
|
e.preventDefault();
|
|
@@ -566,7 +571,7 @@ const GlobalSearchResults = class {
|
|
|
566
571
|
this.filtersDiv.classList.remove('show');
|
|
567
572
|
this.filtersDiv.setAttribute('aria-expanded', 'false');
|
|
568
573
|
document.body.style.overflow = '';
|
|
569
|
-
setTimeout(() => this.openFilterBtn
|
|
574
|
+
setTimeout(() => this.openFilterBtn?.focus(), 20);
|
|
570
575
|
}
|
|
571
576
|
toggleOldResults(show) {
|
|
572
577
|
if (show)
|
|
@@ -574,6 +579,9 @@ const GlobalSearchResults = class {
|
|
|
574
579
|
else
|
|
575
580
|
this.algoliaEle.filters = [...this.algoliaEle.filters, filterOldPosts];
|
|
576
581
|
}
|
|
582
|
+
componentWillLoad() {
|
|
583
|
+
addGlobalStylesheetToShadow(this.el.shadowRoot);
|
|
584
|
+
}
|
|
577
585
|
connectedCallback() {
|
|
578
586
|
const globalNavTag = transformTag('nano-global-nav');
|
|
579
587
|
this.globalNav = this.el.closest(globalNavTag);
|
|
@@ -611,17 +619,17 @@ const GlobalSearchResults = class {
|
|
|
611
619
|
this.ro.observe(this.el);
|
|
612
620
|
}
|
|
613
621
|
render() {
|
|
614
|
-
return (h(Host, { key: '
|
|
615
|
-
small: this.currentWidth <
|
|
622
|
+
return (h(Host, { key: '6f4387b28776c047e2bea038b7de5ebc43c16a49', class: {
|
|
623
|
+
small: this.currentWidth < 780,
|
|
616
624
|
'nano-global-search-results': true,
|
|
617
|
-
}, dir: this.el.ownerDocument.dir === 'rtl' ? 'rtl' : undefined }, h("nano-algolia", { key: '
|
|
625
|
+
}, dir: this.el.ownerDocument.dir === 'rtl' ? 'rtl' : undefined }, h("nano-algolia", { key: 'cf5fdf51f46cedf20c3242ddfd873903168bb04d', storeId: this.queryId, storeMethod: "url-hash-push", class: "main-search__wrap sc-nano-global-search-results", ref: (ele) => requestAnimationFrame(() => (this.algoliaEle = ele)), id: "main-search",
|
|
626
|
+
// @ts-expect-error this bubbles from nano-algolia-filter
|
|
627
|
+
onNanoFilterChanged: () => this.handleNanoFilterChanged() }, h("template", { key: '8abd5c449cb8f570ca9b3a8cdd9247e26dd4a116', slot: "template" },
|
|
618
628
|
/* html */ `<div class="main-search sc-nano-global-search-results">
|
|
619
629
|
<nano-algolia-results id="main-search-results" class="main-search__results sc-nano-global-search-results" infinite-scroll>
|
|
620
630
|
<script type="text/template" slot="start-template">
|
|
621
631
|
<div class="sc-nano-global-search-results main-search__topbar topbar">
|
|
622
|
-
<button class="sc-nano-global-search-results topbar__bkbtn back-btn icon-button">
|
|
623
|
-
<nano-icon class="sc-nano-global-search-results" name="light/chevron-left" size="small"></nano-icon>
|
|
624
|
-
</button>
|
|
632
|
+
<nano-icon-button icon-name="light/chevron-left" class="sc-nano-global-search-results topbar__bkbtn back-btn icon-button"></nano-icon-button>
|
|
625
633
|
<div>
|
|
626
634
|
<em class="sc-nano-global-search-results topbar__query">'{{ it.query }}' - </em> <strong>{{ it.totalHitsWithFilters }}</strong> Results
|
|
627
635
|
</div>
|
|
@@ -653,16 +661,15 @@ const GlobalSearchResults = class {
|
|
|
653
661
|
{{ @if (it.appliedFilters) }}
|
|
654
662
|
{{ @each(it.appliedFilters) => filterObj }}
|
|
655
663
|
{{ @each(filterObj.values) => filterVal }}
|
|
656
|
-
<
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
664
|
+
<nano-tag
|
|
665
|
+
closable
|
|
666
|
+
size="large"
|
|
667
|
+
data-filter-val="{{ filterVal }}"
|
|
668
|
+
data-filter="{{ filterObj.name }}"
|
|
669
|
+
class="remove-filter"
|
|
670
|
+
>{{ filterVal | tag_tidy | public_name }}</nano-tag>
|
|
662
671
|
{{ /each }}
|
|
663
672
|
{{ /each }}
|
|
664
|
-
{{ #else }}
|
|
665
|
-
<span class="sc-nano-global-search-results main-search__applied-nofilter"> </span>
|
|
666
673
|
{{ /if }}
|
|
667
674
|
</div>
|
|
668
675
|
{{ /if }}
|
|
@@ -684,7 +691,7 @@ const GlobalSearchResults = class {
|
|
|
684
691
|
{{ contentType = result.content_type ? result.content_type : result.type }}
|
|
685
692
|
<li class="sc-nano-global-search-results">
|
|
686
693
|
<div class="sc-nano-global-search-results result" data-hit-id="{{ result.objectID }}" data-hit-count="{{ resultIndex }}">
|
|
687
|
-
<
|
|
694
|
+
<strong class="sc-nano-global-search-results result__title" data-icon-set="{{(iconSet = false)}}">
|
|
688
695
|
<a href="{{ result.url | abs_url(it, result) }}">
|
|
689
696
|
{{ @if (result._snippetResult) }}
|
|
690
697
|
{{ result._snippetResult.title.value | safe }}
|
|
@@ -695,7 +702,7 @@ const GlobalSearchResults = class {
|
|
|
695
702
|
<span class="sc-nano-global-search-results result__pdf">PDF</span>
|
|
696
703
|
{{ /if }}
|
|
697
704
|
</a>
|
|
698
|
-
</
|
|
705
|
+
</strong>
|
|
699
706
|
{{ @if (result.authors) }}
|
|
700
707
|
{{ @if (typeof result.authors === 'string') }}
|
|
701
708
|
<a class="sc-nano-global-search-results result__authors" href="{{ result.url | abs_url(it, result) }}">Authors: {{ result.authors | trim_to(50) }}</a>
|
|
@@ -713,12 +720,13 @@ const GlobalSearchResults = class {
|
|
|
713
720
|
{{ @if (result.name) }}
|
|
714
721
|
<a class="sc-nano-global-search-results result__authors" href="{{ result.url | abs_url(it, result) }}">Speaker: {{ result.name | trim_to(50) }}</a>
|
|
715
722
|
{{ /if }}
|
|
723
|
+
|
|
724
|
+
{{ @if (result.image) }}
|
|
725
|
+
<div class="sc-nano-global-search-results result__image" style="background-image: url('{{ result.image | abs_url(it, result) }}')">
|
|
726
|
+
<nano-icon class="sc-nano-global-search-results" name="duotone/play-circle"></nano-icon>
|
|
727
|
+
</div>
|
|
728
|
+
{{ /if }}
|
|
716
729
|
<a class="sc-nano-global-search-results result__video-body" href="{{ result.url | abs_url(it, result) }}">
|
|
717
|
-
{{ @if (result.image) }}
|
|
718
|
-
<div class="sc-nano-global-search-results result__image" style="background-image: url('{{ result.image | abs_url(it, result) }}')">
|
|
719
|
-
<nano-icon class="sc-nano-global-search-results" name="duotone/play-circle"></nano-icon>
|
|
720
|
-
</div>
|
|
721
|
-
{{ /if }}
|
|
722
730
|
<div class="sc-nano-global-search-results result__body">
|
|
723
731
|
<div class="sc-nano-global-search-results result__description">
|
|
724
732
|
{{ @if (result.description) }}
|
|
@@ -726,36 +734,37 @@ const GlobalSearchResults = class {
|
|
|
726
734
|
{{ /if }}
|
|
727
735
|
</div>
|
|
728
736
|
</div>
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
|
|
736
|
-
{{
|
|
737
|
-
</div>
|
|
737
|
+
</a>
|
|
738
|
+
<div class="sc-nano-global-search-results result__meta">
|
|
739
|
+
{{ @if (result.type || result.content_type) }}
|
|
740
|
+
<div class="sc-nano-global-search-results result__type">
|
|
741
|
+
{{ @if (contentType === 'lc_lightning_talk') }}
|
|
742
|
+
Presentation
|
|
743
|
+
{{ #else }}
|
|
744
|
+
{{ contentType }}
|
|
738
745
|
{{ /if }}
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
746
|
+
</div>
|
|
747
|
+
{{ /if }}
|
|
748
|
+
|
|
749
|
+
{{ @if (result.source) }}
|
|
750
|
+
<div class="sc-nano-global-search-results result__source">Source: {{ result.source }}</div>
|
|
751
|
+
{{ /if }}
|
|
752
|
+
</div>
|
|
753
|
+
{{ @if (result.tags) }}
|
|
754
|
+
<div class="sc-nano-global-search-results result__tags">
|
|
755
|
+
{{ @if (typeof result.tags === 'string') }}
|
|
756
|
+
<nano-tag><button data-value="{{ result.tags | lowercase }}" class="sc-nano-global-search-results result__tags-tag">{{ result.tags }}</button></nano-tag>
|
|
757
|
+
{{ #else }}
|
|
758
|
+
{{ @each(result.tags) => tag, index }}
|
|
759
|
+
{{ @if(index < 5)}}
|
|
760
|
+
{{ @if (tag !== "No video" && tag !== "Resources" && tag !== "Video") }}
|
|
761
|
+
<nano-tag><button data-value="{{ tag | lowercase }}" class="sc-nano-global-search-results result__tags-tag">{{ tag | tag_tidy }}</button></nano-tag>
|
|
762
|
+
{{ /if }}
|
|
751
763
|
{{ /if }}
|
|
752
|
-
|
|
753
|
-
{{ /if }}
|
|
754
|
-
{{ @if (result.source) }}
|
|
755
|
-
<div class="sc-nano-global-search-results result__source">Source: {{ result.source }}</div>
|
|
764
|
+
{{ /each }}
|
|
756
765
|
{{ /if }}
|
|
757
766
|
</div>
|
|
758
|
-
|
|
767
|
+
{{ /if }}
|
|
759
768
|
{{ /if }}
|
|
760
769
|
{{ @if (result.body) }}
|
|
761
770
|
<a class="sc-nano-global-search-results result__body" href="{{ result.url | abs_url(it, result) }}">
|
|
@@ -765,8 +774,8 @@ const GlobalSearchResults = class {
|
|
|
765
774
|
</a>
|
|
766
775
|
{{ /if }}
|
|
767
776
|
{{ @if (contentType === 'product' }}
|
|
768
|
-
<
|
|
769
|
-
<a
|
|
777
|
+
<nano-cta size="small">
|
|
778
|
+
<a href="{{ result.url | abs_url(it, result) }}">View product</a>
|
|
770
779
|
</div>
|
|
771
780
|
{{ /if }}
|
|
772
781
|
{{ @if (contentType === 'event') }}
|
|
@@ -839,27 +848,27 @@ const GlobalSearchResults = class {
|
|
|
839
848
|
{{ /if }}
|
|
840
849
|
{{ /if }}
|
|
841
850
|
{{ /if }}
|
|
842
|
-
{{ @if (result.tags) }}
|
|
843
|
-
<div class="sc-nano-global-search-results result__tags">
|
|
844
|
-
{{ @if (typeof result.tags === 'string') }}
|
|
845
|
-
{{ @if (result.tags !== "Resources" && result.tags !== "Tools" && result.tags !== "Publications" && result.tags !== "Case studies") }}
|
|
846
|
-
<button data-value="{{ result.tags | lowercase }}" class="sc-nano-global-search-results result__tags-tag">{{ result.tags }}</button>
|
|
847
|
-
{{ /if }}
|
|
848
|
-
{{ #else }}
|
|
849
|
-
{{ @each(result.tags) => tag, index }}
|
|
850
|
-
{{ @if(index < 5)}}
|
|
851
|
-
{{ @if (tag !== "Resources" && tag !== "Tools" && tag !== "Publications" && tag !== "Case studies") }}
|
|
852
|
-
<button data-value="{{ tag | lowercase }}" class="sc-nano-global-search-results result__tags-tag">{{ tag }}</button>
|
|
853
|
-
{{ /if }}
|
|
854
|
-
{{ /if }}
|
|
855
|
-
{{ /each }}
|
|
856
|
-
{{ /if }}
|
|
857
|
-
</div>
|
|
858
|
-
{{ /if }}
|
|
859
851
|
{{ @if (result.source) }}
|
|
860
852
|
<div class="sc-nano-global-search-results result__source">Source: {{ result.source }}</div>
|
|
861
853
|
{{ /if }}
|
|
862
854
|
</div>
|
|
855
|
+
{{ @if (result.tags) }}
|
|
856
|
+
<div class="sc-nano-global-search-results result__tags">
|
|
857
|
+
{{ @if (typeof result.tags === 'string') }}
|
|
858
|
+
{{ @if (result.tags !== "Resources" && result.tags !== "Tools" && result.tags !== "Publications" && result.tags !== "Case studies") }}
|
|
859
|
+
<nano-tag><button data-value="{{ result.tags | lowercase }}" class="result__tags-tag">{{ result.tags }}</button></nano-tag>
|
|
860
|
+
{{ /if }}
|
|
861
|
+
{{ #else }}
|
|
862
|
+
{{ @each(result.tags) => tag, index }}
|
|
863
|
+
{{ @if(index < 5)}}
|
|
864
|
+
{{ @if (tag !== "Resources" && tag !== "Tools" && tag !== "Publications" && tag !== "Case studies") }}
|
|
865
|
+
<nano-tag><button data-value="{{ tag | lowercase }}" class="result__tags-tag">{{ tag | tag_tidy }}</button></nano-tag>
|
|
866
|
+
{{ /if }}
|
|
867
|
+
{{ /if }}
|
|
868
|
+
{{ /each }}
|
|
869
|
+
{{ /if }}
|
|
870
|
+
</div>
|
|
871
|
+
{{ /if }}
|
|
863
872
|
{{ /if }}
|
|
864
873
|
</div>
|
|
865
874
|
</li>
|
|
@@ -878,30 +887,26 @@ const GlobalSearchResults = class {
|
|
|
878
887
|
<div class="sc-nano-global-search-results filters-header">
|
|
879
888
|
<strong class="sc-nano-global-search-results filters-title">Filters</strong>
|
|
880
889
|
<button class="sc-nano-global-search-results filters-reset">Reset</button>
|
|
881
|
-
<button class="sc-nano-global-search-results filters__close-filters close-filters icon-button" aria-controls="main-search-filters">
|
|
882
|
-
<nano-icon class="sc-nano-global-search-results" name="light/xmark"></nano-icon>
|
|
883
|
-
</button>
|
|
890
|
+
<nano-icon-button class="sc-nano-global-search-results filters__close-filters close-filters icon-button" icon-name="light/xmark" aria-controls="main-search-filters"></nano-icon-button>
|
|
884
891
|
</div>
|
|
885
892
|
{{ /if }}
|
|
886
893
|
|
|
887
|
-
<div>
|
|
888
|
-
<
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
</label>
|
|
894
|
+
<div class="sc-nano-global-search-results filters-list">
|
|
895
|
+
<nano-checkbox value="old-posts" class="old-posts" name="old-posts" checked>
|
|
896
|
+
<span>Include posts older than 2 years</strong>)</span>
|
|
897
|
+
</nano-checkbox>
|
|
892
898
|
{{ @if(it.origFilters['type']) }}
|
|
893
|
-
<nano-details class="sc-nano-global-search-results" open={true}
|
|
894
|
-
<strong slot="label">Type</strong>
|
|
895
|
-
<nano-icon slot="icon-end" name="light/chevron-down" size="small"></nano-icon>
|
|
899
|
+
<nano-details class="sc-nano-global-search-results" open={true} label="Type" size="small">
|
|
896
900
|
<nano-algolia-filter store-id="searchf1" store-method="url-hash-push" filter-name="type">
|
|
897
901
|
<script type="text/template" slot="filter-template">
|
|
898
902
|
<ul class="sc-nano-global-search-results" data-num="{{(x = 0)}}">
|
|
899
903
|
{{ @foreach(it.dyn) => filter, filterVal }}
|
|
900
904
|
<li class="sc-nano-global-search-results" data-num="{{(x++)}}">
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
|
+
<input class="sc-nano-global-search-results filter-cb" type="checkbox" value="{{ filter }}" id="type-{{ filter }}-{{x}}" />
|
|
906
|
+
<label class="sc-nano-global-search-results filter-label" for="type-{{ filter }}-{{x}}">
|
|
907
|
+
<span>{{ filter | public_name }} (<strong>{{ filterVal }}</strong>)</span>
|
|
908
|
+
</label>
|
|
909
|
+
</li>
|
|
905
910
|
{{ /foreach }}
|
|
906
911
|
</ul>
|
|
907
912
|
</script>
|
|
@@ -911,18 +916,17 @@ const GlobalSearchResults = class {
|
|
|
911
916
|
{{ /if }}
|
|
912
917
|
|
|
913
918
|
{{ @if(it.origFilters['channel']) }}
|
|
914
|
-
<nano-details open={true}
|
|
915
|
-
<strong slot="label">Channels</strong>
|
|
916
|
-
<nano-icon slot="icon-end" name="light/chevron-down" size="small"></nano-icon>
|
|
919
|
+
<nano-details open={true} label="Channels" size="small">
|
|
917
920
|
<nano-algolia-filter store-id="searchf2" store-method="url-hash-push" filter-name="channel">
|
|
918
921
|
<script type="text/template" slot="filter-template">
|
|
919
922
|
<ul class="sc-nano-global-search-results" data-num="{{(x = 0)}}">
|
|
920
923
|
{{ @foreach(it.dyn) => filter, filterVal }}
|
|
921
924
|
<li class="sc-nano-global-search-results" data-num="{{(x++)}}">
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
925
|
+
<input class="filter-cb sc-nano-global-search-results" type="checkbox" value="{{ filter }}" id="channel-{{ filter }}-{{x}}" />
|
|
926
|
+
<label class="filter-label sc-nano-global-search-results" for="channel-{{ filter }}-{{x}}">
|
|
927
|
+
<span>{{ filter | public_name }} (<strong>{{ filterVal }}</strong>)</span>
|
|
928
|
+
</label>
|
|
929
|
+
</li>
|
|
926
930
|
{{ /foreach }}
|
|
927
931
|
</ul>
|
|
928
932
|
</script>
|
|
@@ -932,18 +936,17 @@ const GlobalSearchResults = class {
|
|
|
932
936
|
{{ /if }}
|
|
933
937
|
|
|
934
938
|
{{ @if(it.origFilters['authors']) }}
|
|
935
|
-
<nano-details open={true}
|
|
936
|
-
<strong slot="label">Authors</strong>
|
|
937
|
-
<nano-icon slot="icon-end" name="light/chevron-down" size="small"></nano-icon>
|
|
939
|
+
<nano-details open={true} label="Authors" size="small">
|
|
938
940
|
<nano-algolia-filter store-id="searchf3" store-method="url-hash-push" filter-name="authors">
|
|
939
941
|
<script type="text/template" slot="filter-template">
|
|
940
942
|
<ul class="sc-nano-global-search-results" data-num="{{(x = 0)}}">
|
|
941
943
|
{{ @foreach(it.dyn) => filter, filterVal }}
|
|
942
944
|
<li class="sc-nano-global-search-results" data-num="{{(x++)}}">
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
945
|
+
<input class="filter-cb sc-nano-global-search-results" type="checkbox" value="{{ filter }}" id="authors-{{ filter }}-{{x}}" />
|
|
946
|
+
<label class="filter-label sc-nano-global-search-results" for="authors-{{ filter }}-{{x}}">
|
|
947
|
+
<span>{{ filter | public_name }} (<strong>{{ filterVal }}</strong>)</span>
|
|
948
|
+
</label>
|
|
949
|
+
</li>
|
|
947
950
|
{{ /foreach }}
|
|
948
951
|
</ul>
|
|
949
952
|
</script>
|
|
@@ -953,19 +956,18 @@ const GlobalSearchResults = class {
|
|
|
953
956
|
{{ /if }}
|
|
954
957
|
|
|
955
958
|
{{ @if(it.origFilters['categories_without_path']) }}
|
|
956
|
-
<nano-details open={true}
|
|
957
|
-
<strong slot="label">Category</strong>
|
|
958
|
-
<nano-icon slot="icon-end" name="light/chevron-down" size="small"></nano-icon>
|
|
959
|
+
<nano-details open={true} label="Categories" size="small">
|
|
959
960
|
<nano-algolia-filter store-id="searchf4" store-method="url-hash-push" filter-name="categories_without_path">
|
|
960
961
|
<script type="text/template" slot="filter-template">
|
|
961
962
|
<ul class="sc-nano-global-search-results" data-num="{{(x = 0)}}">
|
|
962
963
|
{{ @foreach(it.dyn) => filter, filterVal }}
|
|
963
964
|
{{ @if(!filter.match(/publication/)) }}
|
|
964
965
|
<li class="sc-nano-global-search-results" data-num="{{(x++)}}">
|
|
965
|
-
|
|
966
|
-
|
|
967
|
-
|
|
968
|
-
|
|
966
|
+
<input class="sc-nano-global-search-results filter-cb" type="checkbox" value="{{ filter }}" id="cwp-{{ filter }}-{{x}}" />
|
|
967
|
+
<label class="sc-nano-global-search-results filter-label" for="cwp-{{ filter }}-{{x}}">
|
|
968
|
+
<span>{{ filter | public_name }} (<strong>{{ filterVal }}</strong>)</span>
|
|
969
|
+
</label>
|
|
970
|
+
</li>
|
|
969
971
|
{{ /if }}
|
|
970
972
|
{{ /foreach }}
|
|
971
973
|
</ul>
|
|
@@ -976,18 +978,19 @@ const GlobalSearchResults = class {
|
|
|
976
978
|
{{ /if }}
|
|
977
979
|
|
|
978
980
|
{{ @if(it.origFilters['tags']) }}
|
|
979
|
-
<nano-details open={true}
|
|
980
|
-
<strong slot="label">Tags</strong>
|
|
981
|
-
<nano-icon slot="icon-end" name="light/chevron-down" size="small"></nano-icon>
|
|
981
|
+
<nano-details open={true} label="Tags" size="small">
|
|
982
982
|
<nano-algolia-filter store-id="searchf5" store-method="url-hash-push" filter-name="tags">
|
|
983
983
|
<script type="text/template" slot="filter-template">
|
|
984
984
|
<ul class="sc-nano-global-search-results" data-num="{{(x = 0)}}">
|
|
985
985
|
{{ @foreach(it.dyn) => filter, filterVal }}
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
986
|
+
{{ @if(!filter.match('>')) }}
|
|
987
|
+
<li class="sc-nano-global-search-results" data-num="{{(x++)}}">
|
|
988
|
+
<input class="filter-cb sc-nano-global-search-results" type="checkbox" value="{{ filter | lowercase }}" id="tags-{{ filter }}-{{x}}" />
|
|
989
|
+
<label class="filter-label sc-nano-global-search-results" for="tags-{{ filter }}-{{x}}">
|
|
990
|
+
<span>{{ filter | public_name }} (<strong>{{ filterVal }}</strong>)</span>
|
|
991
|
+
</label>
|
|
992
|
+
</li>
|
|
993
|
+
{{ /if }}
|
|
991
994
|
{{ /foreach }}
|
|
992
995
|
</ul>
|
|
993
996
|
</script>
|
|
@@ -999,7 +1002,7 @@ const GlobalSearchResults = class {
|
|
|
999
1002
|
</div>
|
|
1000
1003
|
</div>
|
|
1001
1004
|
{{ /if }}
|
|
1002
|
-
</div>`), h("div", { key: '
|
|
1005
|
+
</div>`), h("div", { key: '33b7b45a25b64b26e7ccd724e0171c997c145540', slot: "output" }), h("slot", { key: '15039307d1b06217c2666eb344a44fe9966a336f' }))));
|
|
1003
1006
|
}
|
|
1004
1007
|
static get watchers() { return {
|
|
1005
1008
|
"algoliaEle": ["handleAlgoliaCredsChange", "handleAlgoliaIndexChange", "handleAlgoliaEleChange"],
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { r as registerInstance, c as createEvent, g as getElement, a as Host } from './index-DgO0qeQ9.js';
|
|
5
5
|
import { f as focusInContainer, g as getActiveElement } from './active-element-CKJIkX0R.js';
|
|
6
|
-
import { P as Popover } from './popover-
|
|
6
|
+
import { P as Popover } from './popover-CWVbjtKn.js';
|
|
7
7
|
import { a as getNearestTabbableElement, g as getTabbableElements } from './tabbable-DbW4RUw6.js';
|
|
8
8
|
import { t as transformTag, h } from './renderer-T8etwwhk.js';
|
|
9
9
|
import { g as getDirectChildren } from './dom-CrrHp_I_.js';
|
|
@@ -317,8 +317,12 @@ const Dropdown = class {
|
|
|
317
317
|
distance: this.distance,
|
|
318
318
|
skidding: this.skidding,
|
|
319
319
|
transitionElement: this.panel,
|
|
320
|
-
onAfterHide: () =>
|
|
321
|
-
|
|
320
|
+
onAfterHide: () => {
|
|
321
|
+
this.nanoAfterHide.emit();
|
|
322
|
+
},
|
|
323
|
+
onAfterShow: () => {
|
|
324
|
+
this.nanoAfterShow.emit();
|
|
325
|
+
},
|
|
322
326
|
onTransitionEnd: () => {
|
|
323
327
|
if (!this.open) {
|
|
324
328
|
this.afterHide();
|
|
@@ -359,12 +363,12 @@ const Dropdown = class {
|
|
|
359
363
|
this.popover.destroy();
|
|
360
364
|
}
|
|
361
365
|
render() {
|
|
362
|
-
return (h(Host, { key: '
|
|
366
|
+
return (h(Host, { key: 'c0ed4b8b03d27f7437c148c8df305886c6cf29d9', class: "nano-dropdown" }, h("div", { key: '27165586e2caa99ba746e7db3aa1574f0e9d1576', part: "base", id: this.dropdownId, class: {
|
|
363
367
|
dropdown: true,
|
|
364
368
|
'dropdown--open': this.open,
|
|
365
|
-
} }, h("span", { key: '
|
|
369
|
+
} }, h("span", { key: 'b401a4d341e786ae4fe8c54adf06f8da1be4f531', part: "trigger", class: "dropdown__trigger", ref: (el) => (this.trigger = el), onKeyDown: this.handleTriggerKeyDown, onClick: this.togglePanel }, h("slot", { key: 'bd61e0f2d5e164b21d3ecba81c63ec72b0b7cc6f', name: "trigger", onSlotchange: this.handleTriggerSlotChange })), h("div", { key: 'e0cb2a8823490b70f6aa01073d3873fa785fd763', ref: (el) => (this.positioner = el), class: "dropdown__positioner", popover: "manual", id: this.dropdownId + '-positioner' }, h("div", { key: '3f1b7e3911cd7616ff85d042fc0d1e3e358f36c2', ref: (el) => (this.panel = el), part: "panel", class: `dropdown__panel ${this.placement.split('-').join(' ')}`, "aria-hidden": !this.open, role: this.host.getAttribute('role') === 'group' ? 'group' : 'dialog', "aria-modal": this.host.getAttribute('role') === 'group' ? undefined : 'true', "aria-labelledby": this.dialogTitle ? this.labelId : undefined, tabIndex: this.isOverflowing() ? 0 : undefined }, this.dialogTitle && (h("span", { key: '19cc4dd331a4c2cbdc73a05687681cb2830fff0c', id: this.labelId, class: "dropdown__accessible-title", "aria-live": this.host.getAttribute('role') === 'group'
|
|
366
370
|
? undefined
|
|
367
|
-
: 'polite' }, this.dialogTitle)), h("slot", { key: '
|
|
371
|
+
: 'polite' }, this.dialogTitle)), h("slot", { key: '5da1881086c31481463b3b7244552e17ee66d997' }))))));
|
|
368
372
|
}
|
|
369
373
|
static get watchers() { return {
|
|
370
374
|
"open": ["handleOpenChange"],
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { k as getAssetPath, r as registerInstance, c as createEvent, g as getElement, a as Host } from './index-DgO0qeQ9.js';
|
|
5
5
|
import { h } from './renderer-T8etwwhk.js';
|
|
6
|
-
import { P as Popover } from './popover-
|
|
6
|
+
import { P as Popover } from './popover-CWVbjtKn.js';
|
|
7
7
|
|
|
8
8
|
let CACHED_MAP;
|
|
9
9
|
const getIconMap = () => {
|
|
@@ -6,7 +6,7 @@ import { h } from './renderer-T8etwwhk.js';
|
|
|
6
6
|
import { H as HasSlotController } from './slot-ncg8_2lY.js';
|
|
7
7
|
import { g as getDirectChildren } from './dom-CrrHp_I_.js';
|
|
8
8
|
|
|
9
|
-
const inPageNavCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:block}.desktop-nav{display:block}@media (width <= 767px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 767px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:\"\";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper a,.details-wrapper ul,.details-wrapper li{all:unset}.details-wrapper ul{display:flex;flex-direction:column;list-style:none}.details-wrapper ul:not(ul ul){padding:0 var(--spacing-l2)
|
|
9
|
+
const inPageNavCss = ":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:block}.desktop-nav{display:block}@media (width <= 767px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 767px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:\"\";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper a,.details-wrapper ul,.details-wrapper li{all:unset}.details-wrapper ul{display:flex;flex-direction:column;list-style:none}.details-wrapper ul:not(ul ul){padding:0 var(--spacing-l2) 0 var(--spacing-l2)}.details-wrapper a{cursor:pointer}.details-wrapper a:hover{text-decoration:underline}.details-wrapper a:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.details-wrapper ul>li:not(ul>li li){margin:0;padding:var(--spacing-l2) 0;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;inline-size:100%}.details-wrapper ul>li:not(ul>li li):not(:last-of-type){border-block-end:1px solid var(--color-bottom-border)}.details-wrapper ul>li:not(ul>li li) a{color:var(--color-text)}.details-wrapper ul>li:not(ul>li li) a.is-active{border-inline-start:var(--border-active);padding-inline-start:1rem}.details-wrapper ul>li:not(ul>li li) a:hover{color:var(--color-text-hover)}.details-wrapper ul>li>ul,.details-wrapper ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--spacing-l2);gap:var(--list-gap)}.details-wrapper ul>li>ul a,.details-wrapper ul>li>.nano-details>ul a{color:var(--color-primary) !important}.details-wrapper ul>li>ul>li>.nano-details>ul,.details-wrapper ul>li>.nano-details>ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--nano-spacing-xl)}.details-wrapper .nano-details .nano-details:not(.nano-details .nano-details .nano-details){color:var(--color-text)}.details-wrapper .nano-details{--padding:0;--btn-bg-color:transparent;--btn-bg-color--open:var(--nano-color-primary-75);--btn-bg-color--hover:transparent;border:none;color:var(--color-primary)}.details-wrapper .nano-details .is-active::part(header){border-inline-start:var(--border-active);padding-inline-start:1rem !important;color:var(--color-primary)}.details-wrapper .nano-details[open]>[slot=icon-start]{rotate:90deg}.details-wrapper .nano-details::part(icon--start){margin-inline-end:var(--spacing-l3)}.details-wrapper .nano-details::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing)}.details-wrapper .nano-details::part(header):hover{text-decoration:underline}.details-wrapper .nano-details:not(.nav-details){color:var(--color-primary)}";
|
|
10
10
|
|
|
11
11
|
const NanoInPageNav = class {
|
|
12
12
|
constructor(hostRef) {
|
|
@@ -317,7 +317,7 @@ const NanoTabGroup = class {
|
|
|
317
317
|
group: true,
|
|
318
318
|
'group--top': this.placement === 'top',
|
|
319
319
|
'group--start': this.placement === 'start',
|
|
320
|
-
}, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("nano-masked-overflow", { role: "
|
|
320
|
+
}, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("nano-masked-overflow", { role: "navigation", class: "group__tabs", part: "tabs__wrapper", exportparts: "items:tabs, scroll-button:tabs__scroll-button, indicator:active-tab-indicator", orientation: this.placement === 'top' ? 'horizontal' : 'vertical', isActiveHandler: (itm) => this.activeTab === itm, scrollControls: !this.noScrollControls, hideScrollbars: true }, h("slot", { name: "tabs", onSlotchange: this.handleTabSlotChange }), h("div", { class: "group__tabs-border" })), h("div", { part: "body", class: "group__body", onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, h("slot", { onSlotchange: this.handleContentSlotChange })))));
|
|
321
321
|
}
|
|
322
322
|
};
|
|
323
323
|
NanoTabGroup.style = tabGroupCss;
|