@usefillo/dom 0.5.2 → 0.5.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +8 -1
- package/dist/index.js +291 -21
- package/dist/standalone.global.js +1 -65
- package/dist/styles.css +16 -7
- package/package.json +2 -2
package/dist/styles.css
CHANGED
|
@@ -126,12 +126,18 @@
|
|
|
126
126
|
.fillo-field--error .fillo-phone-flag { border-color: var(--fillo-error); }
|
|
127
127
|
.fillo-phone-popover {
|
|
128
128
|
position: absolute; z-index: 30; top: calc(100% + 0.3rem); left: 0;
|
|
129
|
-
width: 18rem
|
|
129
|
+
width: min(18rem, calc(100vw - 1rem));
|
|
130
|
+
max-width: var(--fillo-phone-popover-max-width, 84vw);
|
|
131
|
+
max-height: min(var(--fillo-phone-popover-max-height, 20rem), calc(100vh - 1rem));
|
|
132
|
+
padding: 0.4rem;
|
|
133
|
+
box-sizing: border-box; overflow: hidden;
|
|
134
|
+
transform: translateX(var(--fillo-phone-popover-offset-x, 0px));
|
|
130
135
|
display: flex; flex-direction: column; gap: 0.35rem;
|
|
131
136
|
background: var(--fillo-control-bg);
|
|
132
137
|
border: 1px solid var(--fillo-border); border-radius: var(--fillo-radius);
|
|
133
138
|
box-shadow: 0 12px 32px -14px rgba(0, 0, 0, 0.35);
|
|
134
139
|
}
|
|
140
|
+
.fillo-phone-popover--above { top: auto; bottom: calc(100% + 0.3rem); }
|
|
135
141
|
.fillo-phone-search {
|
|
136
142
|
appearance: none; font: inherit; width: 100%; box-sizing: border-box;
|
|
137
143
|
color: var(--fillo-text); background: var(--fillo-bg);
|
|
@@ -139,7 +145,10 @@
|
|
|
139
145
|
border-radius: calc(var(--fillo-radius) - 3px); padding: 0.45rem 0.6rem;
|
|
140
146
|
}
|
|
141
147
|
.fillo-phone-search:focus-visible { outline: none; border-color: var(--fillo-primary); }
|
|
142
|
-
.fillo-phone-list {
|
|
148
|
+
.fillo-phone-list {
|
|
149
|
+
flex: 1 1 auto; min-height: 0;
|
|
150
|
+
list-style: none; margin: 0; padding: 0; max-height: 14rem; overflow-y: auto;
|
|
151
|
+
}
|
|
143
152
|
.fillo-phone-option {
|
|
144
153
|
display: flex; align-items: center; gap: 0.5rem;
|
|
145
154
|
padding: 0.45rem 0.5rem; border-radius: calc(var(--fillo-radius) - 3px);
|
|
@@ -586,17 +595,17 @@
|
|
|
586
595
|
}
|
|
587
596
|
|
|
588
597
|
/* ---------- Success ---------- */
|
|
589
|
-
.fillo-success { display: flex; flex-direction: column; align-items: center; gap: 0.
|
|
598
|
+
.fillo-success { display: flex; flex-direction: column; align-items: center; gap: 0.4rem; text-align: center; padding: 1.4rem 1rem; }
|
|
590
599
|
.fillo-success-mark {
|
|
591
|
-
width:
|
|
600
|
+
width: 2rem; height: 2rem;
|
|
592
601
|
display: grid; place-items: center;
|
|
593
602
|
border-radius: 999px;
|
|
594
603
|
background: color-mix(in srgb, var(--fillo-primary) 10%, transparent);
|
|
595
604
|
color: var(--fillo-primary);
|
|
596
|
-
font-size:
|
|
605
|
+
font-size: 0.95rem; font-weight: 700;
|
|
597
606
|
}
|
|
598
|
-
.fillo-success-title { margin: 0; font-size: 1.
|
|
599
|
-
.fillo-success-message { margin: 0; color: var(--fillo-muted); }
|
|
607
|
+
.fillo-success-title { margin: 0; font-size: 1.05rem; letter-spacing: 0; }
|
|
608
|
+
.fillo-success-message { margin: 0; font-size: 0.875rem; color: var(--fillo-muted); }
|
|
600
609
|
|
|
601
610
|
/* Honeypot — off-screen, never display:none (bots check that) */
|
|
602
611
|
.fillo-hp {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@usefillo/dom",
|
|
3
|
-
"version": "0.5.
|
|
3
|
+
"version": "0.5.4",
|
|
4
4
|
"description": "Framework-agnostic DOM renderer and web component for embedding Fillo forms.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"keywords": [
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
"access": "public"
|
|
35
35
|
},
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@usefillo/core": "^0.5.
|
|
37
|
+
"@usefillo/core": "^0.5.1"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
40
|
"jsdom": "^25.0.1",
|