@public-ui/themes 1.2.0-rc.9 → 1.3.0-rc.9
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
|
@@ -10,7 +10,7 @@ const BAMF = schema.KoliBri.createTheme("bamf", {
|
|
|
10
10
|
});
|
|
11
11
|
|
|
12
12
|
const BMF = schema.KoliBri.createTheme("bmf", {
|
|
13
|
-
GLOBAL: ":host {--color-midnight: #004b76;--color-ocean: #0077b6;--color-sky: #99c9e2;--color-ice: #cce4f0;--color-crimson: #780f2d;--color-red: #c0003c;--color-pink: #f2ccd8;--color-olive: #004d38;--color-green: #005c45;--color-jungle: #00854a;--color-lime: #c1ca31;--color-mint: #ccdeda;--color-fire: #7a2e1f;--color-orange: #c44931;--color-coral: #f5dcd7;--color-bronze: #c44931;--color-yellow: #c44931;--color-ivory: #c44931;--color-purple: #c44931;--color-lavender: #c44931;--color-black: #202020;--color-metal: #454d4f;--color-grey: #576164;--color-granite: #bec5c9;--color-silver: #e5e8e9;--color-smoke: #f2f3f4;--color-white: #ffffff;--font-family: BundesSans Web, Calibri, Verdana, Arial, Helvetica, sans-serif;--font-size: 16px;--spacing: 0.25em;}
|
|
13
|
+
GLOBAL: ":host {--color-midnight: #004b76;--color-ocean: #0077b6;--color-sky: #99c9e2;--color-ice: #cce4f0;--color-crimson: #780f2d;--color-red: #c0003c;--color-pink: #f2ccd8;--color-olive: #004d38;--color-green: #005c45;--color-jungle: #00854a;--color-lime: #c1ca31;--color-mint: #ccdeda;--color-fire: #7a2e1f;--color-orange: #c44931;--color-coral: #f5dcd7;--color-bronze: #c44931;--color-yellow: #c44931;--color-ivory: #c44931;--color-purple: #c44931;--color-lavender: #c44931;--color-black: #202020;--color-metal: #454d4f;--color-grey: #576164;--color-granite: #bec5c9;--color-silver: #e5e8e9;--color-smoke: #f2f3f4;--color-white: #ffffff;--font-family: BundesSans Web, Calibri, Verdana, Arial, Helvetica, sans-serif;--font-size: 16px;--spacing: 0.25em;}* {box-sizing: border-box;font-family: var(--font-family);}h1,h2,h3,h4,h5,h6 {margin: 0;font-family: var(--font-family);}a,button {align-items: center;background-color: transparent;border: 0;cursor: pointer;display: inline-flex;gap: 0.25rem;justify-items: center;}input,option,select,summary,textarea {display: inline-block;}a,button,input,option,select,summary,textarea {-ms-hyphens: auto;-webkit-hyphens: auto;hyphens: auto;letter-spacing: inherit;word-break: break-word;}*[tabindex]:focus,a:focus,button:focus,input:focus,select:focus,summary:focus,textarea:focus {cursor: pointer;outline-color: var(--color-ocean);outline-offset: 2px;outline-style: solid;outline-width: 3px;transition: outline-offset 0.2s linear;}@keyframes spin {0% {transform: rotate(0deg);}100% {transform: rotate(360deg);}}kol-heading-wc {font-weight: 700;}",
|
|
14
14
|
"KOL-BUTTON": ":host {display: inline-block;}button {background-color: transparent;border: 0;cursor: pointer;border-radius: 1.5em;min-width: 44px;min-height: 44px;padding: 0;text-decoration: none !important;}button > kol-span-wc {display: grid;gap: 0.25em;line-height: 1.5rem;font-family: var(--font-family);font-weight: 700;cursor: pointer;border-radius: 1.5em;border-style: solid;border-width: 2px;font-size: 1rem;align-items: center;padding: 8px 14px;justify-content: center;font-style: normal;text-align: center;text-transform: uppercase;width: inherit;transition-duration: 0.5s;transition-property: background-color, color, border-color;}button:disabled > kol-span-wc {cursor: not-allowed;opacity: 0.5;}button.primary > kol-span-wc,button.primary:disabled:hover > kol-span-wc {background-color: var(--color-midnight);border-color: var(--color-midnight);color: var(--color-white);}button.secondary > kol-span-wc,button.secondary:disabled:hover > kol-span-wc,button.normal > kol-span-wc,button.normal:disabled:hover > kol-span-wc {background-color: var(--color-white);border-color: var(--color-midnight);color: var(--color-midnight);}button.danger > kol-span-wc,button.danger:disabled:hover > kol-span-wc {background-color: var(--color-red);border-color: var(--color-red);color: var(--color-white);}button.ghost > kol-span-wc,button.ghost:disabled:hover > kol-span-wc {border-color: var(--color-white);background-color: var(--color-white);box-shadow: none;color: var(--color-midnight);} /*-----------*/button.primary:active > kol-span-wc,button.primary:hover > kol-span-wc,button.secondary:active > kol-span-wc,button.secondary:hover > kol-span-wc,button.normal:active > kol-span-wc,button.normal:hover > kol-span-wc,button.danger:active > kol-span-wc,button.danger:hover > kol-span-wc,button.ghost:active > kol-span-wc,button.ghost:hover > kol-span-wc {background-color: var(--color-ocean);border-color: var(--color-ocean);box-shadow: 0px 2px 8px 2px rgba(8, 35, 48, 0.24);color: var(--color-white);}button.danger:active > kol-span-wc,button.danger:hover > kol-span-wc {background-color: var(--color-crimson);border-color: var(--color-crimson);}button:disabled:hover > kol-span-wc,button:focus:hover > kol-span-wc {box-shadow: none;}button.primary:active > kol-span-wc,button.secondary:active > kol-span-wc,button.normal:active > kol-span-wc,button.danger:active > kol-span-wc,button.ghost:active > kol-span-wc {border-color: var(--color-white);box-shadow: none;outline: none;}button > kol-span-wc > span {display: flex;gap: 0.5em;margin: auto;align-items: center;justify-content: center;letter-spacing: 0.75px;}button.icon-only > kol-span-wc {padding: 8px;}button.icon-only > kol-span-wc > span > span {display: none;}button.icon-only > kol-span-wc kol-icon {display: inline-block;width: 1.5em;height: 1.5em;}button.loading > kol-span-wc kol-icon {animation: spin 5s infinite linear;}/** small ghost button */button.small.ghost > kol-span-wc {border: none;background-color: transparent;box-shadow: none;}button.small.ghost > kol-span-wc > span {border-radius: 1.5em;border-style: solid;border-width: 2px;border-color: var(--color-white);background-color: var(--color-white);}button.small.ghost:active > kol-span-wc > span,button.small.ghost:hover > kol-span-wc > span,button.small.ghost.transparent:active > kol-span-wc > span,button.small.ghost.transparent:hover > kol-span-wc > span {background-color: var(--color-ocean);border-color: var(--color-ocean);box-shadow: 0px 2px 8px 2px rgba(8, 35, 48, 0.24);color: var(--color-white);}/** button with transparent background */button.transparent > kol-span-wc > span,button.small.ghost.transparent > kol-span-wc > span,button.transparent > kol-span-wc {background-color: transparent;border-color: transparent;}",
|
|
15
15
|
"KOL-INPUT-TEXT": 'kol-input {display: grid;}kol-input label {display: grid;order: 2;margin-bottom: 0.4em;}kol-input div.input {box-sizing: border-box;order: 3;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;order: 1;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grey);border-width: 2px;border-style: solid;padding: 0.625em 0.875em;border-radius: 0.3125rem;overflow: hidden;width: 100%;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--color-grey);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error {border-left: 3px solid var(--color-red);padding-left: 1em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {outline-color: var(--color-red) !important;}kol-input.error kol-alert.error {color: var(--color-red);font-weight: 700;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--color-grey);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-ocean);color: white;}',
|
|
16
16
|
"KOL-INPUT-PASSWORD": 'kol-input {display: grid;}kol-input label {display: grid;order: 2;margin-bottom: 0.4em;}kol-input div.input {box-sizing: border-box;order: 3;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;order: 1;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grey);border-width: 2px;border-style: solid;padding: 0.625em 0.875em;border-radius: 0.3125rem;overflow: hidden;width: 100%;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error {border-left: 3px solid var(--color-red);padding-left: 1em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {outline-color: var(--color-red) !important;}kol-input.error kol-alert.error {color: var(--color-red);font-weight: 700;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--color-grey);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-ocean);color: white;}',
|
|
@@ -32,7 +32,7 @@ const BMF = schema.KoliBri.createTheme("bmf", {
|
|
|
32
32
|
"KOL-INPUT-COLOR": 'kol-input {display: grid;}kol-input label {display: grid;order: 2;margin-bottom: 0.4em;}kol-input div.input {box-sizing: border-box;order: 3;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;order: 1;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grey);border-width: 2px;border-style: solid;padding: 0.625em 0.875em;border-radius: 0.3125rem;overflow: hidden;width: 100%;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error {border-left: 3px solid var(--color-red);padding-left: 1em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {outline-color: var(--color-red) !important;}kol-input.error kol-alert.error {color: var(--color-red);font-weight: 700;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--color-grey);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-ocean);color: white;}',
|
|
33
33
|
"KOL-ACCORDION": ':host > div {font-family: var(--font-family);padding: 0 0.5rem 0 0;}:host > div > kol-heading-wc {font-weight: 700;font-size: 1.25rem;line-height: 1.75rem;}:host > div > kol-heading-wc button {cursor: pointer;width: 100%;margin: 0;display: flex;gap: 0.5em;border: 0;align-items: center;overflow: hidden;font-size: inherit;line-height: 1.75em;background-color: transparent;padding: 0;}:host > div[part*="open"] > kol-heading-wc button {padding-bottom: 0;}:host > div[part*="open"] > kol-heading-wc button kol-icon {width: 1em;}:host > div > kol-heading-wc button kol-icon::part(icon) {font-weight: 900;color: var(--color-midnight);}:host > div > kol-heading-wc button kol-icon::part(close)::before {font-family: "Font Awesome 6 Free";content: "\\f077";}:host > div > kol-heading-wc button kol-icon::part(open)::before {font-family: "Font Awesome 6 Free";content: "\\f078";}:host > div {width: 100%;height: 100%;display: grid;}:host > div div[part="header"],:host > div[part*="open"] div[part="content"] {margin: 0;padding-left: 2em;}button {font-weight: inherit;font-size: inherit;line-height: inherit;}:host > div {background: var(--color-white);}:host > div[part*="open"] {padding-bottom: 1em;}',
|
|
34
34
|
"KOL-TABLE": ':host * {hyphens: var(--kolibri-hyphens);font-family: var(--kolibri-font-family);line-height: var(--kolibri-line-height);word-break: break-word;}:host > div {overflow-x: auto;overflow-y: hidden;}caption {padding: 0.5em;}th {font-weight: normal;color: var(--color-midnight);}:host table thead tr:first-child th,:host table thead tr:first-child td {border-width: 0;border-top-width: 2px;border-style: solid;border-color: var(--color-ice);}table {width: 100%;border-spacing: 0;}table,:host table thead tr:last-child th,:host table thead tr:last-child td {border-width: 0;border-bottom-width: 2px;border-style: solid;border-color: var(--color-ice);}th {background-color: var(--color-white);}th div {width: 100%;display: flex;gap: 0.5em;grid-template-columns: 1fr auto;align-items: center;}th div.center {justify-content: center;}th div.right {justify-content: end;}tr:nth-child(even) {background-color: #f2f2f2;}th,td {padding: 0.5em;}td.center > div {display: flex;justify-content: center;}td.right > div {display: flex;justify-content: end;}th[aria-sort="ascending"],th[aria-sort="descending"] {font-weight: 700;}:host > div:last-child {padding: 0.5em;}:host > div:last-child,:host > div:last-child > div:last-child {display: grid;align-items: center;justify-items: center;gap: 1em;}@media (min-width: 1024px) {:host > div:last-child,:host > div:last-child > div:last-child {grid-auto-flow: column;}:host > div:last-child kol-pagination{display: flex;gap: 1rem}}',
|
|
35
|
-
"KOL-NAV": '* {margin: 0;padding: 0;}nav {font-family: var(--font-family);font-size: var(--font-size);background-color: var(--color-smoke);}ul {list-style: none;}a {background-color: var(--color-white);text-decoration: none;color: var(--color-midnight);width: 100%;display: flex;align-items: center;font-style: normal;font-weight: 700;padding: 0.75rem 0.5rem 0.75rem 0;border-left-color: var(--color-white);border-left-style: solid;border-left-width: 0.5rem;line-height: 1.5rem;min-height: 44px;min-width: 44px;transition-duration: 0.5s;transition-property: background-color, color, border-color;}a:hover {border-left-color: var(--color-ocean);}.selected a,[exportparts*="selected"] a {background-color: var(--color-ice);border-left-color: var(--color-midnight);color: var(--color-midnight);}a:hover,.selected a:hover,[exportparts*="selected"] a:hover {background-color: var(--color-ocean);color: var(--color-white);}a > kol-icon {display: inline-block;text-align: center;width: 44px;flex-shrink: 0;}.hidden {display: none;}:host > div > div:last-child {margin-top: 0.5em;width: 100%;text-align: center;} /* horizontal */ul.flex {display: flex;}li > div > div.absolute {position: absolute;}.horizontal a {display: block;}kol-span-wc {margin: 0 0.25rem;}',
|
|
35
|
+
"KOL-NAV": '* {margin: 0;padding: 0;}nav {font-family: var(--font-family);font-size: var(--font-size);background-color: var(--color-smoke);}ul {list-style: none;}a {background-color: var(--color-white);text-decoration: none;color: var(--color-midnight);width: 100%;display: flex;align-items: center;font-style: normal;font-weight: 700;padding: 0.75rem 0.5rem 0.75rem 0;border-left-color: var(--color-white);border-left-style: solid;border-left-width: 0.5rem;line-height: 1.5rem;min-height: 44px;min-width: 44px;transition-duration: 0.5s;transition-property: background-color, color, border-color;}a:hover {border-left-color: var(--color-ocean);}.selected a,[exportparts*="selected"] a {background-color: var(--color-ice);border-left-color: var(--color-midnight);color: var(--color-midnight);}a:hover,.selected a:hover,[exportparts*="selected"] a:hover {background-color: var(--color-ocean);color: var(--color-white);}a > kol-icon {display: inline-block;text-align: center;width: 44px;flex-shrink: 0;}.hidden {display: none;}:host > div > div:last-child {margin-top: 0.5em;width: 100%;text-align: center;} /* horizontal */ul.flex {display: flex;}li > div > div.absolute {position: absolute;}.horizontal a {display: block;}kol-span-wc {margin: 0 0.25rem;justify-items: baseline;}',
|
|
36
36
|
"KOL-CARD": "/* https://www.figma.com/file/56JbmrssCRpjpfxoAFeHqT/Design-System-EPLF-(in-progress)?node-id=8225%3A5945 */:host > div {display: grid;width: 100%;height: 100%;background-color: white;grid-template-rows: min-content 2fr min-content;box-shadow: 0 0 0.25rem var(--color-grey);border-radius: 0.25rem;}:host kol-heading-wc {display: inline-flex;font-style: normal;font-weight: 700;font-size: 1.25rem;line-height: 1.75rem;}:host div.header {padding: 1rem 1rem 0.5rem 1rem;}:host div.content {padding: 0.5rem 1rem 1rem;overflow: hidden;}:host div.footer {padding: 0.5rem 1rem;}:host > div > div.content + div.footer {border-top: 2px solid var(--color-ice);}",
|
|
37
37
|
"KOL-INPUT-CHECKBOX": '/* INPUT */kol-input {display: grid;align-items: center;justify-items: left;width: 100%;min-height: 44px;}kol-input.checkbox {grid-template-columns: 2rem auto;}kol-input.switch {grid-template-columns: 4rem auto;}kol-input > div.input {display: inline-flex;order: 2;}kol-input > div.input input {margin: 0px;}kol-input > label {cursor: pointer;order: 3;}kol-input > kol-alert.error {order: 1;padding-top: 0.25em;margin-bottom: 0.4em;grid-column: span 2 / auto;}kol-input.error {border-left: 3px solid var(--color-red);padding-left: 1em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {outline-color: var(--color-red) !important;}kol-input.error kol-alert.error {color: var(--color-red);font-weight: 700;}input {cursor: pointer;order: 1;width: 100%;border-color: var(--color-grey);border-width: 2px;border-style: solid;border-radius: 5px; /* padding: 10px 14px; */line-height: 24px;font-size: 1rem;}input:hover {border-color: var(--color-midnight);box-shadow: 0px 2px 8px 2px rgba(8, 35, 48, 0.24);}input:focus:hover {box-shadow: none;}input:active {box-shadow: none;}kol-alert {display: block;width: 100%;} /* CHECKBOX */kol-input label span {margin-top: 0.125rem;}.required label > span::after {content: "*";padding-left: 0.125em;}kol-input input[type="checkbox"] {appearance: none;background-color: white;cursor: pointer;transition: 0.5s;}kol-input input[type="checkbox"].kol-disabled:before {cursor: not-allowed;}kol-input input[type="checkbox"]:before {content: "";cursor: pointer;}kol-input input[type="checkbox"]:checked {background-color: var(--color-midnight);border-color: var(--color-midnight);}kol-input.checkbox input[type="checkbox"] {border-radius: 0.25em;height: calc(6 * var(--spacing));min-width: calc(6 * var(--spacing));width: calc(6 * var(--spacing));}kol-input.checkbox input[type="checkbox"]:before {border-radius: 1.5em;background-color: transparent;display: block;height: calc(6 * var(--spacing));position: relative;width: calc(6 * var(--spacing));}kol-input.checkbox input[type="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));}kol-input.checkbox input[type="checkbox"]:indeterminate {--tw-bg-opacity: 1;background-color: white;}kol-input.checkbox input[type="checkbox"]:indeterminate:before {background-color: var(--color-grey);height: 0.375rem;top: 0.45rem;left: 0.15rem;width: calc(4 * var(--spacing));}kol-input.switch input[type="checkbox"] {min-width: 3.5em;width: 3.5em;background-color: var(--color-grey);border-width: 0;height: 1.5em;border-radius: 1.25em;display: inline-block;position: relative;}kol-input.switch input[type="checkbox"]:before {-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5;width: 1.25em;height: 1.25em;left: calc(0.25em - 2px);top: calc(0.25em - 2px);border-radius: 1.25em;background-color: white;position: absolute;}kol-input.switch input[type="checkbox"]:checked {background-color: var(--color-midnight);}kol-input.switch input[type="checkbox"]:checked:before {-webkit-transform: translateX(2em);-moz-transform: translateX(2em);-ms-transform: translateX(2em);transform: translateX(2em);--tw-bg-opacity: 1;}kol-input.switch input[type="checkbox"]:indeterminate {--tw-bg-opacity: 1;}kol-input.switch input[type="checkbox"]:indeterminate:before {-webkit-transform: translateX(1em);-moz-transform: translateX(1em);-ms-transform: translateX(1em);transform: translateX(1em);}.disabled {opacity: 0.33;}',
|
|
38
38
|
"KOL-INPUT-RADIO": '/* INPUT */label {cursor: pointer;display: grid;line-height: 20px;gap: 8px;width: 100%;}input {cursor: pointer;width: 100%;border-color: var(--color-grey);border-width: 2px;border-style: solid;border-radius: 5px; /* padding: 10px 14px; */line-height: 24px;font-size: 16px;}input:hover {border-color: var(--color-midnight);box-shadow: 0px 2px 8px 2px rgba(8, 35, 48, 0.24);}input:focus:hover {box-shadow: none;}input:hover {border-color: var(--color-midnight);}kol-alert {display: block;width: 100%;margin-bottom: 0.4em;}.required legend > span::after {content: "*";padding-left: 0.125em;} /* RADIO */:host fieldset {border: 0px;margin: 0px;padding: 0px;display: grid;gap: 0.25em;}:host fieldset div {cursor: pointer;display: flex;flex-direction: row;align-items: center;position: relative;min-height: 44px;}:host fieldset div label {cursor: pointer;display: flex;padding-left: 0.25em;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 {background-color: var(--color-midnight);}:host fieldset div input[type="radio"]:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}:host fieldset #error {margin: 0.4em 0;order: 1;}:host fieldset legend {order: 2;display: contents;}:host fieldset kol-input {order: 3;}:host fieldset.error {padding-left: 1em;border-left: 3px solid var(--color-red);}:host fieldset kol-alert#error {color: var(--color-red);font-weight: 700;}:host fieldset.error input:focus,:host fieldset.error select:focus,:host fieldset.error textarea:focus {outline-color: var(--color-red) !important;}:host fieldset.error kol-alert.error {margin-left: -0.25em;color: var(--color-red);font-weight: 700;}.disabled {opacity: 0.33;}:host fieldset.horizontal {display: flex;flex-wrap: wrap;gap: 0.5rem 1rem;}:host fieldset.horizontal legend {display: inline-block;margin-bottom: 0.25em;}',
|
|
@@ -140,7 +140,7 @@ const DESY = schema.KoliBri.createTheme("desy", {
|
|
|
140
140
|
"KOL-INPUT-FILE": 'kol-input {display: grid;}kol-input label {display: grid;order: 1;padding: 0.125rem 0 0.4rem;vertical-align: text-top;line-height: 1.2;}kol-input div.input {box-sizing: border-box;order: 2;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;margin-top: 0.2em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;border-color: var(--color-grey);border-width: 1px;border-style: solid;overflow: hidden;width: 100%;line-height: normal;padding: 0.4rem 8px;}input:hover,select:hover,textarea:hover {border-color: #2d6f9e;box-shadow: 0 0 0 1px #2d6f9e inset;}input:focus,select:focus,textarea:focus {border-color: var(--color-primary-20);box-shadow: inset 0 0 0 1px var(--color-primary-20);outline: none;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {border-color: var(--color-warning);box-shadow: inset 0 0 0 1px var(--color-warning);}kol-input.error kol-alert.error {color: var(--color-warning);}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -2.7em;}kol-button-wc button {border: 0;height: 2.7em;box-sizing: border-box;background-color: transparent;cursor: pointer;}kol-button-wc button:focus,kol-button-wc button:hover {background-color: var(--color-primary);color: var(--color-white);}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-primary);color: white;}',
|
|
141
141
|
"KOL-INPUT-COLOR": 'kol-input {display: grid;}kol-input label {display: grid;order: 1;padding: 0.125rem 0 0.4rem;vertical-align: text-top;line-height: 1.2;}kol-input div.input {box-sizing: border-box;order: 2;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;margin-top: 0.2em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;border-color: var(--color-grey);border-width: 1px;border-style: solid;overflow: hidden;width: 100%;line-height: normal;padding: 0.4rem 8px;}input:hover,select:hover,textarea:hover {border-color: #2d6f9e;box-shadow: 0 0 0 1px #2d6f9e inset;}input:focus,select:focus,textarea:focus {border-color: var(--color-primary-20);box-shadow: inset 0 0 0 1px var(--color-primary-20);outline: none;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {border-color: var(--color-warning);box-shadow: inset 0 0 0 1px var(--color-warning);}kol-input.error kol-alert.error {color: var(--color-warning);}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -2.7em;}kol-button-wc button {border: 0;height: 2.7em;box-sizing: border-box;background-color: transparent;cursor: pointer;}kol-button-wc button:focus,kol-button-wc button:hover {background-color: var(--color-primary);color: var(--color-white);}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-primary);color: white;}',
|
|
142
142
|
"KOL-INPUT-RANGE": 'kol-input {display: grid;}kol-input label {display: grid;order: 1;padding: 0.125rem 0 0.4rem;vertical-align: text-top;line-height: 1.2;}kol-input div.input {box-sizing: border-box;order: 2;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;margin-top: 0.2em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;border-color: var(--color-grey);border-width: 1px;border-style: solid;overflow: hidden;width: 100%;line-height: normal;padding: 0.4rem 8px;}input:hover,select:hover,textarea:hover {border-color: #2d6f9e;box-shadow: 0 0 0 1px #2d6f9e inset;}input:focus,select:focus,textarea:focus {border-color: var(--color-primary-20);box-shadow: inset 0 0 0 1px var(--color-primary-20);outline: none;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {border-color: var(--color-warning);box-shadow: inset 0 0 0 1px var(--color-warning);}kol-input.error kol-alert.error {color: var(--color-warning);}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -2.7em;}kol-button-wc button {border: 0;height: 2.7em;box-sizing: border-box;background-color: transparent;cursor: pointer;}kol-button-wc button:focus,kol-button-wc button:hover {background-color: var(--color-primary);color: var(--color-white);}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-primary);color: white;}',
|
|
143
|
-
"KOL-NAV": '/* :host * {hyphens: var(--hyphens);font-family: var(--font-family);line-height: var(--line-height);word-break: break-word;} */:host .hidden {display: none;}:host > div > nav ul {list-style: none;margin: 0px;padding: 0px;border-radius: var(--border-radius);background-color: var(--color-primary);}:host > div > nav ul > li {border-radius: var(--border-radius);overflow: hidden;padding: 0.125em;}:host > div > nav ul > li[part*="vertical"] + li {border-radius: 0;border-top: 0.1em dotted white;}:host > div > nav ul > li[part*="vertical selected"] {border-right: 0.375em solid var(--color-yellow-neutral);}:host > div > nav ul > li[part*="horizontal"] + li {border-radius: 0;border-left: 0.1em dotted white;}:host > div > nav ul > li[part*="horizontal selected"] {border-bottom: 0.375em solid var(--color-yellow-neutral);}:host > div > nav ul > li > div {height: 100%;}:host > div > nav kol-link-wc {width: 100%; /*height: 100%;font-weight: 600;*/display: block;}:host > div > nav kol-link-wc a {border-radius: var(--border-radius);background-color: var(--color-primary);border: 1px solid transparent;grid: flex;line-height: 2em;padding: 0.5em;color: white;height: 100%;-webkit-box-align: center;align-items: center;
|
|
143
|
+
"KOL-NAV": '/* :host * {hyphens: var(--hyphens);font-family: var(--font-family);line-height: var(--line-height);word-break: break-word;} */:host .hidden {display: none;}:host > div > nav ul {list-style: none;margin: 0px;padding: 0px;border-radius: var(--border-radius);background-color: var(--color-primary);}:host > div > nav ul > li {border-radius: var(--border-radius);overflow: hidden;padding: 0.125em;}:host > div > nav ul > li[part*="vertical"] + li {border-radius: 0;border-top: 0.1em dotted white;}:host > div > nav ul > li[part*="vertical selected"] {border-right: 0.375em solid var(--color-yellow-neutral);}:host > div > nav ul > li[part*="horizontal"] + li {border-radius: 0;border-left: 0.1em dotted white;}:host > div > nav ul > li[part*="horizontal selected"] {border-bottom: 0.375em solid var(--color-yellow-neutral);}:host > div > nav ul > li > div {height: 100%;}:host > div > nav kol-link-wc {width: 100%; /*height: 100%;font-weight: 600;*/display: block;}:host > div > nav kol-link-wc a {border-radius: var(--border-radius);background-color: var(--color-primary);border: 1px solid transparent;grid: flex;line-height: 2em;padding: 0.5em;color: white;height: 100%;-webkit-box-align: center;align-items: center;display: flex;cursor: pointer;text-decoration: inherit;}:host > div > nav kol-link-wc[exportparts*="selected"] a {background-color: var(--color-primary-20);font-weight: 700;}:host > div > nav kol-link-wc a kol-icon.mr-2 {margin-right: calc(2 * var(--spacing));}:host > div > nav kol-link-wc a kol-icon.ml-2 {margin-left: calc(2 * var(--spacing));}:host > div > nav kol-link-wc a:focus,:host > div > nav kol-link-wc a:hover {border: 1px solid white;background-color: var(--kolibri-color-focus);} /* compact button */:host > div > div:last-child {margin-top: 0.5em;width: 100%;text-align: center;}:host > div > nav kol-link-wc a.text-center {display: grid;align-items: center;justify-items: center;} /* horizontal */ul.flex {display: flex;}li > div > div.absolute {position: absolute;}kol-span-wc {justify-items: baseline;}',
|
|
144
144
|
"KOL-BREADCRUMB": 'nav {width: 100%;}ul {margin: 0;padding: 0;list-style: none;display: flex;flex-wrap: wrap;align-items: center;}kol-link {display: inline;}:host kol-icon[exportparts*="separator"] {padding: 0 0.5rem;}:host kol-icon::part(icon separator) {font-weight: 900;font-size: 0.875rem;}:host kol-icon::part(icon separator)::before {color: black;content: "\\f054";font-family: "Font Awesome 6 Free";}:host li > kol-link > kol-link-wc > a {color: red !important;}',
|
|
145
145
|
"KOL-TOAST": ":host > div {position: fixed;top: 0;left: 0;width: 100%;height: 0;z-index: 200;}:host > div > kol-alert {display: block;margin: auto;padding: 1rem;max-width: 750px;}:host > div > kol-button-wc {top: 0;position: relative;display: block;margin: auto;width: 1em;}",
|
|
146
146
|
"KOL-LINK-BUTTON": "a {min-width: 44px;min-height: 44px;background-color: transparent;border: 0;cursor: pointer;padding: 0;display: flex;gap: 0.25rem;justify-items: center;align-items: center;text-decoration: none !important;}a > kol-span-wc {display: grid;min-width: 44px;min-height: 44px;gap: 0.25em;line-height: 1.5rem;font-family: Roboto;font-weight: 700;cursor: pointer;font-size: 1rem;align-items: center;padding: 0px 7px;justify-content: center;font-style: normal;text-align: center;border: none;outline: none;}a:active > kol-span-wc {transform: translateY(1px);}.primary a:disabled > kol-span-wc,.danger a:disabled > kol-span-wc,.normal a:disabled > kol-span-wc {cursor: not-allowed;color: var(--color-white);background-color: var(--color-gray-40);}.ghost a:disabled > kol-span-wc,.loading a:disabled > kol-span-wc,.secondary a:disabled > kol-span-wc {cursor: not-allowed;color: var(--color-gray-40);background-color: var(--color-white);border: var(--color-gray-40) solid 3px;}.primary a > kol-span-wc,.primary a:hover > kol-span-wc,.normal a > kol-span-wc,.normal a:hover > kol-span-wc {background-color: var(--color-primary);color: var(--color-white);}.loading a > kol-span-wc,.loading a:hover > kol-span-wc,.secondary a > kol-span-wc,.secondary a:hover > kol-span-wc {background-color: var(--color-white);color: var(--color-primary);border: 2px solid var(--color-primary);}.danger a > kol-span-wc,.danger a:hover > kol-span-wc {background-color: var(--color-warning);border-color: var(--color-warning);color: var(--color-white);box-shadow: unset;}.ghost a,.ghost a:hover > kol-span-wc {background-color: unset;color: var(--color-primary);box-shadow: unset;}.primary a:active > kol-span-wc,.primary a:focus > kol-span-wc,.primary a:hover > kol-span-wc,.loading a:active > kol-span-wc,.loading a:focus > kol-span-wc,.loading a:hover > kol-span-wc,.secondary a:active > kol-span-wc,.secondary a:focus > kol-span-wc,.secondary a:hover > kol-span-wc,.normal a:active > kol-span-wc,.normal a:focus > kol-span-wc,.normal a:hover > kol-span-wc {background-color: var(--color-primary-20);color: var(--color-white);outline: none;}.loading a:active > kol-span-wc,.loading a:focus > kol-span-wc,.loading a:hover > kol-span-wc,.secondary a:active > kol-span-wc,.secondary a:focus > kol-span-wc,.secondary a:hover > kol-span-wc {border: 2px solid var(--color-primary-20);}.danger a:active > kol-span-wc,.danger a:hover > kol-span-wc {color: var(--color-white);background-color: var(--color-dark-yellow-neutral);outline: none;}.ghost a:active > kol-span-wc,.ghost a:hover > kol-span-wc {color: var(--color-primary);box-shadow: inset 0 0 0 2px var(--color-primary);outline: none;}a > kol-span-wc > span {display: flex;gap: 0.5em;margin: auto;align-items: center;justify-content: center;letter-spacing: 0.75px;}a.icon-only > kol-span-wc {padding: 8px;}a.icon-only > kol-span-wc > span > span {display: none;}a.icon-only > kol-span-wc kol-icon {display: inline-block;width: 1.5em;height: 1.5em;}.loading a > kol-span-wc kol-icon {animation: spin 5s infinite linear;}.loading a > kol-span-wc {min-height: unset !important;min-width: unset !important;}",
|
|
@@ -189,7 +189,7 @@ const ITZBund = schema.KoliBri.createTheme("itzbund", {
|
|
|
189
189
|
});
|
|
190
190
|
|
|
191
191
|
const MAPZ = schema.KoliBri.createTheme("mapz", {
|
|
192
|
-
GLOBAL: ":host {--kolibri-background-color: white;--kolibri-background-color-modal: rgba(0, 0, 0, 0.5);--kolibri-border-color: #aaaaaa;--kolibri-border-radius: 0.
|
|
192
|
+
GLOBAL: ":host {--kolibri-background-color: white;--kolibri-background-color-modal: rgba(0, 0, 0, 0.5);--kolibri-border-color: #aaaaaa;--kolibri-border-radius: 0.25rem;--kolibri-border-width: 2px;--kolibri-color: black;--kolibri-color-undefined: #fb00d2;--kolibri-color-visited: #880b73;--kolibri-color-accent: #ffb752; /* #ef9e48 */--kolibri-color-active: #1e538f;--kolibri-color-hover: #1e538f;--kolibri-color-focus: #1e538f;--kolibri-color-danger: #ad0e0b; /* --kolibri-color-dark: #222222; */--kolibri-color-error: #ad0e0b;--kolibri-color-ghost: #333333;--kolibri-color-info: #28568a; /* --kolibri-color-light: #f2f2f2; */--kolibri-color-normal: #326cae;--kolibri-color-outline: var(--kolibri-color-focus);--kolibri-color-primary: #1e538f;--kolibri-color-secondary: #444444;--kolibri-color-spin-1: #000000;--kolibri-color-spin-2: #ff0000;--kolibri-color-spin-3: #ffcc00;--kolibri-color-success: #12632f;--kolibri-color-warning: #854000;--kolibri-color-gray: #666;--kolibri-font-family: var(--font-family);--kolibri-font-size: var(--font-size);--kolibri-hyphens: auto;--kolibri-line-height: 1.5em;--kolibri-shadow-color: black;--kolibri-spacing: 0.25em;--spacing: 0.25em;--font-family: Roboto, Droid Sans, Arial, Helvetica, sans-serif;--font-size: 16px;}:host * {box-sizing: border-box;font-family: var(--font-family);}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6 {margin: 0;font-family: var(--font-family);}a,button {background-color: transparent;border-radius: var(--kolibri-border-radius);gap: var(--kolibri-spacing);overflow: hidden;text-decoration: none;}input,option,select,summary,textarea {display: inline-block;}*[tabindex]:focus,a:focus,button:focus,input:focus,select:focus,summary:focus,textarea:focus {cursor: pointer;outline-color: var(--kolibri-color-outline);outline-offset: 2px;outline-style: solid;outline-width: 3px;transition: outline-offset 0.2s linear;}@keyframes spin {0% {transform: rotate(0deg);}100% {transform: rotate(360deg);}}kol-heading-wc {font-weight: 700;}",
|
|
193
193
|
"KOL-BUTTON": "a,button {border-radius: var(--kolibri-border-radius);overflow: hidden;}a > kol-span-wc,button > kol-span-wc {border-radius: var(--kolibri-border-radius);border-style: solid;border-width: 2px;min-height: 44px;min-width: 44px;box-shadow: 0 0 0.25em gray;font-family: var(--kolibri-font-family);font-size: inherit;line-height: 1.25em;padding: calc(2 * var(--kolibri-spacing));}a > kol-span-wc,button > kol-span-wc {gap: 0.25em;}kol-link-wc.primary > a > kol-span-wc,kol-link-wc.primary > a:disabled:hover > kol-span-wc,button.primary > kol-span-wc,button.primary:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-primary);border-color: var(--kolibri-color-primary);color: white;}kol-link-wc.primary > a:hover > kol-span-wc,kol-link-wc.primary > a:focus > kol-span-wc,button.primary:hover > kol-span-wc,button.primary:focus > kol-span-wc {color: var(--kolibri-color-primary);}kol-link-wc.secondary > a > kol-span-wc,kol-link-wc.secondary > a:disabled:hover > kol-span-wc,button.secondary > kol-span-wc,button.secondary:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-secondary);border-color: var(--kolibri-color-secondary);color: white;}kol-link-wc.secondary > a:hover > kol-span-wc,kol-link-wc.secondary > a:focus > kol-span-wc,button.secondary:hover > kol-span-wc,button.secondary:focus > kol-span-wc {color: var(--kolibri-color-secondary);}kol-link-wc.normal > a > kol-span-wc,kol-link-wc.normal > a:disabled:hover > kol-span-wc,button.normal > kol-span-wc,button.normal:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-normal);border-color: var(--kolibri-color-normal);color: white;}kol-link-wc.normal > a:hover > kol-span-wc,kol-link-wc.normal > a:focus > kol-span-wc,button.normal:hover > kol-span-wc,button.normal:focus > kol-span-wc {color: var(--kolibri-color-normal);}kol-link-wc.danger > a > kol-span-wc,kol-link-wc.danger > a:disabled:hover > kol-span-wc,button.danger > kol-span-wc,button.danger:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-danger);border-color: var(--kolibri-color-danger);color: white;}kol-link-wc.danger > a:hover > kol-span-wc,kol-link-wc.danger > a:focus > kol-span-wc,button.danger:hover > kol-span-wc,button.danger:focus > kol-span-wc {color: var(--kolibri-color-danger);}kol-link-wc.ghost > a > kol-span-wc,kol-link-wc.ghost > a:disabled:hover > kol-span-wc,button.ghost > kol-span-wc,button.ghost:disabled:hover > kol-span-wc {background-color: white;border-color: var(--kolibri-color-ghost);color: var(--kolibri-color-ghost);}kol-link-wc.ghost > a:hover > kol-span-wc,kol-link-wc.ghost > a:focus > kol-span-wc,button.ghost:hover > kol-span-wc,button.ghost:focus > kol-span-wc {background-color: var(--kolibri-color-ghost);color: white;}kol-link-wc > a:hover > kol-span-wc,kol-link-wc > a:focus > kol-span-wc,button:hover > kol-span-wc,button:focus > kol-span-wc {background-color: white;box-shadow: 0 0 0.25em black;}",
|
|
194
194
|
"KOL-ALERT": ':host > div {background-color: white;border-width: 2px;border-style: solid;border-radius: 0.25rem;display: flex;overflow: unset;}:host > div.default {border-color: var(--kolibri-color-gray);}:host > div.default > .icon {background-color: var(--kolibri-color-gray);}:host > div.error {border-color: var(--kolibri-color-error);}:host > div.error > .icon {background-color: var(--kolibri-color-error);}:host > div.info {border-color: var(--kolibri-color-info);}:host > div.info > .icon {background-color: var(--kolibri-color-info);}:host > div.success {border-color: var(--kolibri-color-success);}:host > div.success > .icon {background-color: var(--kolibri-color-success);}:host > div.warning {border-color: var(--kolibri-color-warning);}:host > div.warning > .icon {background-color: var(--kolibri-color-warning);}:host > div.msg > .icon {color: white;padding: 0.5em;align-items: center;display: inline-flex;}:host > div.card.default .heading .icon {background-color: var(--kolibri-color-gray);}:host > div.card.error .heading .icon {background-color: var(--kolibri-color-error);}:host > div.card.info .heading .icon {background-color: var(--kolibri-color-info);}:host > div.card.success .heading .icon {background-color: var(--kolibri-color-success);}:host > div.card.warning .heading .icon {background-color: var(--kolibri-color-warning);}:host > div.card .heading .icon {color: white;padding: 0.5em;align-items: center;display: inline-flex;}:host > div kol-heading-wc .icon {margin-right: 0.5em;}:host > div.card .heading .icon {border-radius: 0 0 0.25rem 0;}:host > div.msg > div {padding: 0.25em;}:host > div.msg > div > .heading {padding: 0.25em;display: inline-block;}:host > div .content {padding: 0.25em;}:host > div > div {display: grid;grid-template-columns: 1fr auto;}:host > div > div > .content {grid-row: 2;grid-column: 1;}:host > div > div > .close {grid-row: 1 / span 2;display: flex;}:host > div.msg > div > .close > * {margin: auto;}:host > div.msg.default .close .icon {color: var(--color-gray);}:host > div.msg.error .close .icon {color: var(--color-red);}:host > div.msg.info .close .icon {color: var(--color-midnight);}:host > div.msg.success .close .icon {color: var(--color-green);}:host > div.msg.warning .close .icon {color: var(--color-orange);}:host > div.card > div > .heading {width: 100%;}.close > button {min-width: 44px;min-height: 44px;display: grid;gap: 0.25em;line-height: 1.5rem;font-family: var(--font-family);font-weight: 700;cursor: pointer;border-radius: 1.5em;border-style: solid;border-width: 2px;font-size: 1rem;align-items: center;padding: 8px 14px;justify-content: center;font-style: normal;text-align: center;text-transform: uppercase;width: inherit;transition-duration: 0.5s;transition-property: background-color, color, border-color;background-color: rgba(0, 0, 0, 0);border-color: rgba(0, 0, 0, 0);}.close > button.icon-only {padding: 8px;}.close > button.icon-only kol-icon {display: inline-block;width: 1.5em;height: 1.5em;}.close > button:active {box-shadow: none;outline: none;}.close kol-icon::part(icon)::before {content: "\\f00d";}',
|
|
195
195
|
"KOL-INPUT-TEXT": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--kolibri-color-secondary);}kol-input > label {order: 1;margin-bottom: 0.25em;}kol-input > label > span {color: var(--default-letter);font-size: 0.875rem;line-height: 1.5rem;}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;color: var(--default-letter);border-color: var(--kolibri-border-color);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input::placeholder {color: var(--default-border-hover);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--background-light-grey);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--kolibri-border-color);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--kolibri-color-primary);color: white;}',
|
|
@@ -218,7 +218,7 @@ const MAPZ = schema.KoliBri.createTheme("mapz", {
|
|
|
218
218
|
"KOL-TABS": ':host {font-family: var(--font-family);}:host > div {display: block;width: 100%;}:host kol-button-group-wc {display: inline-block;border-radius: 0.25rem 0.25rem 0 0;background-color: var(--kolibri-color-normal);}:host kol-button-group-wc > div {display: inline-flex;}:host kol-button-group-wc > div + div {margin-left: 0.25em;}:host > div > div {padding: 0.25em;border: 1px solid var(--kolibri-border-color);border-radius: 0 0 0.25rem 0.25rem;}button {box-sizing: border-box;font-size: inherit;line-height: 1.25em;cursor: pointer;border-width: 2px;box-shadow: 0 0 0.25em gray;font-family: var(--kolibri-font-family);width: inherit;border-radius: var(--kolibri-border-radius);border-style: solid;padding: calc(2 * var(--kolibri-spacing));display: grid;gap: 0.25em;align-items: center;justify-content: center;text-align: center;transition-duration: 0.5s;transition-property: background-color, color, border-color;}kol-button-wc button.selected,kol-button-wc[aria-selected="true"] button {background-color: white;border-bottom-width: 0.25em !important;border-bottom-style: solid;border-bottom-color: var(--kolibri-color-accent) !important;}button > kol-span-wc span {display: flex;gap: 0.25em;align-items: center;justify-content: center;}button:disabled {cursor: not-allowed;opacity: 0.5;}button.primary,button.primary:disabled:hover {background-color: var(--kolibri-color-primary);border-color: var(--kolibri-color-primary);color: white;}button.primary:hover,button.primary:focus {color: var(--kolibri-color-primary);}button.secondary,button.secondary:disabled:hover {background-color: var(--kolibri-color-secondary);border-color: var(--kolibri-color-secondary);color: white;}button.secondary:hover,button.secondary:focus {color: var(--kolibri-color-secondary);}button.normal,button.normal:disabled:hover {background-color: var(--kolibri-color-normal);border-color: var(--kolibri-color-normal);color: white;}button.normal:hover,button.normal:focus {color: var(--kolibri-color-normal);}button.danger,button.danger:disabled:hover {background-color: var(--kolibri-color-danger);border-color: var(--kolibri-color-danger);color: white;}button.danger:hover,button.danger:focus {color: var(--kolibri-color-danger);}button.ghost,button.ghost:disabled:hover {background-color: white;border-color: var(--kolibri-color-ghost);color: var(--kolibri-color-ghost);}button.ghost:hover,button.ghost:focus {background-color: var(--kolibri-color-ghost);color: white;}button:hover,button:focus {background-color: white;box-shadow: 0 0 0.25em black;}button:active {outline: 0 !important;box-shadow: none !important;}.close-button {font-size: 25%;height: fit-content;width: 0;}.close-button button {width: 1rem;position: relative;height: 1rem;left: -4.25em;top: 0.25em;}:host > div {display: grid;}:host > div.tabs-align-left {grid-template-columns: auto 1fr;}:host > div.tabs-align-right {grid-template-columns: 1fr auto;}:host > .tabs-align-left kol-button-group-wc,:host > .tabs-align-top kol-button-group-wc {order: 0;}:host > .tabs-align-bottom kol-button-group-wc,:host > .tabs-align-right kol-button-group-wc {order: 1;}:host > div.tabs-align-left kol-button-group-wc > div,:host > div.tabs-align-left kol-button-group-wc > div > div,:host > div.tabs-align-right kol-button-group-wc > div,:host > div.tabs-align-right kol-button-group-wc > div > div {display: grid;}:host > div.tabs-align-left kol-button-group-wc > div > div kol-button-wc,:host > div.tabs-align-right kol-button-group-wc > div > div kol-button-wc {width: 100%;}:host > div.tabs-align-bottom kol-button-group-wc div,:host > div.tabs-align-top kol-button-group-wc div {display: flex;flex-wrap: wrap;}:host > div.tabs-align-bottom > kol-button-group-wc {border-radius: 0 0 0.25rem 0.25rem;}:host > div.tabs-align-bottom > div {border-radius: 0.25rem 0.25rem 0 0;}:host > div.tabs-align-top > kol-button-group-wc {border-radius: 0.25rem 0.25rem 0 0;}:host > div.tabs-align-top > div {border-radius: 0 0 0.25rem 0.25rem;}:host > div.tabs-align-left > kol-button-group-wc {border-radius: 0.25rem 0 0 0.25rem;}:host > div.tabs-align-left > div {border-radius: 0 0.25rem 0.25rem 0;}:host > div.tabs-align-right > kol-button-group-wc {border-radius: 0 0.25rem 0.25rem 0;}:host > div.tabs-align-right > div {border-radius: 0.25rem 0 0 0.25rem;}',
|
|
219
219
|
"KOL-TOAST": ":host > div {position: fixed;top: 0;left: 0;width: 100%;height: 0;z-index: 200;}:host > div > kol-alert {display: block;margin: auto;padding: 1rem;max-width: 750px;}:host > div > kol-button-wc {top: 0;position: relative;display: block;margin: auto;width: 1em;}",
|
|
220
220
|
"KOL-INPUT-RANGE": 'kol-input {display: grid;padding: 0;margin: 0;}kol-input > label {order: 1;margin-bottom: 0.25em;}kol-input > label > span {color: var(--default-letter);font-size: 0.875rem;line-height: 1.5rem;}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;color: var(--default-letter);border-color: var(--default-border);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: calc(100% - 4em);}input/*:not([type="range"])*/,select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input::placeholder {color: var(--default-border-hover);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em 0.5em;border-color: transparent;border-width: 2px;border-style: solid;}.icon-left input,.icon-left select {margin-left: 2em;}.icon-right input,.icon-right select {margin-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--kolibri-border-color);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}',
|
|
221
|
-
"KOL-NAV": ':host * {hyphens: var(--kolibri-hyphens);font-family: var(--font-family);line-height: var(--kolibri-line-height);word-break: break-word;}:host .hidden {display: none;}:host > div > nav ul {list-style: none;margin: 0px;padding: 0px;border-radius: var(--kolibri-border-radius);background-color: var(--kolibri-color-normal);}:host > div > nav ul > li {border-radius: var(--kolibri-border-radius);overflow: hidden;padding: 0.125em;}:host > div > nav ul > li[part*="vertical"] + li {border-radius: 0;border-top: 0.1em dotted white;}:host > div > nav ul > li[part*="vertical selected"] {border-right: 0.375em solid var(--kolibri-color-accent);}:host > div > nav ul > li[part*="horizontal"] + li {border-radius: 0;border-left: 0.1em dotted white;}:host > div > nav ul > li[part*="horizontal selected"] {border-bottom: 0.375em solid var(--kolibri-color-accent);}:host > div > nav ul > li > div {height: 100%;}:host > div > nav kol-link-wc {width: 100%; /*height: 100%;font-weight: 600;*/display: block;}:host > div > nav kol-link-wc a {border-radius: var(--kolibri-border-radius);background-color: var(--kolibri-color-normal);border: 1px solid transparent;grid: flex;line-height: 2em;padding: 0.5em;color: white;height: 100%;-webkit-box-align: center;align-items: center;
|
|
221
|
+
"KOL-NAV": ':host * {hyphens: var(--kolibri-hyphens);font-family: var(--font-family);line-height: var(--kolibri-line-height);word-break: break-word;}:host .hidden {display: none;}:host > div > nav ul {list-style: none;margin: 0px;padding: 0px;border-radius: var(--kolibri-border-radius);background-color: var(--kolibri-color-normal);}:host > div > nav ul > li {border-radius: var(--kolibri-border-radius);overflow: hidden;padding: 0.125em;}:host > div > nav ul > li[part*="vertical"] + li {border-radius: 0;border-top: 0.1em dotted white;}:host > div > nav ul > li[part*="vertical selected"] {border-right: 0.375em solid var(--kolibri-color-accent);}:host > div > nav ul > li[part*="horizontal"] + li {border-radius: 0;border-left: 0.1em dotted white;}:host > div > nav ul > li[part*="horizontal selected"] {border-bottom: 0.375em solid var(--kolibri-color-accent);}:host > div > nav ul > li > div {height: 100%;}:host > div > nav kol-link-wc {width: 100%; /*height: 100%;font-weight: 600;*/display: block;}:host > div > nav kol-link-wc a {border-radius: var(--kolibri-border-radius);background-color: var(--kolibri-color-normal);border: 1px solid transparent;grid: flex;line-height: 2em;padding: 0.5em;color: white;height: 100%;-webkit-box-align: center;align-items: center;display: flex;cursor: pointer;text-decoration: inherit;}:host > div > nav kol-link-wc[exportparts*="selected"] a {background-color: var(--kolibri-color-active);font-weight: 700;}:host > div > nav kol-link-wc a kol-icon.mr-2 {margin-right: calc(2 * var(--kolibri-spacing));}:host > div > nav kol-link-wc a kol-icon.ml-2 {margin-left: calc(2 * var(--kolibri-spacing));}:host > div > nav kol-link-wc a:focus,:host > div > nav kol-link-wc a:hover {border: 1px solid white;background-color: var(--kolibri-color-focus);} /* compact button */:host > div > div:last-child {margin-top: 0.5em;width: 100%;text-align: center;}:host > div > nav kol-link-wc a.text-center {display: grid;align-items: center;justify-items: center;} /* horizontal */ul.flex {display: flex;}li > div > div.absolute {position: absolute;}kol-span-wc {justify-items: baseline;}',
|
|
222
222
|
"KOL-TABLE": ":host * {hyphens: var(--kolibri-hyphens);font-family: var(--kolibri-font-family);line-height: var(--kolibri-line-height);word-break: break-word;}:host > div {overflow-x: auto;overflow-y: hidden;}:host > div:first-child {border-radius: var(--kolibri-border-radius);border-style: solid;border-width: 1px;border-color: var(--kolibri-border-color);}table {width: 100%;border-collapse: collapse;border-spacing: 0;}table,tr,th,td {border: 0 solid var(--kolibri-border-color);}tr {border-top-width: 1px;}tr:nth-child(even) {background-color: #f2f2f2;}th,td {border-right-width: 1px;padding: 0.25em 0.5em;}th {background-color: #eee;}th > div {display: grid;grid-template-columns: 1fr auto;align-items: center;gap: 0.25em;}:host > div.pagination {padding: 0.5em;}:host > div.pagination,:host > div.pagination > div:last-child {display: grid;align-items: center;justify-items: center;gap: 0.5em;}@media (min-width: 1024px) {:host > div.pagination,:host > div.pagination > div:last-child {grid-auto-flow: column;}:host > div.pagination kol-pagination {display: flex;gap: 1rem;}}",
|
|
223
223
|
"KOL-LINK-BUTTON": "a > kol-span-wc,button > kol-span-wc {border-radius: var(--kolibri-border-radius);border-style: solid;border-width: 2px;min-height: 44px;min-width: 44px;box-shadow: 0 0 0.25em gray;font-family: var(--kolibri-font-family);font-size: inherit;line-height: 1.25em;padding: calc(2 * var(--kolibri-spacing));}a > kol-span-wc,button > kol-span-wc {gap: 0.25em;}kol-link-wc.primary > a > kol-span-wc,kol-link-wc.primary > a:disabled:hover > kol-span-wc,button.primary > kol-span-wc,button.primary:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-primary);border-color: var(--kolibri-color-primary);color: white;}kol-link-wc.primary > a:hover > kol-span-wc,kol-link-wc.primary > a:focus > kol-span-wc,button.primary:hover > kol-span-wc,button.primary:focus > kol-span-wc {color: var(--kolibri-color-primary);}kol-link-wc.secondary > a > kol-span-wc,kol-link-wc.secondary > a:disabled:hover > kol-span-wc,button.secondary > kol-span-wc,button.secondary:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-secondary);border-color: var(--kolibri-color-secondary);color: white;}kol-link-wc.secondary > a:hover > kol-span-wc,kol-link-wc.secondary > a:focus > kol-span-wc,button.secondary:hover > kol-span-wc,button.secondary:focus > kol-span-wc {color: var(--kolibri-color-secondary);}kol-link-wc.normal > a > kol-span-wc,kol-link-wc.normal > a:disabled:hover > kol-span-wc,button.normal > kol-span-wc,button.normal:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-normal);border-color: var(--kolibri-color-normal);color: white;}kol-link-wc.normal > a:hover > kol-span-wc,kol-link-wc.normal > a:focus > kol-span-wc,button.normal:hover > kol-span-wc,button.normal:focus > kol-span-wc {color: var(--kolibri-color-normal);}kol-link-wc.danger > a > kol-span-wc,kol-link-wc.danger > a:disabled:hover > kol-span-wc,button.danger > kol-span-wc,button.danger:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-danger);border-color: var(--kolibri-color-danger);color: white;}kol-link-wc.danger > a:hover > kol-span-wc,kol-link-wc.danger > a:focus > kol-span-wc,button.danger:hover > kol-span-wc,button.danger:focus > kol-span-wc {color: var(--kolibri-color-danger);}kol-link-wc.ghost > a > kol-span-wc,kol-link-wc.ghost > a:disabled:hover > kol-span-wc,button.ghost > kol-span-wc,button.ghost:disabled:hover > kol-span-wc {background-color: white;border-color: var(--kolibri-color-ghost);color: var(--kolibri-color-ghost);}kol-link-wc.ghost > a:hover > kol-span-wc,kol-link-wc.ghost > a:focus > kol-span-wc,button.ghost:hover > kol-span-wc,button.ghost:focus > kol-span-wc {background-color: var(--kolibri-color-ghost);color: white;}kol-link-wc > a:hover > kol-span-wc,kol-link-wc > a:focus > kol-span-wc,button:hover > kol-span-wc,button:focus > kol-span-wc {background-color: white;box-shadow: 0 0 0.25em black;}",
|
|
224
224
|
"KOL-BUTTON-LINK": "a,button {background-color: transparent;border: 0;cursor: pointer;display: inline-block;}kol-link-wc,kol-link-button-wc {display: inline-block;}a,button {color: var(--kolibri-color-primary);display: inline-flex;flex-wrap: wrap;text-decoration-line: underline;}a:hover,button:hover {text-decoration-thickness: 0.2em;}kol-icon {padding: 0 0.25em;display: inline-block;}.hidden {display: none;visibility: hidden;}.skip {left: -99999px;overflow: hidden;position: absolute;z-index: 9999999;line-height: 1em;}.skip:focus {background: white;left: unset;position: unset;}",
|
package/dist/index.mjs
CHANGED
|
@@ -8,7 +8,7 @@ const BAMF = KoliBri.createTheme("bamf", {
|
|
|
8
8
|
});
|
|
9
9
|
|
|
10
10
|
const BMF = KoliBri.createTheme("bmf", {
|
|
11
|
-
GLOBAL: ":host {--color-midnight: #004b76;--color-ocean: #0077b6;--color-sky: #99c9e2;--color-ice: #cce4f0;--color-crimson: #780f2d;--color-red: #c0003c;--color-pink: #f2ccd8;--color-olive: #004d38;--color-green: #005c45;--color-jungle: #00854a;--color-lime: #c1ca31;--color-mint: #ccdeda;--color-fire: #7a2e1f;--color-orange: #c44931;--color-coral: #f5dcd7;--color-bronze: #c44931;--color-yellow: #c44931;--color-ivory: #c44931;--color-purple: #c44931;--color-lavender: #c44931;--color-black: #202020;--color-metal: #454d4f;--color-grey: #576164;--color-granite: #bec5c9;--color-silver: #e5e8e9;--color-smoke: #f2f3f4;--color-white: #ffffff;--font-family: BundesSans Web, Calibri, Verdana, Arial, Helvetica, sans-serif;--font-size: 16px;--spacing: 0.25em;}
|
|
11
|
+
GLOBAL: ":host {--color-midnight: #004b76;--color-ocean: #0077b6;--color-sky: #99c9e2;--color-ice: #cce4f0;--color-crimson: #780f2d;--color-red: #c0003c;--color-pink: #f2ccd8;--color-olive: #004d38;--color-green: #005c45;--color-jungle: #00854a;--color-lime: #c1ca31;--color-mint: #ccdeda;--color-fire: #7a2e1f;--color-orange: #c44931;--color-coral: #f5dcd7;--color-bronze: #c44931;--color-yellow: #c44931;--color-ivory: #c44931;--color-purple: #c44931;--color-lavender: #c44931;--color-black: #202020;--color-metal: #454d4f;--color-grey: #576164;--color-granite: #bec5c9;--color-silver: #e5e8e9;--color-smoke: #f2f3f4;--color-white: #ffffff;--font-family: BundesSans Web, Calibri, Verdana, Arial, Helvetica, sans-serif;--font-size: 16px;--spacing: 0.25em;}* {box-sizing: border-box;font-family: var(--font-family);}h1,h2,h3,h4,h5,h6 {margin: 0;font-family: var(--font-family);}a,button {align-items: center;background-color: transparent;border: 0;cursor: pointer;display: inline-flex;gap: 0.25rem;justify-items: center;}input,option,select,summary,textarea {display: inline-block;}a,button,input,option,select,summary,textarea {-ms-hyphens: auto;-webkit-hyphens: auto;hyphens: auto;letter-spacing: inherit;word-break: break-word;}*[tabindex]:focus,a:focus,button:focus,input:focus,select:focus,summary:focus,textarea:focus {cursor: pointer;outline-color: var(--color-ocean);outline-offset: 2px;outline-style: solid;outline-width: 3px;transition: outline-offset 0.2s linear;}@keyframes spin {0% {transform: rotate(0deg);}100% {transform: rotate(360deg);}}kol-heading-wc {font-weight: 700;}",
|
|
12
12
|
"KOL-BUTTON": ":host {display: inline-block;}button {background-color: transparent;border: 0;cursor: pointer;border-radius: 1.5em;min-width: 44px;min-height: 44px;padding: 0;text-decoration: none !important;}button > kol-span-wc {display: grid;gap: 0.25em;line-height: 1.5rem;font-family: var(--font-family);font-weight: 700;cursor: pointer;border-radius: 1.5em;border-style: solid;border-width: 2px;font-size: 1rem;align-items: center;padding: 8px 14px;justify-content: center;font-style: normal;text-align: center;text-transform: uppercase;width: inherit;transition-duration: 0.5s;transition-property: background-color, color, border-color;}button:disabled > kol-span-wc {cursor: not-allowed;opacity: 0.5;}button.primary > kol-span-wc,button.primary:disabled:hover > kol-span-wc {background-color: var(--color-midnight);border-color: var(--color-midnight);color: var(--color-white);}button.secondary > kol-span-wc,button.secondary:disabled:hover > kol-span-wc,button.normal > kol-span-wc,button.normal:disabled:hover > kol-span-wc {background-color: var(--color-white);border-color: var(--color-midnight);color: var(--color-midnight);}button.danger > kol-span-wc,button.danger:disabled:hover > kol-span-wc {background-color: var(--color-red);border-color: var(--color-red);color: var(--color-white);}button.ghost > kol-span-wc,button.ghost:disabled:hover > kol-span-wc {border-color: var(--color-white);background-color: var(--color-white);box-shadow: none;color: var(--color-midnight);} /*-----------*/button.primary:active > kol-span-wc,button.primary:hover > kol-span-wc,button.secondary:active > kol-span-wc,button.secondary:hover > kol-span-wc,button.normal:active > kol-span-wc,button.normal:hover > kol-span-wc,button.danger:active > kol-span-wc,button.danger:hover > kol-span-wc,button.ghost:active > kol-span-wc,button.ghost:hover > kol-span-wc {background-color: var(--color-ocean);border-color: var(--color-ocean);box-shadow: 0px 2px 8px 2px rgba(8, 35, 48, 0.24);color: var(--color-white);}button.danger:active > kol-span-wc,button.danger:hover > kol-span-wc {background-color: var(--color-crimson);border-color: var(--color-crimson);}button:disabled:hover > kol-span-wc,button:focus:hover > kol-span-wc {box-shadow: none;}button.primary:active > kol-span-wc,button.secondary:active > kol-span-wc,button.normal:active > kol-span-wc,button.danger:active > kol-span-wc,button.ghost:active > kol-span-wc {border-color: var(--color-white);box-shadow: none;outline: none;}button > kol-span-wc > span {display: flex;gap: 0.5em;margin: auto;align-items: center;justify-content: center;letter-spacing: 0.75px;}button.icon-only > kol-span-wc {padding: 8px;}button.icon-only > kol-span-wc > span > span {display: none;}button.icon-only > kol-span-wc kol-icon {display: inline-block;width: 1.5em;height: 1.5em;}button.loading > kol-span-wc kol-icon {animation: spin 5s infinite linear;}/** small ghost button */button.small.ghost > kol-span-wc {border: none;background-color: transparent;box-shadow: none;}button.small.ghost > kol-span-wc > span {border-radius: 1.5em;border-style: solid;border-width: 2px;border-color: var(--color-white);background-color: var(--color-white);}button.small.ghost:active > kol-span-wc > span,button.small.ghost:hover > kol-span-wc > span,button.small.ghost.transparent:active > kol-span-wc > span,button.small.ghost.transparent:hover > kol-span-wc > span {background-color: var(--color-ocean);border-color: var(--color-ocean);box-shadow: 0px 2px 8px 2px rgba(8, 35, 48, 0.24);color: var(--color-white);}/** button with transparent background */button.transparent > kol-span-wc > span,button.small.ghost.transparent > kol-span-wc > span,button.transparent > kol-span-wc {background-color: transparent;border-color: transparent;}",
|
|
13
13
|
"KOL-INPUT-TEXT": 'kol-input {display: grid;}kol-input label {display: grid;order: 2;margin-bottom: 0.4em;}kol-input div.input {box-sizing: border-box;order: 3;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;order: 1;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grey);border-width: 2px;border-style: solid;padding: 0.625em 0.875em;border-radius: 0.3125rem;overflow: hidden;width: 100%;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--color-grey);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error {border-left: 3px solid var(--color-red);padding-left: 1em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {outline-color: var(--color-red) !important;}kol-input.error kol-alert.error {color: var(--color-red);font-weight: 700;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--color-grey);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-ocean);color: white;}',
|
|
14
14
|
"KOL-INPUT-PASSWORD": 'kol-input {display: grid;}kol-input label {display: grid;order: 2;margin-bottom: 0.4em;}kol-input div.input {box-sizing: border-box;order: 3;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;order: 1;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grey);border-width: 2px;border-style: solid;padding: 0.625em 0.875em;border-radius: 0.3125rem;overflow: hidden;width: 100%;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error {border-left: 3px solid var(--color-red);padding-left: 1em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {outline-color: var(--color-red) !important;}kol-input.error kol-alert.error {color: var(--color-red);font-weight: 700;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--color-grey);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-ocean);color: white;}',
|
|
@@ -30,7 +30,7 @@ const BMF = KoliBri.createTheme("bmf", {
|
|
|
30
30
|
"KOL-INPUT-COLOR": 'kol-input {display: grid;}kol-input label {display: grid;order: 2;margin-bottom: 0.4em;}kol-input div.input {box-sizing: border-box;order: 3;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;order: 1;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grey);border-width: 2px;border-style: solid;padding: 0.625em 0.875em;border-radius: 0.3125rem;overflow: hidden;width: 100%;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error {border-left: 3px solid var(--color-red);padding-left: 1em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {outline-color: var(--color-red) !important;}kol-input.error kol-alert.error {color: var(--color-red);font-weight: 700;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--color-grey);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-ocean);color: white;}',
|
|
31
31
|
"KOL-ACCORDION": ':host > div {font-family: var(--font-family);padding: 0 0.5rem 0 0;}:host > div > kol-heading-wc {font-weight: 700;font-size: 1.25rem;line-height: 1.75rem;}:host > div > kol-heading-wc button {cursor: pointer;width: 100%;margin: 0;display: flex;gap: 0.5em;border: 0;align-items: center;overflow: hidden;font-size: inherit;line-height: 1.75em;background-color: transparent;padding: 0;}:host > div[part*="open"] > kol-heading-wc button {padding-bottom: 0;}:host > div[part*="open"] > kol-heading-wc button kol-icon {width: 1em;}:host > div > kol-heading-wc button kol-icon::part(icon) {font-weight: 900;color: var(--color-midnight);}:host > div > kol-heading-wc button kol-icon::part(close)::before {font-family: "Font Awesome 6 Free";content: "\\f077";}:host > div > kol-heading-wc button kol-icon::part(open)::before {font-family: "Font Awesome 6 Free";content: "\\f078";}:host > div {width: 100%;height: 100%;display: grid;}:host > div div[part="header"],:host > div[part*="open"] div[part="content"] {margin: 0;padding-left: 2em;}button {font-weight: inherit;font-size: inherit;line-height: inherit;}:host > div {background: var(--color-white);}:host > div[part*="open"] {padding-bottom: 1em;}',
|
|
32
32
|
"KOL-TABLE": ':host * {hyphens: var(--kolibri-hyphens);font-family: var(--kolibri-font-family);line-height: var(--kolibri-line-height);word-break: break-word;}:host > div {overflow-x: auto;overflow-y: hidden;}caption {padding: 0.5em;}th {font-weight: normal;color: var(--color-midnight);}:host table thead tr:first-child th,:host table thead tr:first-child td {border-width: 0;border-top-width: 2px;border-style: solid;border-color: var(--color-ice);}table {width: 100%;border-spacing: 0;}table,:host table thead tr:last-child th,:host table thead tr:last-child td {border-width: 0;border-bottom-width: 2px;border-style: solid;border-color: var(--color-ice);}th {background-color: var(--color-white);}th div {width: 100%;display: flex;gap: 0.5em;grid-template-columns: 1fr auto;align-items: center;}th div.center {justify-content: center;}th div.right {justify-content: end;}tr:nth-child(even) {background-color: #f2f2f2;}th,td {padding: 0.5em;}td.center > div {display: flex;justify-content: center;}td.right > div {display: flex;justify-content: end;}th[aria-sort="ascending"],th[aria-sort="descending"] {font-weight: 700;}:host > div:last-child {padding: 0.5em;}:host > div:last-child,:host > div:last-child > div:last-child {display: grid;align-items: center;justify-items: center;gap: 1em;}@media (min-width: 1024px) {:host > div:last-child,:host > div:last-child > div:last-child {grid-auto-flow: column;}:host > div:last-child kol-pagination{display: flex;gap: 1rem}}',
|
|
33
|
-
"KOL-NAV": '* {margin: 0;padding: 0;}nav {font-family: var(--font-family);font-size: var(--font-size);background-color: var(--color-smoke);}ul {list-style: none;}a {background-color: var(--color-white);text-decoration: none;color: var(--color-midnight);width: 100%;display: flex;align-items: center;font-style: normal;font-weight: 700;padding: 0.75rem 0.5rem 0.75rem 0;border-left-color: var(--color-white);border-left-style: solid;border-left-width: 0.5rem;line-height: 1.5rem;min-height: 44px;min-width: 44px;transition-duration: 0.5s;transition-property: background-color, color, border-color;}a:hover {border-left-color: var(--color-ocean);}.selected a,[exportparts*="selected"] a {background-color: var(--color-ice);border-left-color: var(--color-midnight);color: var(--color-midnight);}a:hover,.selected a:hover,[exportparts*="selected"] a:hover {background-color: var(--color-ocean);color: var(--color-white);}a > kol-icon {display: inline-block;text-align: center;width: 44px;flex-shrink: 0;}.hidden {display: none;}:host > div > div:last-child {margin-top: 0.5em;width: 100%;text-align: center;} /* horizontal */ul.flex {display: flex;}li > div > div.absolute {position: absolute;}.horizontal a {display: block;}kol-span-wc {margin: 0 0.25rem;}',
|
|
33
|
+
"KOL-NAV": '* {margin: 0;padding: 0;}nav {font-family: var(--font-family);font-size: var(--font-size);background-color: var(--color-smoke);}ul {list-style: none;}a {background-color: var(--color-white);text-decoration: none;color: var(--color-midnight);width: 100%;display: flex;align-items: center;font-style: normal;font-weight: 700;padding: 0.75rem 0.5rem 0.75rem 0;border-left-color: var(--color-white);border-left-style: solid;border-left-width: 0.5rem;line-height: 1.5rem;min-height: 44px;min-width: 44px;transition-duration: 0.5s;transition-property: background-color, color, border-color;}a:hover {border-left-color: var(--color-ocean);}.selected a,[exportparts*="selected"] a {background-color: var(--color-ice);border-left-color: var(--color-midnight);color: var(--color-midnight);}a:hover,.selected a:hover,[exportparts*="selected"] a:hover {background-color: var(--color-ocean);color: var(--color-white);}a > kol-icon {display: inline-block;text-align: center;width: 44px;flex-shrink: 0;}.hidden {display: none;}:host > div > div:last-child {margin-top: 0.5em;width: 100%;text-align: center;} /* horizontal */ul.flex {display: flex;}li > div > div.absolute {position: absolute;}.horizontal a {display: block;}kol-span-wc {margin: 0 0.25rem;justify-items: baseline;}',
|
|
34
34
|
"KOL-CARD": "/* https://www.figma.com/file/56JbmrssCRpjpfxoAFeHqT/Design-System-EPLF-(in-progress)?node-id=8225%3A5945 */:host > div {display: grid;width: 100%;height: 100%;background-color: white;grid-template-rows: min-content 2fr min-content;box-shadow: 0 0 0.25rem var(--color-grey);border-radius: 0.25rem;}:host kol-heading-wc {display: inline-flex;font-style: normal;font-weight: 700;font-size: 1.25rem;line-height: 1.75rem;}:host div.header {padding: 1rem 1rem 0.5rem 1rem;}:host div.content {padding: 0.5rem 1rem 1rem;overflow: hidden;}:host div.footer {padding: 0.5rem 1rem;}:host > div > div.content + div.footer {border-top: 2px solid var(--color-ice);}",
|
|
35
35
|
"KOL-INPUT-CHECKBOX": '/* INPUT */kol-input {display: grid;align-items: center;justify-items: left;width: 100%;min-height: 44px;}kol-input.checkbox {grid-template-columns: 2rem auto;}kol-input.switch {grid-template-columns: 4rem auto;}kol-input > div.input {display: inline-flex;order: 2;}kol-input > div.input input {margin: 0px;}kol-input > label {cursor: pointer;order: 3;}kol-input > kol-alert.error {order: 1;padding-top: 0.25em;margin-bottom: 0.4em;grid-column: span 2 / auto;}kol-input.error {border-left: 3px solid var(--color-red);padding-left: 1em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {outline-color: var(--color-red) !important;}kol-input.error kol-alert.error {color: var(--color-red);font-weight: 700;}input {cursor: pointer;order: 1;width: 100%;border-color: var(--color-grey);border-width: 2px;border-style: solid;border-radius: 5px; /* padding: 10px 14px; */line-height: 24px;font-size: 1rem;}input:hover {border-color: var(--color-midnight);box-shadow: 0px 2px 8px 2px rgba(8, 35, 48, 0.24);}input:focus:hover {box-shadow: none;}input:active {box-shadow: none;}kol-alert {display: block;width: 100%;} /* CHECKBOX */kol-input label span {margin-top: 0.125rem;}.required label > span::after {content: "*";padding-left: 0.125em;}kol-input input[type="checkbox"] {appearance: none;background-color: white;cursor: pointer;transition: 0.5s;}kol-input input[type="checkbox"].kol-disabled:before {cursor: not-allowed;}kol-input input[type="checkbox"]:before {content: "";cursor: pointer;}kol-input input[type="checkbox"]:checked {background-color: var(--color-midnight);border-color: var(--color-midnight);}kol-input.checkbox input[type="checkbox"] {border-radius: 0.25em;height: calc(6 * var(--spacing));min-width: calc(6 * var(--spacing));width: calc(6 * var(--spacing));}kol-input.checkbox input[type="checkbox"]:before {border-radius: 1.5em;background-color: transparent;display: block;height: calc(6 * var(--spacing));position: relative;width: calc(6 * var(--spacing));}kol-input.checkbox input[type="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));}kol-input.checkbox input[type="checkbox"]:indeterminate {--tw-bg-opacity: 1;background-color: white;}kol-input.checkbox input[type="checkbox"]:indeterminate:before {background-color: var(--color-grey);height: 0.375rem;top: 0.45rem;left: 0.15rem;width: calc(4 * var(--spacing));}kol-input.switch input[type="checkbox"] {min-width: 3.5em;width: 3.5em;background-color: var(--color-grey);border-width: 0;height: 1.5em;border-radius: 1.25em;display: inline-block;position: relative;}kol-input.switch input[type="checkbox"]:before {-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5;width: 1.25em;height: 1.25em;left: calc(0.25em - 2px);top: calc(0.25em - 2px);border-radius: 1.25em;background-color: white;position: absolute;}kol-input.switch input[type="checkbox"]:checked {background-color: var(--color-midnight);}kol-input.switch input[type="checkbox"]:checked:before {-webkit-transform: translateX(2em);-moz-transform: translateX(2em);-ms-transform: translateX(2em);transform: translateX(2em);--tw-bg-opacity: 1;}kol-input.switch input[type="checkbox"]:indeterminate {--tw-bg-opacity: 1;}kol-input.switch input[type="checkbox"]:indeterminate:before {-webkit-transform: translateX(1em);-moz-transform: translateX(1em);-ms-transform: translateX(1em);transform: translateX(1em);}.disabled {opacity: 0.33;}',
|
|
36
36
|
"KOL-INPUT-RADIO": '/* INPUT */label {cursor: pointer;display: grid;line-height: 20px;gap: 8px;width: 100%;}input {cursor: pointer;width: 100%;border-color: var(--color-grey);border-width: 2px;border-style: solid;border-radius: 5px; /* padding: 10px 14px; */line-height: 24px;font-size: 16px;}input:hover {border-color: var(--color-midnight);box-shadow: 0px 2px 8px 2px rgba(8, 35, 48, 0.24);}input:focus:hover {box-shadow: none;}input:hover {border-color: var(--color-midnight);}kol-alert {display: block;width: 100%;margin-bottom: 0.4em;}.required legend > span::after {content: "*";padding-left: 0.125em;} /* RADIO */:host fieldset {border: 0px;margin: 0px;padding: 0px;display: grid;gap: 0.25em;}:host fieldset div {cursor: pointer;display: flex;flex-direction: row;align-items: center;position: relative;min-height: 44px;}:host fieldset div label {cursor: pointer;display: flex;padding-left: 0.25em;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 {background-color: var(--color-midnight);}:host fieldset div input[type="radio"]:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}:host fieldset #error {margin: 0.4em 0;order: 1;}:host fieldset legend {order: 2;display: contents;}:host fieldset kol-input {order: 3;}:host fieldset.error {padding-left: 1em;border-left: 3px solid var(--color-red);}:host fieldset kol-alert#error {color: var(--color-red);font-weight: 700;}:host fieldset.error input:focus,:host fieldset.error select:focus,:host fieldset.error textarea:focus {outline-color: var(--color-red) !important;}:host fieldset.error kol-alert.error {margin-left: -0.25em;color: var(--color-red);font-weight: 700;}.disabled {opacity: 0.33;}:host fieldset.horizontal {display: flex;flex-wrap: wrap;gap: 0.5rem 1rem;}:host fieldset.horizontal legend {display: inline-block;margin-bottom: 0.25em;}',
|
|
@@ -138,7 +138,7 @@ const DESY = KoliBri.createTheme("desy", {
|
|
|
138
138
|
"KOL-INPUT-FILE": 'kol-input {display: grid;}kol-input label {display: grid;order: 1;padding: 0.125rem 0 0.4rem;vertical-align: text-top;line-height: 1.2;}kol-input div.input {box-sizing: border-box;order: 2;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;margin-top: 0.2em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;border-color: var(--color-grey);border-width: 1px;border-style: solid;overflow: hidden;width: 100%;line-height: normal;padding: 0.4rem 8px;}input:hover,select:hover,textarea:hover {border-color: #2d6f9e;box-shadow: 0 0 0 1px #2d6f9e inset;}input:focus,select:focus,textarea:focus {border-color: var(--color-primary-20);box-shadow: inset 0 0 0 1px var(--color-primary-20);outline: none;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {border-color: var(--color-warning);box-shadow: inset 0 0 0 1px var(--color-warning);}kol-input.error kol-alert.error {color: var(--color-warning);}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -2.7em;}kol-button-wc button {border: 0;height: 2.7em;box-sizing: border-box;background-color: transparent;cursor: pointer;}kol-button-wc button:focus,kol-button-wc button:hover {background-color: var(--color-primary);color: var(--color-white);}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-primary);color: white;}',
|
|
139
139
|
"KOL-INPUT-COLOR": 'kol-input {display: grid;}kol-input label {display: grid;order: 1;padding: 0.125rem 0 0.4rem;vertical-align: text-top;line-height: 1.2;}kol-input div.input {box-sizing: border-box;order: 2;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;margin-top: 0.2em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;border-color: var(--color-grey);border-width: 1px;border-style: solid;overflow: hidden;width: 100%;line-height: normal;padding: 0.4rem 8px;}input:hover,select:hover,textarea:hover {border-color: #2d6f9e;box-shadow: 0 0 0 1px #2d6f9e inset;}input:focus,select:focus,textarea:focus {border-color: var(--color-primary-20);box-shadow: inset 0 0 0 1px var(--color-primary-20);outline: none;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {border-color: var(--color-warning);box-shadow: inset 0 0 0 1px var(--color-warning);}kol-input.error kol-alert.error {color: var(--color-warning);}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -2.7em;}kol-button-wc button {border: 0;height: 2.7em;box-sizing: border-box;background-color: transparent;cursor: pointer;}kol-button-wc button:focus,kol-button-wc button:hover {background-color: var(--color-primary);color: var(--color-white);}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-primary);color: white;}',
|
|
140
140
|
"KOL-INPUT-RANGE": 'kol-input {display: grid;}kol-input label {display: grid;order: 1;padding: 0.125rem 0 0.4rem;vertical-align: text-top;line-height: 1.2;}kol-input div.input {box-sizing: border-box;order: 2;background-color: white;border-radius: 0.3125rem;}kol-input kol-alert.error {margin-bottom: 0.4em;margin-top: 0.2em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;border-color: var(--color-grey);border-width: 1px;border-style: solid;overflow: hidden;width: 100%;line-height: normal;padding: 0.4rem 8px;}input:hover,select:hover,textarea:hover {border-color: #2d6f9e;box-shadow: 0 0 0 1px #2d6f9e inset;}input:focus,select:focus,textarea:focus {border-color: var(--color-primary-20);box-shadow: inset 0 0 0 1px var(--color-primary-20);outline: none;}input,select:not([multiple]) {height: 2.75em;}input::placeholder {color: var(--color-grey);}input:hover {border-color: var(--color-midnight);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-input.error input:focus,kol-input.error select:focus,kol-input.error textarea:focus {border-color: var(--color-warning);box-shadow: inset 0 0 0 1px var(--color-warning);}kol-input.error kol-alert.error {color: var(--color-warning);}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -2.7em;}kol-button-wc button {border: 0;height: 2.7em;box-sizing: border-box;background-color: transparent;cursor: pointer;}kol-button-wc button:focus,kol-button-wc button:hover {background-color: var(--color-primary);color: var(--color-white);}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background: var(--color-primary);color: white;}',
|
|
141
|
-
"KOL-NAV": '/* :host * {hyphens: var(--hyphens);font-family: var(--font-family);line-height: var(--line-height);word-break: break-word;} */:host .hidden {display: none;}:host > div > nav ul {list-style: none;margin: 0px;padding: 0px;border-radius: var(--border-radius);background-color: var(--color-primary);}:host > div > nav ul > li {border-radius: var(--border-radius);overflow: hidden;padding: 0.125em;}:host > div > nav ul > li[part*="vertical"] + li {border-radius: 0;border-top: 0.1em dotted white;}:host > div > nav ul > li[part*="vertical selected"] {border-right: 0.375em solid var(--color-yellow-neutral);}:host > div > nav ul > li[part*="horizontal"] + li {border-radius: 0;border-left: 0.1em dotted white;}:host > div > nav ul > li[part*="horizontal selected"] {border-bottom: 0.375em solid var(--color-yellow-neutral);}:host > div > nav ul > li > div {height: 100%;}:host > div > nav kol-link-wc {width: 100%; /*height: 100%;font-weight: 600;*/display: block;}:host > div > nav kol-link-wc a {border-radius: var(--border-radius);background-color: var(--color-primary);border: 1px solid transparent;grid: flex;line-height: 2em;padding: 0.5em;color: white;height: 100%;-webkit-box-align: center;align-items: center;
|
|
141
|
+
"KOL-NAV": '/* :host * {hyphens: var(--hyphens);font-family: var(--font-family);line-height: var(--line-height);word-break: break-word;} */:host .hidden {display: none;}:host > div > nav ul {list-style: none;margin: 0px;padding: 0px;border-radius: var(--border-radius);background-color: var(--color-primary);}:host > div > nav ul > li {border-radius: var(--border-radius);overflow: hidden;padding: 0.125em;}:host > div > nav ul > li[part*="vertical"] + li {border-radius: 0;border-top: 0.1em dotted white;}:host > div > nav ul > li[part*="vertical selected"] {border-right: 0.375em solid var(--color-yellow-neutral);}:host > div > nav ul > li[part*="horizontal"] + li {border-radius: 0;border-left: 0.1em dotted white;}:host > div > nav ul > li[part*="horizontal selected"] {border-bottom: 0.375em solid var(--color-yellow-neutral);}:host > div > nav ul > li > div {height: 100%;}:host > div > nav kol-link-wc {width: 100%; /*height: 100%;font-weight: 600;*/display: block;}:host > div > nav kol-link-wc a {border-radius: var(--border-radius);background-color: var(--color-primary);border: 1px solid transparent;grid: flex;line-height: 2em;padding: 0.5em;color: white;height: 100%;-webkit-box-align: center;align-items: center;display: flex;cursor: pointer;text-decoration: inherit;}:host > div > nav kol-link-wc[exportparts*="selected"] a {background-color: var(--color-primary-20);font-weight: 700;}:host > div > nav kol-link-wc a kol-icon.mr-2 {margin-right: calc(2 * var(--spacing));}:host > div > nav kol-link-wc a kol-icon.ml-2 {margin-left: calc(2 * var(--spacing));}:host > div > nav kol-link-wc a:focus,:host > div > nav kol-link-wc a:hover {border: 1px solid white;background-color: var(--kolibri-color-focus);} /* compact button */:host > div > div:last-child {margin-top: 0.5em;width: 100%;text-align: center;}:host > div > nav kol-link-wc a.text-center {display: grid;align-items: center;justify-items: center;} /* horizontal */ul.flex {display: flex;}li > div > div.absolute {position: absolute;}kol-span-wc {justify-items: baseline;}',
|
|
142
142
|
"KOL-BREADCRUMB": 'nav {width: 100%;}ul {margin: 0;padding: 0;list-style: none;display: flex;flex-wrap: wrap;align-items: center;}kol-link {display: inline;}:host kol-icon[exportparts*="separator"] {padding: 0 0.5rem;}:host kol-icon::part(icon separator) {font-weight: 900;font-size: 0.875rem;}:host kol-icon::part(icon separator)::before {color: black;content: "\\f054";font-family: "Font Awesome 6 Free";}:host li > kol-link > kol-link-wc > a {color: red !important;}',
|
|
143
143
|
"KOL-TOAST": ":host > div {position: fixed;top: 0;left: 0;width: 100%;height: 0;z-index: 200;}:host > div > kol-alert {display: block;margin: auto;padding: 1rem;max-width: 750px;}:host > div > kol-button-wc {top: 0;position: relative;display: block;margin: auto;width: 1em;}",
|
|
144
144
|
"KOL-LINK-BUTTON": "a {min-width: 44px;min-height: 44px;background-color: transparent;border: 0;cursor: pointer;padding: 0;display: flex;gap: 0.25rem;justify-items: center;align-items: center;text-decoration: none !important;}a > kol-span-wc {display: grid;min-width: 44px;min-height: 44px;gap: 0.25em;line-height: 1.5rem;font-family: Roboto;font-weight: 700;cursor: pointer;font-size: 1rem;align-items: center;padding: 0px 7px;justify-content: center;font-style: normal;text-align: center;border: none;outline: none;}a:active > kol-span-wc {transform: translateY(1px);}.primary a:disabled > kol-span-wc,.danger a:disabled > kol-span-wc,.normal a:disabled > kol-span-wc {cursor: not-allowed;color: var(--color-white);background-color: var(--color-gray-40);}.ghost a:disabled > kol-span-wc,.loading a:disabled > kol-span-wc,.secondary a:disabled > kol-span-wc {cursor: not-allowed;color: var(--color-gray-40);background-color: var(--color-white);border: var(--color-gray-40) solid 3px;}.primary a > kol-span-wc,.primary a:hover > kol-span-wc,.normal a > kol-span-wc,.normal a:hover > kol-span-wc {background-color: var(--color-primary);color: var(--color-white);}.loading a > kol-span-wc,.loading a:hover > kol-span-wc,.secondary a > kol-span-wc,.secondary a:hover > kol-span-wc {background-color: var(--color-white);color: var(--color-primary);border: 2px solid var(--color-primary);}.danger a > kol-span-wc,.danger a:hover > kol-span-wc {background-color: var(--color-warning);border-color: var(--color-warning);color: var(--color-white);box-shadow: unset;}.ghost a,.ghost a:hover > kol-span-wc {background-color: unset;color: var(--color-primary);box-shadow: unset;}.primary a:active > kol-span-wc,.primary a:focus > kol-span-wc,.primary a:hover > kol-span-wc,.loading a:active > kol-span-wc,.loading a:focus > kol-span-wc,.loading a:hover > kol-span-wc,.secondary a:active > kol-span-wc,.secondary a:focus > kol-span-wc,.secondary a:hover > kol-span-wc,.normal a:active > kol-span-wc,.normal a:focus > kol-span-wc,.normal a:hover > kol-span-wc {background-color: var(--color-primary-20);color: var(--color-white);outline: none;}.loading a:active > kol-span-wc,.loading a:focus > kol-span-wc,.loading a:hover > kol-span-wc,.secondary a:active > kol-span-wc,.secondary a:focus > kol-span-wc,.secondary a:hover > kol-span-wc {border: 2px solid var(--color-primary-20);}.danger a:active > kol-span-wc,.danger a:hover > kol-span-wc {color: var(--color-white);background-color: var(--color-dark-yellow-neutral);outline: none;}.ghost a:active > kol-span-wc,.ghost a:hover > kol-span-wc {color: var(--color-primary);box-shadow: inset 0 0 0 2px var(--color-primary);outline: none;}a > kol-span-wc > span {display: flex;gap: 0.5em;margin: auto;align-items: center;justify-content: center;letter-spacing: 0.75px;}a.icon-only > kol-span-wc {padding: 8px;}a.icon-only > kol-span-wc > span > span {display: none;}a.icon-only > kol-span-wc kol-icon {display: inline-block;width: 1.5em;height: 1.5em;}.loading a > kol-span-wc kol-icon {animation: spin 5s infinite linear;}.loading a > kol-span-wc {min-height: unset !important;min-width: unset !important;}",
|
|
@@ -187,7 +187,7 @@ const ITZBund = KoliBri.createTheme("itzbund", {
|
|
|
187
187
|
});
|
|
188
188
|
|
|
189
189
|
const MAPZ = KoliBri.createTheme("mapz", {
|
|
190
|
-
GLOBAL: ":host {--kolibri-background-color: white;--kolibri-background-color-modal: rgba(0, 0, 0, 0.5);--kolibri-border-color: #aaaaaa;--kolibri-border-radius: 0.
|
|
190
|
+
GLOBAL: ":host {--kolibri-background-color: white;--kolibri-background-color-modal: rgba(0, 0, 0, 0.5);--kolibri-border-color: #aaaaaa;--kolibri-border-radius: 0.25rem;--kolibri-border-width: 2px;--kolibri-color: black;--kolibri-color-undefined: #fb00d2;--kolibri-color-visited: #880b73;--kolibri-color-accent: #ffb752; /* #ef9e48 */--kolibri-color-active: #1e538f;--kolibri-color-hover: #1e538f;--kolibri-color-focus: #1e538f;--kolibri-color-danger: #ad0e0b; /* --kolibri-color-dark: #222222; */--kolibri-color-error: #ad0e0b;--kolibri-color-ghost: #333333;--kolibri-color-info: #28568a; /* --kolibri-color-light: #f2f2f2; */--kolibri-color-normal: #326cae;--kolibri-color-outline: var(--kolibri-color-focus);--kolibri-color-primary: #1e538f;--kolibri-color-secondary: #444444;--kolibri-color-spin-1: #000000;--kolibri-color-spin-2: #ff0000;--kolibri-color-spin-3: #ffcc00;--kolibri-color-success: #12632f;--kolibri-color-warning: #854000;--kolibri-color-gray: #666;--kolibri-font-family: var(--font-family);--kolibri-font-size: var(--font-size);--kolibri-hyphens: auto;--kolibri-line-height: 1.5em;--kolibri-shadow-color: black;--kolibri-spacing: 0.25em;--spacing: 0.25em;--font-family: Roboto, Droid Sans, Arial, Helvetica, sans-serif;--font-size: 16px;}:host * {box-sizing: border-box;font-family: var(--font-family);}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6 {margin: 0;font-family: var(--font-family);}a,button {background-color: transparent;border-radius: var(--kolibri-border-radius);gap: var(--kolibri-spacing);overflow: hidden;text-decoration: none;}input,option,select,summary,textarea {display: inline-block;}*[tabindex]:focus,a:focus,button:focus,input:focus,select:focus,summary:focus,textarea:focus {cursor: pointer;outline-color: var(--kolibri-color-outline);outline-offset: 2px;outline-style: solid;outline-width: 3px;transition: outline-offset 0.2s linear;}@keyframes spin {0% {transform: rotate(0deg);}100% {transform: rotate(360deg);}}kol-heading-wc {font-weight: 700;}",
|
|
191
191
|
"KOL-BUTTON": "a,button {border-radius: var(--kolibri-border-radius);overflow: hidden;}a > kol-span-wc,button > kol-span-wc {border-radius: var(--kolibri-border-radius);border-style: solid;border-width: 2px;min-height: 44px;min-width: 44px;box-shadow: 0 0 0.25em gray;font-family: var(--kolibri-font-family);font-size: inherit;line-height: 1.25em;padding: calc(2 * var(--kolibri-spacing));}a > kol-span-wc,button > kol-span-wc {gap: 0.25em;}kol-link-wc.primary > a > kol-span-wc,kol-link-wc.primary > a:disabled:hover > kol-span-wc,button.primary > kol-span-wc,button.primary:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-primary);border-color: var(--kolibri-color-primary);color: white;}kol-link-wc.primary > a:hover > kol-span-wc,kol-link-wc.primary > a:focus > kol-span-wc,button.primary:hover > kol-span-wc,button.primary:focus > kol-span-wc {color: var(--kolibri-color-primary);}kol-link-wc.secondary > a > kol-span-wc,kol-link-wc.secondary > a:disabled:hover > kol-span-wc,button.secondary > kol-span-wc,button.secondary:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-secondary);border-color: var(--kolibri-color-secondary);color: white;}kol-link-wc.secondary > a:hover > kol-span-wc,kol-link-wc.secondary > a:focus > kol-span-wc,button.secondary:hover > kol-span-wc,button.secondary:focus > kol-span-wc {color: var(--kolibri-color-secondary);}kol-link-wc.normal > a > kol-span-wc,kol-link-wc.normal > a:disabled:hover > kol-span-wc,button.normal > kol-span-wc,button.normal:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-normal);border-color: var(--kolibri-color-normal);color: white;}kol-link-wc.normal > a:hover > kol-span-wc,kol-link-wc.normal > a:focus > kol-span-wc,button.normal:hover > kol-span-wc,button.normal:focus > kol-span-wc {color: var(--kolibri-color-normal);}kol-link-wc.danger > a > kol-span-wc,kol-link-wc.danger > a:disabled:hover > kol-span-wc,button.danger > kol-span-wc,button.danger:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-danger);border-color: var(--kolibri-color-danger);color: white;}kol-link-wc.danger > a:hover > kol-span-wc,kol-link-wc.danger > a:focus > kol-span-wc,button.danger:hover > kol-span-wc,button.danger:focus > kol-span-wc {color: var(--kolibri-color-danger);}kol-link-wc.ghost > a > kol-span-wc,kol-link-wc.ghost > a:disabled:hover > kol-span-wc,button.ghost > kol-span-wc,button.ghost:disabled:hover > kol-span-wc {background-color: white;border-color: var(--kolibri-color-ghost);color: var(--kolibri-color-ghost);}kol-link-wc.ghost > a:hover > kol-span-wc,kol-link-wc.ghost > a:focus > kol-span-wc,button.ghost:hover > kol-span-wc,button.ghost:focus > kol-span-wc {background-color: var(--kolibri-color-ghost);color: white;}kol-link-wc > a:hover > kol-span-wc,kol-link-wc > a:focus > kol-span-wc,button:hover > kol-span-wc,button:focus > kol-span-wc {background-color: white;box-shadow: 0 0 0.25em black;}",
|
|
192
192
|
"KOL-ALERT": ':host > div {background-color: white;border-width: 2px;border-style: solid;border-radius: 0.25rem;display: flex;overflow: unset;}:host > div.default {border-color: var(--kolibri-color-gray);}:host > div.default > .icon {background-color: var(--kolibri-color-gray);}:host > div.error {border-color: var(--kolibri-color-error);}:host > div.error > .icon {background-color: var(--kolibri-color-error);}:host > div.info {border-color: var(--kolibri-color-info);}:host > div.info > .icon {background-color: var(--kolibri-color-info);}:host > div.success {border-color: var(--kolibri-color-success);}:host > div.success > .icon {background-color: var(--kolibri-color-success);}:host > div.warning {border-color: var(--kolibri-color-warning);}:host > div.warning > .icon {background-color: var(--kolibri-color-warning);}:host > div.msg > .icon {color: white;padding: 0.5em;align-items: center;display: inline-flex;}:host > div.card.default .heading .icon {background-color: var(--kolibri-color-gray);}:host > div.card.error .heading .icon {background-color: var(--kolibri-color-error);}:host > div.card.info .heading .icon {background-color: var(--kolibri-color-info);}:host > div.card.success .heading .icon {background-color: var(--kolibri-color-success);}:host > div.card.warning .heading .icon {background-color: var(--kolibri-color-warning);}:host > div.card .heading .icon {color: white;padding: 0.5em;align-items: center;display: inline-flex;}:host > div kol-heading-wc .icon {margin-right: 0.5em;}:host > div.card .heading .icon {border-radius: 0 0 0.25rem 0;}:host > div.msg > div {padding: 0.25em;}:host > div.msg > div > .heading {padding: 0.25em;display: inline-block;}:host > div .content {padding: 0.25em;}:host > div > div {display: grid;grid-template-columns: 1fr auto;}:host > div > div > .content {grid-row: 2;grid-column: 1;}:host > div > div > .close {grid-row: 1 / span 2;display: flex;}:host > div.msg > div > .close > * {margin: auto;}:host > div.msg.default .close .icon {color: var(--color-gray);}:host > div.msg.error .close .icon {color: var(--color-red);}:host > div.msg.info .close .icon {color: var(--color-midnight);}:host > div.msg.success .close .icon {color: var(--color-green);}:host > div.msg.warning .close .icon {color: var(--color-orange);}:host > div.card > div > .heading {width: 100%;}.close > button {min-width: 44px;min-height: 44px;display: grid;gap: 0.25em;line-height: 1.5rem;font-family: var(--font-family);font-weight: 700;cursor: pointer;border-radius: 1.5em;border-style: solid;border-width: 2px;font-size: 1rem;align-items: center;padding: 8px 14px;justify-content: center;font-style: normal;text-align: center;text-transform: uppercase;width: inherit;transition-duration: 0.5s;transition-property: background-color, color, border-color;background-color: rgba(0, 0, 0, 0);border-color: rgba(0, 0, 0, 0);}.close > button.icon-only {padding: 8px;}.close > button.icon-only kol-icon {display: inline-block;width: 1.5em;height: 1.5em;}.close > button:active {box-shadow: none;outline: none;}.close kol-icon::part(icon)::before {content: "\\f00d";}',
|
|
193
193
|
"KOL-INPUT-TEXT": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--kolibri-color-secondary);}kol-input > label {order: 1;margin-bottom: 0.25em;}kol-input > label > span {color: var(--default-letter);font-size: 0.875rem;line-height: 1.5rem;}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;color: var(--default-letter);border-color: var(--kolibri-border-color);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input::placeholder {color: var(--default-border-hover);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--background-light-grey);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--kolibri-border-color);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--kolibri-color-primary);color: white;}',
|
|
@@ -216,7 +216,7 @@ const MAPZ = KoliBri.createTheme("mapz", {
|
|
|
216
216
|
"KOL-TABS": ':host {font-family: var(--font-family);}:host > div {display: block;width: 100%;}:host kol-button-group-wc {display: inline-block;border-radius: 0.25rem 0.25rem 0 0;background-color: var(--kolibri-color-normal);}:host kol-button-group-wc > div {display: inline-flex;}:host kol-button-group-wc > div + div {margin-left: 0.25em;}:host > div > div {padding: 0.25em;border: 1px solid var(--kolibri-border-color);border-radius: 0 0 0.25rem 0.25rem;}button {box-sizing: border-box;font-size: inherit;line-height: 1.25em;cursor: pointer;border-width: 2px;box-shadow: 0 0 0.25em gray;font-family: var(--kolibri-font-family);width: inherit;border-radius: var(--kolibri-border-radius);border-style: solid;padding: calc(2 * var(--kolibri-spacing));display: grid;gap: 0.25em;align-items: center;justify-content: center;text-align: center;transition-duration: 0.5s;transition-property: background-color, color, border-color;}kol-button-wc button.selected,kol-button-wc[aria-selected="true"] button {background-color: white;border-bottom-width: 0.25em !important;border-bottom-style: solid;border-bottom-color: var(--kolibri-color-accent) !important;}button > kol-span-wc span {display: flex;gap: 0.25em;align-items: center;justify-content: center;}button:disabled {cursor: not-allowed;opacity: 0.5;}button.primary,button.primary:disabled:hover {background-color: var(--kolibri-color-primary);border-color: var(--kolibri-color-primary);color: white;}button.primary:hover,button.primary:focus {color: var(--kolibri-color-primary);}button.secondary,button.secondary:disabled:hover {background-color: var(--kolibri-color-secondary);border-color: var(--kolibri-color-secondary);color: white;}button.secondary:hover,button.secondary:focus {color: var(--kolibri-color-secondary);}button.normal,button.normal:disabled:hover {background-color: var(--kolibri-color-normal);border-color: var(--kolibri-color-normal);color: white;}button.normal:hover,button.normal:focus {color: var(--kolibri-color-normal);}button.danger,button.danger:disabled:hover {background-color: var(--kolibri-color-danger);border-color: var(--kolibri-color-danger);color: white;}button.danger:hover,button.danger:focus {color: var(--kolibri-color-danger);}button.ghost,button.ghost:disabled:hover {background-color: white;border-color: var(--kolibri-color-ghost);color: var(--kolibri-color-ghost);}button.ghost:hover,button.ghost:focus {background-color: var(--kolibri-color-ghost);color: white;}button:hover,button:focus {background-color: white;box-shadow: 0 0 0.25em black;}button:active {outline: 0 !important;box-shadow: none !important;}.close-button {font-size: 25%;height: fit-content;width: 0;}.close-button button {width: 1rem;position: relative;height: 1rem;left: -4.25em;top: 0.25em;}:host > div {display: grid;}:host > div.tabs-align-left {grid-template-columns: auto 1fr;}:host > div.tabs-align-right {grid-template-columns: 1fr auto;}:host > .tabs-align-left kol-button-group-wc,:host > .tabs-align-top kol-button-group-wc {order: 0;}:host > .tabs-align-bottom kol-button-group-wc,:host > .tabs-align-right kol-button-group-wc {order: 1;}:host > div.tabs-align-left kol-button-group-wc > div,:host > div.tabs-align-left kol-button-group-wc > div > div,:host > div.tabs-align-right kol-button-group-wc > div,:host > div.tabs-align-right kol-button-group-wc > div > div {display: grid;}:host > div.tabs-align-left kol-button-group-wc > div > div kol-button-wc,:host > div.tabs-align-right kol-button-group-wc > div > div kol-button-wc {width: 100%;}:host > div.tabs-align-bottom kol-button-group-wc div,:host > div.tabs-align-top kol-button-group-wc div {display: flex;flex-wrap: wrap;}:host > div.tabs-align-bottom > kol-button-group-wc {border-radius: 0 0 0.25rem 0.25rem;}:host > div.tabs-align-bottom > div {border-radius: 0.25rem 0.25rem 0 0;}:host > div.tabs-align-top > kol-button-group-wc {border-radius: 0.25rem 0.25rem 0 0;}:host > div.tabs-align-top > div {border-radius: 0 0 0.25rem 0.25rem;}:host > div.tabs-align-left > kol-button-group-wc {border-radius: 0.25rem 0 0 0.25rem;}:host > div.tabs-align-left > div {border-radius: 0 0.25rem 0.25rem 0;}:host > div.tabs-align-right > kol-button-group-wc {border-radius: 0 0.25rem 0.25rem 0;}:host > div.tabs-align-right > div {border-radius: 0.25rem 0 0 0.25rem;}',
|
|
217
217
|
"KOL-TOAST": ":host > div {position: fixed;top: 0;left: 0;width: 100%;height: 0;z-index: 200;}:host > div > kol-alert {display: block;margin: auto;padding: 1rem;max-width: 750px;}:host > div > kol-button-wc {top: 0;position: relative;display: block;margin: auto;width: 1em;}",
|
|
218
218
|
"KOL-INPUT-RANGE": 'kol-input {display: grid;padding: 0;margin: 0;}kol-input > label {order: 1;margin-bottom: 0.25em;}kol-input > label > span {color: var(--default-letter);font-size: 0.875rem;line-height: 1.5rem;}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;color: var(--default-letter);border-color: var(--default-border);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: calc(100% - 4em);}input/*:not([type="range"])*/,select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input::placeholder {color: var(--default-border-hover);}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em 0.5em;border-color: transparent;border-width: 2px;border-style: solid;}.icon-left input,.icon-left select {margin-left: 2em;}.icon-right input,.icon-right select {margin-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--kolibri-border-color);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}',
|
|
219
|
-
"KOL-NAV": ':host * {hyphens: var(--kolibri-hyphens);font-family: var(--font-family);line-height: var(--kolibri-line-height);word-break: break-word;}:host .hidden {display: none;}:host > div > nav ul {list-style: none;margin: 0px;padding: 0px;border-radius: var(--kolibri-border-radius);background-color: var(--kolibri-color-normal);}:host > div > nav ul > li {border-radius: var(--kolibri-border-radius);overflow: hidden;padding: 0.125em;}:host > div > nav ul > li[part*="vertical"] + li {border-radius: 0;border-top: 0.1em dotted white;}:host > div > nav ul > li[part*="vertical selected"] {border-right: 0.375em solid var(--kolibri-color-accent);}:host > div > nav ul > li[part*="horizontal"] + li {border-radius: 0;border-left: 0.1em dotted white;}:host > div > nav ul > li[part*="horizontal selected"] {border-bottom: 0.375em solid var(--kolibri-color-accent);}:host > div > nav ul > li > div {height: 100%;}:host > div > nav kol-link-wc {width: 100%; /*height: 100%;font-weight: 600;*/display: block;}:host > div > nav kol-link-wc a {border-radius: var(--kolibri-border-radius);background-color: var(--kolibri-color-normal);border: 1px solid transparent;grid: flex;line-height: 2em;padding: 0.5em;color: white;height: 100%;-webkit-box-align: center;align-items: center;
|
|
219
|
+
"KOL-NAV": ':host * {hyphens: var(--kolibri-hyphens);font-family: var(--font-family);line-height: var(--kolibri-line-height);word-break: break-word;}:host .hidden {display: none;}:host > div > nav ul {list-style: none;margin: 0px;padding: 0px;border-radius: var(--kolibri-border-radius);background-color: var(--kolibri-color-normal);}:host > div > nav ul > li {border-radius: var(--kolibri-border-radius);overflow: hidden;padding: 0.125em;}:host > div > nav ul > li[part*="vertical"] + li {border-radius: 0;border-top: 0.1em dotted white;}:host > div > nav ul > li[part*="vertical selected"] {border-right: 0.375em solid var(--kolibri-color-accent);}:host > div > nav ul > li[part*="horizontal"] + li {border-radius: 0;border-left: 0.1em dotted white;}:host > div > nav ul > li[part*="horizontal selected"] {border-bottom: 0.375em solid var(--kolibri-color-accent);}:host > div > nav ul > li > div {height: 100%;}:host > div > nav kol-link-wc {width: 100%; /*height: 100%;font-weight: 600;*/display: block;}:host > div > nav kol-link-wc a {border-radius: var(--kolibri-border-radius);background-color: var(--kolibri-color-normal);border: 1px solid transparent;grid: flex;line-height: 2em;padding: 0.5em;color: white;height: 100%;-webkit-box-align: center;align-items: center;display: flex;cursor: pointer;text-decoration: inherit;}:host > div > nav kol-link-wc[exportparts*="selected"] a {background-color: var(--kolibri-color-active);font-weight: 700;}:host > div > nav kol-link-wc a kol-icon.mr-2 {margin-right: calc(2 * var(--kolibri-spacing));}:host > div > nav kol-link-wc a kol-icon.ml-2 {margin-left: calc(2 * var(--kolibri-spacing));}:host > div > nav kol-link-wc a:focus,:host > div > nav kol-link-wc a:hover {border: 1px solid white;background-color: var(--kolibri-color-focus);} /* compact button */:host > div > div:last-child {margin-top: 0.5em;width: 100%;text-align: center;}:host > div > nav kol-link-wc a.text-center {display: grid;align-items: center;justify-items: center;} /* horizontal */ul.flex {display: flex;}li > div > div.absolute {position: absolute;}kol-span-wc {justify-items: baseline;}',
|
|
220
220
|
"KOL-TABLE": ":host * {hyphens: var(--kolibri-hyphens);font-family: var(--kolibri-font-family);line-height: var(--kolibri-line-height);word-break: break-word;}:host > div {overflow-x: auto;overflow-y: hidden;}:host > div:first-child {border-radius: var(--kolibri-border-radius);border-style: solid;border-width: 1px;border-color: var(--kolibri-border-color);}table {width: 100%;border-collapse: collapse;border-spacing: 0;}table,tr,th,td {border: 0 solid var(--kolibri-border-color);}tr {border-top-width: 1px;}tr:nth-child(even) {background-color: #f2f2f2;}th,td {border-right-width: 1px;padding: 0.25em 0.5em;}th {background-color: #eee;}th > div {display: grid;grid-template-columns: 1fr auto;align-items: center;gap: 0.25em;}:host > div.pagination {padding: 0.5em;}:host > div.pagination,:host > div.pagination > div:last-child {display: grid;align-items: center;justify-items: center;gap: 0.5em;}@media (min-width: 1024px) {:host > div.pagination,:host > div.pagination > div:last-child {grid-auto-flow: column;}:host > div.pagination kol-pagination {display: flex;gap: 1rem;}}",
|
|
221
221
|
"KOL-LINK-BUTTON": "a > kol-span-wc,button > kol-span-wc {border-radius: var(--kolibri-border-radius);border-style: solid;border-width: 2px;min-height: 44px;min-width: 44px;box-shadow: 0 0 0.25em gray;font-family: var(--kolibri-font-family);font-size: inherit;line-height: 1.25em;padding: calc(2 * var(--kolibri-spacing));}a > kol-span-wc,button > kol-span-wc {gap: 0.25em;}kol-link-wc.primary > a > kol-span-wc,kol-link-wc.primary > a:disabled:hover > kol-span-wc,button.primary > kol-span-wc,button.primary:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-primary);border-color: var(--kolibri-color-primary);color: white;}kol-link-wc.primary > a:hover > kol-span-wc,kol-link-wc.primary > a:focus > kol-span-wc,button.primary:hover > kol-span-wc,button.primary:focus > kol-span-wc {color: var(--kolibri-color-primary);}kol-link-wc.secondary > a > kol-span-wc,kol-link-wc.secondary > a:disabled:hover > kol-span-wc,button.secondary > kol-span-wc,button.secondary:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-secondary);border-color: var(--kolibri-color-secondary);color: white;}kol-link-wc.secondary > a:hover > kol-span-wc,kol-link-wc.secondary > a:focus > kol-span-wc,button.secondary:hover > kol-span-wc,button.secondary:focus > kol-span-wc {color: var(--kolibri-color-secondary);}kol-link-wc.normal > a > kol-span-wc,kol-link-wc.normal > a:disabled:hover > kol-span-wc,button.normal > kol-span-wc,button.normal:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-normal);border-color: var(--kolibri-color-normal);color: white;}kol-link-wc.normal > a:hover > kol-span-wc,kol-link-wc.normal > a:focus > kol-span-wc,button.normal:hover > kol-span-wc,button.normal:focus > kol-span-wc {color: var(--kolibri-color-normal);}kol-link-wc.danger > a > kol-span-wc,kol-link-wc.danger > a:disabled:hover > kol-span-wc,button.danger > kol-span-wc,button.danger:disabled:hover > kol-span-wc {background-color: var(--kolibri-color-danger);border-color: var(--kolibri-color-danger);color: white;}kol-link-wc.danger > a:hover > kol-span-wc,kol-link-wc.danger > a:focus > kol-span-wc,button.danger:hover > kol-span-wc,button.danger:focus > kol-span-wc {color: var(--kolibri-color-danger);}kol-link-wc.ghost > a > kol-span-wc,kol-link-wc.ghost > a:disabled:hover > kol-span-wc,button.ghost > kol-span-wc,button.ghost:disabled:hover > kol-span-wc {background-color: white;border-color: var(--kolibri-color-ghost);color: var(--kolibri-color-ghost);}kol-link-wc.ghost > a:hover > kol-span-wc,kol-link-wc.ghost > a:focus > kol-span-wc,button.ghost:hover > kol-span-wc,button.ghost:focus > kol-span-wc {background-color: var(--kolibri-color-ghost);color: white;}kol-link-wc > a:hover > kol-span-wc,kol-link-wc > a:focus > kol-span-wc,button:hover > kol-span-wc,button:focus > kol-span-wc {background-color: white;box-shadow: 0 0 0.25em black;}",
|
|
222
222
|
"KOL-BUTTON-LINK": "a,button {background-color: transparent;border: 0;cursor: pointer;display: inline-block;}kol-link-wc,kol-link-button-wc {display: inline-block;}a,button {color: var(--kolibri-color-primary);display: inline-flex;flex-wrap: wrap;text-decoration-line: underline;}a:hover,button:hover {text-decoration-thickness: 0.2em;}kol-icon {padding: 0 0.25em;display: inline-block;}.hidden {display: none;visibility: hidden;}.skip {left: -99999px;overflow: hidden;position: absolute;z-index: 9999999;line-height: 1em;}.skip:focus {background: white;left: unset;position: unset;}",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@public-ui/themes",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.3.0-rc.9",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"homepage": "https://public-ui.github.io",
|
|
6
6
|
"repository": "https://github.com/public-ui/kolibri",
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
"prepack": "unbuild"
|
|
49
49
|
},
|
|
50
50
|
"dependencies": {
|
|
51
|
-
"@public-ui/schema": "1.
|
|
51
|
+
"@public-ui/schema": "1.3.0-rc.9"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
54
|
"@types/node": "18.11.18",
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
"unbuild": "1.1.1"
|
|
61
61
|
},
|
|
62
62
|
"peerDependencies": {
|
|
63
|
-
"@public-ui/components": "1.
|
|
63
|
+
"@public-ui/components": "1.3.0-rc.9"
|
|
64
64
|
},
|
|
65
65
|
"sideEffects": false,
|
|
66
66
|
"type": "module",
|