diff --git a/views/assets/scripts.js b/views/assets/scripts.js index 6bd6aed..e752013 100644 --- a/views/assets/scripts.js +++ b/views/assets/scripts.js @@ -1,20 +1,20 @@ var _ = (i) => { throw TypeError(i); }; -var g = (i, r, t) => r.has(i) || _("Cannot " + t); -var c = (i, r, t) => (g(i, r, "read from private field"), t ? t.call(i) : r.get(i)), l = (i, r, t) => r.has(i) ? _("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(i) : r.set(i, t), o = (i, r, t, e) => (g(i, r, "write to private field"), e ? e.call(i, t) : r.set(i, t), t), d = (i, r, t) => (g(i, r, "access private method"), t); -const v = "script[xslt-onload]", m = "xslt-template", A = "xslt-transformed", F = "filter-list", f = "filter-list-list", w = "filter-list-item", I = "filter-list-input", E = "filter-list-searchable"; -var a, p, b; -class $ { +var L = (i, r, t) => r.has(i) || _("Cannot " + t); +var d = (i, r, t) => (L(i, r, "read from private field"), t ? t.call(i) : r.get(i)), o = (i, r, t) => r.has(i) ? _("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(i) : r.set(i, t), a = (i, r, t, e) => (L(i, r, "write to private field"), e ? e.call(i, t) : r.set(i, t), t), u = (i, r, t) => (L(i, r, "access private method"), t); +const v = "script[xslt-onload]", b = "xslt-template", w = "xslt-transformed", k = "filter-list", f = "filter-list-list", y = "filter-list-item", A = "filter-list-input", m = "filter-list-searchable", F = "scroll-button"; +var l, p, E; +class H { constructor() { - l(this, p); - l(this, a); - o(this, a, /* @__PURE__ */ new Map()); + o(this, p); + o(this, l); + a(this, l, /* @__PURE__ */ new Map()); } setup() { let r = htmx.findAll(v); for (let t of r) - d(this, p, b).call(this, t); + u(this, p, E).call(this, t); } hookupHTMX() { htmx.on("htmx:load", (r) => { @@ -22,27 +22,27 @@ class $ { }); } } -a = new WeakMap(), p = new WeakSet(), b = function(r) { - if (r.getAttribute(A) === "true" || !r.hasAttribute(m)) +l = new WeakMap(), p = new WeakSet(), E = function(r) { + if (r.getAttribute(w) === "true" || !r.hasAttribute(b)) return; - let t = "#" + r.getAttribute(m), e = c(this, a).get(t); + let t = "#" + r.getAttribute(b), e = d(this, l).get(t); if (!e) { - let u = htmx.find(t); - if (u) { - let S = u.innerHTML ? new DOMParser().parseFromString(u.innerHTML, "application/xml") : u.contentDocument; - e = new XSLTProcessor(), e.importStylesheet(S), c(this, a).set(t, e); + let c = htmx.find(t); + if (c) { + let x = c.innerHTML ? new DOMParser().parseFromString(c.innerHTML, "application/xml") : c.contentDocument; + e = new XSLTProcessor(), e.importStylesheet(x), d(this, l).set(t, e); } else throw new Error("Unknown XSLT template: " + t); } - let s = new DOMParser().parseFromString(r.innerHTML, "application/xml"), L = e.transformToFragment(s, document), x = new XMLSerializer().serializeToString(L); - r.outerHTML = x; + let s = new DOMParser().parseFromString(r.innerHTML, "application/xml"), T = e.transformToFragment(s, document), S = new XMLSerializer().serializeToString(T); + r.outerHTML = S; }; -var n, h, T; -class k extends HTMLElement { +var n, h, g; +class I extends HTMLElement { constructor() { super(); - l(this, h); - l(this, n, !1); + o(this, h); + o(this, n, !1); this._items = [], this._url = "", this._filterstart = !1, this._placeholder = "Liste filtern...", this.render(); } static get observedAttributes() { @@ -55,7 +55,7 @@ class k extends HTMLElement { return this._items; } connectedCallback() { - this._url = this.getAttribute("data-url") || "./", this._filterstart = this.getAttribute("data-filterstart") === "true", this._placeholder = this.getAttribute("data-placeholder") || "Liste filtern...", this._filterstart && o(this, n, !0), this.addEventListener("input", this.onInput.bind(this)), this.addEventListener("keydown", this.onEnter.bind(this)), this.addEventListener("focusin", this.onGainFocus.bind(this)), this.addEventListener("focusout", this.onLoseFocus.bind(this)); + this._url = this.getAttribute("data-url") || "./", this._filterstart = this.getAttribute("data-filterstart") === "true", this._placeholder = this.getAttribute("data-placeholder") || "Liste filtern...", this._filterstart && a(this, n, !0), this.addEventListener("input", this.onInput.bind(this)), this.addEventListener("keydown", this.onEnter.bind(this)), this.addEventListener("focusin", this.onGainFocus.bind(this)), this.addEventListener("focusout", this.onLoseFocus.bind(this)); } attributeChangedCallback(t, e, s) { t === "data-url" && e !== s && (this._url = s, this.render()), t === "data-filterstart" && e !== s && (this._filterstart = s === "true", this.render()), t === "data-placeholder" && e !== s && (this._placeholder = s, this.render()); @@ -64,14 +64,14 @@ class k extends HTMLElement { t.target && t.target.tagName.toLowerCase() === "input" && (this._filter = t.target.value, this.renderList()); } onGainFocus(t) { - t.target && t.target.tagName.toLowerCase() === "input" && (o(this, n, !1), this.renderList()); + t.target && t.target.tagName.toLowerCase() === "input" && (a(this, n, !1), this.renderList()); } onLoseFocus(t) { let e = this.querySelector("input"); if (t.target && t.target === e) { if (relatedElement = t.relatedTarget, relatedElement && this.contains(relatedElement)) return; - e.value = "", this._filter = "", this._filterstart && o(this, n, !0), this.renderList(); + e.value = "", this._filter = "", this._filterstart && a(this, n, !0), this.renderList(); } } onEnter(t) { @@ -87,7 +87,7 @@ class k extends HTMLElement { let t = this.querySelector("#" + f); if (!t) return; - let e = new Mark(t.querySelectorAll("." + E)); + let e = new Mark(t.querySelectorAll("." + m)); this._filter && e.mark(this._filter, { separateWordSearch: !0 }); @@ -124,7 +124,7 @@ class k extends HTMLElement { } getLinkText(t) { let e = this.getSearchText(t); - return e === "" ? "" : `${e}`; + return e === "" ? "" : `${e}`; } renderList() { let t = this.querySelector("#" + f); @@ -139,7 +139,7 @@ class k extends HTMLElement { `; } ActiveDot(t) { - return d(this, h, T).call(this, t), ""; + return u(this, h, g).call(this, t), ""; } NoItems(t) { return t.length === 0 ? '
Keine Einträge gefunden
' : ""; @@ -152,7 +152,7 @@ class k extends HTMLElement { + class="${A} w-full placeholder:italic px-2 py-0.5" /> `; @@ -164,16 +164,16 @@ class k extends HTMLElement { t = this._items.filter((e) => this.getSearchText(e).toLowerCase().startsWith(this._filter.toLowerCase())); else { let e = this._filter.split(" "); - t = this._items.filter((s) => e.every((L) => this.getSearchText(s).toLowerCase().includes(L.toLowerCase()))); + t = this._items.filter((s) => e.every((T) => this.getSearchText(s).toLowerCase().includes(T.toLowerCase()))); } return ` -
+
${t.map( (e, s) => ` + class="${y} block px-2.5 py-0.5 hover:bg-slate-200 no-underline ${s % 2 === 0 ? "bg-stone-100" : "bg-stone-50"}" + ${u(this, h, g).call(this, e) ? 'aria-current="page"' : ""}> ${this.ActiveDot(e)} ${this.getLinkText(e)} @@ -184,14 +184,52 @@ class k extends HTMLElement { `; } } -n = new WeakMap(), h = new WeakSet(), T = function(t) { +n = new WeakMap(), h = new WeakSet(), g = function(t) { if (!t) return !1; let e = this.getHREF(t); return !(e === "" || !window.location.href.endsWith(e)); }; -customElements.define(F, k); +class M extends HTMLElement { + constructor() { + super(), this.handleScroll = this.handleScroll.bind(this), this.scrollToTop = this.scrollToTop.bind(this); + } + connectedCallback() { + this.innerHTML = ` + + `, this._button = this.querySelector(".scroll-to-top"), window.addEventListener("scroll", this.handleScroll), this._button.addEventListener("click", this.scrollToTop); + } + disconnectedCallback() { + window.removeEventListener("scroll", this.handleScroll), this._button.removeEventListener("click", this.scrollToTop); + } + handleScroll() { + (window.scrollY || document.documentElement.scrollTop) > 300 ? this._button.classList.remove("hidden") : this._button.classList.add("hidden"); + } + scrollToTop() { + window.scrollTo({ top: 0, behavior: "smooth" }); + } +} +customElements.define(k, I); +customElements.define(F, M); export { - k as FilterList, - $ as XSLTParseProcess + I as FilterList, + M as ScrollButton, + H as XSLTParseProcess }; diff --git a/views/assets/style.css b/views/assets/style.css index 271049a..482fbcc 100644 --- a/views/assets/style.css +++ b/views/assets/style.css @@ -1 +1 @@ -/*! tailwindcss v4.0.5 | MIT License | https://tailwindcss.com */@layer theme{:root,:host{--font-sans:"Source Sans 3","Merriweather Sans",ui-sans-serif;--font-serif:"Merriweather",ui-serif;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-slate-100:oklch(.968 .007 247.896);--color-slate-200:oklch(.929 .013 255.508);--color-slate-600:oklch(.446 .043 257.281);--color-slate-700:oklch(.372 .044 257.287);--color-slate-800:oklch(.279 .041 260.031);--color-slate-900:oklch(.208 .042 265.755);--color-gray-200:oklch(.928 .006 264.531);--color-gray-500:oklch(.551 .027 264.364);--color-zinc-100:oklch(.967 .001 286.375);--color-zinc-200:oklch(.92 .004 286.32);--color-zinc-300:oklch(.871 .006 286.286);--color-zinc-600:oklch(.442 .017 285.786);--color-stone-50:oklch(.985 .001 106.423);--color-stone-100:oklch(.97 .001 106.424);--color-stone-500:oklch(.553 .013 58.071);--color-stone-700:oklch(.374 .01 67.558);--color-stone-900:oklch(.216 .006 56.043);--color-white:#fff;--spacing:.25rem;--breakpoint-xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--font-weight-bold:700;--tracking-wide:.025em;--ease-in:cubic-bezier(.4,0,1,1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-font-feature-settings:var(--font-sans--font-feature-settings);--default-font-variation-settings:var(--font-sans--font-variation-settings);--default-mono-font-family:var(--font-mono);--default-mono-font-feature-settings:var(--font-mono--font-feature-settings);--default-mono-font-variation-settings:var(--font-mono--font-variation-settings)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}body{line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1;color:color-mix(in oklab,currentColor 50%,transparent)}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}*,:after,:before,::backdrop{border-color:var(--color-gray-200,currentColor)}::file-selector-button{border-color:var(--color-gray-200,currentColor)}}@layer components{html{font-size:16.5px}body{background-color:var(--color-stone-50)}h1,h2,h3,h4{font-family:var(--font-serif)}a{-webkit-hyphens:none;hyphens:none;color:var(--color-slate-700);text-decoration-line:underline;text-decoration-style:dotted}@media (hover:hover){a:hover{color:var(--color-slate-900);text-decoration-style:solid}}ul{margin-block:calc(var(--spacing)*2)}li{margin-left:calc(var(--spacing)*14);list-style-type:disc}@media (hover:hover){nav>a:hover{border-color:var(--color-zinc-200)!important}}nav>*{border-bottom-style:var(--tw-border-style);border-color:#0000;border-bottom-width:4px}nav>button[aria-current=true]{background-color:var(--color-slate-200)!important}nav a[aria-current=page]{color:var(--color-slate-800);border-color:var(--color-zinc-300)!important}main{flex-grow:1;flex-shrink:0}.small-caps{font-variant-caps:small-caps}.alphabet a[aria-current=page]:not(.inactive){bottom:calc(var(--spacing)*-3);border-bottom-style:var(--tw-border-style);padding-top:calc(var(--spacing)*2);padding-bottom:calc(var(--spacing)*3);--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold);border-bottom-width:1px;font-style:italic;position:relative;background-color:var(--color-stone-50)!important}.alphabet a:hover:not([aria-current=page]:not(.inactive)){padding-top:calc(var(--spacing)*.5);padding-bottom:calc(var(--spacing)*1);position:relative;background-color:var(--color-stone-50)!important}.headingcontainer:before{content:"";top:calc(var(--spacing)*0);background-color:var(--color-zinc-300);width:50%;height:1px;position:absolute;left:50%}.headingcontainer{margin-top:calc(var(--spacing)*10);border-right-style:var(--tw-border-style);border-right-width:1px;border-color:var(--color-zinc-300);position:relative}.headingcontainer h1{--tw-translate-y: -50% ;width:min-content;translate:var(--tw-translate-x)var(--tw-translate-y);background-color:var(--color-stone-50);padding-inline:calc(var(--spacing)*3);font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height));--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold);white-space:nowrap;margin-inline:auto;position:relative}.filter-list-list .filter-list-item[aria-current=page]{border-left-style:var(--tw-border-style);border-left-width:4px;border-color:var(--color-zinc-300);--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}}@layer utilities{.collapse{visibility:collapse}.visible{visibility:visible}.relative{position:relative}.static{position:static}.float-right{float:right}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.my-0\.5{margin-block:calc(var(--spacing)*.5)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-8{margin-top:calc(var(--spacing)*8)}.mt-12{margin-top:calc(var(--spacing)*12)}.-mr-36{margin-right:calc(var(--spacing)*-36)}.mr-1{margin-right:calc(var(--spacing)*1)}.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-1\.5{margin-bottom:calc(var(--spacing)*1.5)}.mb-6{margin-bottom:calc(var(--spacing)*6)}.-ml-0\.5{margin-left:calc(var(--spacing)*-.5)}.-ml-16{margin-left:calc(var(--spacing)*-16)}.ml-3{margin-left:calc(var(--spacing)*3)}.ml-6{margin-left:calc(var(--spacing)*6)}.ml-8{margin-left:calc(var(--spacing)*8)}.block{display:block}.contents{display:contents}.flex{display:flex}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.table{display:table}.h-1{height:calc(var(--spacing)*1)}.h-2{height:calc(var(--spacing)*2)}.h-3{height:calc(var(--spacing)*3)}.h-4{height:calc(var(--spacing)*4)}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-14{height:calc(var(--spacing)*14)}.h-full{height:100%}.max-h-60{max-height:calc(var(--spacing)*60)}.min-h-14{min-height:calc(var(--spacing)*14)}.min-h-\[19rem\]{min-height:19rem}.min-h-screen{min-height:100vh}.w-14{width:calc(var(--spacing)*14)}.w-\[12rem\]{width:12rem}.w-full{width:100%}.max-w-\(--breakpoint-xl\){max-width:var(--breakpoint-xl)}.max-w-96{max-width:calc(var(--spacing)*96)}.max-w-\[32rem\]{max-width:32rem}.max-w-\[60rem\]{max-width:60rem}.min-w-7{min-width:calc(var(--spacing)*7)}.min-w-\[22\.5rem\]{min-width:22.5rem}.min-w-\[32rem\]{min-width:32rem}.shrink-0{flex-shrink:0}.flex-grow,.grow{flex-grow:1}.grow-0{flex-grow:0}.translate-2{--tw-translate-x:calc(var(--spacing)*2);--tw-translate-y:calc(var(--spacing)*2);translate:var(--tw-translate-x)var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x)var(--tw-rotate-y)var(--tw-rotate-z)var(--tw-skew-x)var(--tw-skew-y)}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-end{justify-content:flex-end}.gap-x-3{column-gap:calc(var(--spacing)*3)}.gap-x-4{column-gap:calc(var(--spacing)*4)}.gap-y-8{row-gap:calc(var(--spacing)*8)}.self-end{align-self:flex-end}.overflow-auto{overflow:auto}.rounded{border-radius:.25rem}.border{border-style:var(--tw-border-style);border-width:1px}.border-x{border-inline-style:var(--tw-border-style);border-inline-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-4{border-bottom-style:var(--tw-border-style);border-bottom-width:4px}.border-stone-100{border-color:var(--color-stone-100)}.border-zinc-300{border-color:var(--color-zinc-300)}.border-zinc-600{border-color:var(--color-zinc-600)}.bg-slate-100{background-color:var(--color-slate-100)}.bg-stone-50{background-color:var(--color-stone-50)}.bg-stone-100{background-color:var(--color-stone-100)}.bg-stone-700{background-color:var(--color-stone-700)}.px-1{padding-inline:calc(var(--spacing)*1)}.px-1\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-2\.5{padding-inline:calc(var(--spacing)*2.5)}.px-3{padding-inline:calc(var(--spacing)*3)}.py-0\.5{padding-block:calc(var(--spacing)*.5)}.py-1{padding-block:calc(var(--spacing)*1)}.py-3\.5{padding-block:calc(var(--spacing)*3.5)}.pt-0\.5{padding-top:calc(var(--spacing)*.5)}.pt-1{padding-top:calc(var(--spacing)*1)}.pt-3{padding-top:calc(var(--spacing)*3)}.pt-3\.5{padding-top:calc(var(--spacing)*3.5)}.\!pr-2\.5{padding-right:calc(var(--spacing)*2.5)!important}.pr-2\.5{padding-right:calc(var(--spacing)*2.5)}.pb-0{padding-bottom:calc(var(--spacing)*0)}.pb-0\.5{padding-bottom:calc(var(--spacing)*.5)}.pb-1{padding-bottom:calc(var(--spacing)*1)}.pb-1\.5{padding-bottom:calc(var(--spacing)*1.5)}.pl-2{padding-left:calc(var(--spacing)*2)}.text-right{text-align:right}.-indent-3{text-indent:calc(var(--spacing)*-3)}.align-bottom{vertical-align:bottom}.align-top{vertical-align:top}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.font-serif{font-family:var(--font-serif)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-wrap{text-wrap:wrap}.hyphens-auto{-webkit-hyphens:auto;hyphens:auto}.whitespace-nowrap{white-space:nowrap}.text-gray-500{color:var(--color-gray-500)}.text-slate-600{color:var(--color-slate-600)}.text-stone-500{color:var(--color-stone-500)}.text-white{color:var(--color-white)}.italic{font-style:italic}.no-underline{text-decoration-line:none}.overline{text-decoration-line:overline}.underline{text-decoration-line:underline}.shadow-inner{--tw-shadow:inset 0 2px 4px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-75{--tw-duration:75ms;transition-duration:75ms}.ease-in{--tw-ease:var(--ease-in);transition-timing-function:var(--ease-in)}.\[a-zA-Z\:\\-\\\.\]{a-zA-Z:\-\.}.placeholder\:italic::placeholder{font-style:italic}.odd\:bg-stone-100:nth-child(odd){background-color:var(--color-stone-100)}.even\:bg-zinc-100:nth-child(2n){background-color:var(--color-zinc-100)}@media (hover:hover){.hover\:cursor-pointer:hover{cursor:pointer}.hover\:bg-slate-100:hover{background-color:var(--color-slate-100)}.hover\:bg-slate-200:hover{background-color:var(--color-slate-200)}.hover\:bg-stone-900:hover{background-color:var(--color-stone-900)}.hover\:text-slate-900:hover{color:var(--color-slate-900)}}.\[\&_td\]\:\!align-top td{vertical-align:top!important}.\[\&\>\*\]\:-mb-1\.5>*{margin-bottom:calc(var(--spacing)*-1.5)}.\[\&\>\*\]\:bg-slate-100>*{background-color:var(--color-slate-100)}.\[\&\>\*\]\:px-1\.5>*{padding-inline:calc(var(--spacing)*1.5)}.\[\&\>\*\]\:px-12>*{padding-inline:calc(var(--spacing)*12)}.\[\&\>\*\]\:pt-1>*{padding-top:calc(var(--spacing)*1)}.\[\&\>\*\]\:pt-8>*{padding-top:calc(var(--spacing)*8)}.\[\&\>\*\]\:pb-12>*{padding-bottom:calc(var(--spacing)*12)}.\[\&\>a\]\:no-underline>a{text-decoration-line:none}.\[\&\>a\[aria-current\=\'page\'\]\]\:font-bold>a[aria-current=page]{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false;initial-value:rotateX(0)}@property --tw-rotate-y{syntax:"*";inherits:false;initial-value:rotateY(0)}@property --tw-rotate-z{syntax:"*";inherits:false;initial-value:rotateZ(0)}@property --tw-skew-x{syntax:"*";inherits:false;initial-value:skewX(0)}@property --tw-skew-y{syntax:"*";inherits:false;initial-value:skewY(0)}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false} +/*! tailwindcss v4.0.5 | MIT License | https://tailwindcss.com */@layer theme{:root,:host{--font-sans:"Source Sans 3","Merriweather Sans",ui-sans-serif;--font-serif:"Merriweather",ui-serif;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-slate-100:oklch(.968 .007 247.896);--color-slate-200:oklch(.929 .013 255.508);--color-slate-600:oklch(.446 .043 257.281);--color-slate-700:oklch(.372 .044 257.287);--color-slate-800:oklch(.279 .041 260.031);--color-slate-900:oklch(.208 .042 265.755);--color-gray-200:oklch(.928 .006 264.531);--color-gray-500:oklch(.551 .027 264.364);--color-gray-800:oklch(.278 .033 256.848);--color-zinc-100:oklch(.967 .001 286.375);--color-zinc-200:oklch(.92 .004 286.32);--color-zinc-300:oklch(.871 .006 286.286);--color-zinc-600:oklch(.442 .017 285.786);--color-stone-50:oklch(.985 .001 106.423);--color-stone-100:oklch(.97 .001 106.424);--color-stone-500:oklch(.553 .013 58.071);--color-stone-700:oklch(.374 .01 67.558);--color-stone-900:oklch(.216 .006 56.043);--color-white:#fff;--spacing:.25rem;--breakpoint-xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--font-weight-bold:700;--tracking-wide:.025em;--radius-md:.375rem;--ease-in:cubic-bezier(.4,0,1,1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-font-feature-settings:var(--font-sans--font-feature-settings);--default-font-variation-settings:var(--font-sans--font-variation-settings);--default-mono-font-family:var(--font-mono);--default-mono-font-feature-settings:var(--font-mono--font-feature-settings);--default-mono-font-variation-settings:var(--font-mono--font-variation-settings)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}body{line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1;color:color-mix(in oklab,currentColor 50%,transparent)}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}*,:after,:before,::backdrop{border-color:var(--color-gray-200,currentColor)}::file-selector-button{border-color:var(--color-gray-200,currentColor)}}@layer components{html{font-size:16.5px}body{background-color:var(--color-stone-50)}h1,h2,h3,h4{font-family:var(--font-serif)}a{-webkit-hyphens:none;hyphens:none;color:var(--color-slate-700);text-decoration-line:underline;text-decoration-style:dotted}@media (hover:hover){a:hover{color:var(--color-slate-900);text-decoration-style:solid}}ul{margin-block:calc(var(--spacing)*2)}li{margin-left:calc(var(--spacing)*14);list-style-type:disc}@media (hover:hover){nav>a:hover{border-color:var(--color-zinc-200)!important}}nav>*{border-bottom-style:var(--tw-border-style);border-color:#0000;border-bottom-width:4px}nav>button[aria-current=true]{background-color:var(--color-slate-200)!important}nav a[aria-current=page]{color:var(--color-slate-800);border-color:var(--color-zinc-300)!important}main{flex-grow:1;flex-shrink:0}.small-caps{font-variant-caps:small-caps}.alphabet a[aria-current=page]:not(.inactive){bottom:calc(var(--spacing)*-3);border-bottom-style:var(--tw-border-style);padding-top:calc(var(--spacing)*2);padding-bottom:calc(var(--spacing)*3);--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold);border-bottom-width:1px;font-style:italic;position:relative;background-color:var(--color-stone-50)!important}.alphabet a:hover:not([aria-current=page]:not(.inactive)){padding-top:calc(var(--spacing)*.5);padding-bottom:calc(var(--spacing)*1);position:relative;background-color:var(--color-stone-50)!important}.headingcontainer:before{content:"";top:calc(var(--spacing)*0);background-color:var(--color-zinc-300);width:50%;height:1px;position:absolute;left:50%}.headingcontainer{margin-top:calc(var(--spacing)*10);border-right-style:var(--tw-border-style);border-right-width:1px;border-color:var(--color-zinc-300);position:relative}.headingcontainer h1{--tw-translate-y: -50% ;width:min-content;translate:var(--tw-translate-x)var(--tw-translate-y);background-color:var(--color-stone-50);padding-inline:calc(var(--spacing)*3);font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height));--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold);white-space:nowrap;margin-inline:auto;position:relative}.filter-list-list .filter-list-item[aria-current=page]{border-left-style:var(--tw-border-style);border-left-width:4px;border-color:var(--color-zinc-300);--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}}@layer utilities{.collapse{visibility:collapse}.visible{visibility:visible}.fixed{position:fixed}.relative{position:relative}.static{position:static}.right-5{right:calc(var(--spacing)*5)}.bottom-5{bottom:calc(var(--spacing)*5)}.float-right{float:right}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.my-0\.5{margin-block:calc(var(--spacing)*.5)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-8{margin-top:calc(var(--spacing)*8)}.mt-12{margin-top:calc(var(--spacing)*12)}.-mr-36{margin-right:calc(var(--spacing)*-36)}.mr-1{margin-right:calc(var(--spacing)*1)}.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-1\.5{margin-bottom:calc(var(--spacing)*1.5)}.mb-6{margin-bottom:calc(var(--spacing)*6)}.-ml-0\.5{margin-left:calc(var(--spacing)*-.5)}.-ml-16{margin-left:calc(var(--spacing)*-16)}.ml-3{margin-left:calc(var(--spacing)*3)}.ml-6{margin-left:calc(var(--spacing)*6)}.ml-8{margin-left:calc(var(--spacing)*8)}.block{display:block}.contents{display:contents}.flex{display:flex}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.table{display:table}.h-1{height:calc(var(--spacing)*1)}.h-2{height:calc(var(--spacing)*2)}.h-3{height:calc(var(--spacing)*3)}.h-4{height:calc(var(--spacing)*4)}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-14{height:calc(var(--spacing)*14)}.h-full{height:100%}.max-h-60{max-height:calc(var(--spacing)*60)}.min-h-14{min-height:calc(var(--spacing)*14)}.min-h-\[19rem\]{min-height:19rem}.min-h-screen{min-height:100vh}.w-14{width:calc(var(--spacing)*14)}.w-\[12rem\]{width:12rem}.w-full{width:100%}.max-w-\(--breakpoint-xl\){max-width:var(--breakpoint-xl)}.max-w-96{max-width:calc(var(--spacing)*96)}.max-w-\[32rem\]{max-width:32rem}.max-w-\[60rem\]{max-width:60rem}.min-w-7{min-width:calc(var(--spacing)*7)}.min-w-\[22\.5rem\]{min-width:22.5rem}.min-w-\[32rem\]{min-width:32rem}.shrink-0{flex-shrink:0}.flex-grow,.grow{flex-grow:1}.grow-0{flex-grow:0}.translate-2{--tw-translate-x:calc(var(--spacing)*2);--tw-translate-y:calc(var(--spacing)*2);translate:var(--tw-translate-x)var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x)var(--tw-rotate-y)var(--tw-rotate-z)var(--tw-skew-x)var(--tw-skew-y)}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-end{justify-content:flex-end}.gap-x-3{column-gap:calc(var(--spacing)*3)}.gap-x-4{column-gap:calc(var(--spacing)*4)}.gap-y-8{row-gap:calc(var(--spacing)*8)}.self-end{align-self:flex-end}.overflow-auto{overflow:auto}.rounded{border-radius:.25rem}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-x{border-inline-style:var(--tw-border-style);border-inline-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-4{border-bottom-style:var(--tw-border-style);border-bottom-width:4px}.border-stone-100{border-color:var(--color-stone-100)}.border-zinc-300{border-color:var(--color-zinc-300)}.border-zinc-600{border-color:var(--color-zinc-600)}.bg-gray-800{background-color:var(--color-gray-800)}.bg-slate-100{background-color:var(--color-slate-100)}.bg-stone-50{background-color:var(--color-stone-50)}.bg-stone-100{background-color:var(--color-stone-100)}.bg-stone-700{background-color:var(--color-stone-700)}.p-2{padding:calc(var(--spacing)*2)}.px-1{padding-inline:calc(var(--spacing)*1)}.px-1\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-2\.5{padding-inline:calc(var(--spacing)*2.5)}.px-3{padding-inline:calc(var(--spacing)*3)}.py-0\.5{padding-block:calc(var(--spacing)*.5)}.py-1{padding-block:calc(var(--spacing)*1)}.py-3\.5{padding-block:calc(var(--spacing)*3.5)}.pt-0\.5{padding-top:calc(var(--spacing)*.5)}.pt-1{padding-top:calc(var(--spacing)*1)}.pt-3{padding-top:calc(var(--spacing)*3)}.pt-3\.5{padding-top:calc(var(--spacing)*3.5)}.\!pr-2\.5{padding-right:calc(var(--spacing)*2.5)!important}.pr-2\.5{padding-right:calc(var(--spacing)*2.5)}.pb-0{padding-bottom:calc(var(--spacing)*0)}.pb-0\.5{padding-bottom:calc(var(--spacing)*.5)}.pb-1{padding-bottom:calc(var(--spacing)*1)}.pb-1\.5{padding-bottom:calc(var(--spacing)*1.5)}.pl-2{padding-left:calc(var(--spacing)*2)}.text-right{text-align:right}.-indent-3{text-indent:calc(var(--spacing)*-3)}.align-bottom{vertical-align:bottom}.align-top{vertical-align:top}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.font-serif{font-family:var(--font-serif)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-wrap{text-wrap:wrap}.hyphens-auto{-webkit-hyphens:auto;hyphens:auto}.whitespace-nowrap{white-space:nowrap}.text-gray-500{color:var(--color-gray-500)}.text-slate-600{color:var(--color-slate-600)}.text-stone-500{color:var(--color-stone-500)}.text-white{color:var(--color-white)}.italic{font-style:italic}.no-underline{text-decoration-line:none}.overline{text-decoration-line:overline}.underline{text-decoration-line:underline}.shadow-inner{--tw-shadow:inset 0 2px 4px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-75{--tw-duration:75ms;transition-duration:75ms}.ease-in{--tw-ease:var(--ease-in);transition-timing-function:var(--ease-in)}.\[a-zA-Z\:\\-\\\.\]{a-zA-Z:\-\.}.placeholder\:italic::placeholder{font-style:italic}.odd\:bg-stone-100:nth-child(odd){background-color:var(--color-stone-100)}.even\:bg-zinc-100:nth-child(2n){background-color:var(--color-zinc-100)}@media (hover:hover){.hover\:cursor-pointer:hover{cursor:pointer}.hover\:bg-slate-100:hover{background-color:var(--color-slate-100)}.hover\:bg-slate-200:hover{background-color:var(--color-slate-200)}.hover\:bg-stone-900:hover{background-color:var(--color-stone-900)}.hover\:text-slate-900:hover{color:var(--color-slate-900)}.hover\:opacity-80:hover{opacity:.8}}.\[\&_td\]\:\!align-top td{vertical-align:top!important}.\[\&\>\*\]\:-mb-1\.5>*{margin-bottom:calc(var(--spacing)*-1.5)}.\[\&\>\*\]\:bg-slate-100>*{background-color:var(--color-slate-100)}.\[\&\>\*\]\:px-1\.5>*{padding-inline:calc(var(--spacing)*1.5)}.\[\&\>\*\]\:px-12>*{padding-inline:calc(var(--spacing)*12)}.\[\&\>\*\]\:pt-1>*{padding-top:calc(var(--spacing)*1)}.\[\&\>\*\]\:pt-8>*{padding-top:calc(var(--spacing)*8)}.\[\&\>\*\]\:pb-12>*{padding-bottom:calc(var(--spacing)*12)}.\[\&\>a\]\:no-underline>a{text-decoration-line:none}.\[\&\>a\[aria-current\=\'page\'\]\]\:font-bold>a[aria-current=page]{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false;initial-value:rotateX(0)}@property --tw-rotate-y{syntax:"*";inherits:false;initial-value:rotateY(0)}@property --tw-rotate-z{syntax:"*";inherits:false;initial-value:rotateZ(0)}@property --tw-skew-x{syntax:"*";inherits:false;initial-value:skewX(0)}@property --tw-skew-y{syntax:"*";inherits:false;initial-value:skewY(0)}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false} diff --git a/views/layouts/default/root.gohtml b/views/layouts/default/root.gohtml index 83e47d2..8946998 100644 --- a/views/layouts/default/root.gohtml +++ b/views/layouts/default/root.gohtml @@ -45,6 +45,8 @@ {{ block "_footer" . }} {{ end }} + +
diff --git a/views/transform/main.js b/views/transform/main.js index f6c8e71..c2e743b 100644 --- a/views/transform/main.js +++ b/views/transform/main.js @@ -4,12 +4,15 @@ import "./site.css"; const ATTR_XSLT_ONLOAD = "script[xslt-onload]"; const ATTR_XSLT_TEMPLATE = "xslt-template"; const ATTR_XSLT_STATE = "xslt-transformed"; + const FILTER_LIST_ELEMENT = "filter-list"; const FILTER_LIST_LIST = "filter-list-list"; const FILTER_LIST_ITEM = "filter-list-item"; const FILTER_LIST_INPUT = "filter-list-input"; const FILTER_LIST_SEARCHABLE = "filter-list-searchable"; +const SCROLL_BUTTON_ELEMENT = "scroll-button"; + class XSLTParseProcess { #processors; @@ -360,6 +363,69 @@ class FilterList extends HTMLElement { } } -customElements.define(FILTER_LIST_ELEMENT, FilterList); +class ScrollButton extends HTMLElement { + constructor() { + super(); + this.handleScroll = this.handleScroll.bind(this); + this.scrollToTop = this.scrollToTop.bind(this); + } -export { XSLTParseProcess, FilterList }; + connectedCallback() { + // Insert Tailwind-styled button in light DOM + this.innerHTML = ` + + `; + + this._button = this.querySelector(".scroll-to-top"); + + // Listen for scroll events + window.addEventListener("scroll", this.handleScroll); + + // Listen for clicks on the button + this._button.addEventListener("click", this.scrollToTop); + } + + disconnectedCallback() { + window.removeEventListener("scroll", this.handleScroll); + this._button.removeEventListener("click", this.scrollToTop); + } + + handleScroll() { + // Show/hide button based on scroll position + const scrollTop = window.scrollY || document.documentElement.scrollTop; + if (scrollTop > 300) { + // Remove 'hidden' so it becomes visible + this._button.classList.remove("hidden"); + } else { + // Add 'hidden' so it's not displayed + this._button.classList.add("hidden"); + } + } + + scrollToTop() { + // Smoothly scroll back to top + window.scrollTo({ top: 0, behavior: "smooth" }); + } +} + +customElements.define(FILTER_LIST_ELEMENT, FilterList); +customElements.define(SCROLL_BUTTON_ELEMENT, ScrollButton); + +export { XSLTParseProcess, FilterList, ScrollButton };