npm - @pod-os/elements - Versions diffs - 0.25.2 → 0.25.3-rc.2f9e99a.0 - Mend

@pod-os/elements 0.25.2 → 0.25.3-rc.2f9e99a.0

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.

Files changed (412) hide show

package/dist/cjs/ion-card-title_6.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"ion-card-title.ion-col.ion-grid.ion-row.pos-literals.pos-type-badges.entry.cjs.js","mappings":"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","names":["getIonMode","h","Host","createColorClasses","forceUpdate","subscribeResource"],"sources":["../node_modules/@ionic/core/dist/collection/components/card-title/card-title.ios.css?tag=ion-card-title&mode=ios&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/card-title/card-title.md.css?tag=ion-card-title&mode=md&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/card-title/card-title.js","../node_modules/@ionic/core/dist/collection/utils/media.js","../node_modules/@ionic/core/dist/collection/components/col/col.css?tag=ion-col&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/col/col.js","../node_modules/@ionic/core/dist/collection/components/grid/grid.css?tag=ion-grid&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/grid/grid.js","../node_modules/@ionic/core/dist/collection/components/row/row.css?tag=ion-row&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/row/row.js","src/components/pos-literals/pos-literals.css?tag=pos-literals&encapsulation=shadow","src/components/pos-literals/pos-literals.tsx","src/components/pos-type-badges/pos-type-badges.css?tag=pos-type-badges&encapsulation=shadow","src/components/pos-type-badges/pos-type-badges.tsx"],"sourcesContent":["/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n:host {\n /**\n * @prop --color: Color of the card title\n */\n display: block;\n position: relative;\n color: var(--color);\n}\n\n:host(.ion-color) {\n color: var(--ion-color-base);\n}\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n:host {\n --color: var(--ion-text-color, #000);\n margin-left: 0;\n margin-right: 0;\n margin-top: 0;\n margin-bottom: 0;\n padding-left: 0;\n padding-right: 0;\n padding-top: 0;\n padding-bottom: 0;\n font-size: 1.75rem;\n font-weight: 700;\n line-height: 1.2;\n}","/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n:host {\n /**\n * @prop --color: Color of the card title\n */\n display: block;\n position: relative;\n color: var(--color);\n}\n\n:host(.ion-color) {\n color: var(--ion-color-base);\n}\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n:host {\n --color: var(--ion-color-step-850, #262626);\n margin-left: 0;\n margin-right: 0;\n margin-top: 0;\n margin-bottom: 0;\n padding-left: 0;\n padding-right: 0;\n padding-top: 0;\n padding-bottom: 0;\n font-size: 1.25rem;\n font-weight: 500;\n line-height: 1.2;\n}","/*!\n * (C) Ionic http://ionicframework.com - MIT License\n */\nimport { Host, h } from \"@stencil/core\";\nimport { createColorClasses } from \"../../utils/theme\";\nimport { getIonMode } from \"../../global/ionic-global\";\n/**\n * @virtualProp {\"ios\" | \"md\"} mode - The mode determines which platform styles to use.\n */\nexport class CardTitle {\n constructor() {\n this.color = undefined;\n }\n render() {\n const mode = getIonMode(this);\n return (h(Host, { key: 'a9e4190346e7d0a8e6089ec1fe01bca0f5f7200d', role: \"heading\", \"aria-level\": \"2\", class: createColorClasses(this.color, {\n 'ion-inherit-color': true,\n [mode]: true,\n }) }, h(\"slot\", { key: '8d87636ad703545b6d2297629205a5a8616eb94e' })));\n }\n static get is() { return \"ion-card-title\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"ios\": [\"card-title.ios.scss\"],\n \"md\": [\"card-title.md.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"ios\": [\"card-title.ios.css\"],\n \"md\": [\"card-title.md.css\"]\n };\n }\n static get properties() {\n return {\n \"color\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"Color\",\n \"resolved\": \"\\\"danger\\\" | \\\"dark\\\" | \\\"light\\\" | \\\"medium\\\" | \\\"primary\\\" | \\\"secondary\\\" | \\\"success\\\" | \\\"tertiary\\\" | \\\"warning\\\" | string & Record<never, never> | undefined\",\n \"references\": {\n \"Color\": {\n \"location\": \"import\",\n \"path\": \"../../interface\",\n \"id\": \"src/interface.d.ts::Color\"\n }\n }\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The color to use from your application's color palette.\\nDefault options are: `\\\"primary\\\"`, `\\\"secondary\\\"`, `\\\"tertiary\\\"`, `\\\"success\\\"`, `\\\"warning\\\"`, `\\\"danger\\\"`, `\\\"light\\\"`, `\\\"medium\\\"`, and `\\\"dark\\\"`.\\nFor more information on colors, see [theming](/docs/theming/basics).\"\n },\n \"attribute\": \"color\",\n \"reflect\": true\n }\n };\n }\n}\n","/*!\n * (C) Ionic http://ionicframework.com - MIT License\n */\nexport const SIZE_TO_MEDIA = {\n xs: '(min-width: 0px)',\n sm: '(min-width: 576px)',\n md: '(min-width: 768px)',\n lg: '(min-width: 992px)',\n xl: '(min-width: 1200px)',\n};\n// Check if the window matches the media query\n// at the breakpoint passed\n// e.g. matchBreakpoint('sm') => true if screen width exceeds 576px\nexport const matchBreakpoint = (breakpoint) => {\n if (breakpoint === undefined || breakpoint === '') {\n return true;\n }\n if (window.matchMedia) {\n const mediaQuery = SIZE_TO_MEDIA[breakpoint];\n return window.matchMedia(mediaQuery).matches;\n }\n return false;\n};\n","/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n:host {\n /**\n * @prop --ion-grid-columns: The number of total Columns in the Grid\n * @prop --ion-grid-column-padding: Padding for the Column\n * @prop --ion-grid-column-padding-xs: Padding for the Column on xs screens and up\n * @prop --ion-grid-column-padding-sm: Padding for the Column on sm screens and up\n * @prop --ion-grid-column-padding-md: Padding for the Column on md screens and up\n * @prop --ion-grid-column-padding-lg: Padding for the Column on lg screens and up\n * @prop --ion-grid-column-padding-xl: Padding for the Column on xl screens and up\n */\n -webkit-padding-start: var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));\n padding-inline-start: var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));\n -webkit-padding-end: var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));\n padding-inline-end: var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));\n padding-top: var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));\n padding-bottom: var(--ion-grid-column-padding-xs, var(--ion-grid-column-padding, 5px));\n margin-left: 0;\n margin-right: 0;\n margin-top: 0;\n margin-bottom: 0;\n box-sizing: border-box;\n position: relative;\n flex-basis: 0;\n flex-grow: 1;\n width: 100%;\n max-width: 100%;\n min-height: 1px;\n}\n@media (min-width: 576px) {\n :host {\n -webkit-padding-start: var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));\n padding-inline-start: var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));\n -webkit-padding-end: var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));\n padding-inline-end: var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));\n padding-top: var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));\n padding-bottom: var(--ion-grid-column-padding-sm, var(--ion-grid-column-padding, 5px));\n }\n}\n@media (min-width: 768px) {\n :host {\n -webkit-padding-start: var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));\n padding-inline-start: var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));\n -webkit-padding-end: var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));\n padding-inline-end: var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));\n padding-top: var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));\n padding-bottom: var(--ion-grid-column-padding-md, var(--ion-grid-column-padding, 5px));\n }\n}\n@media (min-width: 992px) {\n :host {\n -webkit-padding-start: var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));\n padding-inline-start: var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));\n -webkit-padding-end: var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));\n padding-inline-end: var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));\n padding-top: var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));\n padding-bottom: var(--ion-grid-column-padding-lg, var(--ion-grid-column-padding, 5px));\n }\n}\n@media (min-width: 1200px) {\n :host {\n -webkit-padding-start: var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));\n padding-inline-start: var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));\n -webkit-padding-end: var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));\n padding-inline-end: var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));\n padding-top: var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));\n padding-bottom: var(--ion-grid-column-padding-xl, var(--ion-grid-column-padding, 5px));\n }\n}","/*!\n * (C) Ionic http://ionicframework.com - MIT License\n */\nimport { Host, forceUpdate, h } from \"@stencil/core\";\nimport { matchBreakpoint } from \"../../utils/media\";\nimport { getIonMode } from \"../../global/ionic-global\";\nconst win = typeof window !== 'undefined' ? window : undefined;\n// eslint-disable-next-line @typescript-eslint/prefer-optional-chain\nconst SUPPORTS_VARS = win && !!(win.CSS && win.CSS.supports && win.CSS.supports('--a: 0'));\nconst BREAKPOINTS = ['', 'xs', 'sm', 'md', 'lg', 'xl'];\nexport class Col {\n constructor() {\n this.offset = undefined;\n this.offsetXs = undefined;\n this.offsetSm = undefined;\n this.offsetMd = undefined;\n this.offsetLg = undefined;\n this.offsetXl = undefined;\n this.pull = undefined;\n this.pullXs = undefined;\n this.pullSm = undefined;\n this.pullMd = undefined;\n this.pullLg = undefined;\n this.pullXl = undefined;\n this.push = undefined;\n this.pushXs = undefined;\n this.pushSm = undefined;\n this.pushMd = undefined;\n this.pushLg = undefined;\n this.pushXl = undefined;\n this.size = undefined;\n this.sizeXs = undefined;\n this.sizeSm = undefined;\n this.sizeMd = undefined;\n this.sizeLg = undefined;\n this.sizeXl = undefined;\n }\n onResize() {\n forceUpdate(this);\n }\n // Loop through all of the breakpoints to see if the media query\n // matches and grab the column value from the relevant prop if so\n getColumns(property) {\n let matched;\n for (const breakpoint of BREAKPOINTS) {\n const matches = matchBreakpoint(breakpoint);\n // Grab the value of the property, if it exists and our\n // media query matches we return the value\n const columns = this[property + breakpoint.charAt(0).toUpperCase() + breakpoint.slice(1)];\n if (matches && columns !== undefined) {\n matched = columns;\n }\n }\n // Return the last matched columns since the breakpoints\n // increase in size and we want to return the largest match\n return matched;\n }\n calculateSize() {\n const columns = this.getColumns('size');\n // If size wasn't set for any breakpoint\n // or if the user set the size without a value\n // it means we need to stick with the default and return\n // e.g. <ion-col size-md>\n if (!columns || columns === '') {\n return;\n }\n // If the size is set to auto then don't calculate a size\n const colSize = columns === 'auto'\n ? 'auto'\n : // If CSS supports variables we should use the grid columns var\n SUPPORTS_VARS\n ? `calc(calc(${columns} / var(--ion-grid-columns, 12)) * 100%)`\n : // Convert the columns to a percentage by dividing by the total number\n // of columns (12) and then multiplying by 100\n (columns / 12) * 100 + '%';\n return {\n flex: `0 0 ${colSize}`,\n width: `${colSize}`,\n 'max-width': `${colSize}`,\n };\n }\n // Called by push, pull, and offset since they use the same calculations\n calculatePosition(property, modifier) {\n const columns = this.getColumns(property);\n if (!columns) {\n return;\n }\n // If the number of columns passed are greater than 0 and less than\n // 12 we can position the column, else default to auto\n const amount = SUPPORTS_VARS\n ? // If CSS supports variables we should use the grid columns var\n `calc(calc(${columns} / var(--ion-grid-columns, 12)) * 100%)`\n : // Convert the columns to a percentage by dividing by the total number\n // of columns (12) and then multiplying by 100\n columns > 0 && columns < 12\n ? (columns / 12) * 100 + '%'\n : 'auto';\n return {\n [modifier]: amount,\n };\n }\n calculateOffset(isRTL) {\n return this.calculatePosition('offset', isRTL ? 'margin-right' : 'margin-left');\n }\n calculatePull(isRTL) {\n return this.calculatePosition('pull', isRTL ? 'left' : 'right');\n }\n calculatePush(isRTL) {\n return this.calculatePosition('push', isRTL ? 'right' : 'left');\n }\n render() {\n const isRTL = document.dir === 'rtl';\n const mode = getIonMode(this);\n return (h(Host, { key: '56ecf3b3f2be05d5f179f2d136d4ab05a4525da9', class: {\n [mode]: true,\n }, style: Object.assign(Object.assign(Object.assign(Object.assign({}, this.calculateOffset(isRTL)), this.calculatePull(isRTL)), this.calculatePush(isRTL)), this.calculateSize()) }, h(\"slot\", { key: '8f1113d39dcb709300ebbeaf81bc092c1dd8da3e' })));\n }\n static get is() { return \"ion-col\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"col.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"col.css\"]\n };\n }\n static get properties() {\n return {\n \"offset\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to offset the column, in terms of how many columns it should shift to the end\\nof the total available.\"\n },\n \"attribute\": \"offset\",\n \"reflect\": false\n },\n \"offsetXs\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to offset the column for xs screens, in terms of how many columns it should shift\\nto the end of the total available.\"\n },\n \"attribute\": \"offset-xs\",\n \"reflect\": false\n },\n \"offsetSm\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to offset the column for sm screens, in terms of how many columns it should shift\\nto the end of the total available.\"\n },\n \"attribute\": \"offset-sm\",\n \"reflect\": false\n },\n \"offsetMd\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to offset the column for md screens, in terms of how many columns it should shift\\nto the end of the total available.\"\n },\n \"attribute\": \"offset-md\",\n \"reflect\": false\n },\n \"offsetLg\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to offset the column for lg screens, in terms of how many columns it should shift\\nto the end of the total available.\"\n },\n \"attribute\": \"offset-lg\",\n \"reflect\": false\n },\n \"offsetXl\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to offset the column for xl screens, in terms of how many columns it should shift\\nto the end of the total available.\"\n },\n \"attribute\": \"offset-xl\",\n \"reflect\": false\n },\n \"pull\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to pull the column, in terms of how many columns it should shift to the start of\\nthe total available.\"\n },\n \"attribute\": \"pull\",\n \"reflect\": false\n },\n \"pullXs\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to pull the column for xs screens, in terms of how many columns it should shift\\nto the start of the total available.\"\n },\n \"attribute\": \"pull-xs\",\n \"reflect\": false\n },\n \"pullSm\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to pull the column for sm screens, in terms of how many columns it should shift\\nto the start of the total available.\"\n },\n \"attribute\": \"pull-sm\",\n \"reflect\": false\n },\n \"pullMd\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to pull the column for md screens, in terms of how many columns it should shift\\nto the start of the total available.\"\n },\n \"attribute\": \"pull-md\",\n \"reflect\": false\n },\n \"pullLg\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to pull the column for lg screens, in terms of how many columns it should shift\\nto the start of the total available.\"\n },\n \"attribute\": \"pull-lg\",\n \"reflect\": false\n },\n \"pullXl\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to pull the column for xl screens, in terms of how many columns it should shift\\nto the start of the total available.\"\n },\n \"attribute\": \"pull-xl\",\n \"reflect\": false\n },\n \"push\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to push the column, in terms of how many columns it should shift to the end\\nof the total available.\"\n },\n \"attribute\": \"push\",\n \"reflect\": false\n },\n \"pushXs\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to push the column for xs screens, in terms of how many columns it should shift\\nto the end of the total available.\"\n },\n \"attribute\": \"push-xs\",\n \"reflect\": false\n },\n \"pushSm\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to push the column for sm screens, in terms of how many columns it should shift\\nto the end of the total available.\"\n },\n \"attribute\": \"push-sm\",\n \"reflect\": false\n },\n \"pushMd\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to push the column for md screens, in terms of how many columns it should shift\\nto the end of the total available.\"\n },\n \"attribute\": \"push-md\",\n \"reflect\": false\n },\n \"pushLg\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to push the column for lg screens, in terms of how many columns it should shift\\nto the end of the total available.\"\n },\n \"attribute\": \"push-lg\",\n \"reflect\": false\n },\n \"pushXl\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The amount to push the column for xl screens, in terms of how many columns it should shift\\nto the end of the total available.\"\n },\n \"attribute\": \"push-xl\",\n \"reflect\": false\n },\n \"size\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The size of the column, in terms of how many columns it should take up out of the total\\navailable. If `\\\"auto\\\"` is passed, the column will be the size of its content.\"\n },\n \"attribute\": \"size\",\n \"reflect\": false\n },\n \"sizeXs\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The size of the column for xs screens, in terms of how many columns it should take up out\\nof the total available. If `\\\"auto\\\"` is passed, the column will be the size of its content.\"\n },\n \"attribute\": \"size-xs\",\n \"reflect\": false\n },\n \"sizeSm\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The size of the column for sm screens, in terms of how many columns it should take up out\\nof the total available. If `\\\"auto\\\"` is passed, the column will be the size of its content.\"\n },\n \"attribute\": \"size-sm\",\n \"reflect\": false\n },\n \"sizeMd\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The size of the column for md screens, in terms of how many columns it should take up out\\nof the total available. If `\\\"auto\\\"` is passed, the column will be the size of its content.\"\n },\n \"attribute\": \"size-md\",\n \"reflect\": false\n },\n \"sizeLg\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The size of the column for lg screens, in terms of how many columns it should take up out\\nof the total available. If `\\\"auto\\\"` is passed, the column will be the size of its content.\"\n },\n \"attribute\": \"size-lg\",\n \"reflect\": false\n },\n \"sizeXl\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string | undefined\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The size of the column for xl screens, in terms of how many columns it should take up out\\nof the total available. If `\\\"auto\\\"` is passed, the column will be the size of its content.\"\n },\n \"attribute\": \"size-xl\",\n \"reflect\": false\n }\n };\n }\n static get listeners() {\n return [{\n \"name\": \"resize\",\n \"method\": \"onResize\",\n \"target\": \"window\",\n \"capture\": false,\n \"passive\": true\n }];\n }\n}\n","/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n:host {\n /**\n * @prop --ion-grid-padding: Padding for the Grid\n * @prop --ion-grid-padding-xs: Padding for the Grid on xs screens\n * @prop --ion-grid-padding-sm: Padding for the Grid on sm screens\n * @prop --ion-grid-padding-md: Padding for the Grid on md screens\n * @prop --ion-grid-padding-lg: Padding for the Grid on lg screens\n * @prop --ion-grid-padding-xl: Padding for the Grid on xl screens\n *\n * @prop --ion-grid-width: Width of the fixed Grid\n * @prop --ion-grid-width-xs: Width of the fixed Grid on xs screens\n * @prop --ion-grid-width-sm: Width of the fixed Grid on sm screens\n * @prop --ion-grid-width-md: Width of the fixed Grid on md screens\n * @prop --ion-grid-width-lg: Width of the fixed Grid on lg screens\n * @prop --ion-grid-width-xl: Width of the fixed Grid on xl screens\n */\n -webkit-padding-start: var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));\n padding-inline-start: var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));\n -webkit-padding-end: var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));\n padding-inline-end: var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));\n padding-top: var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));\n padding-bottom: var(--ion-grid-padding-xs, var(--ion-grid-padding, 5px));\n -webkit-margin-start: auto;\n margin-inline-start: auto;\n -webkit-margin-end: auto;\n margin-inline-end: auto;\n display: block;\n flex: 1;\n}\n@media (min-width: 576px) {\n :host {\n -webkit-padding-start: var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));\n padding-inline-start: var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));\n -webkit-padding-end: var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));\n padding-inline-end: var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));\n padding-top: var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));\n padding-bottom: var(--ion-grid-padding-sm, var(--ion-grid-padding, 5px));\n }\n}\n@media (min-width: 768px) {\n :host {\n -webkit-padding-start: var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));\n padding-inline-start: var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));\n -webkit-padding-end: var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));\n padding-inline-end: var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));\n padding-top: var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));\n padding-bottom: var(--ion-grid-padding-md, var(--ion-grid-padding, 5px));\n }\n}\n@media (min-width: 992px) {\n :host {\n -webkit-padding-start: var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));\n padding-inline-start: var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));\n -webkit-padding-end: var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));\n padding-inline-end: var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));\n padding-top: var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));\n padding-bottom: var(--ion-grid-padding-lg, var(--ion-grid-padding, 5px));\n }\n}\n@media (min-width: 1200px) {\n :host {\n -webkit-padding-start: var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));\n padding-inline-start: var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));\n -webkit-padding-end: var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));\n padding-inline-end: var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));\n padding-top: var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));\n padding-bottom: var(--ion-grid-padding-xl, var(--ion-grid-padding, 5px));\n }\n}\n\n:host(.grid-fixed) {\n width: var(--ion-grid-width-xs, var(--ion-grid-width, 100%));\n max-width: 100%;\n}\n@media (min-width: 576px) {\n :host(.grid-fixed) {\n width: var(--ion-grid-width-sm, var(--ion-grid-width, 540px));\n }\n}\n@media (min-width: 768px) {\n :host(.grid-fixed) {\n width: var(--ion-grid-width-md, var(--ion-grid-width, 720px));\n }\n}\n@media (min-width: 992px) {\n :host(.grid-fixed) {\n width: var(--ion-grid-width-lg, var(--ion-grid-width, 960px));\n }\n}\n@media (min-width: 1200px) {\n :host(.grid-fixed) {\n width: var(--ion-grid-width-xl, var(--ion-grid-width, 1140px));\n }\n}\n\n:host(.ion-no-padding) {\n --ion-grid-column-padding: 0;\n --ion-grid-column-padding-xs: 0;\n --ion-grid-column-padding-sm: 0;\n --ion-grid-column-padding-md: 0;\n --ion-grid-column-padding-lg: 0;\n --ion-grid-column-padding-xl: 0;\n}","/*!\n * (C) Ionic http://ionicframework.com - MIT License\n */\nimport { Host, h } from \"@stencil/core\";\nimport { getIonMode } from \"../../global/ionic-global\";\nexport class Grid {\n constructor() {\n this.fixed = false;\n }\n render() {\n const mode = getIonMode(this);\n return (h(Host, { key: 'a1c2ff77f97761c2bbcd869b2cc7b1558032b406', class: {\n [mode]: true,\n 'grid-fixed': this.fixed,\n } }, h(\"slot\", { key: 'cd25166436cf3a63a11ad436a9b9c5a607e72600' })));\n }\n static get is() { return \"ion-grid\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"grid.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"grid.css\"]\n };\n }\n static get properties() {\n return {\n \"fixed\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"If `true`, the grid will have a fixed width based on the screen size.\"\n },\n \"attribute\": \"fixed\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n }\n };\n }\n}\n","/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n * :host {\n * background-color: green;\n * }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n * :host {\n * background-color: blue;\n * }\n * }\n */\n:host {\n display: flex;\n flex-wrap: wrap;\n}","/*!\n * (C) Ionic http://ionicframework.com - MIT License\n */\nimport { Host, h } from \"@stencil/core\";\nimport { getIonMode } from \"../../global/ionic-global\";\nexport class Row {\n render() {\n return (h(Host, { key: '242c9a45b0bb39af2aebf412fdfa9a176babc834', class: getIonMode(this) }, h(\"slot\", { key: 'd9015d663d631bbf20bd3e0821fed874cd6c5156' })));\n }\n static get is() { return \"ion-row\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"row.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"row.css\"]\n };\n }\n}\n",":host {\n --background-base-color: color-mix(in srgb, var(--pos-background-color), var(--color-grey-800) 10%);\n --background-color-even: hsl(from var(--background-base-color) h s calc(l + 7));\n --background-color-odd: hsl(from var(--background-base-color) h s calc(l + 10));\n --border-color: var(--background-base-color);\n}\n\ndd {\n padding: 0;\n margin: 0;\n}\n\ndl {\n padding: 0;\n margin: 0;\n display: flex;\n flex-direction: column;\n gap: var(--size-1);\n}\n\ndt {\n margin-bottom: var(--size-1);\n}\n\n.predicate-values:nth-child(odd) {\n background-color: var(--background-color-odd);\n}\n\n.predicate-values:nth-child(even) {\n background-color: var(--background-color-even);\n}\n\n.predicate-values {\n display: flex;\n flex-direction: column;\n border: var(--size-px) solid var(--border-color);\n padding: var(--size-2);\n gap: var(--size-1);\n\n .values {\n display: flex;\n flex-direction: column;\n gap: var(--size-2);\n }\n}\n","import { Literal, Thing } from '@pod-os/core';\nimport { Component, Event, EventEmitter, h, Host, State } from '@stencil/core';\nimport { ResourceAware, subscribeResource } from '../events/ResourceAware';\n\n@Component({\n tag: 'pos-literals',\n styleUrl: './pos-literals.css',\n shadow: true,\n})\nexport class PosLiterals implements ResourceAware {\n @State() data: Literal[] = [];\n\n @Event({ eventName: 'pod-os:resource' })\n subscribeResource: EventEmitter;\n\n componentWillLoad() {\n subscribeResource(this);\n }\n\n receiveResource = (resource: Thing) => {\n this.data = resource.literals();\n };\n\n literalValueAdded(newLiteral: Literal) {\n const existing = this.data.find(it => it.predicate === newLiteral.predicate);\n\n if (!existing) {\n this.data = [...this.data, newLiteral];\n } else {\n this.data = this.data.map(it => {\n return it.predicate === existing.predicate\n ? {\n predicate: existing.predicate,\n label: existing.label,\n values: [...existing.values, ...newLiteral.values],\n }\n : it;\n });\n }\n }\n\n render() {\n return (\n <Host>\n {this.data.length > 0 ? (\n <dl>\n {this.data.map(it => (\n <div class=\"predicate-values\">\n <dt>\n <pos-predicate uri={it.predicate} label={it.label} />\n </dt>\n <div class=\"values\">\n {it.values.map(value => (\n <dd>{value}</dd>\n ))}\n </div>\n </div>\n ))}\n </dl>\n ) : null}\n <pos-add-literal-value onPod-os:added-literal-value={event => this.literalValueAdded(event.detail)} />\n </Host>\n );\n }\n}\n",".types {\n display: flex;\n gap: var(--size-1);\n}\n\n.expanded {\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n}\n\nion-badge {\n color: #333;\n background: #eee;\n}\n\nion-badge.toggle {\n cursor: pointer;\n}\n\nion-badge.toggle:hover {\n background: #ddd;\n}\n","import { RdfType, Thing } from '@pod-os/core';\nimport { Component, Event, EventEmitter, h, Host, State } from '@stencil/core';\nimport { ResourceAware, subscribeResource } from '../events/ResourceAware';\n\n@Component({\n tag: 'pos-type-badges',\n shadow: true,\n styleUrl: 'pos-type-badges.css',\n})\nexport class PosTypeBadges implements ResourceAware {\n @State() data: RdfType[] = [];\n @State() typeLabels: string[] = [];\n\n @State() isExpanded: boolean = false;\n\n @Event({ eventName: 'pod-os:resource' })\n subscribeResource: EventEmitter;\n\n componentWillLoad() {\n subscribeResource(this);\n }\n\n receiveResource = (resource: Thing) => {\n this.data = resource.types();\n this.typeLabels = [...new Set(resource.types().map(it => it.label))];\n };\n\n toggleDetails() {\n this.isExpanded = !this.isExpanded;\n }\n\n render() {\n if (this.data.length == 0) {\n return null;\n }\n if (this.isExpanded) {\n return (\n <div class=\"types expanded\">\n <ion-badge class=\"toggle\" onClick={() => this.toggleDetails()}>\n <ion-icon name=\"contract-outline\"></ion-icon>\n </ion-badge>\n {this.data.map(it => (\n <ion-badge>{it.uri}</ion-badge>\n ))}\n </div>\n );\n } else {\n return (\n <Host>\n <div class=\"types\">\n {this.typeLabels.map(it => (\n <ion-badge>{it}</ion-badge>\n ))}\n <ion-badge class=\"toggle\" onClick={() => this.toggleDetails()}>\n <ion-icon name=\"expand-outline\"></ion-icon>\n </ion-badge>\n </div>\n </Host>\n );\n }\n }\n}\n"],"version":3}

package/dist/cjs/ion-card_34.cjs.entry.js CHANGED Viewed

@@ -1919,7 +1919,7 @@ const PosAddNewThing = class {
         this.dialog.showModal();
     }
     render() {
-        return (index.h(index.Host, { key: '4adcc80d1a0d810279a85be26c8ec6717d91c8a2' }, index.h("button", { key: '9a3cdd12719c4d3e4ae1e0eff60ccd6101395d92', id: "new", title: "Add a new thing", onClick: () => this.openDialog() }, index.h("ion-icon", { key: 'efb2723db05962c02293931d0a334ba55908f596', name: "add-circle-outline" })), index.h("pos-dialog", { key: '954a947b2dc4082519c50cb71a4b6f0f3550c0fb', ref: el => (this.dialog = el) }, index.h("span", { key: '0a7e91bab3d8740bc8228782d70a980779db7ca1', slot: "title" }, "Add a new thing"), index.h("pos-new-thing-form", { key: '66ac9bcf72a71b58f4dbbc5cfd214b3609c78cbf', slot: "content", referenceUri: this.referenceUri }))));
+        return (index.h(index.Host, { key: '5ed3ba3982467778ed2b9b02090c230acb6b1762' }, index.h("button", { key: '96ff5dbd0ba4ca4d8c1d25045efa06fea062e9cf', id: "new", title: "Add a new thing", onClick: () => this.openDialog() }, index.h("ion-icon", { key: '201a19c8ecb39e0e913d3fb8cf1ebee06bc41df5', name: "add-circle-outline" })), index.h("pos-dialog", { key: '421da81e6faf52119fe600cc388663299eab67ec', ref: el => (this.dialog = el) }, index.h("span", { key: '454e6e05dc478e9c1b378cb3308f006fab4d8738', slot: "title" }, "Add a new thing"), index.h("pos-new-thing-form", { key: 'a469379848776a4c7e9f8e3f94da76ba048d7fab', slot: "content", referenceUri: this.referenceUri }))));
     }
 };
 PosAddNewThing.style = PosAddNewThingStyle0;
@@ -3250,11 +3250,11 @@ const PosApp = class {
         }
     }
     render() {
-        return index.h("slot", { key: 'eb7dfaa67c538b3e3e33f42556c1b604fc964729' });
+        return index.h("slot", { key: '402887f3383b6053da157df211c28977720db8e2' });
     }
 };
-const posAppBrowserCss = "pos-router {\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n}\n\npos-navigation-bar {\n  max-width: var(--width-lg);\n  margin: 0;\n}\n\npos-add-new-thing,\npos-login {\n  flex: 0 1 auto; /* Behält die Breite des Inhalts bei */\n}\n\nheader,\nfooter {\n  display: flex;\n  gap: var(--size-1);\n  height: auto;\n  justify-content: center;\n  align-items: center;\n  padding: var(--size-1);\n}\n\nfooter svg {\n  width: var(--size-5);\n  height: var(--size-5);\n}\n\nfooter {\n  font-size: var(--scale-fluid-000);\n\n  .settings {\n    padding: 0 var(--size-1);\n    text-decoration: none;\n    border: 1px solid var(--color-grey-800);\n    color: var(--color-grey-800);\n    border-radius: var(--radius-xs);\n\n    &:hover {\n      background-color: var(--color-grey-800);\n      color: white;\n    }\n  }\n}\n\nheader {\n  flex-wrap: wrap;\n  padding: 0 var(--size-8);\n}\n\nmain {\n  flex: 1;\n  max-height: 100vh;\n  overflow: auto;\n}\n\n@media (max-width: 640px) {\n  header {\n    padding: 0 var(--size-1) var(--size-1);\n    justify-content: space-between;\n  }\n\n  pos-navigation-bar {\n    flex-basis: 100%;\n    order: 0;\n  }\n\n  pos-add-new-thing,\n  pos-login {\n    order: 1;\n  }\n}\n";
+const posAppBrowserCss = "pos-router {\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n}\n\npos-navigation-bar {\n  max-width: var(--width-lg);\n  margin: 0;\n}\n\npos-add-new-thing,\npos-login {\n  flex: 0 1 auto; /* Behält die Breite des Inhalts bei */\n}\n\nheader,\nfooter {\n  display: flex;\n  gap: var(--size-1);\n  height: auto;\n  justify-content: center;\n  align-items: center;\n  padding: var(--size-1);\n}\n\nfooter svg {\n  width: var(--size-5);\n  height: var(--size-5);\n}\n\nfooter {\n  font-size: var(--scale-fluid-000);\n\n  .settings {\n    padding: 0 var(--size-1);\n    text-decoration: none;\n    background-color: var(--pos-background-color);\n    border: 1px solid var(--pos-secondary-border-color);\n    color: var(--pos-secondary-border-color);\n    border-radius: var(--radius-xs);\n\n    &:hover {\n      background-color: var(--pos-secondary-border-color);\n      color: var(--pos-background-color);\n    }\n  }\n}\n\nheader {\n  flex-wrap: wrap;\n  padding: 0 var(--size-8);\n}\n\nmain {\n  flex: 1;\n  max-height: 100vh;\n  overflow: auto;\n}\n\n@media (max-width: 640px) {\n  header {\n    padding: 0 var(--size-1) var(--size-1);\n    justify-content: space-between;\n  }\n\n  pos-navigation-bar {\n    flex-basis: 100%;\n    order: 0;\n  }\n\n  pos-add-new-thing,\n  pos-login {\n    order: 1;\n  }\n}\n";
 const PosAppBrowserStyle0 = posAppBrowserCss;
 const PosAppBrowser = class {
@@ -3291,7 +3291,7 @@ const Logo = () => {
 };
 PosAppBrowser.style = PosAppBrowserStyle0;
-const posAppDashboardCss = ":host{display:grid;grid-template-columns:repeat(auto-fit, minmax(var(--size-12), var(--size-96)));gap:var(--size-4);padding:var(--size-2);justify-content:center;align-items:start;justify-items:stretch;height:100%;background:linear-gradient(230deg, rgb(251, 251, 255) 0%, rgb(215, 223, 252) 100%)}";
+const posAppDashboardCss = ":host{display:grid;grid-template-columns:repeat(auto-fit, minmax(var(--size-12), var(--size-96)));gap:var(--size-4);padding:var(--size-2);justify-content:center;align-items:start;justify-items:stretch}";
 const PosAppDashboardStyle0 = posAppDashboardCss;
 const PosAppDashboard = class {
@@ -3304,7 +3304,7 @@ const PosAppDashboard = class {
 };
 PosAppDashboard.style = PosAppDashboardStyle0;
-const posAppSettingsCss = ":host{display:grid;grid-template-columns:repeat(auto-fit, minmax(var(--size-12), var(--size-96)));gap:var(--size-4);padding:var(--size-2);justify-content:center;align-items:start;justify-items:stretch;height:100%;background:linear-gradient(230deg, rgb(251, 251, 255) 0%, rgb(215, 223, 252) 100%)}";
+const posAppSettingsCss = ":host{display:grid;grid-template-columns:repeat(auto-fit, minmax(var(--size-12), var(--size-96)));gap:var(--size-4);padding:var(--size-2);justify-content:center;align-items:start;justify-items:stretch}";
 const PosAppSettingsStyle0 = posAppSettingsCss;
 const PosAppSettings = class {
@@ -3312,7 +3312,7 @@ const PosAppSettings = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return index.h("pos-setting-offline-cache", { key: '83d824c60d1eb9e2d60b0d7255dda841ad9c6164' });
+        return index.h("pos-setting-offline-cache", { key: '0da588136a4c7c4238e0387bfe0649464ccd1c7d' });
     }
 };
 PosAppSettings.style = PosAppSettingsStyle0;
@@ -3333,7 +3333,7 @@ const PosDescription = class {
     }
 };
-const posDialogCss = "dialog{background-color:var(--pos-background-color);border:none;border-radius:var(--radius-md);box-shadow:var(--shadow-md);max-width:var(--width-xs)}dialog header>:first-child{flex-grow:1;font-weight:var(--weight-light);font-size:var(--scale-2);font-family:var(--font-sans);margin:0}dialog header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:var(--scale-0);border-bottom-style:inset;padding:0 0 var(--scale-0) 0}dialog>:last-child{display:block;margin-top:var(--scale-3)}button#close{cursor:pointer;display:flex;align-items:center;justify-content:center;border:none;background:none;font-size:var(--scale-3);color:var(--color-grey-500)}button#close:hover{color:var(--color-grey-800)}";
+const posDialogCss = "dialog{background-color:var(--pos-background-color);color:var(--pos-normal-text-color);border:none;border-radius:var(--radius-md);box-shadow:var(--shadow-md);max-width:var(--width-xs);animation:slideIn 0.2s ease-out}dialog::backdrop{background:rgba(0, 0, 0, 0.5);backdrop-filter:var(--blur-sm);animation:fadeIn 0.2s ease-out}@media (prefers-color-scheme: dark){dialog::backdrop{background:rgb(100, 100, 100, 0.5)}}dialog header>:first-child{flex-grow:1;font-weight:var(--weight-light);font-size:var(--scale-2);font-family:var(--font-sans);margin:0}dialog header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:var(--scale-0);border-bottom-style:inset;padding:0 0 var(--scale-0) 0}dialog>:last-child{display:block;margin-top:var(--scale-3)}button#close{cursor:pointer;display:flex;align-items:center;justify-content:center;border:none;background:none;font-size:var(--scale-3);color:var(--color-grey-500)}button#close:hover{color:var(--pos-secondary-border-color)}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideIn{from{opacity:0;transform:translateY(-20px) scale(0.95)}to{opacity:1;transform:translateY(0) scale(1)}}";
 const PosDialogStyle0 = posDialogCss;
 const PosDialog = class {
@@ -3347,7 +3347,7 @@ const PosDialog = class {
         this.dialog.close();
     }
     render() {
-        return (index.h(index.Host, { key: '097959e50499628b0b3e9be024cd415d25182303' }, index.h("dialog", { key: '0ac068acd6392cfc57f9e3bff866a6c865dcafe3', ref: el => (this.dialog = el) }, index.h("header", { key: '0cf470448e42f04c8a839eb67eec5a0708e306cb' }, index.h("slot", { key: '3f3f457ff9130c66ac31e21da74f9ffa9cc42a06', name: "title" }), index.h("button", { key: 'd420ee61dc91d4f193048f6c89351121c0337446', tabindex: -1, id: "close", title: "Close", onClick: () => this.close() }, index.h("ion-icon", { key: '9a775752b1678654b3446b964fe83ca15d8722ca', name: "close-outline" }))), index.h("slot", { key: '464e9fefd0dc8c32b52399358ff250e1982bdf36', name: "content" }))));
+        return (index.h(index.Host, { key: '307e23d3f92eae595a6bb9fd3e2487387d9b02c2' }, index.h("dialog", { key: '4c21714a0e2e84d809fe46b75d875c961ff8240c', ref: el => (this.dialog = el) }, index.h("header", { key: '0b9276c31a8deffa524a65b744d0ced04a753c1b' }, index.h("slot", { key: 'f4bcf72fcb25ea2619a0d7a40f524a10a91c0ca6', name: "title" }), index.h("button", { key: '8afb0911e29f8b4c81ff31f498266b398125327a', tabindex: -1, id: "close", title: "Close", onClick: () => this.close() }, index.h("ion-icon", { key: '464669b8a7f2aa1a1d274f933bb394a61abffc99', name: "close-outline" }))), index.h("slot", { key: 'f9fa43f73f8c295b6c728b4c7e7e3bf5c3be8948', name: "content" }))));
     }
 };
 PosDialog.style = PosDialogStyle0;
@@ -3382,11 +3382,11 @@ const PosErrorToast = class {
         await toast.present();
     }
     render() {
-        return (index.h(index.Host, { key: 'ca253ac051cc38f56c8db1224fea075293f796b4' }, index.h("ion-toast", { key: '060b78fd54963782be40abca4592c5871fc84d82', trigger: "never", message: "Workarround to preload ion-toast and ion-ripple-effect to be able to show errors while offline", duration: 0 }, index.h("ion-ripple-effect", { key: '45f799c8d1f36ad3f11a62485677fc38eb01857b' })), index.h("slot", { key: '02c6e3ad7cce764de694579056fc1fe1d97dfa32' })));
+        return (index.h(index.Host, { key: '0dce513e04101d3b9011c635f5aab8897a246385' }, index.h("ion-toast", { key: '956224c61589fca317f8143055344c857aa894cf', trigger: "never", message: "Workarround to preload ion-toast and ion-ripple-effect to be able to show errors while offline", duration: 0 }, index.h("ion-ripple-effect", { key: 'e96e65e2f06b61970e241639e7c429a90404517e' })), index.h("slot", { key: '8869125c64fb97f9736e30df0a748c9ce6aec1da' })));
     }
 };
-const posExampleResourcesCss = ":host{border:var(--size-px) solid var(--color-grey-100);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--color-white)}.links{display:flex;flex-direction:column;gap:var(--size-3);max-width:80vw}";
+const posExampleResourcesCss = ":host{border:var(--size-px) solid var(--pos-border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--pos-card-background)}.links{display:flex;flex-direction:column;gap:var(--size-3);max-width:80vw}";
 const PosExampleResourcesStyle0 = posExampleResourcesCss;
 const PosExampleResources = class {
@@ -3399,7 +3399,7 @@ const PosExampleResources = class {
 };
 PosExampleResources.style = PosExampleResourcesStyle0;
-const posGettingStartedCss = ":host{border:var(--size-px) solid var(--color-grey-100);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--color-white)}.question{font-weight:var(--weight-semibold);color:var(--color-grey-900)}a{font-weight:var(--weight-bold);color:var(--pos-primary-color)}";
+const posGettingStartedCss = ":host{border:var(--size-px) solid var(--pos-border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--pos-card-background)}.question{font-weight:var(--weight-semibold)}a{font-weight:var(--weight-bold);color:var(--pos-primary-color)}";
 const PosGettingStartedStyle0 = posGettingStartedCss;
 const PosGettingStarted = class {
@@ -3537,12 +3537,12 @@ const PosLogin = class {
         this.dialog.showModal();
     }
     render() {
-        return (index.h(index.Host, { key: '246bea632b952b0a004e1237697a86bd0ebfeea4' }, index.h("div", { key: 'cdcb1905deb0d27f79adc4ed1eeae0adb47b37f6', class: "container" }, BrokenFile.store.state.isLoggedIn ? (index.h("pos-resource", { uri: BrokenFile.store.state.webId }, index.h("span", { class: "user-data" }, index.h("pos-picture", null), index.h("pos-label", null)))) : (''), !BrokenFile.store.state.isLoggedIn && (index.h("button", { key: 'dc3a1072af920e9495a2e003c1e2edf8d282de29', id: "login", onClick: () => this.openDialog() }, "Login")), BrokenFile.store.state.isLoggedIn && (index.h("button", { key: 'ca04ffb1126cd26d1c80060673c036048b403c82', id: "logout", onClick: () => this.logout() }, "Logout"))), index.h("pos-dialog", { key: 'f832ac8272a695e1bcf826d5aa5d62843bfb4de5', ref: el => (this.dialog = el) }, index.h("span", { key: 'd2dd84554a068af4a044cba963aa4417b8232d93', slot: "title" }, "Sign in to your Pod"), index.h("pos-login-form", { key: '98b542c2ddc6828fe99857632ee90a0dae6fdf96', "onPod-os:idp-url-selected": ev => this.login(ev), slot: "content" }))));
+        return (index.h(index.Host, { key: 'a4fffd431e401c0acba29cd336715b24fa2bed67' }, index.h("div", { key: '31aaebc9eeacbf274d72bb42f9bca15691bf1590', class: "container" }, BrokenFile.store.state.isLoggedIn ? (index.h("pos-resource", { uri: BrokenFile.store.state.webId }, index.h("span", { class: "user-data" }, index.h("pos-picture", null), index.h("pos-label", null)))) : (''), !BrokenFile.store.state.isLoggedIn && (index.h("button", { key: '8680aa6b62740fea847d85e12e05573ba44e37ce', id: "login", onClick: () => this.openDialog() }, "Login")), BrokenFile.store.state.isLoggedIn && (index.h("button", { key: '3f1af02cd8e77910d4469c1ab83a4fc844c3bae2', id: "logout", onClick: () => this.logout() }, "Logout"))), index.h("pos-dialog", { key: '732816c365ae37b144fd56c0146dd9970336dc2a', ref: el => (this.dialog = el) }, index.h("span", { key: '7598a5abff7af257779111cac31ee879eb47dfd4', slot: "title" }, "Sign in to your Pod"), index.h("pos-login-form", { key: 'cb1297076cf78aafad0dba1b5c111bf9c68e717b', "onPod-os:idp-url-selected": ev => this.login(ev), slot: "content" }))));
     }
 };
 PosLogin.style = PosLoginStyle0;
-const posLoginFormCss = ":host{display:block;margin:0}form{display:flex;flex-direction:column;gap:var(--size-4)}input{outline:var(--pos-input-outline);padding:var(--scale-000);border:none;border-radius:var(--radius-xs);width:var(--size-full);box-sizing:border-box}input:focus-within{outline:var(--pos-input-focus-outline)}input#login{outline:none;box-shadow:var(--shadow-sm);cursor:pointer;color:var(--pos-primary-text-color);background-color:var(--pos-primary-color)}input#login:disabled{cursor:default;color:var(--pos-disabled-text-color);background-color:var(--pos-disabled-color);box-shadow:none}input#login:hover:not(:disabled),input#login:focus{filter:brightness(110%);box-shadow:var(--shadow-md)}";
+const posLoginFormCss = ":host{display:block;margin:0}form{display:flex;flex-direction:column;gap:var(--size-4)}input{outline:var(--pos-input-outline);padding:var(--scale-000);border:none;border-radius:var(--radius-xs);width:var(--size-full);box-sizing:border-box;background:var(--pos-input-background-color);color:var(--pos-normal-text-color)}input:focus-within{outline:var(--pos-input-focus-outline)}input#login{outline:none;box-shadow:var(--shadow-sm);cursor:pointer;color:var(--pos-primary-text-color);background-color:var(--pos-primary-color)}input#login:disabled{cursor:default;color:var(--pos-disabled-text-color);background-color:var(--pos-disabled-color);box-shadow:none}input#login:hover:not(:disabled),input#login:focus{filter:brightness(110%);box-shadow:var(--shadow-md)}";
 const PosLoginFormStyle0 = posLoginFormCss;
 const PosLoginForm = class {
@@ -3556,7 +3556,7 @@ const PosLoginForm = class {
         this.canSubmit = Boolean(this.idpUrl);
     }
     render() {
-        return (index.h("form", { key: 'ad94a827203fead2cc5976e65d5dd11b76929a37', method: "dialog", onSubmit: () => this.handleSubmit() }, index.h("label", { key: '042115e98ac3dc97aa941b9a086a930c532bab19', htmlFor: "idpUrl" }, "Please enter your Identity Provider"), index.h("input", { key: '45a4621d9a21a5b21ec82f81025b2be68d5505ae', id: "idpUrl", type: "url", value: this.idpUrl, required: true, onInput: e => this.handleChange(e), list: "suggestedIssuers", placeholder: "Type to search..." }), index.h("datalist", { key: '1f4dd4962470e796d1a175ea2ec2d03663390a0d', id: "suggestedIssuers" }, index.h("option", { key: 'f00f189f9f7babbda5c109a57d380d4d44d68f79', value: "https://solidcommunity.net" }, "solidcommunity.net"), index.h("option", { key: 'a0a1e4171ef87cd219cb8f0c68b68d0901d3fa55', value: "https://solidweb.org" }, "solidweb.org"), index.h("option", { key: '4361294b71ba9b7b123dd5d1deb2692b2edfa59e', value: "https://solidweb.me" }, "solidweb.me"), index.h("option", { key: '0fcee23d732415ef206d8c9a4d18c31f2bcd8eca', value: "https://inrupt.net" }, "inrupt.net"), index.h("option", { key: '267b177e9765e09ee2aa592c8a4d4c152ad7fb0b', value: "https://login.inrupt.com" }, "Inrupt PodSpaces"), index.h("option", { key: '302a4d517fedeafb146d9f8a3938383c57e24f7e', value: "https://trinpod.us" }, "trinpod.us"), index.h("option", { key: '83fd1b92688b24f575d3ee17a9cb394c8ab16eab', value: "https://use.id" }, "use.id"), index.h("option", { key: '007f814795f747d9b74f7b16db986502a9b746af', value: "https://solid.redpencil.io" }, "redpencil.io"), index.h("option", { key: '5477d60737d194bce4c50f24a75930427b6dc9bb', value: "https://datapod.grant.io" }, "Data Pod (grant.io)"), index.h("option", { key: 'e289736fcc31902f783efae443f17dfda532ba9f', value: "https://teamid.live" }, "teamid.live")), index.h("input", { key: '69a61d727a4e2c88a7f3594b98cca42f934b649a', id: "login", type: "submit", value: "Login", disabled: !this.canSubmit })));
+        return (index.h("form", { key: '6c54aa03972bf5af3779c1e3f874b99574232821', method: "dialog", onSubmit: () => this.handleSubmit() }, index.h("label", { key: 'a5def7569abeb0a2591886d48fa0deb2c7f6039c', htmlFor: "idpUrl" }, "Please enter your Identity Provider"), index.h("input", { key: '1da8575dccea9a777f00cb8a7f96435654a582bc', id: "idpUrl", type: "url", value: this.idpUrl, required: true, onInput: e => this.handleChange(e), list: "suggestedIssuers", placeholder: "Type to search..." }), index.h("datalist", { key: '1818988df2f8a825194eb3503979d6c6adac3619', id: "suggestedIssuers" }, index.h("option", { key: '25e1b3fd84610e0664c25c3ca9cd535bf7558357', value: "https://solidcommunity.net" }, "solidcommunity.net"), index.h("option", { key: '5635e434dc4bf406a3664cf5cb28489b5b9218fc', value: "https://solidweb.org" }, "solidweb.org"), index.h("option", { key: 'd4d301023b40f84b5f445d14290ef3bc589cff56', value: "https://solidweb.me" }, "solidweb.me"), index.h("option", { key: '39f968af206347c83e4271724e9090543fcec43e', value: "https://inrupt.net" }, "inrupt.net"), index.h("option", { key: '381767d06a60e16b9323cb15b4298db2eac71d82', value: "https://login.inrupt.com" }, "Inrupt PodSpaces"), index.h("option", { key: 'd4461d0bb2bfba0ec97f276951b6534dee1ffd51', value: "https://trinpod.us" }, "trinpod.us"), index.h("option", { key: '80aa0ef7de3ec8dd53d06402c116a6c97747a24f', value: "https://use.id" }, "use.id"), index.h("option", { key: '794bee3c5a2b29738f25bb67bfb918754fe016ef', value: "https://solid.redpencil.io" }, "redpencil.io"), index.h("option", { key: '88e27225e7252c90bfb24f21a72bd70c9e3408f4', value: "https://datapod.grant.io" }, "Data Pod (grant.io)"), index.h("option", { key: '033b75773e898b4fed2507c5064686fb0ad56e03', value: "https://teamid.live" }, "teamid.live")), index.h("input", { key: 'c8dc41c5d6a892e623d42f5b1839af2728929abd', id: "login", type: "submit", value: "Login", disabled: !this.canSubmit })));
     }
     handleChange(event) {
         this.validate();
@@ -3679,7 +3679,7 @@ const IconMakeFindable = () => (index.h("svg", { role: "presentation", xmlns: "h
 const IconSuccess = () => (index.h("svg", { role: "presentation", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" }, index.h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M10.125 2.25h-4.5c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125v-9M10.125 2.25h.375a9 9 0 0 1 9 9v.375M10.125 2.25A3.375 3.375 0 0 1 13.5 5.625v1.5c0 .621.504 1.125 1.125 1.125h1.5a3.375 3.375 0 0 1 3.375 3.375M9 15l2.25 2.25L15 12" })));
 PosMakeFindable.style = PosMakeFindableStyle0;
-const posNavigationBarCss = ":host {\n}\n\n.suggestions ol {\n  border: 1px solid var(--color-grey-200);\n  display: flex;\n  flex-direction: column;\n  position: absolute;\n  margin: 0;\n  padding: 0;\n  z-index: var(--layer-top);\n  list-style-type: none;\n  box-shadow: var(--shadow-xl);\n}\n\n.suggestions {\n  position: relative;\n  li {\n    padding: 1rem;\n    background-color: white;\n    pos-rich-link {\n      --background-color: inherit;\n    }\n    &.selected {\n      background-color: var(--color-blue);\n      &:hover {\n        background-color: var(--color-blue-700);\n      }\n    }\n    &:hover {\n      background-color: var(--color-grey-200);\n    }\n  }\n}\n\n.suggestions li.selected pos-rich-link {\n  --label-color: white;\n  --description-color: var(--color-grey-200);\n  --uri-color: var(--color-grey-200);\n}\n\nion-searchbar {\n  width: 100%;\n}\n\nform {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n\n.bar {\n  flex-grow: 1;\n}\n";
+const posNavigationBarCss = ".suggestions ol {\n  border: 1px solid var(--pos-border-color);\n  display: flex;\n  flex-direction: column;\n  position: absolute;\n  margin: 0;\n  padding: 0;\n  z-index: var(--layer-top);\n  list-style-type: none;\n  box-shadow: var(--shadow-xl);\n}\n\n.suggestions {\n  position: relative;\n  li {\n    padding: 1rem;\n    background-color: var(--pos-background-color);\n    pos-rich-link {\n      --background-color: inherit;\n    }\n    &.selected {\n      background-color: var(--pos-primary-color);\n      &:hover {\n        background-color: var(--pos-primary-color);\n      }\n    }\n    &:hover {\n      background-color: var(--pos-border-color);\n    }\n  }\n}\n\n.suggestions li.selected pos-rich-link {\n  --label-color: white;\n  --description-color: var(--pos-border-color);\n  --uri-color: var(--pos-subtle-text-color);\n}\n\nion-searchbar {\n  width: 100%;\n}\n\nform {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n\n.bar {\n  flex-grow: 1;\n}\n";
 const PosNavigationBarStyle0 = posNavigationBarCss;
 const PosNavigationBar = class {
@@ -3756,12 +3756,12 @@ const PosNavigationBar = class {
         }
     }
     render() {
-        return (index.h("form", { key: 'dadf35124fd0908c3623ef2e358f1e751a0b7242', onSubmit: e => this.onSubmit(e) }, this.searchIndex && this.uri ? index.h("pos-make-findable", { uri: this.uri }) : '', index.h("div", { key: '64d85b0b51298e2d1b3d6ff32f36db3f80fa1796', class: "bar" }, index.h("ion-searchbar", { key: 'cd51737238ab42315ace5bebdcc0b4c561b02c38', enterkeyhint: "search", placeholder: "Search or enter URI", value: this.uri, debounce: 300, onIonChange: e => this.onChange(e), onIonInput: e => this.onChange(e) }), this.suggestions.length > 0 ? (index.h("div", { class: "suggestions" }, index.h("ol", null, this.suggestions.map((it, index$1) => (index.h("li", { class: index$1 === this.selectedIndex ? 'selected' : '' }, index.h("pos-rich-link", { uri: it.ref }))))))) : null)));
+        return (index.h("form", { key: 'cafd872d1cd6a9a0493b6c05ad51ab080d59a4f4', onSubmit: e => this.onSubmit(e) }, this.searchIndex && this.uri ? index.h("pos-make-findable", { uri: this.uri }) : '', index.h("div", { key: '8c090ab0ed8b6cb579be0baf7c8129e41b1a5732', class: "bar" }, index.h("ion-searchbar", { key: '2b1070406dcf0548a5df9c9b226c933789bb1aa5', enterkeyhint: "search", placeholder: "Search or enter URI", value: this.uri, debounce: 300, onIonChange: e => this.onChange(e), onIonInput: e => this.onChange(e) }), this.suggestions.length > 0 ? (index.h("div", { class: "suggestions" }, index.h("ol", null, this.suggestions.map((it, index$1) => (index.h("li", { class: index$1 === this.selectedIndex ? 'selected' : '' }, index.h("pos-rich-link", { uri: it.ref }))))))) : null)));
     }
 };
 PosNavigationBar.style = PosNavigationBarStyle0;
-const posNewThingFormCss = ":host{display:block}form{display:grid;grid-template-columns:var(--size-16) 1fr;grid-gap:var(--scale-0)}label{grid-column:1 / 2;display:flex;align-items:center;justify-content:flex-end}input,pos-select-term,button{grid-column:2 / 3}input,pos-select-term::part(input){outline:var(--pos-input-outline);padding:var(--scale-000);border:none;border-radius:var(--radius-xs);width:var(--size-full);box-sizing:border-box}input:focus-within,pos-select-term::part(input):focus-within{outline:var(--pos-input-focus-outline)}#new-uri{grid-column:1/3;cursor:default;word-break:break-all;color:var(--color-grey-800);font-weight:var(--weight-light);background:var(--color-grey-100);padding:var(--scale-000);border-radius:var(--radius-xs)}input#create{outline:none;box-shadow:var(--shadow-sm);cursor:pointer;color:var(--pos-primary-text-color);background-color:var(--pos-primary-color)}input#create:disabled{cursor:default;color:var(--pos-disabled-text-color);background-color:var(--pos-disabled-color);box-shadow:none}input#create:hover:not(:disabled),input#create:focus{filter:brightness(110%);box-shadow:var(--shadow-md)}";
+const posNewThingFormCss = ":host{display:block}form{display:grid;grid-template-columns:var(--size-16) 1fr;grid-gap:var(--scale-0)}label{grid-column:1 / 2;display:flex;align-items:center;justify-content:flex-end}input,pos-select-term,button{grid-column:2 / 3}input,pos-select-term::part(input){outline:var(--pos-input-outline);padding:var(--scale-000);border:none;border-radius:var(--radius-xs);width:var(--size-full);box-sizing:border-box;background:var(--pos-input-background-color);color:var(--pos-normal-text-color)}input:focus-within,pos-select-term::part(input):focus-within{outline:var(--pos-input-focus-outline)}#new-uri{grid-column:1/3;cursor:default;word-break:break-all;color:var(--pos-normal-text-color);font-weight:var(--weight-light);background:var(--pos-disabled-color);padding:var(--scale-000);border-radius:var(--radius-xs)}input#create{outline:none;box-shadow:var(--shadow-sm);cursor:pointer;color:var(--pos-primary-text-color);background-color:var(--pos-primary-color)}input#create:disabled{cursor:default;color:var(--pos-disabled-text-color);background-color:var(--pos-disabled-color);box-shadow:none}input#create:hover:not(:disabled),input#create:focus{filter:brightness(110%);box-shadow:var(--shadow-md)}";
 const PosNewThingFormStyle0 = posNewThingFormCss;
 const PosNewThingForm = class {
@@ -3782,7 +3782,7 @@ const PosNewThingForm = class {
         PodOsAware.subscribePodOs(this);
     }
     render() {
-        return (index.h("form", { key: 'd231729bb8d01ffa9e1f88d9488fa92041f33460', method: "dialog", onSubmit: e => this.handleSubmit(e) }, index.h("label", { key: '739f893b508ffe8baa0b575594af48f6f690425c', htmlFor: "type" }, "Type"), index.h("pos-select-term", { key: '9973af04355cf8dec838a4217f711e4c8669dab4', id: "type", placeholder: "", value: this.selectedTypeUri, "onPod-os:term-selected": e => this.onTermSelected(e) }), index.h("label", { key: '4fac8ecca95c2e16c98c35ae92ea9b7f6bd6a94a', htmlFor: "name" }, "Name"), index.h("input", { key: 'c922c03e656d194c3235fb374ef90fce205f7ee7', id: "name", type: "text", value: this.name, onInput: e => this.handleChange(e) }), this.newUri ? (index.h("div", { id: "new-uri", title: "This will be the URI of the new thing" }, this.newUri)) : null, index.h("input", { key: 'fb39eb6c09e67315326f13e184aab93a4ed786c6', id: "create", type: "submit", value: "Create", disabled: !this.canSubmit })));
+        return (index.h("form", { key: '0d52a6b85338d0353876f0fde0a7ef45e5ebe104', method: "dialog", onSubmit: e => this.handleSubmit(e) }, index.h("label", { key: '6765ada99850150a6a1dc9135a6ec0c575e3066d', htmlFor: "type" }, "Type"), index.h("pos-select-term", { key: '375ca79b6ffa3d363954578cf83d2eab10b0e486', id: "type", placeholder: "", value: this.selectedTypeUri, "onPod-os:term-selected": e => this.onTermSelected(e) }), index.h("label", { key: '9da148cb532d236a5dc9ad73fc75e1bd2d277d17', htmlFor: "name" }, "Name"), index.h("input", { key: '81b5a4bf51eb403bfebfa0c9e023935ddde48194', id: "name", type: "text", value: this.name, onInput: e => this.handleChange(e) }), this.newUri ? (index.h("div", { id: "new-uri", title: "This will be the URI of the new thing" }, this.newUri)) : null, index.h("input", { key: '5f4ff09818262ad875f80bce3a0f942b0428335f', id: "create", type: "submit", value: "Create", disabled: !this.canSubmit })));
     }
     handleChange(event) {
         this.name = event.target.value;
@@ -3908,7 +3908,7 @@ const PosResource = class {
     }; }
 };
-const posRichLinkCss = ":host {\n  --background-color: inherit;\n  --label-color: var(--color-grey-900);\n  --description-color: var(--color-grey-900);\n  --uri-color: var(--color-grey-600);\n  --font-family: var(--font-sans);\n}\n\np.content {\n  background-color: var(--background-color);\n  line-height: var(--line-xs);\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: baseline;\n  gap: var(--size-1);\n\n  .url {\n    font-size: var(--scale-fluid-1);\n    color: var(--color-grey-500);\n  }\n}\n\na {\n  color: var(--label-color);\n  max-width: var(--prose-lg);\n  text-decoration: underline;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  text-decoration-thickness: var(--size-px);\n}\n\npos-label {\n  color: var(--label-color);\n  font-size: var(--scale-fluid-2);\n  margin-bottom: var(--size-1);\n}\n\npos-description {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  font-weight: var(--weight-light);\n  color: var(--description-color);\n  font-size: var(--scale-fluid-2);\n}\n\n@media (min-width: 640px) {\n  pos-label {\n    font-size: var(--scale-fluid-0);\n  }\n  pos-description {\n    font-size: var(--scale-fluid-1);\n  }\n\n  p.content {\n    .url {\n      font-size: var(--scale-fluid-000);\n    }\n  }\n}\n";
+const posRichLinkCss = ":host {\n  --background-color: inherit;\n  --label-color: var(--pos-normal-text-color);\n  --description-color: var(--pos-normal-text-color);\n  --uri-color: var(--pos-subtle-text-color);\n  --font-family: var(--font-sans);\n}\n\np.content {\n  background-color: var(--background-color);\n  line-height: var(--line-xs);\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: baseline;\n  gap: var(--size-1);\n\n  .url {\n    font-size: var(--scale-fluid-1);\n    color: var(--color-grey-500);\n  }\n}\n\na {\n  color: var(--label-color);\n  max-width: var(--prose-lg);\n  text-decoration: underline;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  text-decoration-thickness: var(--size-px);\n}\n\npos-label {\n  color: var(--label-color);\n  font-size: var(--scale-fluid-2);\n  margin-bottom: var(--size-1);\n}\n\npos-description {\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  font-weight: var(--weight-light);\n  color: var(--description-color);\n  font-size: var(--scale-fluid-2);\n}\n\n@media (min-width: 640px) {\n  pos-label {\n    font-size: var(--scale-fluid-0);\n  }\n  pos-description {\n    font-size: var(--scale-fluid-1);\n  }\n\n  p.content {\n    .url {\n      font-size: var(--scale-fluid-000);\n    }\n  }\n}\n";
 const PosRichLinkStyle0 = posRichLinkCss;
 const PosRichLink = class {
@@ -3917,10 +3917,10 @@ const PosRichLink = class {
         this.linkEmitter = index.createEvent(this, "pod-os:link", 7);
     }
     render() {
-        return (index.h("pos-resource", { key: 'e9f1c8b7ca9ded161eebf1b4886b21ec2a23e042', lazy: true, uri: this.uri }, index.h("p", { key: '022cebbb522c3a04f1f6b83e9aeb8ad890642bdd', class: "content" }, index.h("a", { key: '105415deeb645e99e36d34f1750da0fa444c6ba8', href: this.uri, onClick: e => {
+        return (index.h("pos-resource", { key: '3b236e4b091933214cdedb460d916d8d09d5dca8', lazy: true, uri: this.uri }, index.h("p", { key: '988ccbc7283df323fe9a3230fcb8761bc44ef71f', class: "content" }, index.h("a", { key: '48054e89ea97d8a5b974811dfbfeab2dbc49a7da', href: this.uri, onClick: e => {
                 e.preventDefault();
                 this.linkEmitter.emit(this.uri);
-            } }, index.h("pos-label", { key: '4530f9511b81d37229f7c4f57915da035002bdfb' })), index.h("span", { key: '341e91a6167d36881d2bb5e96365aa7f2f7f2f9b', class: "url" }, new URL(this.uri).host), index.h("pos-description", { key: 'c8e3875a219a76fa401a558d9c4eaa6813206a19' }))));
+            } }, index.h("pos-label", { key: '9c1cb23e622d7130d37bfa17106e345949f44d9e' })), index.h("span", { key: 'c4f1532dffb691838947d2e9e79d4f8a51ef1eeb', class: "url" }, new URL(this.uri).host), index.h("pos-description", { key: 'c9a4b76eb86af15f908b820f06c4631a22f0c34f' }))));
     }
 };
 PosRichLink.style = PosRichLinkStyle0;
@@ -4251,12 +4251,12 @@ const PosRouter = class {
         this.routeChanged.emit(this.uri);
     }
     render() {
-        return index.h("slot", { key: '4c9986b609d72550130ca76675dee260ca1cf373' });
+        return index.h("slot", { key: '5c111993377abe4ad03de3c8678c0a5a9529085a' });
     }
 };
 PosRouter.style = PosRouterStyle0;
-const posSelectTermCss = ":host{display:block}input{border:none;padding-top:1rem;padding-bottom:1rem}input:focus{outline:none}";
+const posSelectTermCss = ":host{display:block}input{background-color:transparent;color:var(--pos-normal-text-color);border:none;padding-top:1rem;padding-bottom:1rem}input:focus{outline:none}";
 const PosSelectTermStyle0 = posSelectTermCss;
 const PosSelectTerm = class {
@@ -4281,7 +4281,7 @@ const PosSelectTerm = class {
         this.termSelected.emit({ uri: event.target.value });
     }
     render() {
-        return (index.h(index.Host, { key: '0c84c241534e981ac22797ca058622c79aa2c661' }, index.h("input", { key: '0dd0c1d3ed228a3e2c333e440eb5044e99110252', part: "input", list: "terms", placeholder: this.placeholder, value: this.value, onChange: ev => this.handleChange(ev) }), index.h("datalist", { key: 'b792a879f92d1b95b094cef9cab81738205a503b', part: "terms", id: "terms" }, this.terms.map(term => (index.h("option", { value: term.uri }, term.shorthand))))));
+        return (index.h(index.Host, { key: 'd8316308e089f89fdbb16dbdf799caa308713a14' }, index.h("input", { key: 'aab9ef56274dd2608c346673fd9be2420b0f6dbf', part: "input", list: "terms", placeholder: this.placeholder, value: this.value, onChange: ev => this.handleChange(ev) }), index.h("datalist", { key: '5b54e6c44cd926b9b40fe79de1afb12326f919bc', part: "terms", id: "terms" }, this.terms.map(term => (index.h("option", { value: term.uri }, term.shorthand))))));
     }
     static get delegatesFocus() { return true; }
     static get watchers() { return {
@@ -4290,7 +4290,7 @@ const PosSelectTerm = class {
 };
 PosSelectTerm.style = PosSelectTermStyle0;
-const posSettingOfflineCacheCss = ":host{border:var(--size-px) solid var(--color-grey-100);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--color-white)}svg{width:var(--size-8)}h2{display:flex;align-items:center}p{padding:var(--size-2)}.info{background-color:var(--color-blue-200)}.warn{background-color:var(--color-yellow-200)}";
+const posSettingOfflineCacheCss = ":host{border:var(--size-px) solid var(--pos-border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--size-8);max-width:var(--size-96);background:var(--pos-card-background)}svg{width:var(--size-8)}h2{display:flex;align-items:center}p{padding:var(--size-2)}.info{color:var(--color-grey-900);background-color:var(--color-blue-200)}.warn{color:var(--color-grey-900);background-color:var(--color-yellow-200)}";
 const PosSettingOfflineCacheStyle0 = posSettingOfflineCacheCss;
 const PosSettingOfflineCache = class {
@@ -4298,7 +4298,7 @@ const PosSettingOfflineCache = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: 'a98de97ba1e0930b485a4a3610102deb02d927a7' }, index.h("div", { key: '5cf196a71b95fdfed7e5d990b272e12d2b9dd3ff' }, index.h("h2", { key: '99ddd9827f3ccc5a5277cc64e3952a3f5170f7bc' }, index.h("svg", { key: 'd9ce3722957428524cc9b264265320119f2e5c88', xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" }, index.h("path", { key: '8e4e7af37df231e3141ba30b17a02517737cbe85', "stroke-linecap": "round", "stroke-linejoin": "round", d: "M20.25 6.375c0 2.278-3.694 4.125-8.25 4.125S3.75 8.653 3.75 6.375m16.5 0c0-2.278-3.694-4.125-8.25-4.125S3.75 4.097 3.75 6.375m16.5 0v11.25c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125V6.375m16.5 0v3.75m-16.5-3.75v3.75m16.5 0v3.75C20.25 16.153 16.556 18 12 18s-8.25-1.847-8.25-4.125v-3.75m16.5 0c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125" })), "Cache Settings"), index.h("p", { key: '7175929cd9327bc705db305294afa362cb2f648c', class: "info" }, "\u2139 Enable offline cache to be able to access previously loaded data while offline."), index.h("p", { key: '784fd9141b339165fdab6a98c084430299ff7ed5', class: "warn" }, "\u26A0 Private data may be stored on this device. Only enable it, if you trust this device."), index.h("label", { key: 'dac2cddf6b6c374d1a2ef3c4d9bad63a9cb7b8d9' }, index.h("input", { key: 'e39adb18d03ce622a85dd48a28c6d3c0dc2ce7f4', type: "checkbox", checked: localSettings.state.offlineCache, onChange: ev => (localSettings.state.offlineCache = ev.target.checked) }), "Enable offline cache"))));
+        return (index.h(index.Host, { key: 'b598a0dbe21fe9e7f1aa0f51f0b53c270feb8add' }, index.h("div", { key: '5cec10cc63203c8421bbb627643f1365899cc850' }, index.h("h2", { key: '094528da7d8567e8a2ba6e82fb1c05b2f4dc7b22' }, index.h("svg", { key: '3d3e8b17420ba7352877eb1c6bca17d3791b1bd6', xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" }, index.h("path", { key: '065bc78382b03bd2bcc3c812a71e9f27c4e3251c', "stroke-linecap": "round", "stroke-linejoin": "round", d: "M20.25 6.375c0 2.278-3.694 4.125-8.25 4.125S3.75 8.653 3.75 6.375m16.5 0c0-2.278-3.694-4.125-8.25-4.125S3.75 4.097 3.75 6.375m16.5 0v11.25c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125V6.375m16.5 0v3.75m-16.5-3.75v3.75m16.5 0v3.75C20.25 16.153 16.556 18 12 18s-8.25-1.847-8.25-4.125v-3.75m16.5 0c0 2.278-3.694 4.125-8.25 4.125s-8.25-1.847-8.25-4.125" })), "Cache Settings"), index.h("p", { key: '5e5d2ec497039791f82a857a709157e6b97efdfe', class: "info" }, "\u2139 Enable offline cache to be able to access previously loaded data while offline."), index.h("p", { key: 'd4ff4a3a17df1e5ed7ce076abbf98def4ebdac7d', class: "warn" }, "\u26A0 Private data may be stored on this device. Only enable it, if you trust this device."), index.h("label", { key: '1d1aa4f7b4b5fa53080cc5635a20ccee3faee29d' }, index.h("input", { key: '4223888802ea51dec26a3d23abdd9c28098de5aa', type: "checkbox", checked: localSettings.state.offlineCache, onChange: ev => (localSettings.state.offlineCache = ev.target.checked) }), "Enable offline cache"))));
     }
 };
 PosSettingOfflineCache.style = PosSettingOfflineCacheStyle0;