@public-ui/themes 1.7.13 → 1.7.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +5 -5
- package/dist/index.mjs +5 -5
- package/package.json +3 -3
package/dist/index.cjs
CHANGED
|
@@ -1955,7 +1955,7 @@ const BMF = KoliBri.createTheme("bmf", {
|
|
|
1955
1955
|
overflow-x: auto;
|
|
1956
1956
|
overflow-y: hidden;
|
|
1957
1957
|
}
|
|
1958
|
-
.table:has(
|
|
1958
|
+
.table:has(.focus-element:focus) {
|
|
1959
1959
|
outline-color: var(--color-ocean);
|
|
1960
1960
|
outline-style: solid;
|
|
1961
1961
|
outline-width: 3px;
|
|
@@ -10234,7 +10234,7 @@ const spinCss = css_248z$1H;
|
|
|
10234
10234
|
var css_248z$1G = ".popover {\n background: #fff;\n}";
|
|
10235
10235
|
const splitButtonCss = css_248z$1G;
|
|
10236
10236
|
|
|
10237
|
-
var css_248z$1F = ":host * {\n hyphens: var(--hyphens);\n font-family: var(--font-family);\n line-height: var(--line-height);\n word-break: break-word;\n}\n\n:host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5rem;\n}\n\nth {\n font-weight: normal;\n color: var(--color-primary);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: calc(var(--border-width) * 2);\n border-style: solid;\n border-color: var(--color-primary-variant);\n}\n\n.table {\n padding: 0.5rem;\n}\n\n.table:has(
|
|
10237
|
+
var css_248z$1F = ":host * {\n hyphens: var(--hyphens);\n font-family: var(--font-family);\n line-height: var(--line-height);\n word-break: break-word;\n}\n\n:host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5rem;\n}\n\nth {\n font-weight: normal;\n color: var(--color-primary);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: calc(var(--border-width) * 2);\n border-style: solid;\n border-color: var(--color-primary-variant);\n}\n\n.table {\n padding: 0.5rem;\n}\n\n.table:has(.focus-element:focus) {\n outline-color: var(--color-primary-variant);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 3px;\n transition: outline-offset 0.2s linear;\n}\n\ntable {\n width: 100%;\n border-spacing: 0;\n}\n\ntable,\n:host table thead tr:last-child th,\n:host table thead tr:last-child td {\n border-width: 0;\n border-bottom-width: calc(var(--border-width) * 2);\n border-style: solid;\n border-color: var(--color-primary-variant);\n}\n\nth {\n background-color: var(--color-light);\n}\n\nth div {\n width: 100%;\n display: flex;\n gap: 0.5rem;\n grid-template-columns: 1fr auto;\n align-items: center;\n}\n\ntr:nth-child(even) {\n background-color: var(--color-mute);\n}\n\nth,\ntd {\n padding: 0.5rem;\n}\n\nth[aria-sort=ascending],\nth[aria-sort=descending] {\n font-weight: 700;\n}\n\n@media (min-width: 1024px) {\n div.pagination kol-pagination {\n display: flex;\n align-items: center;\n }\n}";
|
|
10238
10238
|
const tableCss = css_248z$1F;
|
|
10239
10239
|
|
|
10240
10240
|
var css_248z$1E = "button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n:host kol-button-group-wc {\n display: inline-flex;\n gap: 2rem;\n flex-wrap: wrap;\n}\n\nbutton {\n box-sizing: border-box;\n background-color: transparent;\n border: 0;\n border-radius: var(--border-radius);\n font-style: normal;\n font-weight: 700;\n font-size: 18px;\n line-height: 22px;\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n color: var(--color-subtle);\n padding: 0;\n}\n\nbutton:hover {\n color: var(--color-primary);\n}\n\nbutton.primary,\nbutton.selected {\n color: var(--color-primary);\n}\n\nbutton:not(.selected) kol-span-wc > span {\n padding-bottom: 0.25em;\n}\n\nbutton.selected kol-span-wc > span {\n border-bottom: 0.25em solid;\n}\n\nbutton kol-span-wc > span {\n gap: 0.5rem;\n}\n\n:host > div > div {\n padding: 0.25em 0;\n}\n\ndiv[role=tabpanel] {\n height: 100%;\n}\n\ndiv.grid {\n height: 100%;\n}\n\n:host > .tabs-align-right {\n display: grid;\n grid-template-columns: 1fr auto;\n}\n\n:host > .tabs-align-right kol-button-group-wc {\n display: grid;\n order: 2;\n}\n\n:host > .tabs-align-left {\n display: grid;\n grid-template-columns: auto 1fr;\n}\n\n:host > .tabs-align-left kol-button-group-wc {\n display: grid;\n order: 0;\n}\n\n:host > .tabs-align-bottom {\n display: grid;\n grid-template-rows: 1fr auto;\n}\n\n:host > .tabs-align-bottom kol-button-group-wc {\n order: 2;\n}\n\n:host > .tabs-align-bottom kol-button-group-wc > div {\n display: flex;\n}\n\n:host > .tabs-align-bottom > kol-button-group-wc > div > div:first-child {\n margin: 0px 1rem 0px 0px;\n}\n\n:host > .tabs-align-bottom > kol-button-group-wc > div > div {\n margin: 0px 1rem;\n}\n\n:host > .tabs-align-top {\n display: grid;\n grid-template-rows: auto 1fr;\n}\n\n:host > .tabs-align-top kol-button-group-wc {\n order: 0;\n}\n\n:host > .tabs-align-top kol-button-group-wc > div {\n display: flex;\n}\n\n:host > .tabs-align-top > kol-button-group-wc > div > div:first-child {\n margin: 0px 1rem 0px 0px;\n}\n\n:host > .tabs-align-top > kol-button-group-wc > div > div {\n margin: 0px 1rem;\n}\n\n:host > div {\n display: grid;\n}\n\n:host > div.tabs-align-left {\n grid-template-columns: auto 1fr;\n}\n\n:host > div.tabs-align-right {\n grid-template-columns: 1fr auto;\n}\n\n:host > .tabs-align-left kol-button-group-wc,\n:host > .tabs-align-top kol-button-group-wc {\n order: 0;\n}\n\n:host > .tabs-align-bottom kol-button-group-wc,\n:host > .tabs-align-right kol-button-group-wc {\n order: 1;\n}\n\n:host > .tabs-align-left kol-button-group-wc,\n:host > .tabs-align-right kol-button-group-wc {\n gap: inherit;\n}\n\n:host > div.tabs-align-left kol-button-group-wc > div,\n:host > div.tabs-align-left kol-button-group-wc > div > div,\n:host > div.tabs-align-right kol-button-group-wc > div,\n:host > div.tabs-align-right kol-button-group-wc > div > div {\n display: grid;\n}\n\n:host > div.tabs-align-left kol-button-group-wc > div > div kol-button-wc,\n:host > div.tabs-align-right kol-button-group-wc > div > div kol-button-wc {\n width: 100%;\n}\n\n:host > div.tabs-align-bottom kol-button-group-wc div,\n:host > div.tabs-align-top kol-button-group-wc div {\n display: flex;\n flex-wrap: wrap;\n}\n\n:host kol-button-group-wc button {\n border: none;\n}";
|
|
@@ -10347,7 +10347,7 @@ var css_248z$19 = "kol-link-wc > a > kol-span-wc {\n border-radius: 0;\n borde
|
|
|
10347
10347
|
|
|
10348
10348
|
var css_248z$18 = ".popover {\n background: #fff;\n}";
|
|
10349
10349
|
|
|
10350
|
-
var css_248z$17 = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5em;\n}\n\nth {\n font-weight: normal;\n color: var(--color-midnight);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(
|
|
10350
|
+
var css_248z$17 = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5em;\n}\n\nth {\n font-weight: normal;\n color: var(--color-midnight);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(.focus-element:focus) {\n outline-color: var(--color-blue);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 2px;\n}\n\ntable {\n width: 100%;\n border-spacing: 0;\n}\n\ntable,\n:host table thead tr:last-child th,\n:host table thead tr:last-child td {\n border-width: 0;\n border-bottom-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\nth {\n background-color: var(--color-white);\n}\n\nth div {\n width: 100%;\n display: flex;\n gap: 0.5em;\n grid-template-columns: 1fr auto;\n align-items: center;\n}\n\ntbody tr:nth-child(odd) {\n background-color: var(--color-grey-10);\n}\n\nth,\ntd {\n padding: 0.5em;\n}\n\nth[aria-sort=ascending],\nth[aria-sort=descending] {\n font-weight: 700;\n}\n\n@media (min-width: 1024px) {\n :host > div:last-child,\n :host > div:last-child > div:last-child {\n grid-auto-flow: column;\n }\n :host > div:last-child kol-pagination {\n display: flex;\n gap: 1rem;\n }\n}";
|
|
10351
10351
|
|
|
10352
10352
|
var css_248z$16 = "kol-input {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n}\n\ninput,\nselect,\ntextarea {\n border: none;\n outline: none;\n}\n\ninput,\nselect:not([multiple]) {\n height: 40px !important;\n min-height: 40px !important;\n}\n\nlabel {\n font-weight: var(--font-weight-bold);\n order: 1;\n}\n\n.hint {\n font-size: 0.875rem;\n order: 2;\n}\n\nkol-alert {\n color: var(--color-red);\n font-size: 0.875em;\n margin-left: calc(-1 * var(--spacing-2xs));\n order: 3;\n}\n\n.input {\n min-height: 44px !important;\n border: 1px solid var(--color-grey-75);\n color: var(--color-grey);\n order: 4;\n align-items: center;\n padding: 1px 0.5em;\n}\n\n.counter {\n order: 5;\n}\n\ninput::placeholder,\ntextarea::placeholder {\n color: var(--color-grey-50);\n}\n\n.input:focus-within {\n box-shadow: inset 1px 1px var(--color-blue), inset -1px -1px var(--color-blue);\n outline: none;\n}\n\n.input:focus-within,\n.input:hover {\n border-color: var(--color-blue) !important;\n}\n\n.error .input {\n border-color: var(--color-red);\n}";
|
|
10353
10353
|
|
|
@@ -10453,7 +10453,7 @@ var css_248z$E = "kol-link-wc > a > kol-span-wc {\n border-radius: 4px;\n gap:
|
|
|
10453
10453
|
|
|
10454
10454
|
var css_248z$D = ".popover {\n background: #fff;\n}";
|
|
10455
10455
|
|
|
10456
|
-
var css_248z$C = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5em;\n}\n\nth {\n font-weight: normal;\n color: var(--color-midnight);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(
|
|
10456
|
+
var css_248z$C = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5em;\n}\n\nth {\n font-weight: normal;\n color: var(--color-midnight);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(.focus-element:focus) {\n outline-color: var(--color-blue);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 2px;\n}\n\ntable {\n width: 100%;\n border-spacing: 0;\n}\n\ntable,\n:host table thead tr:last-child th,\n:host table thead tr:last-child td {\n border-width: 0;\n border-bottom-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\nth {\n background-color: var(--color-white);\n}\n\nth div {\n width: 100%;\n display: flex;\n gap: 0.5em;\n grid-template-columns: 1fr auto;\n align-items: center;\n}\n\ntbody tr:nth-child(odd) {\n background-color: var(--color-grey-10);\n}\n\nth,\ntd {\n padding: 0.5em;\n}\n\nth[aria-sort=ascending],\nth[aria-sort=descending] {\n font-weight: 700;\n}\n\n@media (min-width: 1024px) {\n :host > div:last-child,\n :host > div:last-child > div:last-child {\n grid-auto-flow: column;\n }\n :host > div:last-child kol-pagination {\n display: flex;\n gap: 1rem;\n }\n}";
|
|
10457
10457
|
|
|
10458
10458
|
var css_248z$B = ":host {\n --kolibri-spacing: 0.25rem;\n}\n\nkol-button-group-wc {\n border-bottom: 1px solid var(--color-grey-25);\n margin-bottom: -1px;\n}\n\nkol-button-group-wc button {\n border: none;\n margin-bottom: -1px;\n}\n\nkol-button-group-wc button kol-span-wc {\n padding: 0.5rem;\n min-height: 44px;\n min-width: 44px;\n}\n\nkol-button-group-wc button.selected kol-span-wc {\n border-color: var(--color-grey-25);\n border-style: solid;\n border-width: 1px;\n border-bottom-color: white;\n border-top-color: var(--color-blue);\n box-shadow: 0 -3px var(--color-blue);\n font-weight: var(--font-weight-bold);\n color: var(--color-blue);\n}\n\nkol-button-group-wc button:hover:not(:disabled) kol-span-wc {\n color: var(--color-blue-130);\n}\n\nkol-button-group-wc button:focus kol-span-wc {\n outline-color: var(--color-blue-130);\n outline-style: solid;\n outline-width: 2px;\n}";
|
|
10459
10459
|
|
|
@@ -10555,7 +10555,7 @@ var css_248z$7 = "kol-link-wc > a > kol-span-wc {\n border-radius: 2rem;\n bor
|
|
|
10555
10555
|
|
|
10556
10556
|
var css_248z$6 = ".popover {\n background: #fff;\n}";
|
|
10557
10557
|
|
|
10558
|
-
var css_248z$5 = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n:host > div:last-child {\n border-style: solid;\n border-width: 1px;\n border-color: var(--border-color);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(
|
|
10558
|
+
var css_248z$5 = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n:host > div:last-child {\n border-style: solid;\n border-width: 1px;\n border-color: var(--border-color);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(.focus-element:focus) {\n outline-color: var(--color-petrol);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 3px;\n transition: outline-offset 0.2s linear;\n}\n\ntable {\n width: 100%;\n border-collapse: collapse;\n border-spacing: 0;\n}\n\ntable,\ntr,\nth,\ntd {\n border: 0 solid var(--border-color);\n}\n\ntr {\n border-top-width: 1px;\n}\n\ntr:nth-child(even) {\n background-color: #f2f2f2;\n}\n\nth,\ntd {\n border-right-width: 1px;\n padding: 0.25em 0.5em;\n}\n\nth {\n background-color: #eee;\n}\n\n.table-sort-button .button {\n font-weight: bold;\n}\n\n@media (min-width: 1024px) {\n :host > div.pagination,\n :host > div.pagination > div:last-child {\n grid-auto-flow: column;\n }\n :host > div.pagination kol-pagination {\n display: flex;\n gap: 1rem;\n }\n}";
|
|
10559
10559
|
|
|
10560
10560
|
var css_248z$4 = ":host > div {\n display: block;\n width: 100%;\n}\n\n:host kol-button-group-wc {\n display: flex;\n background-color: var(--color-petrol);\n}\n\n:host kol-button-group-wc > div {\n display: inline-flex;\n}\n\n:host kol-button-group-wc > div + div {\n margin-left: 0.25em;\n}\n\n:host > div > div {\n padding: 0.25em;\n border: 1px solid var(--border-color);\n}\n\nbutton {\n box-sizing: border-box;\n font-size: inherit;\n line-height: 1.25em;\n cursor: pointer;\n border-width: 2px;\n box-shadow: 0 0 0.25em gray;\n width: inherit;\n overflow: hidden;\n border-style: solid;\n padding: calc(4 * var(--spacing));\n display: grid;\n gap: 0.25em;\n align-items: center;\n justify-content: center;\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n}\n\nkol-button-wc button.selected,\nkol-button-wc[aria-selected=true] button {\n background-color: white;\n border-bottom-width: 0.25em !important;\n border-bottom-style: solid;\n border-bottom-color: var(--color-citrin) !important;\n}\n\nbutton > kol-span-wc span {\n display: flex;\n gap: 0.25em;\n align-items: center;\n justify-content: center;\n}\n\nbutton:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n\nbutton.primary,\nbutton.primary:disabled:hover {\n background-color: var(--kolibri-color-primary);\n border-color: var(--kolibri-color-primary);\n color: white;\n}\n\nbutton.primary:hover,\nbutton.primary:focus {\n color: var(--kolibri-color-primary);\n}\n\nbutton.secondary,\nbutton.secondary:disabled:hover {\n background-color: var(--kolibri-color-secondary);\n border-color: var(--kolibri-color-secondary);\n color: white;\n}\n\nbutton.secondary:hover,\nbutton.secondary:focus {\n color: var(--kolibri-color-secondary);\n}\n\nbutton.normal,\nbutton.normal:disabled:hover {\n background-color: var(--color-petrol);\n border-color: var(--color-petrol);\n color: white;\n}\n\nbutton.normal:hover,\nbutton.normal:focus {\n color: var(--color-petrol);\n}\n\nbutton.danger,\nbutton.danger:disabled:hover {\n background-color: var(--kolibri-color-danger);\n border-color: var(--kolibri-color-danger);\n color: white;\n}\n\nbutton.danger:hover,\nbutton.danger:focus {\n color: var(--kolibri-color-danger);\n}\n\nbutton.ghost,\nbutton.ghost:disabled:hover {\n background-color: white;\n border-color: var(--kolibri-color-ghost);\n color: var(--kolibri-color-ghost);\n}\n\nbutton.ghost:hover,\nbutton.ghost:focus {\n background-color: var(--kolibri-color-ghost);\n color: white;\n}\n\nbutton:hover,\nbutton:focus {\n background-color: white;\n box-shadow: 0 0 0.25em black;\n}\n\nbutton:active {\n outline: 0 !important;\n box-shadow: none !important;\n}\n\n.close-button {\n font-size: 25%;\n height: fit-content;\n width: 0;\n}\n\n.close-button button {\n width: 1rem;\n position: relative;\n height: 1rem;\n left: -4.25em;\n top: 0.25em;\n}\n\n:host > div {\n display: grid;\n}\n\n:host > div.tabs-align-left {\n grid-template-columns: auto 1fr;\n}\n\n:host > div.tabs-align-right {\n grid-template-columns: 1fr auto;\n}\n\n:host > .tabs-align-left kol-button-group-wc,\n:host > .tabs-align-top kol-button-group-wc {\n order: 0;\n}\n\n:host > .tabs-align-bottom kol-button-group-wc,\n:host > .tabs-align-right kol-button-group-wc {\n order: 1;\n}\n\n:host > div.tabs-align-left kol-button-group-wc > div,\n:host > div.tabs-align-left kol-button-group-wc > div > div,\n:host > div.tabs-align-right kol-button-group-wc > div,\n:host > div.tabs-align-right kol-button-group-wc > div > div {\n display: grid;\n}\n\n:host > div.tabs-align-left kol-button-group-wc > div > div kol-button-wc,\n:host > div.tabs-align-right kol-button-group-wc > div > div kol-button-wc {\n width: 100%;\n}\n\n:host > div.tabs-align-bottom kol-button-group-wc div,\n:host > div.tabs-align-top kol-button-group-wc div {\n display: flex;\n flex-wrap: wrap;\n}";
|
|
10561
10561
|
|
package/dist/index.mjs
CHANGED
|
@@ -1953,7 +1953,7 @@ const BMF = KoliBri.createTheme("bmf", {
|
|
|
1953
1953
|
overflow-x: auto;
|
|
1954
1954
|
overflow-y: hidden;
|
|
1955
1955
|
}
|
|
1956
|
-
.table:has(
|
|
1956
|
+
.table:has(.focus-element:focus) {
|
|
1957
1957
|
outline-color: var(--color-ocean);
|
|
1958
1958
|
outline-style: solid;
|
|
1959
1959
|
outline-width: 3px;
|
|
@@ -10232,7 +10232,7 @@ const spinCss = css_248z$1H;
|
|
|
10232
10232
|
var css_248z$1G = ".popover {\n background: #fff;\n}";
|
|
10233
10233
|
const splitButtonCss = css_248z$1G;
|
|
10234
10234
|
|
|
10235
|
-
var css_248z$1F = ":host * {\n hyphens: var(--hyphens);\n font-family: var(--font-family);\n line-height: var(--line-height);\n word-break: break-word;\n}\n\n:host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5rem;\n}\n\nth {\n font-weight: normal;\n color: var(--color-primary);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: calc(var(--border-width) * 2);\n border-style: solid;\n border-color: var(--color-primary-variant);\n}\n\n.table {\n padding: 0.5rem;\n}\n\n.table:has(
|
|
10235
|
+
var css_248z$1F = ":host * {\n hyphens: var(--hyphens);\n font-family: var(--font-family);\n line-height: var(--line-height);\n word-break: break-word;\n}\n\n:host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5rem;\n}\n\nth {\n font-weight: normal;\n color: var(--color-primary);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: calc(var(--border-width) * 2);\n border-style: solid;\n border-color: var(--color-primary-variant);\n}\n\n.table {\n padding: 0.5rem;\n}\n\n.table:has(.focus-element:focus) {\n outline-color: var(--color-primary-variant);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 3px;\n transition: outline-offset 0.2s linear;\n}\n\ntable {\n width: 100%;\n border-spacing: 0;\n}\n\ntable,\n:host table thead tr:last-child th,\n:host table thead tr:last-child td {\n border-width: 0;\n border-bottom-width: calc(var(--border-width) * 2);\n border-style: solid;\n border-color: var(--color-primary-variant);\n}\n\nth {\n background-color: var(--color-light);\n}\n\nth div {\n width: 100%;\n display: flex;\n gap: 0.5rem;\n grid-template-columns: 1fr auto;\n align-items: center;\n}\n\ntr:nth-child(even) {\n background-color: var(--color-mute);\n}\n\nth,\ntd {\n padding: 0.5rem;\n}\n\nth[aria-sort=ascending],\nth[aria-sort=descending] {\n font-weight: 700;\n}\n\n@media (min-width: 1024px) {\n div.pagination kol-pagination {\n display: flex;\n align-items: center;\n }\n}";
|
|
10236
10236
|
const tableCss = css_248z$1F;
|
|
10237
10237
|
|
|
10238
10238
|
var css_248z$1E = "button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n:host kol-button-group-wc {\n display: inline-flex;\n gap: 2rem;\n flex-wrap: wrap;\n}\n\nbutton {\n box-sizing: border-box;\n background-color: transparent;\n border: 0;\n border-radius: var(--border-radius);\n font-style: normal;\n font-weight: 700;\n font-size: 18px;\n line-height: 22px;\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n color: var(--color-subtle);\n padding: 0;\n}\n\nbutton:hover {\n color: var(--color-primary);\n}\n\nbutton.primary,\nbutton.selected {\n color: var(--color-primary);\n}\n\nbutton:not(.selected) kol-span-wc > span {\n padding-bottom: 0.25em;\n}\n\nbutton.selected kol-span-wc > span {\n border-bottom: 0.25em solid;\n}\n\nbutton kol-span-wc > span {\n gap: 0.5rem;\n}\n\n:host > div > div {\n padding: 0.25em 0;\n}\n\ndiv[role=tabpanel] {\n height: 100%;\n}\n\ndiv.grid {\n height: 100%;\n}\n\n:host > .tabs-align-right {\n display: grid;\n grid-template-columns: 1fr auto;\n}\n\n:host > .tabs-align-right kol-button-group-wc {\n display: grid;\n order: 2;\n}\n\n:host > .tabs-align-left {\n display: grid;\n grid-template-columns: auto 1fr;\n}\n\n:host > .tabs-align-left kol-button-group-wc {\n display: grid;\n order: 0;\n}\n\n:host > .tabs-align-bottom {\n display: grid;\n grid-template-rows: 1fr auto;\n}\n\n:host > .tabs-align-bottom kol-button-group-wc {\n order: 2;\n}\n\n:host > .tabs-align-bottom kol-button-group-wc > div {\n display: flex;\n}\n\n:host > .tabs-align-bottom > kol-button-group-wc > div > div:first-child {\n margin: 0px 1rem 0px 0px;\n}\n\n:host > .tabs-align-bottom > kol-button-group-wc > div > div {\n margin: 0px 1rem;\n}\n\n:host > .tabs-align-top {\n display: grid;\n grid-template-rows: auto 1fr;\n}\n\n:host > .tabs-align-top kol-button-group-wc {\n order: 0;\n}\n\n:host > .tabs-align-top kol-button-group-wc > div {\n display: flex;\n}\n\n:host > .tabs-align-top > kol-button-group-wc > div > div:first-child {\n margin: 0px 1rem 0px 0px;\n}\n\n:host > .tabs-align-top > kol-button-group-wc > div > div {\n margin: 0px 1rem;\n}\n\n:host > div {\n display: grid;\n}\n\n:host > div.tabs-align-left {\n grid-template-columns: auto 1fr;\n}\n\n:host > div.tabs-align-right {\n grid-template-columns: 1fr auto;\n}\n\n:host > .tabs-align-left kol-button-group-wc,\n:host > .tabs-align-top kol-button-group-wc {\n order: 0;\n}\n\n:host > .tabs-align-bottom kol-button-group-wc,\n:host > .tabs-align-right kol-button-group-wc {\n order: 1;\n}\n\n:host > .tabs-align-left kol-button-group-wc,\n:host > .tabs-align-right kol-button-group-wc {\n gap: inherit;\n}\n\n:host > div.tabs-align-left kol-button-group-wc > div,\n:host > div.tabs-align-left kol-button-group-wc > div > div,\n:host > div.tabs-align-right kol-button-group-wc > div,\n:host > div.tabs-align-right kol-button-group-wc > div > div {\n display: grid;\n}\n\n:host > div.tabs-align-left kol-button-group-wc > div > div kol-button-wc,\n:host > div.tabs-align-right kol-button-group-wc > div > div kol-button-wc {\n width: 100%;\n}\n\n:host > div.tabs-align-bottom kol-button-group-wc div,\n:host > div.tabs-align-top kol-button-group-wc div {\n display: flex;\n flex-wrap: wrap;\n}\n\n:host kol-button-group-wc button {\n border: none;\n}";
|
|
@@ -10345,7 +10345,7 @@ var css_248z$19 = "kol-link-wc > a > kol-span-wc {\n border-radius: 0;\n borde
|
|
|
10345
10345
|
|
|
10346
10346
|
var css_248z$18 = ".popover {\n background: #fff;\n}";
|
|
10347
10347
|
|
|
10348
|
-
var css_248z$17 = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5em;\n}\n\nth {\n font-weight: normal;\n color: var(--color-midnight);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(
|
|
10348
|
+
var css_248z$17 = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5em;\n}\n\nth {\n font-weight: normal;\n color: var(--color-midnight);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(.focus-element:focus) {\n outline-color: var(--color-blue);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 2px;\n}\n\ntable {\n width: 100%;\n border-spacing: 0;\n}\n\ntable,\n:host table thead tr:last-child th,\n:host table thead tr:last-child td {\n border-width: 0;\n border-bottom-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\nth {\n background-color: var(--color-white);\n}\n\nth div {\n width: 100%;\n display: flex;\n gap: 0.5em;\n grid-template-columns: 1fr auto;\n align-items: center;\n}\n\ntbody tr:nth-child(odd) {\n background-color: var(--color-grey-10);\n}\n\nth,\ntd {\n padding: 0.5em;\n}\n\nth[aria-sort=ascending],\nth[aria-sort=descending] {\n font-weight: 700;\n}\n\n@media (min-width: 1024px) {\n :host > div:last-child,\n :host > div:last-child > div:last-child {\n grid-auto-flow: column;\n }\n :host > div:last-child kol-pagination {\n display: flex;\n gap: 1rem;\n }\n}";
|
|
10349
10349
|
|
|
10350
10350
|
var css_248z$16 = "kol-input {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n}\n\ninput,\nselect,\ntextarea {\n border: none;\n outline: none;\n}\n\ninput,\nselect:not([multiple]) {\n height: 40px !important;\n min-height: 40px !important;\n}\n\nlabel {\n font-weight: var(--font-weight-bold);\n order: 1;\n}\n\n.hint {\n font-size: 0.875rem;\n order: 2;\n}\n\nkol-alert {\n color: var(--color-red);\n font-size: 0.875em;\n margin-left: calc(-1 * var(--spacing-2xs));\n order: 3;\n}\n\n.input {\n min-height: 44px !important;\n border: 1px solid var(--color-grey-75);\n color: var(--color-grey);\n order: 4;\n align-items: center;\n padding: 1px 0.5em;\n}\n\n.counter {\n order: 5;\n}\n\ninput::placeholder,\ntextarea::placeholder {\n color: var(--color-grey-50);\n}\n\n.input:focus-within {\n box-shadow: inset 1px 1px var(--color-blue), inset -1px -1px var(--color-blue);\n outline: none;\n}\n\n.input:focus-within,\n.input:hover {\n border-color: var(--color-blue) !important;\n}\n\n.error .input {\n border-color: var(--color-red);\n}";
|
|
10351
10351
|
|
|
@@ -10451,7 +10451,7 @@ var css_248z$E = "kol-link-wc > a > kol-span-wc {\n border-radius: 4px;\n gap:
|
|
|
10451
10451
|
|
|
10452
10452
|
var css_248z$D = ".popover {\n background: #fff;\n}";
|
|
10453
10453
|
|
|
10454
|
-
var css_248z$C = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5em;\n}\n\nth {\n font-weight: normal;\n color: var(--color-midnight);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(
|
|
10454
|
+
var css_248z$C = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\ncaption {\n padding: 0.5em;\n}\n\nth {\n font-weight: normal;\n color: var(--color-midnight);\n}\n\n:host table thead tr:first-child th,\n:host table thead tr:first-child td {\n border-width: 0;\n border-top-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(.focus-element:focus) {\n outline-color: var(--color-blue);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 2px;\n}\n\ntable {\n width: 100%;\n border-spacing: 0;\n}\n\ntable,\n:host table thead tr:last-child th,\n:host table thead tr:last-child td {\n border-width: 0;\n border-bottom-width: 2px;\n border-style: solid;\n border-color: var(--color-ice);\n}\n\nth {\n background-color: var(--color-white);\n}\n\nth div {\n width: 100%;\n display: flex;\n gap: 0.5em;\n grid-template-columns: 1fr auto;\n align-items: center;\n}\n\ntbody tr:nth-child(odd) {\n background-color: var(--color-grey-10);\n}\n\nth,\ntd {\n padding: 0.5em;\n}\n\nth[aria-sort=ascending],\nth[aria-sort=descending] {\n font-weight: 700;\n}\n\n@media (min-width: 1024px) {\n :host > div:last-child,\n :host > div:last-child > div:last-child {\n grid-auto-flow: column;\n }\n :host > div:last-child kol-pagination {\n display: flex;\n gap: 1rem;\n }\n}";
|
|
10455
10455
|
|
|
10456
10456
|
var css_248z$B = ":host {\n --kolibri-spacing: 0.25rem;\n}\n\nkol-button-group-wc {\n border-bottom: 1px solid var(--color-grey-25);\n margin-bottom: -1px;\n}\n\nkol-button-group-wc button {\n border: none;\n margin-bottom: -1px;\n}\n\nkol-button-group-wc button kol-span-wc {\n padding: 0.5rem;\n min-height: 44px;\n min-width: 44px;\n}\n\nkol-button-group-wc button.selected kol-span-wc {\n border-color: var(--color-grey-25);\n border-style: solid;\n border-width: 1px;\n border-bottom-color: white;\n border-top-color: var(--color-blue);\n box-shadow: 0 -3px var(--color-blue);\n font-weight: var(--font-weight-bold);\n color: var(--color-blue);\n}\n\nkol-button-group-wc button:hover:not(:disabled) kol-span-wc {\n color: var(--color-blue-130);\n}\n\nkol-button-group-wc button:focus kol-span-wc {\n outline-color: var(--color-blue-130);\n outline-style: solid;\n outline-width: 2px;\n}";
|
|
10457
10457
|
|
|
@@ -10553,7 +10553,7 @@ var css_248z$7 = "kol-link-wc > a > kol-span-wc {\n border-radius: 2rem;\n bor
|
|
|
10553
10553
|
|
|
10554
10554
|
var css_248z$6 = ".popover {\n background: #fff;\n}";
|
|
10555
10555
|
|
|
10556
|
-
var css_248z$5 = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n:host > div:last-child {\n border-style: solid;\n border-width: 1px;\n border-color: var(--border-color);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(
|
|
10556
|
+
var css_248z$5 = ":host > div {\n overflow-x: auto;\n overflow-y: hidden;\n}\n\n:host > div:last-child {\n border-style: solid;\n border-width: 1px;\n border-color: var(--border-color);\n}\n\n.table {\n padding: 0.5em;\n}\n\n.table:has(.focus-element:focus) {\n outline-color: var(--color-petrol);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 3px;\n transition: outline-offset 0.2s linear;\n}\n\ntable {\n width: 100%;\n border-collapse: collapse;\n border-spacing: 0;\n}\n\ntable,\ntr,\nth,\ntd {\n border: 0 solid var(--border-color);\n}\n\ntr {\n border-top-width: 1px;\n}\n\ntr:nth-child(even) {\n background-color: #f2f2f2;\n}\n\nth,\ntd {\n border-right-width: 1px;\n padding: 0.25em 0.5em;\n}\n\nth {\n background-color: #eee;\n}\n\n.table-sort-button .button {\n font-weight: bold;\n}\n\n@media (min-width: 1024px) {\n :host > div.pagination,\n :host > div.pagination > div:last-child {\n grid-auto-flow: column;\n }\n :host > div.pagination kol-pagination {\n display: flex;\n gap: 1rem;\n }\n}";
|
|
10557
10557
|
|
|
10558
10558
|
var css_248z$4 = ":host > div {\n display: block;\n width: 100%;\n}\n\n:host kol-button-group-wc {\n display: flex;\n background-color: var(--color-petrol);\n}\n\n:host kol-button-group-wc > div {\n display: inline-flex;\n}\n\n:host kol-button-group-wc > div + div {\n margin-left: 0.25em;\n}\n\n:host > div > div {\n padding: 0.25em;\n border: 1px solid var(--border-color);\n}\n\nbutton {\n box-sizing: border-box;\n font-size: inherit;\n line-height: 1.25em;\n cursor: pointer;\n border-width: 2px;\n box-shadow: 0 0 0.25em gray;\n width: inherit;\n overflow: hidden;\n border-style: solid;\n padding: calc(4 * var(--spacing));\n display: grid;\n gap: 0.25em;\n align-items: center;\n justify-content: center;\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n}\n\nkol-button-wc button.selected,\nkol-button-wc[aria-selected=true] button {\n background-color: white;\n border-bottom-width: 0.25em !important;\n border-bottom-style: solid;\n border-bottom-color: var(--color-citrin) !important;\n}\n\nbutton > kol-span-wc span {\n display: flex;\n gap: 0.25em;\n align-items: center;\n justify-content: center;\n}\n\nbutton:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n\nbutton.primary,\nbutton.primary:disabled:hover {\n background-color: var(--kolibri-color-primary);\n border-color: var(--kolibri-color-primary);\n color: white;\n}\n\nbutton.primary:hover,\nbutton.primary:focus {\n color: var(--kolibri-color-primary);\n}\n\nbutton.secondary,\nbutton.secondary:disabled:hover {\n background-color: var(--kolibri-color-secondary);\n border-color: var(--kolibri-color-secondary);\n color: white;\n}\n\nbutton.secondary:hover,\nbutton.secondary:focus {\n color: var(--kolibri-color-secondary);\n}\n\nbutton.normal,\nbutton.normal:disabled:hover {\n background-color: var(--color-petrol);\n border-color: var(--color-petrol);\n color: white;\n}\n\nbutton.normal:hover,\nbutton.normal:focus {\n color: var(--color-petrol);\n}\n\nbutton.danger,\nbutton.danger:disabled:hover {\n background-color: var(--kolibri-color-danger);\n border-color: var(--kolibri-color-danger);\n color: white;\n}\n\nbutton.danger:hover,\nbutton.danger:focus {\n color: var(--kolibri-color-danger);\n}\n\nbutton.ghost,\nbutton.ghost:disabled:hover {\n background-color: white;\n border-color: var(--kolibri-color-ghost);\n color: var(--kolibri-color-ghost);\n}\n\nbutton.ghost:hover,\nbutton.ghost:focus {\n background-color: var(--kolibri-color-ghost);\n color: white;\n}\n\nbutton:hover,\nbutton:focus {\n background-color: white;\n box-shadow: 0 0 0.25em black;\n}\n\nbutton:active {\n outline: 0 !important;\n box-shadow: none !important;\n}\n\n.close-button {\n font-size: 25%;\n height: fit-content;\n width: 0;\n}\n\n.close-button button {\n width: 1rem;\n position: relative;\n height: 1rem;\n left: -4.25em;\n top: 0.25em;\n}\n\n:host > div {\n display: grid;\n}\n\n:host > div.tabs-align-left {\n grid-template-columns: auto 1fr;\n}\n\n:host > div.tabs-align-right {\n grid-template-columns: 1fr auto;\n}\n\n:host > .tabs-align-left kol-button-group-wc,\n:host > .tabs-align-top kol-button-group-wc {\n order: 0;\n}\n\n:host > .tabs-align-bottom kol-button-group-wc,\n:host > .tabs-align-right kol-button-group-wc {\n order: 1;\n}\n\n:host > div.tabs-align-left kol-button-group-wc > div,\n:host > div.tabs-align-left kol-button-group-wc > div > div,\n:host > div.tabs-align-right kol-button-group-wc > div,\n:host > div.tabs-align-right kol-button-group-wc > div > div {\n display: grid;\n}\n\n:host > div.tabs-align-left kol-button-group-wc > div > div kol-button-wc,\n:host > div.tabs-align-right kol-button-group-wc > div > div kol-button-wc {\n width: 100%;\n}\n\n:host > div.tabs-align-bottom kol-button-group-wc div,\n:host > div.tabs-align-top kol-button-group-wc div {\n display: flex;\n flex-wrap: wrap;\n}";
|
|
10559
10559
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@public-ui/themes",
|
|
3
|
-
"version": "1.7.
|
|
3
|
+
"version": "1.7.14",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"homepage": "https://public-ui.github.io",
|
|
6
6
|
"repository": "https://github.com/public-ui/kolibri",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
"wcag"
|
|
42
42
|
],
|
|
43
43
|
"devDependencies": {
|
|
44
|
-
"@public-ui/schema": "1.7.
|
|
44
|
+
"@public-ui/schema": "1.7.14",
|
|
45
45
|
"@types/node": "ts5.3",
|
|
46
46
|
"@typescript-eslint/eslint-plugin": "7.0.2",
|
|
47
47
|
"@typescript-eslint/parser": "7.0.2",
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"unbuild": "1.2.1"
|
|
54
54
|
},
|
|
55
55
|
"peerDependencies": {
|
|
56
|
-
"@public-ui/components": "1.7.
|
|
56
|
+
"@public-ui/components": "1.7.14"
|
|
57
57
|
},
|
|
58
58
|
"sideEffects": false,
|
|
59
59
|
"type": "module",
|