@public-ui/themes 1.2.0-rc.1 → 1.2.0-rc.2

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.
@@ -61,7 +61,7 @@
61
61
  }
62
62
  .iconlist li .icon-holder .icon i {
63
63
  font-size: 3em;
64
- color: #1.2.0-rc.1;
64
+ color: #1.2.0-rc.2;
65
65
  }
66
66
  .iconlist li .icon-holder span {
67
67
  font-size: 14px;
package/dist/index.cjs CHANGED
@@ -20,7 +20,7 @@ const BMF = schema.KoliBri.createTheme("bmf", {
20
20
  "KOL-TEXTAREA": '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;}',
21
21
  "KOL-ALERT": ':host > div {font-family: var(--font-family);border-width: 2px;border-style: solid;border-radius: 5px;display: flex;width: 100%;overflow: unset;border-color: transparent;background-color: white;}:host > div.default {border-color: var(--color-grey);}:host > div.default.msg .icon {color: var(--color-grey);}:host > div.error {border-color: var(--color-red);}:host > div.error.msg .icon {color: var(--color-red);}:host > div.info {border-color: var(--color-midnight);}:host > div.info.msg .icon {color: var(--color-midnight);}:host > div.success {border-color: var(--color-green);}:host > div.success.msg .icon {color: var(--color-green);}:host > div.warning {border-color: var(--color-orange);}:host > div.warning.msg .icon {color: var(--color-orange);}:host .icon {align-items: center;color: white;display: inline-flex;}:host > div.msg .icon {padding-right: 0.25em;}:host > div.card .heading .icon {padding: 0 0.5em 0 0;}:host > div > div > .heading {padding: 0 0.25rem;display: inline-block;}:host > div > div > .heading > .icon {margin-left: -0.25rem;margin-right: 0.25rem;border-radius: 0 0 0.25rem 0;}:host > div > div > .content {padding: 0.25rem;}:host .msg,:host .msg {border-width: 0;}:host > div.msg.default > div > .heading {color: var(--color-grey);}:host > div.msg.error > div > .heading {color: var(--color-red);}:host > div.msg.info > div > .heading {color: var(--color-midnight);}:host > div.msg.success > div > .heading {color: var(--color-green);}:host > div.msg.warning > div > .heading {color: var(--color-orange);}:host > div.msg > div {display: grid;grid-template-columns: 1fr auto;}:host > div.msg > div > .content {grid-row: 2;grid-column: 1;}:host > div.msg > div > .close {grid-row: 1 / span 2;display: flex;}:host > div.msg > div > .close > * {margin: auto;}:host > div.msg.default .close {color: var(--color-grey);}:host > div.msg.error .close {color: var(--color-red);}:host > div.msg.info .close {color: var(--color-midnight);}:host > div.msg.success .close {color: var(--color-green);}:host > div.msg.warning .close {color: var(--color-orange);}:host .card,:host .card {border: 3px solid #004b76;filter: drop-shadow(0px 2px 4px rgba(8, 35, 48, 0.24));}:host > div.card > div,:host > div.card > div {width: 100%;}:host > div.card > div > .heading {width: 100%;color: white;display: flex;font-size: 1.25rem;line-height: 1.75rem;}:host > div.card > div > .heading > * {margin: auto 0;}:host > div.card > div > .heading,:host > div.card > div > .content {padding: 0.5rem 1rem;}:host > div.card.default > div > .heading {background-color: var(--color-grey);}:host > div.card.error > div > .heading {background-color: var(--color-red);}:host > div.card.info > div > .heading {background-color: var(--color-midnight);}:host > div.card.success > div > .heading {background-color: var(--color-green);}:host > div.card.warning > div > .heading {background-color: var(--color-orange);}:host > div kol-icon::part(icon)::before {font-family: "Font Awesome 6 Free" !important;font-weight: 900;}:host > div.error kol-icon::part(icon)::before {content: "\\f06a";}:host > div.info kol-icon::part(icon)::before {content: "\\f05a";}:host > div.success kol-icon::part(icon)::before {content: "\\f058";}:host > div.warning kol-icon::part(icon)::before {content: "\\f071";}:host > div.card > div {display: grid;grid-template-columns: 1fr auto;}:host > div.card > div > .content {grid-row: 2;grid-column: 1 / span 2;}:host > div.card.default .close {background-color: var(--color-grey);}:host > div.card.error .close {background-color: var(--color-red);}:host > div.card.info .close {background-color: var(--color-midnight);}:host > div.card.success .close {background-color: var(--color-green);}:host > div.card.warning .close {background-color: var(--color-orange);}.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;}:host > div .close .icon {padding: 0;}:host > div .close kol-icon::part(icon)::before {content: "\\f00d";}',
22
22
  "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {color: inherit;font-style: normal;margin: 0;padding: 0;}h1,h2,h3 {font-weight: 700;}h1 {font-size: 1.5rem;line-height: 3.25rem;}h2 {font-size: 1.25rem;line-height: 1.75rem;}h3 {font-size: 1.125rem;line-height: 1.5rem;}",
23
- "KOL-BADGE": ":host {display: inline-block;}kol-span-wc {align-items: center;border-radius: 0.3125rem;display: grid;font-size: 0.875em;font-style: normal;font-weight: 700;gap: 0.5rem;line-height: 1.25rem;padding: 0.25rem 0.75rem;}kol-span-wc span {display: flex;gap: 0.25rem;}",
23
+ "KOL-BADGE": ":host {display: inline-block;}:host > span {border-radius: 0.3125rem;display: inline-flex;font-size: 0.875em;font-style: normal;font-weight: 700;line-height: 1.25rem;}:host > span kol-button-wc {border-left: 1px solid rgba(0, 0, 0, 0.25);}:host > span kol-span-wc {padding: 0.25rem 0.5rem;}:host > span > kol-span-wc {align-items: center;font-style: normal;gap: 0.5rem;}:host > span > kol-span-wc > span {display: flex;gap: 0.25rem;}",
24
24
  "KOL-BUTTON-GROUP": "div {display: flex;flex-wrap: wrap;gap: 0.5em;}",
25
25
  "KOL-INDENTED-TEXT": ":host > div {padding: 0.25em 0.5em;width: 100%;}:host > div {box-shadow: -4px 0px 0px var(--color-ocean);background: var(--color-white);}",
26
26
  "KOL-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(--color-midnight);font-style: normal;font-weight: 400;display: inline-flex;line-height: 1.5em;text-decoration-line: underline;border-radius: 0.25rem;}a:hover,button:hover {text-decoration-thickness: 0.25em;}a:visited,button:visited {color: var(--visited);}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;}",
@@ -167,7 +167,7 @@ const ITZBund = schema.KoliBri.createTheme("itzbund", {
167
167
  "KOL-TEXTAREA": 'textarea:hover,textarea:focus {border-color: var(--default-border-hover);outline-color: var(--primary) !important;outline-offset: 0;outline-style: solid;outline-width: 1px;}label {color: var(--default-letter);display: grid;font-size: 14px;line-height: 20px;gap: 8px;width: 100%;font-weight: bold;}textarea.error {background-color: var(--danger-light) !important;border-color: var(--danger);}textarea {width: 100%;color: var(--default-letter);border-width: 1px;border-style: solid;line-height: 24px;font-size: 16px;border-color: var(--kolibri-color-normal);border-radius: 0;background-color: #e8edf2 !important;padding: 0.75em;}textarea::placeholder {color: var(--default-border);}textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}.kol-required span::after {content: "*";}kol-alert {margin-top: var(--spacing);display: block;}',
168
168
  "KOL-ALERT": ":host > div {border-width: 2px;border-style: solid;border-radius: 5px;display: flex;width: 100%;overflow: hidden;border-color: transparent;}:host > div.error {border-color: var(--danger);}:host > div.error .icon {background-color: var(--danger);}:host > div.info {border-color: var(--secondary-blue);}:host > div.info .icon {background-color: var(--secondary-blue);}:host > div.success {border-color: var(--dark-green);}:host > div.success .icon {background-color: var(--dark-green);}:host > div.warning {border-color: var(--dark-red);}:host > div.warning .icon {background-color: var(--dark-red);}:host .icon {color: white;display: inline-block;padding: 0 0.25rem;}:host > div > div > .heading {padding: 0 0.25rem;display: inline-block;}:host > div > div > .heading > .icon {margin-left: -0.25rem;margin-right: 0.25rem;border-radius: 0 0 0.25rem 0;}:host > div > div > div:last-child {padding: 0.25rem;}",
169
169
  "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {line-height: 1.5em;margin: 0;padding: 0;}h1 {font-size: 1.2rem;}h2,h3,h4,h5,h6 {font-size: 1.1rem;}",
170
- "KOL-BADGE": ":host {display: inline-block;}span {align-items: center;border-radius: 0.3125rem;display: flex;line-height: 1.25rem;gap: 0.5rem;padding: 0.25rem 0.75rem;}",
170
+ "KOL-BADGE": ":host {display: inline-block;}:host > span {border-radius: 0.3125rem;display: inline-flex;line-height: 1.25rem;}:host > span kol-button-wc {border-left: 1px solid rgba(0, 0, 0, 0.25);}:host > span kol-span-wc {padding: 0.25rem 0.5rem;}:host > span > kol-span-wc {align-items: center;font-style: normal;gap: 0.5rem;}:host > span > kol-span-wc > span {display: flex;gap: 0.25rem;}",
171
171
  "KOL-BUTTON-GROUP": "div {display: flex;flex-wrap: wrap;gap: 0.5em;}",
172
172
  "KOL-INDENTED-TEXT": ":host > div {width: 100%;border-left-style: solid;border-left-width: 0.5em;border-left-color: var(--border-default);padding: 0.5em;}",
173
173
  "KOL-LINK": "a {color: var(--primary);font-style: normal;line-height: 1.5em;text-decoration-line: none;background-size: 0 0.25ex;font-weight: bold;display: inline;background-image: repeating-linear-gradient(to right, #66ddec, #66ddec);background-repeat: no-repeat;background-position: left 0 bottom 0;text-transform: uppercase;transition: background-size 0.2s ease-in-out, color 0.2s ease-in-out;}a:hover,a:focus {background-size: 100% 0.25ex;font-weight: 700;text-decoration-thickness: 0.125em;outline: none;}a:visited {color: var(--visited);}kol-icon-icofont {padding: 0 0.25em;display: inline-block;}.hidden {display: none;visibility: hidden;}a.skip {left: -99999px;overflow: hidden;position: absolute;z-index: 9999999;}a.skip:focus {background-color: white;box-shadow: 0 0 0.5rem 0.5rem white;left: unset;position: unset;}",
@@ -202,7 +202,7 @@ const MAPZ = schema.KoliBri.createTheme("mapz", {
202
202
  "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {line-height: 1.25em;margin: 0;padding: 0;}h1 {font-size: 1.5rem !important;}h2 {font-size: 1.4rem !important;}h3 {font-size: 1.3rem !important;}h4 {font-size: 1.2rem !important;}h5 {font-size: 1.1rem !important;}h6 {font-size: 1rem !important;}",
203
203
  "KOL-INPUT-CHECKBOX": '/* ALL INPUT, SELECT, TEXTAREA */label {cursor: pointer;}input {color: var(--default-letter);border-color: var(--default-border);border-width: 2px;border-style: solid;border-radius: 5px; /* padding: 10px 14px; */line-height: 24px;font-size: 16px;}.required label > span::after {content: "*";padding-left: 0.125em;}input:hover {border-color: var(--kolibri-color-primary);} /* NEU */kol-input {display: grid;align-items: center;justify-items: left;width: 100%;}kol-input.checkbox {grid-template-columns: calc(6 * var(--spacing)) auto;}kol-input.switch {grid-template-columns: calc(13 * var(--spacing)) auto;}kol-input > div.input {display: inline-flex;order: 1;}kol-input > div.input input {margin: 0px;}kol-input > label {order: 2;padding-left: calc(2 * var(--spacing));}kol-input > kol-alert.error {order: 3;padding-top: 0.25em;grid-column: span 2 / auto;} /* CHECKBOX */input[type="checkbox"] {appearance: none;background-color: white;cursor: pointer;transition: 0.5s;}input[type="checkbox"].kol-disabled:before {cursor: not-allowed;}input[type="checkbox"]:before {content: "";cursor: pointer;}input[type="checkbox"]:checked {background-color: var(--kolibri-color-primary);border-color: var(--kolibri-color-primary);}.checkbox input[type="checkbox"] {border-radius: 0.25em;height: calc(6 * var(--kolibri-spacing));min-width: calc(6 * var(--kolibri-spacing));width: calc(6 * var(--kolibri-spacing));}.checkbox input[type="checkbox"]:before {border-radius: 0.25em;background-color: transparent;display: block;height: calc(6 * var(--kolibri-spacing));position: relative;width: calc(6 * var(--kolibri-spacing));}.checkbox input[type="checkbox"]:checked:before {border-right-width: 3px;border-bottom-width: 3px;left: calc(1.5 * var(--kolibri-spacing) - 2px);top: calc(2.85 * var(--kolibri-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(--kolibri-spacing));width: calc(1.5 * var(--kolibri-spacing));}.checkbox input[type="checkbox"]:indeterminate:before {background-color: var(--kolibri-color-normal);height: 0.375rem;top: 0.45rem;left: 0.15rem;width: calc(4 * var(--kolibri-spacing));}.switch input[type="checkbox"] {min-width: 3.2em;width: 3.2em;height: 1.7em;border-radius: 0.25em;display: inline-block;position: relative;}.switch input[type="checkbox"]:before {-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5;width: 1.2em;height: 1.2em;left: calc(0.25em - 2px);top: calc(0.25em - 2px);border-radius: 0.25em;background-color: black;position: absolute;}.switch input[type="checkbox"]:checked:before {-webkit-transform: translateX(1.5em);-moz-transform: translateX(1.5em);-ms-transform: translateX(1.5em);transform: translateX(1.5em);background-color: white;}.switch input[type="checkbox"]:indeterminate:before {-webkit-transform: translateX(0.75em);-moz-transform: translateX(0.75em);-ms-transform: translateX(0.75em);transform: translateX(0.75em);background-color: var(--kolibri-color-primary);}.disabled {opacity: 0.33;}',
204
204
  "KOL-INPUT-RADIO": 'label {cursor: pointer;display: grid;font-size: 14px;line-height: 20px;gap: 8px;width: 100%;}input {cursor: pointer;width: 100%;border-color: var(--kolibri-border-color);border-width: 2px;border-style: solid;border-radius: 5px; /* padding: 10px 14px; */line-height: 24px;font-size: 16px;}input:hover {border-color: var(--kolibri-color-primary);}kol-alert {display: block;width: 100%;margin-bottom: 0.4em;}.required label > 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;margin-top: 0.125em;margin-bottom: 0.125em;align-items: center;position: relative;}: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 {box-shadow: 0 0 0.1rem black;background-color: var(--kolibri-color-primary);}:host fieldset #error {margin: 0.4em 0;order: 3;}:host fieldset legend {order: 1;display: contents;}:host fieldset kol-input {order: 2;}.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;}',
205
- "KOL-BADGE": ":host {display: inline-block;}kol-span-wc {align-items: center;border-radius: 0.3125rem;display: grid;gap: 0.5rem;line-height: 1.25rem;padding: 0.25rem 0.75rem;}kol-span-wc span {display: flex;gap: 0.25rem;}",
205
+ "KOL-BADGE": ":host {display: inline-block;}:host > span {border-radius: 0.3125rem;display: inline-flex;font-size: 0.875em;font-style: normal;font-weight: 700;line-height: 1.25rem;}:host > span kol-button-wc {border-left: 1px solid rgba(0, 0, 0, 0.25);}:host > span kol-span-wc {padding: 0.25rem 0.5rem;}:host > span > kol-span-wc {align-items: center;font-style: normal;gap: 0.5rem;}:host > span > kol-span-wc > span {display: flex;gap: 0.25rem;}",
206
206
  "KOL-INDENTED-TEXT": ":host > div {width: 100%;border-left-style: solid;border-left-width: 0.5em;border-left-color: var(--kolibri-border-color);padding: 0.5em;}",
207
207
  "KOL-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;}",
208
208
  "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;}',
package/dist/index.mjs CHANGED
@@ -18,7 +18,7 @@ const BMF = KoliBri.createTheme("bmf", {
18
18
  "KOL-TEXTAREA": '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;}',
19
19
  "KOL-ALERT": ':host > div {font-family: var(--font-family);border-width: 2px;border-style: solid;border-radius: 5px;display: flex;width: 100%;overflow: unset;border-color: transparent;background-color: white;}:host > div.default {border-color: var(--color-grey);}:host > div.default.msg .icon {color: var(--color-grey);}:host > div.error {border-color: var(--color-red);}:host > div.error.msg .icon {color: var(--color-red);}:host > div.info {border-color: var(--color-midnight);}:host > div.info.msg .icon {color: var(--color-midnight);}:host > div.success {border-color: var(--color-green);}:host > div.success.msg .icon {color: var(--color-green);}:host > div.warning {border-color: var(--color-orange);}:host > div.warning.msg .icon {color: var(--color-orange);}:host .icon {align-items: center;color: white;display: inline-flex;}:host > div.msg .icon {padding-right: 0.25em;}:host > div.card .heading .icon {padding: 0 0.5em 0 0;}:host > div > div > .heading {padding: 0 0.25rem;display: inline-block;}:host > div > div > .heading > .icon {margin-left: -0.25rem;margin-right: 0.25rem;border-radius: 0 0 0.25rem 0;}:host > div > div > .content {padding: 0.25rem;}:host .msg,:host .msg {border-width: 0;}:host > div.msg.default > div > .heading {color: var(--color-grey);}:host > div.msg.error > div > .heading {color: var(--color-red);}:host > div.msg.info > div > .heading {color: var(--color-midnight);}:host > div.msg.success > div > .heading {color: var(--color-green);}:host > div.msg.warning > div > .heading {color: var(--color-orange);}:host > div.msg > div {display: grid;grid-template-columns: 1fr auto;}:host > div.msg > div > .content {grid-row: 2;grid-column: 1;}:host > div.msg > div > .close {grid-row: 1 / span 2;display: flex;}:host > div.msg > div > .close > * {margin: auto;}:host > div.msg.default .close {color: var(--color-grey);}:host > div.msg.error .close {color: var(--color-red);}:host > div.msg.info .close {color: var(--color-midnight);}:host > div.msg.success .close {color: var(--color-green);}:host > div.msg.warning .close {color: var(--color-orange);}:host .card,:host .card {border: 3px solid #004b76;filter: drop-shadow(0px 2px 4px rgba(8, 35, 48, 0.24));}:host > div.card > div,:host > div.card > div {width: 100%;}:host > div.card > div > .heading {width: 100%;color: white;display: flex;font-size: 1.25rem;line-height: 1.75rem;}:host > div.card > div > .heading > * {margin: auto 0;}:host > div.card > div > .heading,:host > div.card > div > .content {padding: 0.5rem 1rem;}:host > div.card.default > div > .heading {background-color: var(--color-grey);}:host > div.card.error > div > .heading {background-color: var(--color-red);}:host > div.card.info > div > .heading {background-color: var(--color-midnight);}:host > div.card.success > div > .heading {background-color: var(--color-green);}:host > div.card.warning > div > .heading {background-color: var(--color-orange);}:host > div kol-icon::part(icon)::before {font-family: "Font Awesome 6 Free" !important;font-weight: 900;}:host > div.error kol-icon::part(icon)::before {content: "\\f06a";}:host > div.info kol-icon::part(icon)::before {content: "\\f05a";}:host > div.success kol-icon::part(icon)::before {content: "\\f058";}:host > div.warning kol-icon::part(icon)::before {content: "\\f071";}:host > div.card > div {display: grid;grid-template-columns: 1fr auto;}:host > div.card > div > .content {grid-row: 2;grid-column: 1 / span 2;}:host > div.card.default .close {background-color: var(--color-grey);}:host > div.card.error .close {background-color: var(--color-red);}:host > div.card.info .close {background-color: var(--color-midnight);}:host > div.card.success .close {background-color: var(--color-green);}:host > div.card.warning .close {background-color: var(--color-orange);}.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;}:host > div .close .icon {padding: 0;}:host > div .close kol-icon::part(icon)::before {content: "\\f00d";}',
20
20
  "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {color: inherit;font-style: normal;margin: 0;padding: 0;}h1,h2,h3 {font-weight: 700;}h1 {font-size: 1.5rem;line-height: 3.25rem;}h2 {font-size: 1.25rem;line-height: 1.75rem;}h3 {font-size: 1.125rem;line-height: 1.5rem;}",
21
- "KOL-BADGE": ":host {display: inline-block;}kol-span-wc {align-items: center;border-radius: 0.3125rem;display: grid;font-size: 0.875em;font-style: normal;font-weight: 700;gap: 0.5rem;line-height: 1.25rem;padding: 0.25rem 0.75rem;}kol-span-wc span {display: flex;gap: 0.25rem;}",
21
+ "KOL-BADGE": ":host {display: inline-block;}:host > span {border-radius: 0.3125rem;display: inline-flex;font-size: 0.875em;font-style: normal;font-weight: 700;line-height: 1.25rem;}:host > span kol-button-wc {border-left: 1px solid rgba(0, 0, 0, 0.25);}:host > span kol-span-wc {padding: 0.25rem 0.5rem;}:host > span > kol-span-wc {align-items: center;font-style: normal;gap: 0.5rem;}:host > span > kol-span-wc > span {display: flex;gap: 0.25rem;}",
22
22
  "KOL-BUTTON-GROUP": "div {display: flex;flex-wrap: wrap;gap: 0.5em;}",
23
23
  "KOL-INDENTED-TEXT": ":host > div {padding: 0.25em 0.5em;width: 100%;}:host > div {box-shadow: -4px 0px 0px var(--color-ocean);background: var(--color-white);}",
24
24
  "KOL-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(--color-midnight);font-style: normal;font-weight: 400;display: inline-flex;line-height: 1.5em;text-decoration-line: underline;border-radius: 0.25rem;}a:hover,button:hover {text-decoration-thickness: 0.25em;}a:visited,button:visited {color: var(--visited);}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;}",
@@ -165,7 +165,7 @@ const ITZBund = KoliBri.createTheme("itzbund", {
165
165
  "KOL-TEXTAREA": 'textarea:hover,textarea:focus {border-color: var(--default-border-hover);outline-color: var(--primary) !important;outline-offset: 0;outline-style: solid;outline-width: 1px;}label {color: var(--default-letter);display: grid;font-size: 14px;line-height: 20px;gap: 8px;width: 100%;font-weight: bold;}textarea.error {background-color: var(--danger-light) !important;border-color: var(--danger);}textarea {width: 100%;color: var(--default-letter);border-width: 1px;border-style: solid;line-height: 24px;font-size: 16px;border-color: var(--kolibri-color-normal);border-radius: 0;background-color: #e8edf2 !important;padding: 0.75em;}textarea::placeholder {color: var(--default-border);}textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--background-light-grey);}.kol-required span::after {content: "*";}kol-alert {margin-top: var(--spacing);display: block;}',
166
166
  "KOL-ALERT": ":host > div {border-width: 2px;border-style: solid;border-radius: 5px;display: flex;width: 100%;overflow: hidden;border-color: transparent;}:host > div.error {border-color: var(--danger);}:host > div.error .icon {background-color: var(--danger);}:host > div.info {border-color: var(--secondary-blue);}:host > div.info .icon {background-color: var(--secondary-blue);}:host > div.success {border-color: var(--dark-green);}:host > div.success .icon {background-color: var(--dark-green);}:host > div.warning {border-color: var(--dark-red);}:host > div.warning .icon {background-color: var(--dark-red);}:host .icon {color: white;display: inline-block;padding: 0 0.25rem;}:host > div > div > .heading {padding: 0 0.25rem;display: inline-block;}:host > div > div > .heading > .icon {margin-left: -0.25rem;margin-right: 0.25rem;border-radius: 0 0 0.25rem 0;}:host > div > div > div:last-child {padding: 0.25rem;}",
167
167
  "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {line-height: 1.5em;margin: 0;padding: 0;}h1 {font-size: 1.2rem;}h2,h3,h4,h5,h6 {font-size: 1.1rem;}",
168
- "KOL-BADGE": ":host {display: inline-block;}span {align-items: center;border-radius: 0.3125rem;display: flex;line-height: 1.25rem;gap: 0.5rem;padding: 0.25rem 0.75rem;}",
168
+ "KOL-BADGE": ":host {display: inline-block;}:host > span {border-radius: 0.3125rem;display: inline-flex;line-height: 1.25rem;}:host > span kol-button-wc {border-left: 1px solid rgba(0, 0, 0, 0.25);}:host > span kol-span-wc {padding: 0.25rem 0.5rem;}:host > span > kol-span-wc {align-items: center;font-style: normal;gap: 0.5rem;}:host > span > kol-span-wc > span {display: flex;gap: 0.25rem;}",
169
169
  "KOL-BUTTON-GROUP": "div {display: flex;flex-wrap: wrap;gap: 0.5em;}",
170
170
  "KOL-INDENTED-TEXT": ":host > div {width: 100%;border-left-style: solid;border-left-width: 0.5em;border-left-color: var(--border-default);padding: 0.5em;}",
171
171
  "KOL-LINK": "a {color: var(--primary);font-style: normal;line-height: 1.5em;text-decoration-line: none;background-size: 0 0.25ex;font-weight: bold;display: inline;background-image: repeating-linear-gradient(to right, #66ddec, #66ddec);background-repeat: no-repeat;background-position: left 0 bottom 0;text-transform: uppercase;transition: background-size 0.2s ease-in-out, color 0.2s ease-in-out;}a:hover,a:focus {background-size: 100% 0.25ex;font-weight: 700;text-decoration-thickness: 0.125em;outline: none;}a:visited {color: var(--visited);}kol-icon-icofont {padding: 0 0.25em;display: inline-block;}.hidden {display: none;visibility: hidden;}a.skip {left: -99999px;overflow: hidden;position: absolute;z-index: 9999999;}a.skip:focus {background-color: white;box-shadow: 0 0 0.5rem 0.5rem white;left: unset;position: unset;}",
@@ -200,7 +200,7 @@ const MAPZ = KoliBri.createTheme("mapz", {
200
200
  "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {line-height: 1.25em;margin: 0;padding: 0;}h1 {font-size: 1.5rem !important;}h2 {font-size: 1.4rem !important;}h3 {font-size: 1.3rem !important;}h4 {font-size: 1.2rem !important;}h5 {font-size: 1.1rem !important;}h6 {font-size: 1rem !important;}",
201
201
  "KOL-INPUT-CHECKBOX": '/* ALL INPUT, SELECT, TEXTAREA */label {cursor: pointer;}input {color: var(--default-letter);border-color: var(--default-border);border-width: 2px;border-style: solid;border-radius: 5px; /* padding: 10px 14px; */line-height: 24px;font-size: 16px;}.required label > span::after {content: "*";padding-left: 0.125em;}input:hover {border-color: var(--kolibri-color-primary);} /* NEU */kol-input {display: grid;align-items: center;justify-items: left;width: 100%;}kol-input.checkbox {grid-template-columns: calc(6 * var(--spacing)) auto;}kol-input.switch {grid-template-columns: calc(13 * var(--spacing)) auto;}kol-input > div.input {display: inline-flex;order: 1;}kol-input > div.input input {margin: 0px;}kol-input > label {order: 2;padding-left: calc(2 * var(--spacing));}kol-input > kol-alert.error {order: 3;padding-top: 0.25em;grid-column: span 2 / auto;} /* CHECKBOX */input[type="checkbox"] {appearance: none;background-color: white;cursor: pointer;transition: 0.5s;}input[type="checkbox"].kol-disabled:before {cursor: not-allowed;}input[type="checkbox"]:before {content: "";cursor: pointer;}input[type="checkbox"]:checked {background-color: var(--kolibri-color-primary);border-color: var(--kolibri-color-primary);}.checkbox input[type="checkbox"] {border-radius: 0.25em;height: calc(6 * var(--kolibri-spacing));min-width: calc(6 * var(--kolibri-spacing));width: calc(6 * var(--kolibri-spacing));}.checkbox input[type="checkbox"]:before {border-radius: 0.25em;background-color: transparent;display: block;height: calc(6 * var(--kolibri-spacing));position: relative;width: calc(6 * var(--kolibri-spacing));}.checkbox input[type="checkbox"]:checked:before {border-right-width: 3px;border-bottom-width: 3px;left: calc(1.5 * var(--kolibri-spacing) - 2px);top: calc(2.85 * var(--kolibri-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(--kolibri-spacing));width: calc(1.5 * var(--kolibri-spacing));}.checkbox input[type="checkbox"]:indeterminate:before {background-color: var(--kolibri-color-normal);height: 0.375rem;top: 0.45rem;left: 0.15rem;width: calc(4 * var(--kolibri-spacing));}.switch input[type="checkbox"] {min-width: 3.2em;width: 3.2em;height: 1.7em;border-radius: 0.25em;display: inline-block;position: relative;}.switch input[type="checkbox"]:before {-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5;width: 1.2em;height: 1.2em;left: calc(0.25em - 2px);top: calc(0.25em - 2px);border-radius: 0.25em;background-color: black;position: absolute;}.switch input[type="checkbox"]:checked:before {-webkit-transform: translateX(1.5em);-moz-transform: translateX(1.5em);-ms-transform: translateX(1.5em);transform: translateX(1.5em);background-color: white;}.switch input[type="checkbox"]:indeterminate:before {-webkit-transform: translateX(0.75em);-moz-transform: translateX(0.75em);-ms-transform: translateX(0.75em);transform: translateX(0.75em);background-color: var(--kolibri-color-primary);}.disabled {opacity: 0.33;}',
202
202
  "KOL-INPUT-RADIO": 'label {cursor: pointer;display: grid;font-size: 14px;line-height: 20px;gap: 8px;width: 100%;}input {cursor: pointer;width: 100%;border-color: var(--kolibri-border-color);border-width: 2px;border-style: solid;border-radius: 5px; /* padding: 10px 14px; */line-height: 24px;font-size: 16px;}input:hover {border-color: var(--kolibri-color-primary);}kol-alert {display: block;width: 100%;margin-bottom: 0.4em;}.required label > 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;margin-top: 0.125em;margin-bottom: 0.125em;align-items: center;position: relative;}: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 {box-shadow: 0 0 0.1rem black;background-color: var(--kolibri-color-primary);}:host fieldset #error {margin: 0.4em 0;order: 3;}:host fieldset legend {order: 1;display: contents;}:host fieldset kol-input {order: 2;}.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;}',
203
- "KOL-BADGE": ":host {display: inline-block;}kol-span-wc {align-items: center;border-radius: 0.3125rem;display: grid;gap: 0.5rem;line-height: 1.25rem;padding: 0.25rem 0.75rem;}kol-span-wc span {display: flex;gap: 0.25rem;}",
203
+ "KOL-BADGE": ":host {display: inline-block;}:host > span {border-radius: 0.3125rem;display: inline-flex;font-size: 0.875em;font-style: normal;font-weight: 700;line-height: 1.25rem;}:host > span kol-button-wc {border-left: 1px solid rgba(0, 0, 0, 0.25);}:host > span kol-span-wc {padding: 0.25rem 0.5rem;}:host > span > kol-span-wc {align-items: center;font-style: normal;gap: 0.5rem;}:host > span > kol-span-wc > span {display: flex;gap: 0.25rem;}",
204
204
  "KOL-INDENTED-TEXT": ":host > div {width: 100%;border-left-style: solid;border-left-width: 0.5em;border-left-color: var(--kolibri-border-color);padding: 0.5em;}",
205
205
  "KOL-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;}",
206
206
  "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;}',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@public-ui/themes",
3
- "version": "1.2.0-rc.1",
3
+ "version": "1.2.0-rc.2",
4
4
  "license": "EUPL-1.2",
5
5
  "homepage": "https://public-ui.github.io",
6
6
  "repository": "https://github.com/public-ui/kolibri",
@@ -48,19 +48,19 @@
48
48
  "prepack": "unbuild"
49
49
  },
50
50
  "dependencies": {
51
- "@public-ui/schema": "1.2.0-rc.1"
51
+ "@public-ui/schema": "1.2.0-rc.2"
52
52
  },
53
53
  "devDependencies": {
54
54
  "@types/node": "18.11.18",
55
55
  "@typescript-eslint/eslint-plugin": "5.48.1",
56
56
  "@typescript-eslint/parser": "5.48.1",
57
- "eslint": "8.31.0",
57
+ "eslint": "8.32.0",
58
58
  "eslint-plugin-no-loops": "0.3.0",
59
59
  "typescript": "4.9.4",
60
60
  "unbuild": "1.1.1"
61
61
  },
62
62
  "peerDependencies": {
63
- "@public-ui/components": "1.2.0-rc.1"
63
+ "@public-ui/components": "1.2.0-rc.2"
64
64
  },
65
65
  "sideEffects": false,
66
66
  "type": "module",