@public-ui/themes 1.4.2 → 1.5.0-rc.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { KoliBri } from '@public-ui/schema';
1
+ import { KoliBri } from '@public-ui/components';
2
2
 
3
3
  const BAMF = KoliBri.createTheme("bamf", {
4
4
  "KOL-BADGE": ":host {display: inline-block;}span {align-items: center;border-radius: 0.3125rem;display: flex;line-height: 1.25rem;gap: 0.5rem;padding: 0.25rem 0.75rem;}"
@@ -40,34 +40,34 @@ const BMF = KoliBri.createTheme("bmf", {
40
40
  });
41
41
 
42
42
  const BPA = KoliBri.createTheme("bpa", {
43
- GLOBAL: ":host {--primary: #007a89;--secondary: #0b4d59;--normal: #f2f3f4;--danger: #bc0000;--danger-light: rgba(188, 0, 0, 0.1);--ghost: white;--font-family: BundesSans Web, Calibri, Verdana, Arial, Helvetica, sans-serif;--font-size: 16px;--error: var(--danger);--dark-red: #780f2d;--dark-green: #005c45;--red-orange: #c44931;--visited: #5f316e;--secondary-blue: #004b76;--default-letter: #202020;--default-border: #576164;--default-border-hover: var(--secondary);--border-default: #bec5c9;--background-light-grey: #f2f3f4;--kolibri-color-spin-1: blue;--kolibri-color-spin-2: red;--kolibri-color-spin-3: green;--spacing: 0.25em;}:host {font-family: var(--font-family);font-size: var(--font-size);}:host * {box-sizing: border-box;letter-spacing: inherit;font-family: inherit;word-spacing: inherit;hyphens: auto;word-break: break-word;}:host div {background-color: white;}:host button {cursor: pointer;}.hidden {visibility: hidden;height: 0;}",
44
- "KOL-BUTTON": ':host button {padding: 7px 20px;border: solid 2px #007a89;border-radius: 27px;color: #fff;font-size: 12px;font-weight: bold;line-height: 2.16667;text-align: center;display: inline-flex;align-items: center;justify-content: center;position: relative;text-transform: uppercase;transition-duration: 0.5s;transition-property: background-color, color, border-color;}:host button.icon-only {padding: 7px 14px;}:host button:hover::before,:host button:focus::before {font-family: "Font Awesome 5 Free" !important;content: "\\f061";font-weight: 900;margin-right: 0.5em;}:host button:focus {outline-color: var(--primary);outline-offset: 2px;outline-style: solid;outline-width: 2px;}button:disabled {cursor: not-allowed;opacity: 0.5;}button.primary,button.primary:disabled:hover {color: white;background-color: var(--primary);border-color: var(--primary);}button.secondary,button.secondary:disabled:hover,button.normal,button.normal:disabled:hover {color: var(--secondary-blue);background-color: var(--normal);border-color: var(--normal);}button.danger,button.danger:disabled:hover {color: white;background-color: var(--danger);border-color: var(--danger);}button.ghost,button.ghost:disabled:hover {color: var(--primary);border-color: var(--primary);background-color: white;}button.primary:hover,button.primary:focus {background-color: var(--secondary);}button.danger:hover,button.danger:focus {background-color: var(--dark-red);}button.ghost:hover,button.ghost:focus {background-color: var(--primary);border-color: var(--primary);color: white;}button.primary:active,button.secondary:active,button.normal:active,button.danger:active,button.ghost:active {outline: 0 !important;}:host button:disabled:hover::before,:host button:disabled:focus::before {display: none;}',
45
- "KOL-INPUT-TEXT": 'input:hover,input:focus {border-color: var(--default-border-hover);outline-color: var(--primary) !important;outline-offset: 0;outline-style: solid;outline-width: 1px;}label {color: var(--default-letter);font-size: 14px;line-height: 20px;gap: 8px;width: 100%;font-weight: bold;}input {width: 100%;color: var(--default-letter);border-width: 1px;border-style: solid;line-height: 24px;font-size: 16px;border-color: var(--kolibri-color-normal);border-radius: 0;background-color: #e8edf2 !important;padding: 0.75em;}input.error {background-color: var(--danger-light) !important;border-color: var(--danger);}input::placeholder {font-style: italic;color: var(--default-border);}input:read-only,input:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}kol-alert {margin-top: var(--spacing);display: block;}.kol-required span::after {content: " *";}',
46
- "KOL-INPUT-PASSWORD": 'input:hover,input:focus {border-color: var(--default-border-hover);outline-color: var(--primary) !important;outline-offset: 0;outline-style: solid;outline-width: 1px;}label {color: var(--default-letter);font-size: 14px;line-height: 20px;gap: 8px;width: 100%;font-weight: bold;}input {width: 100%;color: var(--default-letter);border-width: 1px;border-style: solid;line-height: 24px;font-size: 16px;border-color: var(--kolibri-color-normal);border-radius: 0;background-color: #e8edf2 !important;padding: 0.75em;}input.error {background-color: var(--danger-light) !important;border-color: var(--danger);}input::placeholder {font-style: italic;color: var(--default-border);}input:read-only,input:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}kol-alert {margin-top: var(--spacing);display: block;}.kol-required span::after {content: " *";}',
47
- "KOL-INPUT-NUMBER": 'input:hover,input:focus {border-color: var(--default-border-hover);outline-color: var(--primary) !important;outline-offset: 0;outline-style: solid;outline-width: 1px;}label {color: var(--default-letter);font-size: 14px;line-height: 20px;gap: 8px;width: 100%;font-weight: bold;}input {width: 100%;color: var(--default-letter);border-width: 1px;border-style: solid;line-height: 24px;font-size: 16px;border-color: var(--kolibri-color-normal);border-radius: 0;background-color: #e8edf2 !important;padding: 0.75em;}input.error {background-color: var(--danger-light) !important;border-color: var(--danger);}input::placeholder {font-style: italic;color: var(--default-border);}input:read-only,input:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}kol-alert {margin-top: var(--spacing);display: block;}.kol-required span::after {content: " *";}',
48
- "KOL-INPUT-EMAIL": 'input:hover,input:focus {border-color: var(--default-border-hover);outline-color: var(--primary) !important;outline-offset: 0;outline-style: solid;outline-width: 1px;}label {color: var(--default-letter);font-size: 14px;line-height: 20px;gap: 8px;width: 100%;font-weight: bold;}input {width: 100%;color: var(--default-letter);border-width: 1px;border-style: solid;line-height: 24px;font-size: 16px;border-color: var(--kolibri-color-normal);border-radius: 0;background-color: #e8edf2 !important;padding: 0.75em;}input.error {background-color: var(--danger-light) !important;border-color: var(--danger);}input::placeholder {font-style: italic;color: var(--default-border);}input:read-only,input:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}kol-alert {margin-top: var(--spacing);display: block;}.kol-required span::after {content: " *";}',
49
- "KOL-INPUT-FILE": 'input:hover,input:focus {border-color: var(--default-border-hover);outline-color: var(--primary) !important;outline-offset: 0;outline-style: solid;outline-width: 1px;}label {color: var(--default-letter);font-size: 14px;line-height: 20px;gap: 8px;width: 100%;font-weight: bold;}input {width: 100%;color: var(--default-letter);border-width: 1px;border-style: solid;line-height: 24px;font-size: 16px;border-color: var(--kolibri-color-normal);border-radius: 0;background-color: #e8edf2 !important;padding: 0.75em;}input.error {background-color: var(--danger-light) !important;border-color: var(--danger);}input::placeholder {font-style: italic;color: var(--default-border);}input:read-only,input:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}kol-alert {margin-top: var(--spacing);display: block;}.kol-required span::after {content: " *";}',
50
- "KOL-TEXTAREA": 'textarea:hover,textarea:focus {border-color: var(--default-border-hover);outline-color: var(--primary) !important;outline-offset: 0;outline-style: solid;outline-width: 1px;}label {color: var(--default-letter);font-size: 14px;line-height: 20px;gap: 8px;width: 100%;font-weight: bold;}textarea.error {background-color: var(--danger-light) !important;border-color: var(--danger);}textarea {width: 100%;color: var(--default-letter);border-width: 1px;border-style: solid;line-height: 24px;font-size: 16px;border-color: var(--kolibri-color-normal);border-radius: 0;background-color: #e8edf2 !important;padding: 0.75em;}textarea::placeholder {color: var(--default-border);}textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}.kol-required span::after {content: "*";}kol-alert {margin-top: var(--spacing);display: block;}',
51
- "KOL-ALERT": ":host > div {border-width: 2px;border-style: solid;border-radius: 5px;display: flex;width: 100%;overflow: hidden;border-color: transparent;}:host > div.error {border-color: var(--danger);}:host > div.error .icon {background-color: var(--danger);}:host > div.info {border-color: var(--secondary-blue);}:host > div.info .icon {background-color: var(--secondary-blue);}:host > div.success {border-color: var(--dark-green);}:host > div.success .icon {background-color: var(--dark-green);}:host > div.warning {border-color: var(--dark-red);}:host > div.warning .icon {background-color: var(--dark-red);}:host .icon {color: white;display: inline-block;padding: 0 0.25rem;}:host > div > div > .heading {padding: 0 0.25rem;display: inline-block;}:host > div > div > .heading > .icon {margin-left: -0.25rem;margin-right: 0.25rem;border-radius: 0 0 0.25rem 0;}:host > div > div > div:last-child {padding: 0.25rem;}",
52
- "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {line-height: 1.5em;margin: 0;padding: 0;}h1 {font-size: 1.2rem;}h2,h3,h4,h5,h6 {font-size: 1.1rem;}",
53
- "KOL-BADGE": ":host {display: inline-block;}span {align-items: center;border-radius: 0.3125rem;display: flex;line-height: 1.25rem;gap: 0.5rem;padding: 0.25rem 0.75rem;}",
54
- "KOL-BUTTON-GROUP": "div {display: flex;flex-wrap: wrap;gap: 0.5em;}",
55
- "KOL-INDENTED-TEXT": ":host > div {width: 100%;border-left-style: solid;border-left-width: 0.5em;border-left-color: var(--border-default);padding: 0.5em;}",
56
- "KOL-LINK": "a {color: var(--primary);font-style: normal;line-height: 1.5em;text-decoration-line: none;background-size: 0 0.25ex;font-weight: bold;display: inline;background-image: repeating-linear-gradient(to right, #66ddec, #66ddec);background-repeat: no-repeat;background-position: left 0 bottom 0;text-transform: uppercase;transition: background-size 0.2s ease-in-out, color 0.2s ease-in-out;}a:hover,a:focus {background-size: 100% 0.25ex;font-weight: 700;text-decoration-thickness: 0.125em;outline: none;}a:visited {color: var(--visited);}kol-icon-icofont {padding: 0 0.25em;display: inline-block;}.hidden {display: none;visibility: hidden;}a.skip {left: -99999px;overflow: hidden;position: absolute;z-index: 9999999;}a.skip:focus {background-color: white;box-shadow: 0 0 0.5rem 0.5rem white;left: unset;position: unset;}",
57
- "KOL-BREADCRUMB": 'nav {width: 100%;}ul {margin: 0;padding: 0;list-style: none;display: flex;flex-wrap: wrap;}span {line-height: 1.5em;}i[part*="separator"]::before {font-family: "Icofont";font-style: normal;content: "\\ea5d";}',
58
- "KOL-DETAILS": "summary {cursor: pointer;display: flow-root;}summary span {text-decoration: underline;}",
59
- "KOL-SPIN": ".spin {display: inline-block;height: 1rem;position: relative;width: 3rem;}.spin span {animation-timing-function: cubic-bezier(0, 1, 1, 0);border: 0.1rem solid rgb(255, 255, 255);border-radius: 50%;height: 0.8rem;width: 0.8rem;top: 0.1rem;position: absolute;}.spin span:nth-child(1) {background-color: #fc0;z-index: 0;animation: 2s ease 0s infinite normal none running spin1;left: 0.1rem;}.spin span:nth-child(2) {background-color: #f00;z-index: 1;animation: 2s ease 0s infinite normal none running spin2;left: 0.1rem;}.spin span:nth-child(3) {background-color: #000;z-index: 1;animation: 2s ease 0s infinite normal none running spin2;left: 1.1rem;}.spin span:nth-child(4) {background-color: #666;z-index: 0;animation: 2s ease 0s infinite normal none running spin3;left: 2.1rem;}@keyframes spin1 {0% {transform: scale(0);}100% {transform: scale(1);}}@keyframes spin2 {0% {transform: translate(0px, 0px);}100% {transform: translate(1rem, 0px);}}@keyframes spin3 {0% {transform: scale(1);}100% {transform: scale(0);}}",
60
- "KOL-PROGRESS": ":host progress,:host span {display: block;height: 0px;overflow: hidden;width: 0px;}svg line:first-child,svg circle:first-child {fill: transparent;stroke: #efefef;}svg line:last-child,svg circle:last-child {stroke: var(--secondary);fill: transparent;}progress {display: none;}",
61
- "KOL-SELECT": 'select:hover,select:focus {border-color: var(--default-border-hover);outline-color: var(--primary) !important;outline-offset: 0;outline-style: solid;outline-width: 1px;}label {color: var(--default-letter);font-size: 14px;line-height: 20px;gap: 8px;width: 100%;font-weight: bold;}select.error {background-color: var(--danger-light) !important;border-color: var(--danger);}select {width: 100%;color: var(--default-letter);border-width: 1px;border-style: solid;line-height: 24px;font-size: 16px;border-color: var(--kolibri-color-normal);border-radius: 0;background-color: #e8edf2 !important;padding: 0.75em;}select:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}option {height: 2em;padding: 0.5em;}kol-alert {margin-top: var(--spacing);display: block;}.kol-required span::after {content: "*";}',
62
- "KOL-INPUT-COLOR": 'input:hover,input:focus {border-color: var(--default-border-hover);outline-color: var(--primary) !important;outline-offset: 0;outline-style: solid;outline-width: 1px;}label {color: var(--default-letter);font-size: 14px;line-height: 20px;gap: 8px;width: 100%;font-weight: bold;}input {width: 100%;color: var(--default-letter);border-width: 1px;border-style: solid;line-height: 24px;font-size: 16px;border-color: var(--kolibri-color-normal);border-radius: 0;background-color: #e8edf2 !important;padding: 0.25em;overflow: hidden;height: 3em;}input.error {background-color: var(--danger-light) !important;border-color: var(--danger);}input:read-only,input:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}kol-alert {margin-top: var(--spacing);display: block;}.kol-required span::after {content: "*";}',
63
- "KOL-ACCORDION": ':host > div > kol-heading > button {width: 100%;display: flex;align-items: center;overflow: hidden;font-size: inherit;border: 0;padding: 0.25rem 0.5rem;background-color: transparent;}:host button:focus {outline-color: var(--primary) !important;outline-offset: 2px;outline-style: solid;outline-width: 3px;}:host > div > kol-heading > button > span {padding-top: 0.1em;}:host > div > kol-heading > button i[part*="icon"] {font-family: "Font Awesome 5 Free" !important;width: 2rem;padding-right: 0.5rem;display: block;}:host > div > kol-heading > button i[part*="close"]::before {content: "\\f139";font-weight: 900;color: var(--secondary);}:host > div > kol-heading > button i[part*="open"]::before {content: "\\f13a";font-weight: 900;color: var(--secondary);}:host > div {width: 100%;height: 100%;display: grid;border-radius: 5px;border: 2px solid var(--border-default);}:host > div[part*="open"] {background-color: #f2f3f4;}:host > div[part*="open"] div[part="header"],:host > div[part*="open"] div[part="content"] {padding: 0 0.5rem 0.5rem 2.5rem;}button {font-weight: inherit;font-size: inherit;line-height: inherit;}',
64
- "KOL-TABLE": ':host > div {overflow: auto;}th {font-size: 0.875rem;font-weight: normal;color: var(--secondary);}:host table thead tr:first-child th,:host table thead tr:first-child td {border-width: 0;border-top-width: 1px;border-style: solid;border-color: var(--background-light-grey);}table {width: 100%;}table,:host table thead tr:last-child th,:host table thead tr:last-child td {border-width: 0;border-bottom-width: 1px;border-style: solid;border-color: var(--background-light-grey);}th div {width: 100%;display: flex;gap: 0.5em;align-items: center;}th,td {padding: 0.5em;}th[aria-sort="ascending"],th[aria-sort="descending"] {font-weight: 700;}:host > div:last-child {display: grid;grid-auto-flow: column;align-items: center;}:host > div:last-child > div:last-child {display: grid;grid-auto-flow: column;align-items: center;}.hidden {display: none;}',
65
- "KOL-NAV": 'ul {width: 100%;list-style: none;margin: 0px;padding: 0px;}:host div.horizontal > nav > ul {display: flex;}li {height: 100%;width: 100%;padding: 0.5em;}a {align-items: center;border-radius: 0.25em;line-height: 2em;height: 100%;text-decoration: none;background-image: none;padding: 0.25em 0.5em;color: #333;font-weight: bold;text-transform: uppercase;display: flex;position: relative;cursor: pointer;}a:focus {outline-color: var(--primary) !important;outline-offset: 2px;outline-style: solid;outline-width: 3px;}i {padding: 0.25em;display: block;}a:hover {box-shadow: 0px 0.125rem 0.5rem 0.125rem rgba(128, 128, 128, 0.5);color: var(--secondary);}a:hover {background-color: var(--background-light-grey);}a:active {outline: none;}a[part*="selected"] {box-shadow: 0px 0.0625rem 0.25rem 0.0625rem rgba(128, 206, 237, 0.5);color: white;background-color: var(--primary);}a > span[class="hidden"] {visibility: hidden;height: 0px;display: none;}:host div > div {margin-top: 0.5rem;width: 100%;text-align: center;}:host div.inline-block {display: inline-block;}',
66
- "KOL-CARD": ":host > div {background-color: white;border-color: var(--border-default);border-style: solid;border-width: 1px;border-radius: unset;width: 100%;height: 100%;overflow: hidden;}kol-heading {padding: 0.5rem;display: block;border-bottom-style: solid;border-bottom-color: var(--border-default);border-bottom-width: 1px;}:host > div > div {display: block;padding: 0.5rem;}:host > div > div:last-child {display: block;padding: 0.5rem;border-top-style: solid;border-top-color: var(--border-default);border-top-width: 1px;}",
67
- "KOL-INPUT-CHECKBOX": '/* INPUT */:host input:focus {outline-color: var(--primary) !important;outline-offset: 2px;outline-style: solid;outline-width: 3px;}label {color: var(--default-letter);font-size: 14px;line-height: 20px;gap: 8px;width: 100%;}input {width: 100%;color: var(--default-letter);border-color: var(--default-border);border-width: 2px;border-style: solid;line-height: 24px;font-size: 16px;}input:hover {border-color: var(--default-border-hover);}kol-alert {display: block;width: 100%;}.kol-required span::after {content: "*";} /* CHECKBOX */label {cursor: pointer;display: flex;flex-direction: row;position: relative;grid-gap: calc(2 * var(--spacing));gap: calc(2 * var(--spacing));}label span {margin-top: 0.125rem;}label.kol-required span::after {content: "*";}label input[type="checkbox"] {appearance: none;background-color: white;cursor: pointer;transition: 0.5s;}label input[type="checkbox"].kol-disabled:before {cursor: not-allowed;}label input[type="checkbox"]:before {content: "";cursor: pointer;}label input[type="checkbox"]:checked {background-color: var(--secondary);}label input[type="checkbox"].checkbox {height: calc(6 * var(--spacing));min-width: calc(6 * var(--spacing));width: calc(6 * var(--spacing));}label input[type="checkbox"].checkbox:before {background-color: transparent;display: block;height: calc(6 * var(--spacing));position: relative;width: calc(6 * var(--spacing));}label input[type="checkbox"].checkbox:checked:before {border-right-width: 3px;border-bottom-width: 3px;left: calc(1.5 * var(--spacing) - 2px);top: calc(2.85 * var(--spacing) - 2px);transform: rotate(40deg) translate(-50%, -50%);background-color: transparent;border-width: 0px 3px 3px 0px;border-color: white;border-radius: 1px;border-style: solid;height: calc(3 * var(--spacing));width: calc(1.5 * var(--spacing));}label input[type="checkbox"].checkbox:indeterminate {--tw-bg-opacity: 1;background-color: rgba(242, 242, 242, var(--tw-bg-opacity));}label input[type="checkbox"].checkbox:indeterminate:before {background-color: var(--secondary);height: 0.375rem;top: 0.45rem;left: 0.15rem;width: calc(4 * var(--spacing));}label input[type="checkbox"].switch {min-width: 3.2em;width: 3.2em;height: 1.7em;display: inline-block;position: relative;}label input[type="checkbox"].switch:before {-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5;width: 1.2em;height: 1.2em;left: calc(0.25em - 2px);top: calc(0.25em - 2px);box-shadow: 0 0 0.1rem var(--background-light-grey);background-color: var(--secondary);position: absolute;}label input[type="checkbox"].switch:checked:before {-webkit-transform: translateX(1.5em);-moz-transform: translateX(1.5em);-ms-transform: translateX(1.5em);transform: translateX(1.5em);--tw-bg-opacity: 1;background-color: rgba(252, 252, 252, var(--tw-bg-opacity));}label input[type="checkbox"].switch:indeterminate {--tw-bg-opacity: 1;background-color: rgba(242, 242, 242, var(--tw-bg-opacity));}label input[type="checkbox"].switch:indeterminate:before {-webkit-transform: translateX(0.75em);-moz-transform: translateX(0.75em);-ms-transform: translateX(0.75em);transform: translateX(0.75em);}',
68
- "KOL-INPUT-RADIO": '/* INPUT */:host input:focus {outline-color: var(--primary) !important;outline-offset: 2px;outline-style: solid;outline-width: 3px;}label {color: var(--default-letter);font-size: 14px;line-height: 20px;gap: 8px;width: 100%;}input {width: 100%;color: var(--default-letter);border-color: var(--default-border);border-width: 2px;border-style: solid;border-radius: 5px; /* padding: 10px 14px; */line-height: 24px;font-size: 16px;}input:hover {border-color: var(--default-border-hover);}kol-alert {display: block;width: 100%;}.kol-required span::after {content: "*";}/* RADIO */:host fieldset {border: 0px;margin: 0px;padding: 0px;display: grid;gap: 0.25em;}:host fieldset legend {display: block;width: 100%;line-height: 1.5em;}:host fieldset div {cursor: pointer;display: flex;flex-direction: row;gap: 0.5em;margin-top: 0.25em;margin-bottom: 0.25em;align-items: center;position: relative;}:host fieldset div label {cursor: pointer;display: flex;width: 100%;}:host fieldset div label span {margin-top: 0.125em;}:host fieldset div input[type="radio"] {appearance: none;transition: 0.5s;border-radius: 100%;height: calc(6 * var(--spacing));min-width: calc(6 * var(--spacing));width: calc(6 * var(--spacing));}:host fieldset div input[type="radio"]:before {content: "";cursor: pointer;left: calc(1.5 * var(--spacing) - 2px);top: calc(1.5 * var(--spacing) - 2px);position: relative;border-radius: 100%;display: block;height: calc(3 * var(--spacing));width: calc(3 * var(--spacing));}:host fieldset div input[type="radio"]:checked:before {box-shadow: 0 0 0.1rem black;background-color: var(--secondary);}:host fieldset div input[type="radio"]:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}',
69
- "KOL-LINK-GROUP": "nav {background-color: white;}ul {list-style: none;margin: 0px;padding: 0px;}nav.horizontal ul {display: flex;flex-wrap: wrap;}li {margin-left: 1rem;margin-right: 0.5rem;}li.list-none {list-style-type: none !important;margin-left: 0;}",
70
- "KOL-TOAST": ":host > div {display: fixed;top: 0;left: 0;width: 100%;height: 0;z-index: 50;}:host > div > kol-alert {display: block;padding: 1em;margin: auto;max-width: 750px;}"
43
+ "GLOBAL": ":host {--kolibri-border-color: unset;--kolibri-border-radius: unset;--kolibri-border-width: unset;--kolibri-color-error: unset;--kolibri-color-info: unset;--kolibri-color-success: unset;--kolibri-color-warning: unset;--kolibri-color-primary: unset;--kolibri-color-secondary: unset;--kolibri-color-normal: unset;--kolibri-color-danger: unset;--kolibri-color-ghost: unset;--kolibri-color-disabled: unset;--kolibri-color-text: unset;--kolibri-color-visited: unset;--kolibri-font-family: BundesSansWeb-Regular, Arial, Helvetica, sans-serif;--kolibri-font-family-heading: BundesSerifWeb-Regular, BundesSansWeb-Regular,Arial, Helvetica, sans-serif;--kolibri-font-size: unset;--kolibri-spacing: unset;}:host {--color-blue: #0077b6;--color-blue-80: #3392c5;--color-blue-60: #66add3;--color-blue-40: #99c9e2;--color-blue-20: #cce4f0;--color-darkblue: #004b76;--color-darkblue-80: #336f91;--color-darkblue-60: #6693ad;--color-darkblue-40: #99b7c8;--color-darkblue-20: #ccdbe4;}@keyframes blinker {50% {opacity: 0.25;}}",
44
+ "KOL-BUTTON": "",
45
+ "KOL-INPUT-TEXT": "",
46
+ "KOL-INPUT-PASSWORD": "",
47
+ "KOL-INPUT-NUMBER": "",
48
+ "KOL-INPUT-EMAIL": "",
49
+ "KOL-INPUT-FILE": "",
50
+ "KOL-TEXTAREA": "",
51
+ "KOL-ALERT": "",
52
+ "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {font-family: var(--kolibri-font-family-heading);}h1 {margin-bottom: 1.5rem;font-size: 2rem;font-weight: 400;line-height: 2.5rem;}@media (min-width: 64rem) {h1 {font-size: 2.875rem;line-height: 3.125rem;}}@media (min-width: 85.375rem) {h1 {font-size: 3.5rem;line-height: 4.5rem;}}h2 {margin-bottom: 1.5rem;font-size: 1.75rem;font-weight: 400;line-height: 2rem;color: var(--color-blue);}@media (min-width: 64rem) {h2 {font-size: 2.5rem;line-height: 3rem;}}@media (min-width: 85.375rem) {h2 {font-size: 2.875rem;line-height: 3.125rem;}}h3 {margin-bottom: 1.5rem;font-size: 1.625rem;font-weight: 400;line-height: 2rem;color: var(--color-blue);/*color: #111314;*/}@media (min-width: 64rem) {h3 {font-size: 1.75rem;line-height: 2.25rem;}}@media (min-width: 85.375rem) {h3 {font-size: 2rem;line-height: 2.625rem;}}h4 {margin-bottom: 1.5rem;font-size: 1.5rem;font-weight: 400;line-height: 1.75rem;color: var(--color-blue);}@media (min-width: 64rem) {h4 {font-size: 1.625rem;line-height: 1.875rem;}}@media (min-width: 85.375rem) {h4 {font-size: 1.75rem;line-height: 2.25rem;}}h5 {margin-bottom: 1.5rem;font-size: 1.1875rem;font-weight: 400;line-height: 1.75rem;color: var(--color-darkblue);}@media (min-width: 64rem) {h5 {font-size: 1.375rem;line-height: 1.875rem;}}@media (min-width: 85.375rem) {h5 {font-size: 1.5rem;line-height: 2.125rem;}}h6 {color: #f0f;animation: blinker 0.25s linear infinite;}",
53
+ "KOL-BADGE": ":host {--kolibri-spacing: 0.25rem;}:host > span > kol-span-wc {font: normal normal var(--font-weight) 0.875rem/1rem var(--font-family);padding: calc(0.5rem - 1px) calc(0.75rem - 1px);text-transform: uppercase;}",
54
+ "KOL-BUTTON-GROUP": "",
55
+ "KOL-INDENTED-TEXT": "",
56
+ "KOL-LINK": "",
57
+ "KOL-BREADCRUMB": "",
58
+ "KOL-DETAILS": "",
59
+ "KOL-SPIN": "",
60
+ "KOL-PROGRESS": "",
61
+ "KOL-SELECT": "",
62
+ "KOL-INPUT-COLOR": "",
63
+ "KOL-ACCORDION": "",
64
+ "KOL-TABLE": "",
65
+ "KOL-NAV": "",
66
+ "KOL-CARD": "",
67
+ "KOL-INPUT-CHECKBOX": "",
68
+ "KOL-INPUT-RADIO": "",
69
+ "KOL-LINK-GROUP": "",
70
+ "KOL-TOAST": ""
71
71
  });
72
72
 
73
73
  const BZSt = KoliBri.createTheme("bzst", {
@@ -180,7 +180,7 @@ const DESYv2 = KoliBri.createTheme("desy-v2", {
180
180
  });
181
181
 
182
182
  const ECL_EC = KoliBri.createTheme("ecl-ec", {
183
- GLOBAL: ":host {--kolibri-border-color: unset;--kolibri-border-radius: unset;--kolibri-border-width: unset;--kolibri-color-error: unset;--kolibri-color-info: unset;--kolibri-color-success: unset;--kolibri-color-warning: unset;--kolibri-color-primary: unset;--kolibri-color-secondary: unset;--kolibri-color-normal: unset;--kolibri-color-danger: unset;--kolibri-color-ghost: unset;--kolibri-color-disabled: unset;--kolibri-color-text: unset;--kolibri-color-visited: unset;--kolibri-font-family: unset;--kolibri-font-size: unset;--kolibri-spacing: unset;}:host {--color-blue: #004494;--color-yellow: #ffd617;--color-grey: #404040;--color-blue-130: #002f67;--color-blue-120: #003776;--color-blue-110: #003d84;--color-blue-100: var(--color-blue);--color-blue-75: #4073af;--color-blue-50: #bfd0e4;--color-blue-25: #bfd0e4;--color-blue-5: #f2f5f9;--color-yellow-120: #f8ae21;--color-yellow-110: #fbc11d;--color-yellow-100: var(--color-yellow);--color-yellow-75: #ffde39;--color-yellow-50: #ffe879;--color-yellow-25: #fff4bb;--color-grey-100: var(--color-grey);--color-grey-75: #707070;--color-grey-50: #9f9f9f;--color-grey-25: #cfcfcf;--color-grey-20: #d9d9d9;--color-grey-15: #e3e3e3;--color-grey-10: #ebebeb;--color-grey-5: #f5f5f5;--color-grey-3: #f9f9f9;--color-blue-n: #006fb4;--color-orange: #f29527;--color-green: #467a39;--color-red: #da2131;--color-red-1xx: #981722;--color-black: #000;--color-white: #fff;--font-family: Arial, sans-serif;--font-size: 16px;--font-weight: 400;--font-weight-bold: 600;--line-height: 1.5em;--line-height-heading: 1.2em; /* ?! */--spacing-4xl: 64px;--spacing-3xl: 48px;--spacing-2xl: 40px;--spacing-xl: 32px;--spacing-l: 24px;--spacing-m: 16px;--spacing-s: 12px;--spacing-xs: 8px;--spacing-2xs: 4px; /* ?! */}:host {font-family: var(--font-family);font-size: var(--font-size);}a,button {font-size: var(--font-size);outline: none;}h1,h2,h3,h4,h5,h6 {font-weight: var(--font-weight-bold);line-height: var(--line-height-heading);}p {font-weight: var(--font-weight);}",
183
+ GLOBAL: ":host {--kolibri-border-color: unset;--kolibri-border-radius: unset;--kolibri-border-width: unset;--kolibri-color-error: unset;--kolibri-color-info: unset;--kolibri-color-success: unset;--kolibri-color-warning: unset;--kolibri-color-primary: unset;--kolibri-color-secondary: unset;--kolibri-color-normal: unset;--kolibri-color-danger: unset;--kolibri-color-ghost: unset;--kolibri-color-disabled: unset;--kolibri-color-text: unset;--kolibri-color-visited: unset;--kolibri-font-family: unset;--kolibri-font-size: unset;--kolibri-spacing: unset;}:host {--color-blue: #004494;--color-yellow: #ffd617;--color-grey: #404040;--color-blue-130: #002f67;--color-blue-120: #003776;--color-blue-110: #003d84;--color-blue-100: var(--color-blue);--color-blue-75: #4073af;--color-blue-50: #bfd0e4;--color-blue-25: #bfd0e4;--color-blue-5: #f2f5f9;--color-yellow-120: #f8ae21;--color-yellow-110: #fbc11d;--color-yellow-100: var(--color-yellow);--color-yellow-75: #ffde39;--color-yellow-50: #ffe879;--color-yellow-25: #fff4bb;--color-grey-100: var(--color-grey);--color-grey-75: #707070;--color-grey-50: #9f9f9f;--color-grey-25: #cfcfcf;--color-grey-20: #d9d9d9;--color-grey-15: #e3e3e3;--color-grey-10: #ebebeb;--color-grey-5: #f5f5f5;--color-grey-3: #f9f9f9;--color-blue-n: #006fb4;--color-orange: #f29527;--color-green: #467a39;--color-red: #da2131;--color-red-1xx: #981722;--color-black: #000;--color-white: #fff;--font-family: Arial, sans-serif;--font-size: 16px;--font-weight: 400;--font-weight-bold: 600;--line-height: 1.5em;--line-height-heading: 1.2em; /* ?! */--spacing-4xl: 64px;--spacing-3xl: 48px;--spacing-2xl: 40px;--spacing-xl: 32px;--spacing-l: 24px;--spacing-m: 16px;--spacing-s: 12px;--spacing-xs: 8px;--spacing-2xs: 4px; /* ?! */}:host {display: inline-block;font-family: var(--font-family);font-size: var(--font-size);}a,button {font-size: var(--font-size);outline: none;}h1,h2,h3,h4,h5,h6 {font-weight: var(--font-weight-bold);line-height: var(--line-height-heading);}p {font-weight: var(--font-weight);}",
184
184
  "KOL-HEADING": "h1 {font-size: 2rem;line-height: 2.5rem;}h2 {font-size: 1.75rem;line-height: 2rem;}h3 {font-size: 1.5rem;line-height: 1.75rem;}h4 {font-size: 1.25rem;line-height: 1.75rem;}h5 {font-size: 1rem;line-height: 1.5rem;}h6 {color: rgb(234, 0, 255);}",
185
185
  "KOL-ACCORDION": ':host > div {background-color: var(--color-grey-5);border-color: var(--color-grey-25);border-style: solid;border-width: 1px;}:host > div .headline button {text-align: left;width: 100%;padding: 0 var(--spacing-m);display: flex;place-items: center;}:host > div .headline button kol-icon {margin-bottom: 0.75rem;margin-inline-end: 1rem;margin-inline-start: 0;margin-top: 0.75rem;}:host > div .headline button span {color: var(--color-grey);font-weight: var(--font-weight-bold);padding: 0.75rem 0;width: 100%;}:host > div[part*="open"] .headline button span {border-bottom: 1px solid var(--color-grey);}:host > div .headline button:focus,:host > div .headline button:hover {background-color: var(--color-grey-25);}:host > div .headline button:focus {outline: 2px solid var(--color-blue);outline-offset: -2px;}div[part="content"] {padding: var(--spacing-s) var(--spacing-m);}',
186
186
  "KOL-INDENTED-TEXT": ":host > div {border-end-start-radius: 0;border-inline-start: 10px solid #ffd617;border-start-start-radius: 0;padding-bottom: 1rem;padding-inline-start: 1.5rem;padding-top: 1rem;margin: 0;}",
@@ -195,12 +195,32 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
195
195
  "KOL-DETAILS": "details > kol-indented-text {margin: 0.175rem;padding: 0;}",
196
196
  "KOL-PROGRESS": ":host progress,:host span {display: block;height: 0px;overflow: hidden;width: 0px;}svg line:first-child,svg circle:first-child {fill: transparent;stroke: var(--color-grey-25);}svg line:last-child,svg circle:last-child {stroke: var(--color-blue-130);fill: transparent;}progress {display: none;}",
197
197
  "KOL-SPIN": ".spin span:nth-child(1) {background-color: var(--color-blue-75);}.spin span:nth-child(2) {background-color: var(--color-blue);}.spin span:nth-child(3) {background-color: var(--color-blue-130);}.spin span:nth-child(4) {background-color: var(--color-grey-25);}",
198
- "KOL-PAGINATION": ":host {--kolibri-spacing: var(--spacing-m);}:host {display: grid;gap: 1rem;}:host > div {display: inline-flex;flex-wrap: wrap;align-items: center;gap: 0.5em;}button > kol-span-wc {border: none;color: var(--color-black);font-weight: var(--font-weight-bold);}",
199
- "KOL-INPUT-CHECKBOX": 'input[type="checkbox"] {background-color: var(--color-white);border-width: 2px;border-style: solid;color: var(--color-grey);line-height: 1.5em;font-size: 1rem;}input[type="checkbox"]:focus {outline-color: var(--color-blue);outline-offset: 2px;outline-style: solid;outline-width: 2px;}input[type="checkbox"] {border-color: var(--color-grey-75);}input[type="checkbox"]:checked {background-color: var(--color-blue);border-color: var(--color-blue);}input[type="checkbox"]:hover {border-color: var(--color-blue);}input[type="checkbox"]:checked:hover {background-color: var(--color-blue-130);border-color: var(--color-blue-130);}input[type="checkbox"]:indeterminate:hover::before {background-color: var(--color-blue-130);}.error input[type="checkbox"] {border-color: var(--color-red);}.error input[type="checkbox"]:checked {background-color: var(--color-red);border-color: var(--color-red);}.error input[type="checkbox"]:hover {border-color: var(--color-red);}.error input[type="checkbox"]:checked:hover {background-color: var(--color-red-1xx);border-color: var(--color-red-1xx);}.error input[type="checkbox"]:checked:hover::before {border-color: var(--color-white);}.error input[type="checkbox"]:indeterminate:hover::before {background-color: var(--color-red-1xx);}.error.required label > span::after {color: var(--color-red);}.switch input[type="checkbox"]::before,.switch input[type="checkbox"]:indeterminate::before {background-color: var(--color-grey-75);}.switch input[type="checkbox"]:hover::before,.switch input[type="checkbox"]:indeterminate:hover::before {background-color: var(--color-blue);}.switch input[type="checkbox"]:checked::before,.switch input[type="checkbox"]:checked:hover::before {background-color: var(--color-white);}.switch.error input[type="checkbox"]::before {background-color: var(--color-red);}.switch.error input[type="checkbox"]:checked::before {background-color: var(--color-white);}.switch.error input[type="checkbox"]:indeterminate:hover::before {background-color: var(--color-red-1xx);}kol-input {gap: var(--spacing-xs);}kol-input.error > kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-2xs));order: 1;}kol-input.error > .input {order: 2;}kol-input.error > label {order: 3;}kol-input.error > .hint {font-size: 0.875rem;order: 4;}',
200
- "KOL-INPUT-COLOR": "kol-input.error > kol-alert {color: var(--color-red);font-size: 0.875rem;margin-left: calc(-1 * var(--spacing-2xs));order: 1;}"
198
+ "KOL-PAGINATION": ":host {display: grid;gap: var(--spacing-m);}:host > div {display: inline-flex;flex-wrap: wrap;align-items: center;gap: var(--spacing-xs);}.selected button {min-width: 44px;min-height: 44px;display: grid;line-height: 1.5rem;font-family: var(--font-family);cursor: not-allowed;font-weight: 700;padding: 10px 12px;border: none;font-size: 16px;font-style: normal;text-align: center;text-decoration: underline;text-transform: uppercase;width: inherit;color: var(--color-white);background-color: var(--color-blue);border-color: var(--color-blue);}",
199
+ "KOL-INPUT-CHECKBOX": 'input[type="checkbox"] {background-color: var(--color-white);border-width: 2px;border-style: solid;color: var(--color-grey);line-height: 1.5em;font-size: 1rem;}input[type="checkbox"]:focus {outline-color: var(--color-blue);outline-offset: 2px;outline-style: solid;outline-width: 2px;}input[type="checkbox"] {border-color: var(--color-grey-75);}input[type="checkbox"]:checked {background-color: var(--color-blue);border-color: var(--color-blue);}input[type="checkbox"]:hover {border-color: var(--color-blue);}input[type="checkbox"]:checked:hover {background-color: var(--color-blue-130);border-color: var(--color-blue-130);}input[type="checkbox"]:indeterminate:hover::before {background-color: var(--color-blue-130);}.error input[type="checkbox"] {border-color: var(--color-red);}.error input[type="checkbox"]:checked {background-color: var(--color-red);border-color: var(--color-red);}.error input[type="checkbox"]:hover {border-color: var(--color-red);}.error input[type="checkbox"]:checked:hover {background-color: var(--color-red-1xx);border-color: var(--color-red-1xx);}.error input[type="checkbox"]:checked:hover::before {border-color: var(--color-white);}.error input[type="checkbox"]:indeterminate:hover::before {background-color: var(--color-red-1xx);}.error.required label > span::after {color: var(--color-red);}.switch input[type="checkbox"]::before,.switch input[type="checkbox"]:indeterminate::before {background-color: var(--color-grey-75);}.switch input[type="checkbox"]:hover::before,.switch input[type="checkbox"]:indeterminate:hover::before {background-color: var(--color-blue);}.switch input[type="checkbox"]:checked::before,.switch input[type="checkbox"]:checked:hover::before {background-color: var(--color-white);}.switch.error input[type="checkbox"]::before {background-color: var(--color-red);}.switch.error input[type="checkbox"]:checked::before {background-color: var(--color-white);}.switch.error input[type="checkbox"]:indeterminate:hover::before {background-color: var(--color-red-1xx);}kol-input {gap: var(--spacing-xs);}kol-input > .input {order: 2;}kol-input > label {order: 3;}kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-2xs));order: 1;}.hint {font-size: 0.875rem;order: 4;}',
200
+ "KOL-INPUT-COLOR": 'kol-input {color: var(--color-grey);gap: var(--spacing-xs);}label {font-weight: var(--font-weight-bold);order: 1;}.hint {font-size: 0.875rem;order: 2;}kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-2xs));order: 3;}.input {order: 4;}input,select,textarea {border: 1px solid #707070;color: var(--color-grey);}input::placeholder,textarea::placeholder {color: var(--color-grey-50);}input:focus,select:focus,textarea:focus {box-shadow: inset 1px 1px #004494, inset -1px -1px #004494;outline: none;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: #004494 !important;}.disabled input,.disabled label,.disabled select,.disabled textarea {opacity: 0.5;}.error input,.error select,.error textarea {border-color: var(--color-red);}.required label > span::after,.required legend > span::after {color: var(--color-red);content: "*";padding-left: var(--spacing-2xs);}',
201
+ "KOL-CARD": ":host > div {display: grid;width: 100%;height: 100%;background-color: white;grid-template-rows: min-content 2fr min-content;box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);}:host kol-heading-wc {display: inline-flex;font-style: normal;font-weight: 700;font-size: 1.25em;line-height: 1.75em;}:host div.header {padding: var(--spacing-m) var(--spacing-m) var(--spacing-xs) var(--spacing-m);}:host div.content {padding: var(--spacing-xs) var(--spacing-m) var(--spacing-m);overflow: hidden;}:host div.footer {padding: var(--spacing-xs) var(--spacing-m);}:host > div > div.content + div.footer {border-top: 2px solid var(--color-blue);}",
202
+ "KOL-BUTTON-GROUP": ":host > kol-button-group-wc {display: inline-flex;flex-wrap: wrap;gap: var(--spacing-2xs);}",
203
+ "KOL-INPUT-RADIO": ':host {--kolibri-spacing: 0.25rem;}fieldset kol-alert {order: 1;}fieldset .hint {order: 2;}fieldset kol-alert {order: 3;}fieldset kol-input {order: 4;}input[type="radio"] {border: 2px solid #707070;}input[type="radio"]:before {display: none;}input[type="radio"]:checked {border-color: #004494;border-width: 7px;}input[type="radio"]:focus {outline: 2px solid #004494;outline-offset: 2px;}input[type="radio"]:not(:disabled):hover {border-color: #004494;}label,legend {color: #404040;font-size: 1rem;}legend {font-weight: var(--font-weight-bold);}.error input[type="radio"] {border: 2px solid var(--color-red);}.error input[type="radio"]:before {display: none;}.error input[type="radio"]:checked {border-color: var(--color-red);border-width: 7px;}.error input[type="radio"]:not(:disabled):hover {border-color: var(--color-red-1xx);}kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-xs));order: 1;}.hint {font-size: 0.875rem;order: 4;}.disabled input,.disabled label {opacity: 0.5;}.required label span::after,.required legend span::after {color: var(--color-red);content: "*";padding-left: var(--spacing-2xs);}',
204
+ "KOL-INPUT-RANGE": 'input[type="range"] {appearance: none;-webkit-appearance: none;-moz-appearance: none;}input[type="range"] {overflow: visible;background-color: var(--color-grey-20);border: 0;height: 0.5rem;padding: 0;padding-bottom: 0;margin-bottom: 0;}input[type="range"]::-webkit-slider-thumb {box-sizing: border-box;background-color: var(--color-blue);height: 20px;width: 20px;border-radius: 20px;cursor: pointer;-webkit-appearance: none;}',
205
+ "KOL-INPUT-TEXT": 'kol-input {color: var(--color-grey);gap: var(--spacing-xs);}label {font-weight: var(--font-weight-bold);order: 1;}.hint {font-size: 0.875rem;order: 2;}kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-2xs));order: 3;}.input {order: 4;}input,select,textarea {border: 1px solid #707070;color: var(--color-grey);}input::placeholder,textarea::placeholder {color: var(--color-grey-50);}input:focus,select:focus,textarea:focus {box-shadow: inset 1px 1px #004494, inset -1px -1px #004494;outline: none;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: #004494 !important;}.disabled input,.disabled label,.disabled select,.disabled textarea {opacity: 0.5;}.error input,.error select,.error textarea {border-color: var(--color-red);}.required label > span::after,.required legend > span::after {color: var(--color-red);content: "*";padding-left: var(--spacing-2xs);}',
206
+ "KOL-INPUT-PASSWORD": 'kol-input {color: var(--color-grey);gap: var(--spacing-xs);}label {font-weight: var(--font-weight-bold);order: 1;}.hint {font-size: 0.875rem;order: 2;}kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-2xs));order: 3;}.input {order: 4;}input,select,textarea {border: 1px solid #707070;color: var(--color-grey);}input::placeholder,textarea::placeholder {color: var(--color-grey-50);}input:focus,select:focus,textarea:focus {box-shadow: inset 1px 1px #004494, inset -1px -1px #004494;outline: none;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: #004494 !important;}.disabled input,.disabled label,.disabled select,.disabled textarea {opacity: 0.5;}.error input,.error select,.error textarea {border-color: var(--color-red);}.required label > span::after,.required legend > span::after {color: var(--color-red);content: "*";padding-left: var(--spacing-2xs);}',
207
+ "KOL-INPUT-NUMBER": 'kol-input {color: var(--color-grey);gap: var(--spacing-xs);}label {font-weight: var(--font-weight-bold);order: 1;}.hint {font-size: 0.875rem;order: 2;}kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-2xs));order: 3;}.input {order: 4;}input,select,textarea {border: 1px solid #707070;color: var(--color-grey);}input::placeholder,textarea::placeholder {color: var(--color-grey-50);}input:focus,select:focus,textarea:focus {box-shadow: inset 1px 1px #004494, inset -1px -1px #004494;outline: none;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: #004494 !important;}.disabled input,.disabled label,.disabled select,.disabled textarea {opacity: 0.5;}.error input,.error select,.error textarea {border-color: var(--color-red);}.required label > span::after,.required legend > span::after {color: var(--color-red);content: "*";padding-left: var(--spacing-2xs);}',
208
+ "KOL-INPUT-EMAIL": 'kol-input {color: var(--color-grey);gap: var(--spacing-xs);}label {font-weight: var(--font-weight-bold);order: 1;}.hint {font-size: 0.875rem;order: 2;}kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-2xs));order: 3;}.input {order: 4;}input,select,textarea {border: 1px solid #707070;color: var(--color-grey);}input::placeholder,textarea::placeholder {color: var(--color-grey-50);}input:focus,select:focus,textarea:focus {box-shadow: inset 1px 1px #004494, inset -1px -1px #004494;outline: none;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: #004494 !important;}.disabled input,.disabled label,.disabled select,.disabled textarea {opacity: 0.5;}.error input,.error select,.error textarea {border-color: var(--color-red);}.required label > span::after,.required legend > span::after {color: var(--color-red);content: "*";padding-left: var(--spacing-2xs);}',
209
+ "KOL-INPUT-FILE": 'kol-input {color: var(--color-grey);gap: var(--spacing-xs);}label {font-weight: var(--font-weight-bold);order: 1;}.hint {font-size: 0.875rem;order: 2;}kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-2xs));order: 3;}.input {order: 4;}input,select,textarea {border: 1px solid #707070;color: var(--color-grey);}input::placeholder,textarea::placeholder {color: var(--color-grey-50);}input:focus,select:focus,textarea:focus {box-shadow: inset 1px 1px #004494, inset -1px -1px #004494;outline: none;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: #004494 !important;}.disabled input,.disabled label,.disabled select,.disabled textarea {opacity: 0.5;}.error input,.error select,.error textarea {border-color: var(--color-red);}.required label > span::after,.required legend > span::after {color: var(--color-red);content: "*";padding-left: var(--spacing-2xs);}',
210
+ "KOL-SELECT": 'kol-input {color: var(--color-grey);gap: var(--spacing-xs);}label {font-weight: var(--font-weight-bold);order: 1;}.hint {font-size: 0.875rem;order: 2;}kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-2xs));order: 3;}.input {order: 4;}input,select,textarea {background-color: transparent;border: 1px solid #707070;color: var(--color-grey);margin: 0;padding: 0;position: relative;z-index: 100;}input::placeholder,textarea::placeholder {color: var(--color-grey-50);}input:focus,select:focus,textarea:focus {box-shadow: inset 1px 1px #004494, inset -1px -1px #004494;outline: none;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: #004494 !important;}.disabled input,.disabled label,.disabled select,.disabled textarea {opacity: 0.5;}.error input,.error select,.error textarea {border-color: var(--color-red);}.required label > span::after,.required legend > span::after {color: var(--color-red);content: "*";padding-left: var(--spacing-2xs);}.icons kol-icon:last-child {background-color: var(--color-grey);color: var(--color-white);}kol-input:has(.icons + select:hover) .icons kol-icon:last-child {background-color: var(--color-blue);}option:focus,option:hover {background-color: var(--color-blue-25);}option:checked,option:selected {background-color: var(--color-blue);color: var(--color-white);}',
211
+ "KOL-TEXTAREA": 'kol-input {color: var(--color-grey);gap: var(--spacing-xs);}label {font-weight: var(--font-weight-bold);order: 1;}.hint {font-size: 0.875rem;order: 2;}kol-alert {color: var(--color-red);font-size: 0.875em;margin-left: calc(-1 * var(--spacing-2xs));order: 3;}.input {order: 4;}input,select,textarea {border: 1px solid #707070;color: var(--color-grey);}input::placeholder,textarea::placeholder {color: var(--color-grey-50);}input:focus,select:focus,textarea:focus {box-shadow: inset 1px 1px #004494, inset -1px -1px #004494;outline: none;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: #004494 !important;}.disabled input,.disabled label,.disabled select,.disabled textarea {opacity: 0.5;}.error input,.error select,.error textarea {border-color: var(--color-red);}.required label > span::after,.required legend > span::after {color: var(--color-red);content: "*";padding-left: var(--spacing-2xs);}'
201
212
  });
202
213
 
203
- const ECL_EU = KoliBri.createTheme("ecl-eu", {});
214
+ const ECL_EU = KoliBri.createTheme("ecl-eu", {
215
+ GLOBAL: "/* kolibri unset */:host {--kolibri-border-color: unset;--kolibri-border-radius: unset;--kolibri-border-width: unset;--kolibri-color-error: unset;--kolibri-color-info: unset;--kolibri-color-success: unset;--kolibri-color-warning: unset;--kolibri-color-primary: unset;--kolibri-color-secondary: unset;--kolibri-color-normal: unset;--kolibri-color-danger: unset;--kolibri-color-ghost: unset;--kolibri-color-disabled: unset;--kolibri-color-text: unset;--kolibri-color-visited: unset;--kolibri-font-family: unset;--kolibri-font-size: unset;--kolibri-spacing: unset;}/* properties */:host {--color-blue: #0e47cb;--color-blue-140: #082b7a;--color-blue-130: #082b7a;--color-blue-120: #0b39a2;--color-blue-110: #0d40b7;--color-blue-100: #0e47cb;--color-blue-80: #3e6cd5;--color-blue-60: #6e91e0;--color-blue-40: #9fb5ea;--color-blue-20: #cfdaf5;--color-blue-10: #e7edfa;--color-blue-5: #f3f6fc;--color-yellow: #ffcc00;--color-yellow-140: #997a00;--color-yellow-130: #b38f00;--color-yellow-120: #cca300;--color-yellow-110: #e6b800;--color-yellow-100: #ffcc00;--color-yellow-80: #ffd633;--color-yellow-60: #ffe066;--color-yellow-40: #ffeb99;--color-yellow-20: #fff5cc;--color-yellow-10: #fffae6;--color-yellow-5: #fffcf2;--color-grey: #262b38;--color-grey-140: #171a22;--color-grey-130: #1b1e27;--color-grey-120: #1e222d;--color-grey-110: #222732;--color-grey-100: #262b38;--color-grey-80: #515560;--color-grey-60: #7d8088;--color-grey-40: #a8aaaf;--color-grey-20: #d4d5d7;--color-grey-10: #e9eaeb;--color-grey-5: #f4f5f5;--color-grey-3: #f9f9f9;--color-orange: #ff6200;--color-orange-140: #993b00;--color-orange-130: #b34500;--color-orange-120: #cc4e00;--color-orange-110: #e65800;--color-orange-100: #e65800;--color-orange-80: #ff8133;--color-orange-60: #ff914d;--color-orange-40: #ffb180;--color-orange-20: #ffd0b3;--color-orange-10: #ffefe6;--color-orange-5: #fff7f2;--color-green: #00c991;--color-green-140: #007957;--color-green-130: #008d66;--color-green-120: #008d66;--color-green-110: #00b583;--color-green-100: #00c991;--color-green-80: #00c991;--color-green-60: #66dfbd;--color-green-40: #99e9d3;--color-green-20: #ccf4e9;--color-green-10: #e6faf4;--color-green-5: #f2fcf9;--color-red: #ef0044;--color-red-140: #8f0029;--color-red-130: #a70030;--color-red-120: #bf0036;--color-red-110: #d7003d;--color-red-100: #ef0044;--color-red-80: #f23369;--color-red-60: #f5668f;--color-red-40: #f999b4;--color-red-20: #fcccda;--color-red-10: #fde6ec;--color-red-5: #fef2f5;--color-accent-blue-100: #00e9ff;--color-accent-blue-30: #b3f8ff;--color-purple: #510dcd;--color-purple-140: #31087b;--color-purple-130: #390990;--color-purple-120: #410aa4;--color-purple-110: #490cb9;--color-purple-100: #510dcd;--color-purple-80: #743dd7;--color-purple-60: #976ee1;--color-purple-40: #bf9af1;--color-purple-20: #dccff5;--color-purple-10: #eee7fa;--color-purple-5: #eee7fa;--color-white: #fff;--color-black: #000;--font-family: Arial, sans-serif;--font-size: 16px;--font-weight-regular: 400;--font-weight-bold: 700;--line-height-regular: 1.5em;--line-height-heading: 1.2em;--spacing-4xl: 64px;--spacing-3xl: 48px;--spacing-2xl: 40px;--spacing-xl: 32px;--spacing-l: 24px;--spacing-m: 16px;--spacing-s: 12px;--spacing-xs: 8px;--spacing-2xs: 4px; /* ?! */}/* preset */:host {font-family: var(--font-family);font-size: var(--font-size);font-weight: var(--font-weight-regular);}p.l,p.lead {font-size: 1.25rem;line-height: 1.75rem;}p,p.m,p.medium {font-size: 1rem;line-height: 1.5rem;}p.s,p.small {font-size: 0.875rem;line-height: 1.25rem;}p.xs,p.extra-small {font-size: 0.75rem;line-height: 1.25rem;}",
216
+ "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {font-weight: var(--font-weight-bold);}h1 {font-size: 2.625rem;line-height: 3.25rem;}h2 {font-size: 2.25rem;line-height: 2.75rem;}h3 {font-size: 2rem;line-height: 2.5rem;}h4 {font-size: 1.75rem;line-height: 2rem;}h5 {font-size: 1.5rem;line-height: 1.75rem;}h6 {font-size: 1.25rem;line-height: 1.75rem;}",
217
+ "KOL-ACCORDION": '.accordion,div[part*="accordion"] {border-radius: 8px;box-shadow: 0 2px 4px rgb(9 49 142 / 8%), 0 0 10px rgb(9 49 142 / 4%),0 4px 5px rgb(9 49 142 / 4%), 0 -4px 4px rgb(9 49 142 / 4%);margin: 0;overflow: hidden;}.headline {font-size: 2em;}div[part*="close"] .headline button {border-radius: 8px;}div[part*="open"] .headline button {border-start-end-radius: 8px;border-start-start-radius: 8px;}.headline button {outline-offset: -1px;border: 0;border-bottom-color: #cfdaf5;border-bottom-style: solid;border-bottom-width: 2px;color: #171a22;position: relative;display: block;font: normal normal 400 1.125rem/1.75rem arial, sans-serif;padding: 1.5rem;text-align: start;width: 100%;}.headline button::before {background-color: #fc0;border-end-end-radius: 2px;border-end-start-radius: 2px;content: "";height: 4px;position: absolute;left: 1.5rem;top: 0;width: 32px;}.headline button kol-icon {margin-right: 0.75rem;}.headline button kol-icon::part(icon)::before {color: #0e47cb;font-family: "Font Awesome 6 Free";}.headline button kol-icon::part(close)::before {content: "\\f077";}.headline button kol-icon::part(open)::before {content: "\\f078";}.content,div[part="content"] {-webkit-border-start: 4px solid #0e47cb;-webkit-margin-start: 0;border-bottom: 2px solid #cfdaf5;border-inline-start: 4px solid #0e47cb;color: #515560;font: normal normal 400 1rem/1.5rem arial, sans-serif;margin-inline-start: 0;padding: 1.5rem;}',
218
+ "KOL-INDENTED-TEXT": ":host > div {-webkit-border-start: 8px solid #0e47cb;-webkit-padding-start: 1.5rem;border-end-start-radius: 4px;border-inline-start: 8px solid #0e47cb;border-start-start-radius: 4px;display: inline-block;padding-bottom: 1rem;padding-inline-start: 1.5rem;padding-top: 1rem;}",
219
+ "KOL-BUTTON": ":host {--kolibri-spacing: 0.25rem;}a,button {appearance: none;border-radius: 4px;text-decoration: none;}a:focus,button:focus {outline: none;}a > kol-span-wc,button > kol-span-wc {min-height: 44px;min-width: 44px;border-radius: 4px;font: normal normal 400 1rem/1.25rem arial, sans-serif;font-weight: 400;margin: 0;padding: 0.75rem;}a:focus-visible > kol-span-wc,button:focus-visible > kol-span-wc {outline-offset: -4px;outline-style: solid;outline-width: 2px;}a:active > kol-span-wc,button:active > kol-span-wc,a:hover > kol-span-wc,button:hover > kol-span-wc {box-shadow: 0 2px 4px rgb(9 49 142 / 8%), 0 0 10px rgb(9 49 142 / 4%),0 4px 5px rgb(9 49 142 / 4%), 0 -4px 4px rgb(9 49 142 / 4%);}.primary a > kol-span-wc,.primary button > kol-span-wc {background-color: #0e47cb;color: #fff;}.primary a:focus-visible > kol-span-wc,.primary button:focus-visible > kol-span-wc {outline-color: #fff;}.primary a:hover > kol-span-wc,.primary button:hover > kol-span-wc {background-color: #3e6cd5;}.secondary a > kol-span-wc,.secondary button > kol-span-wc {background-color: #fff;border: 2px solid #0e47cb;color: #0e47cb;padding: calc(0.75rem - 2px) calc(1rem - 2px);}.secondary a:focus-visible > kol-span-wc,.secondary button:focus-visible > kol-span-wc {box-shadow: inset 0 0 0 4px #0e47cb;outline-color: #fff;}.secondary a:hover > kol-span-wc,.secondary button:hover > kol-span-wc {border-color: #0e47cb;color: #0e47cb;}.normal a > kol-span-wc,.normal button > kol-span-wc {background-color: #fc0;color: #171a22;}.normal a:focus-visible > kol-span-wc,.normal button:focus-visible > kol-span-wc {outline-color: #000;}.normal a:hover > kol-span-wc,.normal button:hover > kol-span-wc {background-color: #fc0;border-color: #fc0;}.danger a kol-span-wc,.danger button kol-span-wc {background-color: var(--color-red);border-color: var(--color-red);color: var(--color-white);}.danger a:hover kol-span-wc,.danger button:hover kol-span-wc {background-color: var(--color-red);border-color: var(--color-red);}.ghost a > kol-span-wc,.ghost button > kol-span-wc {color: #0e47cb;}.ghost a:focus-visible > kol-span-wc,.ghost button:focus-visible > kol-span-wc {outline-color: #0e47cb;}.ghost a:hover > kol-span-wc,.ghost button:hover > kol-span-wc {color: #0e47cb;}",
220
+ "KOL-LINK-BUTTON": ":host {--kolibri-spacing: 0.25rem;}a,button {appearance: none;border-radius: 4px;text-decoration: none;}a:focus,button:focus {outline: none;}a > kol-span-wc,button > kol-span-wc {min-height: 44px;min-width: 44px;border-radius: 4px;font: normal normal 400 1rem/1.25rem arial, sans-serif;font-weight: 400;margin: 0;padding: 0.75rem;}a:focus-visible > kol-span-wc,button:focus-visible > kol-span-wc {outline-offset: -4px;outline-style: solid;outline-width: 2px;}a:active > kol-span-wc,button:active > kol-span-wc,a:hover > kol-span-wc,button:hover > kol-span-wc {box-shadow: 0 2px 4px rgb(9 49 142 / 8%), 0 0 10px rgb(9 49 142 / 4%),0 4px 5px rgb(9 49 142 / 4%), 0 -4px 4px rgb(9 49 142 / 4%);}.primary a > kol-span-wc,.primary button > kol-span-wc {background-color: #0e47cb;color: #fff;}.primary a:focus-visible > kol-span-wc,.primary button:focus-visible > kol-span-wc {outline-color: #fff;}.primary a:hover > kol-span-wc,.primary button:hover > kol-span-wc {background-color: #3e6cd5;}.secondary a > kol-span-wc,.secondary button > kol-span-wc {background-color: #fff;border: 2px solid #0e47cb;color: #0e47cb;padding: calc(0.75rem - 2px) calc(1rem - 2px);}.secondary a:focus-visible > kol-span-wc,.secondary button:focus-visible > kol-span-wc {box-shadow: inset 0 0 0 4px #0e47cb;outline-color: #fff;}.secondary a:hover > kol-span-wc,.secondary button:hover > kol-span-wc {border-color: #0e47cb;color: #0e47cb;}.normal a > kol-span-wc,.normal button > kol-span-wc {background-color: #fc0;color: #171a22;}.normal a:focus-visible > kol-span-wc,.normal button:focus-visible > kol-span-wc {outline-color: #000;}.normal a:hover > kol-span-wc,.normal button:hover > kol-span-wc {background-color: #fc0;border-color: #fc0;}.danger a kol-span-wc,.danger button kol-span-wc {background-color: var(--color-red);border-color: var(--color-red);color: var(--color-white);}.danger a:hover kol-span-wc,.danger button:hover kol-span-wc {background-color: var(--color-red);border-color: var(--color-red);}.ghost a > kol-span-wc,.ghost button > kol-span-wc {color: #0e47cb;}.ghost a:focus-visible > kol-span-wc,.ghost button:focus-visible > kol-span-wc {outline-color: #0e47cb;}.ghost a:hover > kol-span-wc,.ghost button:hover > kol-span-wc {color: #0e47cb;}",
221
+ "KOL-BUTTON-GROUP": ":host > kol-button-group-wc {gap: var(--spacing-2xs);}",
222
+ "KOL-PAGINATION": ":host > div {display: flex;gap: 0.25rem;}"
223
+ });
204
224
 
205
225
  const ITZBund = KoliBri.createTheme("itzbund", {
206
226
  GLOBAL: ":host {--kolibri-border-color: unset;--kolibri-border-radius: unset;--kolibri-border-width: unset;--kolibri-color-error: unset;--kolibri-color-info: unset;--kolibri-color-success: unset;--kolibri-color-warning: unset;--kolibri-color-primary: unset;--kolibri-color-secondary: unset;--kolibri-color-normal: unset;--kolibri-color-danger: unset;--kolibri-color-ghost: unset;--kolibri-color-disabled: unset;--kolibri-color-text: unset;--kolibri-color-visited: unset;--kolibri-font-family: unset;--kolibri-font-size: unset;--kolibri-spacing: unset;}:host {--border-color: var(--color-anthrazit);--border-radius: 0.125rem;--color-anthrazit: #333;--color-jade: #f3f7fb;--color-weiss: #fff;--color-petrol: #007a89;--color-achat: #0b4d59;--color-teal: #056773;--color-fluorit: #66ddec;--color-rotton: rgba(188, 0, 0, 1);--color-rotton-20: rgba(188, 0, 0, 0.2);--color-gras: #138510;--color-warn: #f0541e;--color-blut: var(--color-rotton);--color-input-bg-default: #e8edf2;--gradient-petrol-achat: linear-gradient(67deg,var(--color-petrol),var(--color-achat));--color-citrin: #d4c912;--color-umber: #494500;--color-gelb: #fff443;--color-lichtgelb: #eeff6c;--gradient-gelb-citrin: linear-gradient(67deg,var(--color-gelb),var(--color-citrin));--font-family-sans: BundesSans Web;--font-family-serif: BundesSerif Web;--font-size: 16px;--spacing: 0.125em;--kolibri-spacing: calc(2 * var(--spacing));}*[tabindex]:focus,a:focus,button:focus,input:focus,select:focus,summary:focus,textarea:focus {cursor: pointer;outline-color: var(--color-petrol);outline-offset: 2px;outline-style: solid;outline-width: 3px;transition: outline-offset 0.2s linear;}",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@public-ui/themes",
3
- "version": "1.4.2",
3
+ "version": "1.5.0-rc.1",
4
4
  "license": "EUPL-1.2",
5
5
  "homepage": "https://public-ui.github.io",
6
6
  "repository": "https://github.com/public-ui/kolibri",
@@ -48,20 +48,17 @@
48
48
  "prepack": "unbuild"
49
49
  },
50
50
  "dependencies": {
51
- "@public-ui/schema": "1.4.2"
51
+ "@public-ui/components": "1.5.0-rc.1"
52
52
  },
53
53
  "devDependencies": {
54
54
  "@types/node": "ts4.9",
55
- "@typescript-eslint/eslint-plugin": "5.54.0",
56
- "@typescript-eslint/parser": "5.54.0",
57
- "eslint": "8.35.0",
55
+ "@typescript-eslint/eslint-plugin": "5.55.0",
56
+ "@typescript-eslint/parser": "5.55.0",
57
+ "eslint": "8.36.0",
58
58
  "eslint-plugin-no-loops": "0.3.0",
59
59
  "typescript": "4.9.5",
60
60
  "unbuild": "1.1.2"
61
61
  },
62
- "peerDependencies": {
63
- "@public-ui/components": "1.4.2"
64
- },
65
62
  "sideEffects": false,
66
63
  "type": "module",
67
64
  "exports": {