@getpara/core-components 2.0.0-alpha.64 → 2.0.0-alpha.65
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/capsule/capsule.esm.js +1 -1
- package/dist/capsule/{p-d60a363b.entry.js → p-9fa6f865.entry.js} +2 -2
- package/dist/capsule/{p-d60a363b.entry.js.map → p-9fa6f865.entry.js.map} +1 -1
- package/dist/cjs/cpsl-alert_34.cjs.entry.js +1 -1
- package/dist/cjs/cpsl-alert_34.cjs.entry.js.map +1 -1
- package/dist/collection/components/cpsl-alert/cpsl-alert.css +14 -8
- package/dist/esm/cpsl-alert_34.entry.js +1 -1
- package/dist/esm/cpsl-alert_34.entry.js.map +1 -1
- package/package.json +2 -2
|
@@ -55,11 +55,11 @@
|
|
|
55
55
|
*/
|
|
56
56
|
:host {
|
|
57
57
|
--container-gap: 8px;
|
|
58
|
-
--container-padding-top:
|
|
59
|
-
--container-padding-bottom:
|
|
60
|
-
--container-padding-start:
|
|
61
|
-
--container-padding-end:
|
|
62
|
-
--container-font-size: var(--cpsl-font-size-body-
|
|
58
|
+
--container-padding-top: 8px;
|
|
59
|
+
--container-padding-bottom: 8px;
|
|
60
|
+
--container-padding-start: 8px;
|
|
61
|
+
--container-padding-end: 8px;
|
|
62
|
+
--container-font-size: var(--cpsl-font-size-body-s);
|
|
63
63
|
--container-border-width: 1px;
|
|
64
64
|
--container-border-radius: var(--cpsl-border-radius-alert);
|
|
65
65
|
--container-background-color: var(--cpsl-color-background-0);
|
|
@@ -68,13 +68,15 @@
|
|
|
68
68
|
--container-align-items: center;
|
|
69
69
|
--container-justify-content: center;
|
|
70
70
|
--title-container-gap: 8px;
|
|
71
|
-
--title-container-align-items:
|
|
71
|
+
--title-container-align-items: flex-start;
|
|
72
72
|
--title-container-justify-content: center;
|
|
73
73
|
display: inline-block;
|
|
74
74
|
font-family: var(--cpsl-font-family, inherit);
|
|
75
75
|
}
|
|
76
76
|
|
|
77
77
|
:host(.error) {
|
|
78
|
+
--container-color: var(--cpsl-color-black);
|
|
79
|
+
--container-icon-color: var(--cpsl-color-utility-red);
|
|
78
80
|
--container-border-color: var(--cpsl-color-utility-red);
|
|
79
81
|
}
|
|
80
82
|
:host(.error):host(.filled) {
|
|
@@ -82,6 +84,8 @@
|
|
|
82
84
|
}
|
|
83
85
|
|
|
84
86
|
:host(.warning) {
|
|
87
|
+
--container-color: var(--cpsl-color-black);
|
|
88
|
+
--container-icon-color: var(--cpsl-color-utility-yellow);
|
|
85
89
|
--container-border-color: var(--cpsl-color-utility-yellow);
|
|
86
90
|
}
|
|
87
91
|
:host(.warning):host(.filled) {
|
|
@@ -89,6 +93,8 @@
|
|
|
89
93
|
}
|
|
90
94
|
|
|
91
95
|
:host(.success) {
|
|
96
|
+
--container-color: var(--cpsl-color-black);
|
|
97
|
+
--container-icon-color: var(--cpsl-color-utility-green);
|
|
92
98
|
--container-border-color: var(--cpsl-color-utility-green);
|
|
93
99
|
}
|
|
94
100
|
:host(.success):host(.filled) {
|
|
@@ -97,8 +103,8 @@
|
|
|
97
103
|
|
|
98
104
|
:host cpsl-icon {
|
|
99
105
|
--icon-color: var(--container-icon-color);
|
|
100
|
-
--height:
|
|
101
|
-
--width:
|
|
106
|
+
--height: 24px;
|
|
107
|
+
--width: 24px;
|
|
102
108
|
}
|
|
103
109
|
|
|
104
110
|
.alert-container {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host, c as createEvent, g as getElement, F as Fragment } from './index-91db3414.js';
|
|
2
2
|
import { M as MOBILE_SIZE, a as DEFAULT_Z_INDICES } from './constants-fce138fa.js';
|
|
3
3
|
|
|
4
|
-
const cpslAlertCss = ":host{--container-gap:8px;--container-padding-top:
|
|
4
|
+
const cpslAlertCss = ":host{--container-gap:8px;--container-padding-top:8px;--container-padding-bottom:8px;--container-padding-start:8px;--container-padding-end:8px;--container-font-size:var(--cpsl-font-size-body-s);--container-border-width:1px;--container-border-radius:var(--cpsl-border-radius-alert);--container-background-color:var(--cpsl-color-background-0);--container-color:var(--cpsl-color-text-primary);--container-icon-color:var(--container-color);--container-align-items:center;--container-justify-content:center;--title-container-gap:8px;--title-container-align-items:flex-start;--title-container-justify-content:center;display:inline-block;font-family:var(--cpsl-font-family, inherit)}:host(.error){--container-color:var(--cpsl-color-black);--container-icon-color:var(--cpsl-color-utility-red);--container-border-color:var(--cpsl-color-utility-red)}:host(.error):host(.filled){--container-background-color:var(--cpsl-color-utility-red-light)}:host(.warning){--container-color:var(--cpsl-color-black);--container-icon-color:var(--cpsl-color-utility-yellow);--container-border-color:var(--cpsl-color-utility-yellow)}:host(.warning):host(.filled){--container-background-color:var(--cpsl-color-utility-yellow-light)}:host(.success){--container-color:var(--cpsl-color-black);--container-icon-color:var(--cpsl-color-utility-green);--container-border-color:var(--cpsl-color-utility-green)}:host(.success):host(.filled){--container-background-color:var(--cpsl-color-utility-green-light)}:host cpsl-icon{--icon-color:var(--container-icon-color);--height:24px;--width:24px}.alert-container{border-radius:var(--container-border-radius);-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);font-size:var(--container-font-size);display:flex;flex-direction:column;align-items:var(--container-align-items);justify-content:var(--container-justify-content);gap:var(--container-gap);border-style:solid;border-width:var(--container-border-width);border-color:var(--container-border-color);background-color:var(--container-background-color);color:var(--container-color)}.title-container{display:flex;align-items:var(--title-container-align-items);justify-content:var(--title-container-justify-content);gap:var(--title-container-gap)}";
|
|
5
5
|
const CpslAlertStyle0 = cpslAlertCss;
|
|
6
6
|
|
|
7
7
|
const CpslAlert = class {
|