@pod-os/elements 0.25.3-rc.aa3b162.0 → 0.25.3-rc.ba1a8fa.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.
@@ -1799,7 +1799,7 @@ Toast.style = {
1799
1799
  md: IonToastMdStyle0
1800
1800
  };
1801
1801
 
1802
- const posAddNewThingCss = ":host{font-family:var(--font-sans);display:block}button#new{cursor:pointer;display:flex;align-items:center;justify-content:center;border:none;width:var(--scale-5);height:var(--scale-5);background-color:var(--pos-primary-color);color:var(--pos-primary-text-color);font-size:var(--scale-6);border-radius:var(--radius-xs)}button#new:hover,button#new:focus{outline:none;filter:brightness(110%);box-shadow:var(--shadow-sm)}pos-new-thing-form{margin:var(--scale-3)}";
1802
+ const posAddNewThingCss = ":host{font-family:var(--font-sans);display:block}button#new{cursor:pointer;display:flex;align-items:center;justify-content:center;border:none;width:var(--scale-5);height:var(--scale-5);background-color:var(--pos-primary-color);color:var(--color-grey-50);font-size:var(--scale-6);border-radius:var(--radius-xs)}button#new:hover,button#new:focus{outline:none;filter:brightness(110%);box-shadow:var(--shadow-sm)}pos-new-thing-form{margin:var(--scale-3)}";
1803
1803
  const PosAddNewThingStyle0 = posAddNewThingCss;
1804
1804
 
1805
1805
  const PosAddNewThing = class {
@@ -3463,7 +3463,7 @@ const PosLoginForm = class {
3463
3463
  };
3464
3464
  PosLoginForm.style = PosLoginFormStyle0;
3465
3465
 
3466
- const posMakeFindableCss = "button.main {\n display: flex;\n transition:\n width 200ms,\n background-color 500ms,\n color 500ms,\n border-color 500ms;\n max-width: var(--size-40);\n flex-direction: row;\n overflow: hidden;\n height: var(--size-8);\n width: var(--size-8);\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-xs);\n color: var(--pos-subtle-text-color);\n border: var(--size-px) dashed var(--pos-subtle-text-color);\n background-color: var(--pos-background-color);\n\n p {\n padding: 0;\n margin: 0;\n display: none;\n white-space: nowrap;\n }\n\n &.success {\n color: var(--color-green-700);\n border-color: var(--color-green-700);\n border-style: solid;\n background-color: var(--color-green-100);\n }\n\n &:active {\n transform: scale(0.99);\n filter: brightness(90%);\n }\n}\n\n.options {\n position: absolute;\n animation: fadeIn 300ms;\n padding: 0;\n margin-top: var(--size-1);\n z-index: var(--layer-top);\n\n ol {\n display: flex;\n flex-direction: column;\n box-shadow: var(--shadow-md);\n backdrop-filter: var(--blur-md);\n border-radius: var(--radius-xs);\n overflow: hidden;\n color: var(--color-grey-900);\n background-color: var(--color-grey-200);\n padding: 0;\n margin: 0;\n list-style: none;\n label {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n transition: all 300ms var(--ease-in-out-sine);\n margin: 0;\n border: none;\n outline: none;\n padding: var(--size-2);\n width: var(--size-full);\n\n &:hover,\n &:focus {\n filter: brightness(80%);\n }\n\n &:active {\n filter: brightness(90%);\n }\n }\n }\n label:has(input:checked) {\n background-color: var(--color-green-100);\n }\n}\n\nsvg {\n display: inline-block;\n height: var(--size-6);\n flex-shrink: 0;\n flex-grow: 0;\n width: var(--size-6);\n}\n\nbutton.main:hover,\nbutton.open {\n &.success {\n background: var(--color-green-200);\n }\n width: var(--size-full);\n height: var(--size-8);\n background: var(--pos-background-color);\n color: var(--pos-normal-text-color);\n\n p {\n display: inline-block;\n }\n}\n\n@keyframes fadeIn {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n";
3466
+ const posMakeFindableCss = "button.main {\n display: flex;\n transition:\n width 200ms,\n background-color 500ms,\n color 500ms,\n border-color 500ms;\n max-width: var(--size-40);\n flex-direction: row;\n overflow: hidden;\n height: var(--size-8);\n width: var(--size-8);\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-xs);\n color: var(--color-grey-500);\n border: var(--size-px) dashed var(--color-grey-500);\n background: none;\n\n p {\n padding: 0;\n margin: 0;\n display: none;\n white-space: nowrap;\n }\n\n &.success {\n color: var(--color-green-700);\n border-color: var(--color-green-700);\n border-style: solid;\n background-color: var(--color-green-100);\n }\n\n &:active {\n transform: scale(0.99);\n filter: brightness(90%);\n }\n}\n\n.options {\n position: absolute;\n animation: fadeIn 300ms;\n padding: 0;\n margin-top: var(--size-1);\n z-index: var(--layer-top);\n\n ol {\n display: flex;\n flex-direction: column;\n box-shadow: var(--shadow-md);\n backdrop-filter: var(--blur-md);\n border-radius: var(--radius-xs);\n overflow: hidden;\n background-color: var(--color-grey-200);\n padding: 0;\n margin: 0;\n list-style: none;\n label {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n transition: all 300ms var(--ease-in-out-sine);\n margin: 0;\n border: none;\n outline: none;\n padding: var(--size-2);\n width: var(--size-full);\n\n &:hover,\n &:focus {\n filter: brightness(80%);\n }\n\n &:active {\n filter: brightness(90%);\n }\n }\n }\n label:has(input:checked) {\n background-color: var(--color-green-100);\n }\n}\n\nsvg {\n display: inline-block;\n height: var(--size-6);\n flex-shrink: 0;\n flex-grow: 0;\n width: var(--size-6);\n}\n\nbutton.main:hover,\nbutton.open {\n &.success {\n background: var(--color-green-200);\n }\n width: var(--size-full);\n height: var(--size-8);\n background: var(--color-grey-200);\n color: var(--color-grey-700);\n\n p {\n display: inline-block;\n }\n}\n\n@keyframes fadeIn {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n";
3467
3467
  const PosMakeFindableStyle0 = posMakeFindableCss;
3468
3468
 
3469
3469
  const PosMakeFindable = class {
@@ -3803,7 +3803,7 @@ const PosResource = class {
3803
3803
  };
3804
3804
  PosResource.style = PosResourceStyle0;
3805
3805
 
3806
- 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(--pos-subtle-text-color);\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";
3806
+ 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";
3807
3807
  const PosRichLinkStyle0 = posRichLinkCss;
3808
3808
 
3809
3809
  const PosRichLink = class {