@adnap/krysalicss 0.0.1 → 0.1.0

package/dist/module/card.min.css

@@ -1 +1 @@
-:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:light){:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}}:root.theme-light{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:dark){:root{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}}.theme-dark{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}.card{background-color:#fff;background-color:var(--kc-card-bg,#fff);color:#27282b;color:var(--kc-card-fg,#27282b);padding:1rem;border-radius:5px;border:1px solid color-mix(in srgb,currentcolor 12%,#0000)}.card a{color:currentColor;text-decoration:underline}.card.is-default{background-color:#fff;background-color:var(--kc-default-bg,#fff);color:#27282b;color:var(--kc-default-fg,#27282b)}.card.is-primary{background-color:#247d59;background-color:var(--kc-primary-bg,#247d59);color:#fff;color:var(--kc-primary-fg,#fff)}.card.is-warning{background-color:#7a4f10;background-color:var(--kc-warning-bg,#7a4f10);color:#fff;color:var(--kc-warning-fg,#fff)}.card.is-danger{background-color:#8c351a;background-color:var(--kc-danger-bg,#8c351a);color:#fff;color:var(--kc-danger-fg,#fff)}.card.is-success{background-color:#525a22;background-color:var(--kc-success-bg,#525a22);color:#fff;color:var(--kc-success-fg,#fff)}
+:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:light){:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}}:root.theme-light{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:dark){:root{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}}.theme-dark{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}.card{background-color:#fff;background-color:var(--kc-card-bg,#fff);color:#27282b;color:var(--kc-card-fg,#27282b);padding:1rem;border-radius:5px;border:1px solid color-mix(in srgb,currentcolor 12%,#0000);overflow:hidden}.card:has(.card__content),.card:has(.card__footer),.card:has(.card__header),.card:has(.card__image){padding:0}.card a{color:currentColor;text-decoration:underline}.card .card__header{display:flex;align-items:stretch;min-height:2.75rem;border-block-end:1px solid color-mix(in srgb,currentColor 12%,#0000)}.card .card__header-title{flex:1;padding:.75rem 1rem;font-weight:600;margin:0}.card .card__header-icon{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1rem;min-width:2.75rem}.card .card__image{display:block}.card .card__image img{display:block;width:100%;height:auto}.card .card__content{padding:1rem}.card .card__footer{display:flex;align-items:stretch;border-block-start:1px solid color-mix(in srgb,currentColor 12%,#0000)}.card .card__footer-item{flex:1 1 0;padding:.75rem;display:inline-flex;align-items:center;justify-content:center;text-align:center}.card .card__footer-item:not(:last-child){border-inline-end:1px solid color-mix(in srgb,currentColor 12%,#0000)}.card.is-default{background-color:#fff;background-color:var(--kc-default-bg,#fff);color:#27282b;color:var(--kc-default-fg,#27282b)}.card.is-primary{background-color:#247d59;background-color:var(--kc-primary-bg,#247d59);color:#fff;color:var(--kc-primary-fg,#fff)}.card.is-warning{background-color:#7a4f10;background-color:var(--kc-warning-bg,#7a4f10);color:#fff;color:var(--kc-warning-fg,#fff)}.card.is-danger{background-color:#8c351a;background-color:var(--kc-danger-bg,#8c351a);color:#fff;color:var(--kc-danger-fg,#fff)}.card.is-success{background-color:#525a22;background-color:var(--kc-success-bg,#525a22);color:#fff;color:var(--kc-success-fg,#fff)}.card.is-default.is-light{background-color:#fff;background-color:var(--kc-default-light-bg,#fff);color:#27282b;color:var(--kc-default-light-fg,#27282b)}.card.is-primary.is-light{background-color:#247d59;background-color:var(--kc-primary-light-bg,#247d59);color:#fff;color:var(--kc-primary-light-fg,#fff)}.card.is-warning.is-light{background-color:#7a4f10;background-color:var(--kc-warning-light-bg,#7a4f10);color:#fff;color:var(--kc-warning-light-fg,#fff)}.card.is-danger.is-light{background-color:#8c351a;background-color:var(--kc-danger-light-bg,#8c351a);color:#fff;color:var(--kc-danger-light-fg,#fff)}.card.is-success.is-light{background-color:#525a22;background-color:var(--kc-success-light-bg,#525a22);color:#fff;color:var(--kc-success-light-fg,#fff)}@media(forced-colors:active){.card :is(.card__footer,.card__header){border-color:CanvasText}.card .card__footer-item:not(:last-child){border-inline-end-color:CanvasText}}

package/dist/module/dropdown.css

@@ -0,0 +1,253 @@
+:root {
+  --kc-bg: #ffffff;
+  --kc-fg: #27282b;
+  --kc-link: #1a6347;
+  --kc-link-hover: #525a22;
+  --kc-link-visited: #8c351a;
+  --kc-border-radius: 5px;
+  --kc-card-bg: #ffffff;
+  --kc-card-fg: #27282b;
+  --kc-focus-ring: #1a6347;
+  --kc-default-bg: #ffffff;
+  --kc-default-fg: #27282b;
+  --kc-primary-bg: #247d59;
+  --kc-primary-fg: #ffffff;
+  --kc-warning-bg: #7a4f10;
+  --kc-warning-fg: #ffffff;
+  --kc-danger-bg: #8c351a;
+  --kc-danger-fg: #ffffff;
+  --kc-success-bg: #525a22;
+  --kc-success-fg: #ffffff;
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    --kc-bg: #ffffff;
+    --kc-fg: #27282b;
+    --kc-link: #1a6347;
+    --kc-link-hover: #525a22;
+    --kc-link-visited: #8c351a;
+    --kc-border-radius: 5px;
+    --kc-card-bg: #ffffff;
+    --kc-card-fg: #27282b;
+    --kc-focus-ring: #1a6347;
+    --kc-default-bg: #ffffff;
+    --kc-default-fg: #27282b;
+    --kc-primary-bg: #247d59;
+    --kc-primary-fg: #ffffff;
+    --kc-warning-bg: #7a4f10;
+    --kc-warning-fg: #ffffff;
+    --kc-danger-bg: #8c351a;
+    --kc-danger-fg: #ffffff;
+    --kc-success-bg: #525a22;
+    --kc-success-fg: #ffffff;
+  }
+}
+:root.theme-light {
+  --kc-bg: #ffffff;
+  --kc-fg: #27282b;
+  --kc-link: #1a6347;
+  --kc-link-hover: #525a22;
+  --kc-link-visited: #8c351a;
+  --kc-border-radius: 5px;
+  --kc-card-bg: #ffffff;
+  --kc-card-fg: #27282b;
+  --kc-focus-ring: #1a6347;
+  --kc-default-bg: #ffffff;
+  --kc-default-fg: #27282b;
+  --kc-primary-bg: #247d59;
+  --kc-primary-fg: #ffffff;
+  --kc-warning-bg: #7a4f10;
+  --kc-warning-fg: #ffffff;
+  --kc-danger-bg: #8c351a;
+  --kc-danger-fg: #ffffff;
+  --kc-success-bg: #525a22;
+  --kc-success-fg: #ffffff;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --kc-bg: #121417;
+    --kc-fg: #e6e8eb;
+    --kc-link: #6bd1a7;
+    --kc-link-hover: #9ce3c2;
+    --kc-link-visited: #c8a8e0;
+    --kc-border-radius: 5px;
+    --kc-card-bg: #1b1e22;
+    --kc-card-fg: #e6e8eb;
+    --kc-focus-ring: #6bd1a7;
+    --kc-modal-backdrop: color-mix(in srgb, #e6e8eb 22%, transparent);
+    --kc-default-bg: #1b1e22;
+    --kc-default-fg: #e6e8eb;
+    --kc-primary-bg: #1f6e51;
+    --kc-primary-fg: #f4f7fb;
+    --kc-warning-bg: #b8991e;
+    --kc-warning-fg: #1b1b13;
+    --kc-danger-bg: #a2481a;
+    --kc-danger-fg: #fff6f0;
+    --kc-success-bg: #5c6529;
+    --kc-success-fg: #f3f6e5;
+  }
+}
+.theme-dark {
+  --kc-bg: #121417;
+  --kc-fg: #e6e8eb;
+  --kc-link: #6bd1a7;
+  --kc-link-hover: #9ce3c2;
+  --kc-link-visited: #c8a8e0;
+  --kc-border-radius: 5px;
+  --kc-card-bg: #1b1e22;
+  --kc-card-fg: #e6e8eb;
+  --kc-focus-ring: #6bd1a7;
+  --kc-modal-backdrop: color-mix(in srgb, #e6e8eb 22%, transparent);
+  --kc-default-bg: #1b1e22;
+  --kc-default-fg: #e6e8eb;
+  --kc-primary-bg: #1f6e51;
+  --kc-primary-fg: #f4f7fb;
+  --kc-warning-bg: #b8991e;
+  --kc-warning-fg: #1b1b13;
+  --kc-danger-bg: #a2481a;
+  --kc-danger-fg: #fff6f0;
+  --kc-success-bg: #5c6529;
+  --kc-success-fg: #f3f6e5;
+}
+
+.dropdown {
+  position: relative;
+  display: inline-block;
+}
+.dropdown .dropdown__toggle {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+.dropdown .dropdown__trigger {
+  display: inline-block;
+  padding: 0.5rem 0.75rem;
+  border-radius: 5px;
+  cursor: pointer;
+  appearance: none;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  border: 0;
+  text-decoration: none;
+  -webkit-user-select: none;
+          user-select: none;
+}
+.dropdown .dropdown__trigger:hover {
+  background: color-mix(in srgb, currentColor 8%, transparent);
+}
+.dropdown .dropdown__toggle:focus-visible + .dropdown__trigger {
+  outline: 2px solid var(--kc-focus-ring, var(--kc-fg, currentColor));
+  outline-offset: 2px;
+}
+.dropdown .dropdown__menu {
+  display: none;
+  position: absolute;
+  inset-block-start: calc(100% + 2px);
+  inset-inline-start: 0;
+  min-width: 12rem;
+  padding: 0.5rem;
+  margin: 0;
+  list-style: none;
+  border-radius: 5px;
+  background-color: var(--kc-bg, #ffffff);
+  background-color: var(--kc-dropdown-bg, var(--kc-bg, #ffffff));
+  color: var(--kc-fg, #27282b);
+  color: var(--kc-dropdown-fg, var(--kc-fg, #27282b));
+  border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
+  box-shadow: 0 4px 12px color-mix(in srgb, currentColor 18%, transparent);
+  z-index: 10;
+}
+.dropdown .dropdown__menu a,
+.dropdown .dropdown__menu button {
+  display: block;
+  padding: 0.5rem 0.75rem;
+  border-radius: 5px;
+  color: inherit;
+  text-decoration: none;
+  background: transparent;
+  border: 0;
+  font: inherit;
+  width: 100%;
+  text-align: start;
+  cursor: pointer;
+}
+.dropdown .dropdown__menu a:hover,
+.dropdown .dropdown__menu button:hover {
+  background: color-mix(in srgb, currentColor 8%, transparent);
+}
+.dropdown .dropdown__menu a:focus-visible,
+.dropdown .dropdown__menu button:focus-visible {
+  outline: 2px solid var(--kc-focus-ring, var(--kc-fg, currentColor));
+  outline-offset: 2px;
+}
+.dropdown.is-right .dropdown__menu {
+  inset-inline-start: auto;
+  inset-inline-end: 0;
+}
+.dropdown.is-up .dropdown__menu {
+  inset-block-start: auto;
+  inset-block-end: calc(100% + 2px);
+}
+.dropdown .dropdown__trigger::after {
+  content: "";
+  display: inline-block;
+  margin-inline-start: 0.5em;
+  width: 0;
+  height: 0;
+  border-style: solid;
+  border-color: currentColor transparent transparent;
+  border-width: 0.3em 0.3em 0;
+  vertical-align: middle;
+}
+.dropdown.is-up .dropdown__trigger::after {
+  border-color: transparent transparent currentColor;
+  border-width: 0 0.3em 0.3em;
+}
+.dropdown:has(.dropdown__toggle:checked) .dropdown__menu {
+  display: block;
+}
+.dropdown:has([aria-expanded=true]) .dropdown__menu, .dropdown.is-active .dropdown__menu {
+  display: block;
+}
+.dropdown.is-hoverable:hover .dropdown__menu, .dropdown.is-hoverable:focus-within .dropdown__menu {
+  display: block;
+}
+.dropdown.is-default .dropdown__menu {
+  background-color: #ffffff;
+  background-color: var(--kc-default-bg, #ffffff);
+  color: #27282b;
+  color: var(--kc-default-fg, #27282b);
+}
+.dropdown.is-primary .dropdown__menu {
+  background-color: #247d59;
+  background-color: var(--kc-primary-bg, #247d59);
+  color: #ffffff;
+  color: var(--kc-primary-fg, #ffffff);
+}
+.dropdown.is-warning .dropdown__menu {
+  background-color: #7a4f10;
+  background-color: var(--kc-warning-bg, #7a4f10);
+  color: #ffffff;
+  color: var(--kc-warning-fg, #ffffff);
+}
+.dropdown.is-danger .dropdown__menu {
+  background-color: #8c351a;
+  background-color: var(--kc-danger-bg, #8c351a);
+  color: #ffffff;
+  color: var(--kc-danger-fg, #ffffff);
+}
+.dropdown.is-success .dropdown__menu {
+  background-color: #525a22;
+  background-color: var(--kc-success-bg, #525a22);
+  color: #ffffff;
+  color: var(--kc-success-fg, #ffffff);
+}

package/dist/module/dropdown.min.css

@@ -0,0 +1 @@
+:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:light){:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}}:root.theme-light{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:dark){:root{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}}.theme-dark{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}.dropdown{position:relative;display:inline-block}.dropdown .dropdown__toggle{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dropdown .dropdown__trigger{display:inline-block;padding:.5rem .75rem;border-radius:5px;cursor:pointer;appearance:none;background:#0000;color:inherit;font:inherit;border:0;text-decoration:none;-webkit-user-select:none;user-select:none}.dropdown .dropdown__trigger:hover{background:color-mix(in srgb,currentColor 8%,#0000)}.dropdown .dropdown__toggle:focus-visible+.dropdown__trigger{outline:2px solid var(--kc-focus-ring,var(--kc-fg,currentColor));outline-offset:2px}.dropdown .dropdown__menu{display:none;position:absolute;inset-block-start:calc(100% + 2px);inset-inline-start:0;min-width:12rem;padding:.5rem;margin:0;list-style:none;border-radius:5px;background-color:var(--kc-bg,#fff);background-color:var(--kc-dropdown-bg,var(--kc-bg,#fff));color:var(--kc-fg,#27282b);color:var(--kc-dropdown-fg,var(--kc-fg,#27282b));border:1px solid color-mix(in srgb,currentcolor 12%,#0000);box-shadow:0 4px 12px color-mix(in srgb,currentColor 18%,#0000);z-index:10}.dropdown .dropdown__menu :is(a,button){display:block;padding:.5rem .75rem;border-radius:5px;color:inherit;text-decoration:none;background:#0000;border:0;font:inherit;width:100%;text-align:start;cursor:pointer}.dropdown .dropdown__menu :is(a:hover,button:hover){background:color-mix(in srgb,currentColor 8%,#0000)}.dropdown .dropdown__menu :is(a:focus-visible,button:focus-visible){outline:2px solid var(--kc-focus-ring,var(--kc-fg,currentColor));outline-offset:2px}.dropdown.is-right .dropdown__menu{inset-inline-start:auto;inset-inline-end:0}.dropdown.is-up .dropdown__menu{inset-block-start:auto;inset-block-end:calc(100% + 2px)}.dropdown .dropdown__trigger:after{content:"";display:inline-block;margin-inline-start:.5em;width:0;height:0;border-color:currentcolor #0000 #0000;border-style:solid;border-width:.3em .3em 0;vertical-align:middle}.dropdown.is-up .dropdown__trigger:after{border-color:#0000 #0000 currentColor;border-width:0 .3em .3em}.dropdown:has(.dropdown__toggle:checked) .dropdown__menu,:is(.dropdown.is-active,.dropdown:has([aria-expanded=true])) .dropdown__menu,:is(.dropdown.is-hoverable:focus-within,.dropdown.is-hoverable:hover) .dropdown__menu{display:block}.dropdown.is-default .dropdown__menu{background-color:#fff;background-color:var(--kc-default-bg,#fff);color:#27282b;color:var(--kc-default-fg,#27282b)}.dropdown.is-primary .dropdown__menu{background-color:#247d59;background-color:var(--kc-primary-bg,#247d59);color:#fff;color:var(--kc-primary-fg,#fff)}.dropdown.is-warning .dropdown__menu{background-color:#7a4f10;background-color:var(--kc-warning-bg,#7a4f10);color:#fff;color:var(--kc-warning-fg,#fff)}.dropdown.is-danger .dropdown__menu{background-color:#8c351a;background-color:var(--kc-danger-bg,#8c351a);color:#fff;color:var(--kc-danger-fg,#fff)}.dropdown.is-success .dropdown__menu{background-color:#525a22;background-color:var(--kc-success-bg,#525a22);color:#fff;color:var(--kc-success-fg,#fff)}

package/dist/module/navbar.css

@@ -198,7 +198,7 @@
 .navbar .navbar__item.has-dropdown:has([aria-expanded=true]) .navbar__dropdown {
   display: block;
 }
-.navbar .navbar__item.has-dropdown.hoverable:hover .navbar__dropdown, .navbar .navbar__item.has-dropdown.hoverable:focus-within .navbar__dropdown {
+.navbar .navbar__item.has-dropdown.is-hoverable:hover .navbar__dropdown, .navbar .navbar__item.has-dropdown.is-hoverable:focus-within .navbar__dropdown {
   display: block;
 }
 .navbar .navbar__toggle {

package/dist/module/navbar.min.css

@@ -1 +1 @@
-:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:light){:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}}:root.theme-light{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:dark){:root{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}}.theme-dark{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}.navbar{background-color:var(--kc-bg,#fff);background-color:var(--kc-navbar-bg,var(--kc-bg,#fff));color:var(--kc-fg,#27282b);color:var(--kc-navbar-fg,var(--kc-fg,#27282b));display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;border-radius:5px}.navbar :is(.navbar__brand,.navbar__link){display:inline-block;padding:.5rem .75rem;border-radius:5px;text-decoration:none;color:inherit}.navbar :is(.navbar__brand:focus-visible,.navbar__link:focus-visible){outline:2px solid var(--kc-focus-ring,currentColor);outline-offset:2px}.navbar :is(.navbar__brand:hover,.navbar__link:hover){background:color-mix(in srgb,currentColor 8%,#0000)}.navbar .navbar__brand{font-weight:600;flex:0 0 auto}.navbar .navbar__menu{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:1rem;flex:1 1 auto}.navbar .navbar__item{position:relative}.navbar .navbar__link{background:#0000;border:0;min-width:0;font:inherit;cursor:pointer}.navbar .navbar__item.has-dropdown .navbar__dropdown-toggle{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.navbar .navbar__item.has-dropdown .navbar__dropdown{display:none;position:absolute;inset-block-start:100%;inset-inline-start:0;min-width:12rem;padding:.5rem;margin:0;list-style:none;border-radius:5px;background-color:var(--kc-bg,#fff);background-color:var(--kc-navbar-dropdown-bg,var(--kc-bg,#fff));color:var(--kc-fg,#27282b);color:var(--kc-navbar-dropdown-fg,var(--kc-fg,#27282b));border:1px solid color-mix(in srgb,currentcolor 12%,#0000);box-shadow:0 4px 12px color-mix(in srgb,currentColor 18%,#0000);z-index:10}.navbar .navbar__item.has-dropdown:has(.navbar__dropdown-toggle:checked) .navbar__dropdown,.navbar .navbar__item.has-dropdown:has([aria-expanded=true]) .navbar__dropdown,.navbar :is(.navbar__item.has-dropdown.hoverable:focus-within,.navbar__item.has-dropdown.hoverable:hover) .navbar__dropdown{display:block}.navbar .navbar__toggle{display:none;flex:0 0 auto;margin-inline-start:auto}@media screen and (max-width:767px){.navbar{flex-wrap:wrap}.navbar .navbar__toggle{display:inline-block}.navbar .navbar__menu{flex-direction:column;flex-basis:100%;gap:.5rem}.navbar .navbar__item.has-dropdown .navbar__dropdown{position:static;box-shadow:none;border:0}}.navbar.is-default{background-color:#fff;background-color:var(--kc-default-bg,#fff);color:#27282b;color:var(--kc-default-fg,#27282b)}.navbar.is-primary{background-color:#247d59;background-color:var(--kc-primary-bg,#247d59);color:#fff;color:var(--kc-primary-fg,#fff)}.navbar.is-warning{background-color:#7a4f10;background-color:var(--kc-warning-bg,#7a4f10);color:#fff;color:var(--kc-warning-fg,#fff)}.navbar.is-danger{background-color:#8c351a;background-color:var(--kc-danger-bg,#8c351a);color:#fff;color:var(--kc-danger-fg,#fff)}.navbar.is-success{background-color:#525a22;background-color:var(--kc-success-bg,#525a22);color:#fff;color:var(--kc-success-fg,#fff)}
+:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:light){:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}}:root.theme-light{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:dark){:root{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}}.theme-dark{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}.navbar{background-color:var(--kc-bg,#fff);background-color:var(--kc-navbar-bg,var(--kc-bg,#fff));color:var(--kc-fg,#27282b);color:var(--kc-navbar-fg,var(--kc-fg,#27282b));display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;border-radius:5px}.navbar :is(.navbar__brand,.navbar__link){display:inline-block;padding:.5rem .75rem;border-radius:5px;text-decoration:none;color:inherit}.navbar :is(.navbar__brand:focus-visible,.navbar__link:focus-visible){outline:2px solid var(--kc-focus-ring,currentColor);outline-offset:2px}.navbar :is(.navbar__brand:hover,.navbar__link:hover){background:color-mix(in srgb,currentColor 8%,#0000)}.navbar .navbar__brand{font-weight:600;flex:0 0 auto}.navbar .navbar__menu{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:1rem;flex:1 1 auto}.navbar .navbar__item{position:relative}.navbar .navbar__link{background:#0000;border:0;min-width:0;font:inherit;cursor:pointer}.navbar .navbar__item.has-dropdown .navbar__dropdown-toggle{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.navbar .navbar__item.has-dropdown .navbar__dropdown{display:none;position:absolute;inset-block-start:100%;inset-inline-start:0;min-width:12rem;padding:.5rem;margin:0;list-style:none;border-radius:5px;background-color:var(--kc-bg,#fff);background-color:var(--kc-navbar-dropdown-bg,var(--kc-bg,#fff));color:var(--kc-fg,#27282b);color:var(--kc-navbar-dropdown-fg,var(--kc-fg,#27282b));border:1px solid color-mix(in srgb,currentcolor 12%,#0000);box-shadow:0 4px 12px color-mix(in srgb,currentColor 18%,#0000);z-index:10}.navbar .navbar__item.has-dropdown:has(.navbar__dropdown-toggle:checked) .navbar__dropdown,.navbar .navbar__item.has-dropdown:has([aria-expanded=true]) .navbar__dropdown,.navbar :is(.navbar__item.has-dropdown.is-hoverable:focus-within,.navbar__item.has-dropdown.is-hoverable:hover) .navbar__dropdown{display:block}.navbar .navbar__toggle{display:none;flex:0 0 auto;margin-inline-start:auto}@media screen and (max-width:767px){.navbar{flex-wrap:wrap}.navbar .navbar__toggle{display:inline-block}.navbar .navbar__menu{flex-direction:column;flex-basis:100%;gap:.5rem}.navbar .navbar__item.has-dropdown .navbar__dropdown{position:static;box-shadow:none;border:0}}.navbar.is-default{background-color:#fff;background-color:var(--kc-default-bg,#fff);color:#27282b;color:var(--kc-default-fg,#27282b)}.navbar.is-primary{background-color:#247d59;background-color:var(--kc-primary-bg,#247d59);color:#fff;color:var(--kc-primary-fg,#fff)}.navbar.is-warning{background-color:#7a4f10;background-color:var(--kc-warning-bg,#7a4f10);color:#fff;color:var(--kc-warning-fg,#fff)}.navbar.is-danger{background-color:#8c351a;background-color:var(--kc-danger-bg,#8c351a);color:#fff;color:var(--kc-danger-fg,#fff)}.navbar.is-success{background-color:#525a22;background-color:var(--kc-success-bg,#525a22);color:#fff;color:var(--kc-success-fg,#fff)}

package/dist/module/pagination.css

@@ -0,0 +1,301 @@
+:root {
+  --kc-bg: #ffffff;
+  --kc-fg: #27282b;
+  --kc-link: #1a6347;
+  --kc-link-hover: #525a22;
+  --kc-link-visited: #8c351a;
+  --kc-border-radius: 5px;
+  --kc-card-bg: #ffffff;
+  --kc-card-fg: #27282b;
+  --kc-focus-ring: #1a6347;
+  --kc-default-bg: #ffffff;
+  --kc-default-fg: #27282b;
+  --kc-primary-bg: #247d59;
+  --kc-primary-fg: #ffffff;
+  --kc-warning-bg: #7a4f10;
+  --kc-warning-fg: #ffffff;
+  --kc-danger-bg: #8c351a;
+  --kc-danger-fg: #ffffff;
+  --kc-success-bg: #525a22;
+  --kc-success-fg: #ffffff;
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    --kc-bg: #ffffff;
+    --kc-fg: #27282b;
+    --kc-link: #1a6347;
+    --kc-link-hover: #525a22;
+    --kc-link-visited: #8c351a;
+    --kc-border-radius: 5px;
+    --kc-card-bg: #ffffff;
+    --kc-card-fg: #27282b;
+    --kc-focus-ring: #1a6347;
+    --kc-default-bg: #ffffff;
+    --kc-default-fg: #27282b;
+    --kc-primary-bg: #247d59;
+    --kc-primary-fg: #ffffff;
+    --kc-warning-bg: #7a4f10;
+    --kc-warning-fg: #ffffff;
+    --kc-danger-bg: #8c351a;
+    --kc-danger-fg: #ffffff;
+    --kc-success-bg: #525a22;
+    --kc-success-fg: #ffffff;
+  }
+}
+:root.theme-light {
+  --kc-bg: #ffffff;
+  --kc-fg: #27282b;
+  --kc-link: #1a6347;
+  --kc-link-hover: #525a22;
+  --kc-link-visited: #8c351a;
+  --kc-border-radius: 5px;
+  --kc-card-bg: #ffffff;
+  --kc-card-fg: #27282b;
+  --kc-focus-ring: #1a6347;
+  --kc-default-bg: #ffffff;
+  --kc-default-fg: #27282b;
+  --kc-primary-bg: #247d59;
+  --kc-primary-fg: #ffffff;
+  --kc-warning-bg: #7a4f10;
+  --kc-warning-fg: #ffffff;
+  --kc-danger-bg: #8c351a;
+  --kc-danger-fg: #ffffff;
+  --kc-success-bg: #525a22;
+  --kc-success-fg: #ffffff;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --kc-bg: #121417;
+    --kc-fg: #e6e8eb;
+    --kc-link: #6bd1a7;
+    --kc-link-hover: #9ce3c2;
+    --kc-link-visited: #c8a8e0;
+    --kc-border-radius: 5px;
+    --kc-card-bg: #1b1e22;
+    --kc-card-fg: #e6e8eb;
+    --kc-focus-ring: #6bd1a7;
+    --kc-modal-backdrop: color-mix(in srgb, #e6e8eb 22%, transparent);
+    --kc-default-bg: #1b1e22;
+    --kc-default-fg: #e6e8eb;
+    --kc-primary-bg: #1f6e51;
+    --kc-primary-fg: #f4f7fb;
+    --kc-warning-bg: #b8991e;
+    --kc-warning-fg: #1b1b13;
+    --kc-danger-bg: #a2481a;
+    --kc-danger-fg: #fff6f0;
+    --kc-success-bg: #5c6529;
+    --kc-success-fg: #f3f6e5;
+  }
+}
+.theme-dark {
+  --kc-bg: #121417;
+  --kc-fg: #e6e8eb;
+  --kc-link: #6bd1a7;
+  --kc-link-hover: #9ce3c2;
+  --kc-link-visited: #c8a8e0;
+  --kc-border-radius: 5px;
+  --kc-card-bg: #1b1e22;
+  --kc-card-fg: #e6e8eb;
+  --kc-focus-ring: #6bd1a7;
+  --kc-modal-backdrop: color-mix(in srgb, #e6e8eb 22%, transparent);
+  --kc-default-bg: #1b1e22;
+  --kc-default-fg: #e6e8eb;
+  --kc-primary-bg: #1f6e51;
+  --kc-primary-fg: #f4f7fb;
+  --kc-warning-bg: #b8991e;
+  --kc-warning-fg: #1b1b13;
+  --kc-danger-bg: #a2481a;
+  --kc-danger-fg: #fff6f0;
+  --kc-success-bg: #5c6529;
+  --kc-success-fg: #f3f6e5;
+}
+
+.pagination {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: inherit;
+  line-height: 1;
+}
+.pagination.pagination .pagination__list, .pagination.pagination > ol, .pagination.pagination > ul {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: stretch;
+  gap: 0.5rem;
+  margin-block: 0;
+  margin-inline: 0;
+  padding: 0;
+  list-style: none;
+  line-height: 1;
+}
+.pagination.pagination .pagination__list > li, .pagination.pagination > ol > li, .pagination.pagination > ul > li {
+  display: flex;
+  align-items: stretch;
+  margin-block: 0;
+  margin-inline: 0;
+}
+.pagination .pagination__link,
+.pagination .pagination__previous,
+.pagination .pagination__next,
+.pagination .pagination__ellipsis {
+  box-sizing: border-box;
+  display: inline-grid;
+  grid-auto-flow: column;
+  place-items: center;
+  gap: 0.5rem;
+  min-width: 2.75rem;
+  height: 2.75rem;
+  padding: 0 0.5rem;
+  border-radius: 5px;
+  line-height: 1;
+  font-variant-numeric: tabular-nums;
+  text-align: center;
+  vertical-align: middle;
+  white-space: nowrap;
+}
+.pagination .pagination__link {
+  border: 1px solid color-mix(in srgb, var(--kc-fg, currentColor) 35%, transparent);
+  background: transparent;
+  color: inherit;
+  text-decoration: none;
+  cursor: pointer;
+  -webkit-user-select: none;
+          user-select: none;
+}
+.pagination .pagination__link:hover {
+  background: color-mix(in srgb, currentColor 8%, transparent);
+}
+.pagination .pagination__link:focus-visible {
+  outline: 2px solid var(--kc-focus-ring, var(--kc-fg, currentColor));
+  outline-offset: 2px;
+}
+.pagination .pagination__previous,
+.pagination .pagination__next {
+  padding-inline-start: 1rem;
+  padding-inline-end: 1rem;
+  background: transparent;
+  color: inherit;
+  text-decoration: none;
+  cursor: pointer;
+  -webkit-user-select: none;
+          user-select: none;
+  border: 1px solid color-mix(in srgb, var(--kc-fg, currentColor) 35%, transparent);
+}
+.pagination .pagination__previous:hover,
+.pagination .pagination__next:hover {
+  background: color-mix(in srgb, currentColor 8%, transparent);
+}
+.pagination .pagination__previous:focus-visible,
+.pagination .pagination__next:focus-visible {
+  outline: 2px solid var(--kc-focus-ring, var(--kc-fg, currentColor));
+  outline-offset: 2px;
+}
+.pagination .pagination__previous::before,
+.pagination .pagination__next::after {
+  content: "";
+  width: 0.5em;
+  height: 0.5em;
+  border-block-start: 0.125em solid currentColor;
+  border-inline-end: 0.125em solid currentColor;
+}
+.pagination .pagination__previous::before {
+  transform: rotate(-135deg);
+}
+.pagination .pagination__next::after {
+  transform: rotate(45deg);
+}
+.pagination .pagination__link[aria-current=page],
+.pagination .pagination__link.is-current {
+  background-color: #247d59;
+  background-color: var(--kc-pagination-current-bg, #247d59);
+  color: #ffffff;
+  color: var(--kc-pagination-current-fg, #ffffff);
+  border-color: transparent;
+  font-weight: 600;
+}
+.pagination .pagination__link[aria-current=page]:hover,
+.pagination .pagination__link.is-current:hover {
+  background: var(--kc-pagination-current-bg, #247d59);
+}
+.pagination .pagination__link[disabled],
+.pagination .pagination__link[aria-disabled=true],
+.pagination .pagination__link.is-disabled,
+.pagination .pagination__previous[disabled],
+.pagination .pagination__previous[aria-disabled=true],
+.pagination .pagination__previous.is-disabled,
+.pagination .pagination__next[disabled],
+.pagination .pagination__next[aria-disabled=true],
+.pagination .pagination__next.is-disabled {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+.pagination .pagination__link[disabled]:hover,
+.pagination .pagination__link[aria-disabled=true]:hover,
+.pagination .pagination__link.is-disabled:hover,
+.pagination .pagination__previous[disabled]:hover,
+.pagination .pagination__previous[aria-disabled=true]:hover,
+.pagination .pagination__previous.is-disabled:hover,
+.pagination .pagination__next[disabled]:hover,
+.pagination .pagination__next[aria-disabled=true]:hover,
+.pagination .pagination__next.is-disabled:hover {
+  background: transparent;
+}
+.pagination .pagination__ellipsis {
+  border: 1px solid color-mix(in srgb, var(--kc-fg, currentColor) 15%, transparent);
+  color: color-mix(in srgb, var(--kc-fg, currentColor) 50%, transparent);
+  -webkit-user-select: none;
+          user-select: none;
+}
+.pagination.is-rounded .pagination__link,
+.pagination.is-rounded .pagination__previous,
+.pagination.is-rounded .pagination__next,
+.pagination.is-rounded .pagination__ellipsis {
+  border-radius: 999px;
+}
+.pagination.is-centered {
+  justify-content: center;
+}
+.pagination.is-right {
+  justify-content: flex-end;
+}
+.pagination.is-small {
+  font-size: 0.75rem;
+}
+.pagination.is-small .pagination__link,
+.pagination.is-small .pagination__previous,
+.pagination.is-small .pagination__next,
+.pagination.is-small .pagination__ellipsis {
+  min-width: 2rem;
+  min-height: 2rem;
+}
+.pagination.is-large {
+  font-size: 1.25rem;
+}
+.pagination.is-large .pagination__link,
+.pagination.is-large .pagination__previous,
+.pagination.is-large .pagination__next,
+.pagination.is-large .pagination__ellipsis {
+  min-width: 3rem;
+  min-height: 3rem;
+}
+
+@media (forced-colors: active) {
+  .pagination .pagination__link,
+  .pagination .pagination__previous,
+  .pagination .pagination__next,
+  .pagination .pagination__ellipsis {
+    border-color: CanvasText;
+  }
+  .pagination .pagination__ellipsis {
+    color: CanvasText;
+  }
+  .pagination .pagination__link[aria-current=page],
+  .pagination .pagination__link.is-current {
+    background: Highlight;
+    color: HighlightText;
+    border-color: Highlight;
+  }
+}

package/dist/module/pagination.min.css

@@ -0,0 +1 @@
+:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:light){:root{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}}:root.theme-light{--kc-bg:#fff;--kc-fg:#27282b;--kc-link:#1a6347;--kc-link-hover:#525a22;--kc-link-visited:#8c351a;--kc-border-radius:5px;--kc-card-bg:#fff;--kc-card-fg:#27282b;--kc-focus-ring:#1a6347;--kc-default-bg:#fff;--kc-default-fg:#27282b;--kc-primary-bg:#247d59;--kc-primary-fg:#fff;--kc-warning-bg:#7a4f10;--kc-warning-fg:#fff;--kc-danger-bg:#8c351a;--kc-danger-fg:#fff;--kc-success-bg:#525a22;--kc-success-fg:#fff}@media(prefers-color-scheme:dark){:root{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}}.theme-dark{--kc-bg:#121417;--kc-fg:#e6e8eb;--kc-link:#6bd1a7;--kc-link-hover:#9ce3c2;--kc-link-visited:#c8a8e0;--kc-border-radius:5px;--kc-card-bg:#1b1e22;--kc-card-fg:#e6e8eb;--kc-focus-ring:#6bd1a7;--kc-modal-backdrop:color-mix(in srgb,#e6e8eb 22%,#0000);--kc-default-bg:#1b1e22;--kc-default-fg:#e6e8eb;--kc-primary-bg:#1f6e51;--kc-primary-fg:#f4f7fb;--kc-warning-bg:#b8991e;--kc-warning-fg:#1b1b13;--kc-danger-bg:#a2481a;--kc-danger-fg:#fff6f0;--kc-success-bg:#5c6529;--kc-success-fg:#f3f6e5}.pagination{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:inherit;line-height:1}.pagination.pagination .pagination__list,.pagination.pagination>ol,.pagination.pagination>ul{display:flex;flex-wrap:wrap;align-items:stretch;gap:.5rem;margin-block:0;margin-inline:0;padding:0;list-style:none;line-height:1}.pagination.pagination .pagination__list>li,.pagination.pagination>ol>li,.pagination.pagination>ul>li{display:flex;align-items:stretch;margin-block:0;margin-inline:0}.pagination :is(.pagination__ellipsis,.pagination__link,.pagination__next,.pagination__previous){box-sizing:border-box;display:inline-grid;grid-auto-flow:column;place-items:center;gap:.5rem;min-width:2.75rem;height:2.75rem;padding:0 .5rem;border-radius:5px;line-height:1;font-variant-numeric:tabular-nums;text-align:center;vertical-align:middle;white-space:nowrap}.pagination .pagination__link{border:1px solid color-mix(in srgb,var(--kc-fg,currentcolor) 35%,#0000);background:#0000;color:inherit;text-decoration:none;cursor:pointer;-webkit-user-select:none;user-select:none}.pagination .pagination__link:hover{background:color-mix(in srgb,currentColor 8%,#0000)}.pagination .pagination__link:focus-visible{outline:2px solid var(--kc-focus-ring,var(--kc-fg,currentColor));outline-offset:2px}.pagination :is(.pagination__next,.pagination__previous){padding-inline-start:1rem;padding-inline-end:1rem;background:#0000;color:inherit;text-decoration:none;cursor:pointer;-webkit-user-select:none;user-select:none;border:1px solid color-mix(in srgb,var(--kc-fg,currentcolor) 35%,#0000)}.pagination :is(.pagination__next:hover,.pagination__previous:hover){background:color-mix(in srgb,currentColor 8%,#0000)}.pagination :is(.pagination__next:focus-visible,.pagination__previous:focus-visible){outline:2px solid var(--kc-focus-ring,var(--kc-fg,currentColor));outline-offset:2px}.pagination .pagination__next:after,.pagination .pagination__previous:before{content:"";width:.5em;height:.5em;border-block-start:.125em solid currentColor;border-inline-end:.125em solid currentColor}.pagination .pagination__previous:before{transform:rotate(-135deg)}.pagination .pagination__next:after{transform:rotate(45deg)}.pagination :is(.pagination__link.is-current,.pagination__link[aria-current=page]){background-color:#247d59;background-color:var(--kc-pagination-current-bg,#247d59);color:#fff;color:var(--kc-pagination-current-fg,#fff);border-color:#0000;font-weight:600}.pagination :is(.pagination__link.is-current:hover,.pagination__link[aria-current=page]:hover){background:var(--kc-pagination-current-bg,#247d59)}.pagination :is(.pagination__link.is-disabled,.pagination__link[aria-disabled=true],.pagination__link[disabled],.pagination__next.is-disabled,.pagination__next[aria-disabled=true],.pagination__next[disabled],.pagination__previous.is-disabled,.pagination__previous[aria-disabled=true],.pagination__previous[disabled]){cursor:not-allowed;opacity:.6}.pagination :is(.pagination__link.is-disabled:hover,.pagination__link[aria-disabled=true]:hover,.pagination__link[disabled]:hover,.pagination__next.is-disabled:hover,.pagination__next[aria-disabled=true]:hover,.pagination__next[disabled]:hover,.pagination__previous.is-disabled:hover,.pagination__previous[aria-disabled=true]:hover,.pagination__previous[disabled]:hover){background:#0000}.pagination .pagination__ellipsis{border:1px solid color-mix(in srgb,var(--kc-fg,currentcolor) 15%,#0000);color:color-mix(in srgb,var(--kc-fg,currentColor) 50%,#0000);-webkit-user-select:none;user-select:none}.pagination.is-rounded :is(.pagination__ellipsis,.pagination__link,.pagination__next,.pagination__previous){border-radius:999px}.pagination.is-centered{justify-content:center}.pagination.is-right{justify-content:flex-end}.pagination.is-small{font-size:.75rem}.pagination.is-small :is(.pagination__ellipsis,.pagination__link,.pagination__next,.pagination__previous){min-width:2rem;min-height:2rem}.pagination.is-large{font-size:1.25rem}.pagination.is-large :is(.pagination__ellipsis,.pagination__link,.pagination__next,.pagination__previous){min-width:3rem;min-height:3rem}@media(forced-colors:active){.pagination :is(.pagination__ellipsis,.pagination__link,.pagination__next,.pagination__previous){border-color:CanvasText}.pagination .pagination__ellipsis{color:initial}.pagination :is(.pagination__link.is-current,.pagination__link[aria-current=page]){background:Highlight;color:HighlightText;border-color:Highlight}}