framework7 8.0.2 → 8.0.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.
Files changed (39) hide show
  1. package/components/area-chart/area-chart-rtl.css +1 -1
  2. package/components/area-chart/area-chart-vars.less +7 -1
  3. package/components/area-chart/area-chart.css +1 -1
  4. package/components/button/button-vars.less +2 -0
  5. package/components/calendar/calendar-class.js +4 -4
  6. package/components/card/card.js +4 -4
  7. package/components/chip/chip-ios.less +8 -0
  8. package/components/chip/chip-md.less +8 -0
  9. package/components/chip/chip-rtl.css +1 -1
  10. package/components/chip/chip.css +1 -1
  11. package/components/chip/chip.less +6 -10
  12. package/components/input/input-rtl.css +1 -1
  13. package/components/input/input.css +1 -1
  14. package/components/input/input.less +0 -3
  15. package/components/popup/popup-class.js +4 -3
  16. package/components/pull-to-refresh/pull-to-refresh-class.js +3 -1
  17. package/components/sheet/sheet-class.js +2 -2
  18. package/framework7-bundle-rtl.css +16 -7
  19. package/framework7-bundle-rtl.min.css +4 -4
  20. package/framework7-bundle.css +16 -7
  21. package/framework7-bundle.esm.js +2 -2
  22. package/framework7-bundle.js +28 -19
  23. package/framework7-bundle.js.map +1 -1
  24. package/framework7-bundle.less +2 -2
  25. package/framework7-bundle.min.css +4 -4
  26. package/framework7-bundle.min.js +3 -3
  27. package/framework7-bundle.min.js.map +1 -1
  28. package/framework7-lite-bundle.esm.js +2 -2
  29. package/framework7-lite.esm.js +2 -2
  30. package/framework7-rtl.css +4 -2
  31. package/framework7-rtl.min.css +3 -3
  32. package/framework7.css +4 -2
  33. package/framework7.esm.js +2 -2
  34. package/framework7.less +2 -2
  35. package/framework7.min.css +3 -3
  36. package/modules/router/swipe-back.js +4 -1
  37. package/modules/touch/touch.js +3 -0
  38. package/package.json +2 -2
  39. package/shared/utils.js +2 -2
package/components/area-chart/area-chart-rtl.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-area-chart-current-line-stroke-width:2px;--f7-area-chart-current-line-stroke:rgba(0, 0, 0, 0.15);--f7-area-chart-axis-text-color:inherit;--f7-area-chart-axis-height:1px;--f7-area-chart-axis-font-size:10px;--f7-area-chart-axis-font-weight:500;--f7-area-chart-tooltip-font-size:12px;--f7-area-chart-tooltip-total-label-text-color:rgba(255, 255, 255, 0.75);--f7-area-chart-tooltip-total-font-size:16px;--f7-area-chart-tooltip-total-font-weight:bold;--f7-area-chart-tooltip-color-size:10px;--f7-area-chart-legend-font-size:14px;--f7-area-chart-legend-font-weight:500;--f7-area-chart-legend-text-color:inherit;--f7-area-chart-legend-padding:4px 8px;--f7-area-chart-legend-border-radius:4px;--f7-area-chart-legend-color-size:14px;--f7-area-chart-line-stroke-width:2px;--f7-area-chart-axis-bg-color:rgba(0, 0, 0, 0.15);--f7-area-chart-legend-disabled-text-color:rgba(0, 0, 0, 0.22)}:root .dark,:root.dark{--f7-area-chart-axis-bg-color:rgba(255, 255, 255, 0.15);--f7-area-chart-legend-disabled-text-color:rgba(255, 255, 255, 0.22)}.area-chart{position:relative}.area-chart svg{display:block;width:100%;font-size:0;height:auto;margin:0 auto}.area-chart path{fill:none;stroke-width:var(--f7-area-chart-line-stroke-width)}.area-chart-current-line{stroke:var(--f7-area-chart-current-line-stroke);stroke-width:var(--f7-area-chart-current-line-stroke-width)}.area-chart-axis{height:var(--f7-area-chart-axis-height);background:var(--f7-area-chart-axis-bg-color);color:var(--f7-area-chart-axis-text-color);display:flex;font-size:var(--f7-area-chart-axis-font-size);font-weight:var(--f7-area-chart-axis-font-weight);justify-content:space-between;line-height:1;margin-bottom:2em}.area-chart-axis>span{padding-top:10px;width:0;display:flex;align-items:flex-start;justify-content:center;white-space:nowrap}.area-chart-axis>span:first-child{justify-content:flex-start}.area-chart-axis>span:last-child{justify-content:flex-end}.area-chart-tooltip{pointer-events:none;text-align:left;font-size:var(--f7-area-chart-tooltip-font-size);line-height:1.4}.area-chart-tooltip-label{color:var(--f7-area-chart-tooltip-total-label-text-color)}.area-chart-tooltip-total{font-size:var(--f7-area-chart-tooltip-total-font-size);font-weight:var(--f7-area-chart-tooltip-total-font-weight)}.area-chart-tooltip-list{list-style:none;margin:0;padding:0}.area-chart-tooltip-list li{white-space:nowrap}.area-chart-tooltip-list span{display:inline-block;width:var(--f7-area-chart-tooltip-color-size);height:var(--f7-area-chart-tooltip-color-size);border-radius:50%;margin-right:4px}.area-chart-axis~.area-chart-legend{margin-top:2em}.area-chart-legend{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;font-size:var(--f7-area-chart-legend-font-size);width:100%;margin-top:1em}.area-chart-legend-button{-webkit-appearance:none!important;appearance:none!important;background-color:transparent;border-radius:0;border:none;outline:0!important;cursor:pointer;font-family:inherit;font-size:inherit;box-shadow:none!important}.area-chart-legend-item{position:relative;color:var(--f7-area-chart-legend-text-color);width:auto;display:flex;align-items:center;font-weight:var(--f7-area-chart-legend-font-weight);transition-duration:.2s;padding:var(--f7-area-chart-legend-padding);border-radius:var(--f7-area-chart-legend-border-radius);overflow:hidden}.area-chart-legend-item span{width:var(--f7-area-chart-legend-color-size);height:var(--f7-area-chart-legend-color-size);margin-right:4px;border-radius:50%;transition-duration:.2s}.area-chart-legend-item-hidden{color:var(--f7-area-chart-legend-disabled-text-color)}.area-chart-legend-item-hidden span{background-color:var(--f7-area-chart-legend-disabled-text-color)!important}
1
+ :root{--f7-area-chart-current-line-stroke-width:2px;--f7-area-chart-current-line-stroke:rgba(0, 0, 0, 0.15);--f7-area-chart-axis-text-color:inherit;--f7-area-chart-axis-height:1px;--f7-area-chart-axis-font-size:10px;--f7-area-chart-axis-font-weight:500;--f7-area-chart-tooltip-font-size:12px;--f7-area-chart-tooltip-total-font-size:16px;--f7-area-chart-tooltip-total-font-weight:bold;--f7-area-chart-tooltip-color-size:10px;--f7-area-chart-legend-font-size:14px;--f7-area-chart-legend-font-weight:500;--f7-area-chart-legend-text-color:inherit;--f7-area-chart-legend-padding:4px 8px;--f7-area-chart-legend-border-radius:4px;--f7-area-chart-legend-color-size:14px;--f7-area-chart-line-stroke-width:2px;--f7-area-chart-axis-bg-color:rgba(0, 0, 0, 0.15);--f7-area-chart-legend-disabled-text-color:rgba(0, 0, 0, 0.22)}:root .dark,:root.dark{--f7-area-chart-axis-bg-color:rgba(255, 255, 255, 0.15);--f7-area-chart-legend-disabled-text-color:rgba(255, 255, 255, 0.22)}.ios{--f7-area-chart-tooltip-total-label-text-color:rgba(255, 255, 255, 0.75)}.md{--f7-area-chart-tooltip-total-label-text-color:inherit}.area-chart{position:relative}.area-chart svg{display:block;width:100%;font-size:0;height:auto;margin:0 auto}.area-chart path{fill:none;stroke-width:var(--f7-area-chart-line-stroke-width)}.area-chart-current-line{stroke:var(--f7-area-chart-current-line-stroke);stroke-width:var(--f7-area-chart-current-line-stroke-width)}.area-chart-axis{height:var(--f7-area-chart-axis-height);background:var(--f7-area-chart-axis-bg-color);color:var(--f7-area-chart-axis-text-color);display:flex;font-size:var(--f7-area-chart-axis-font-size);font-weight:var(--f7-area-chart-axis-font-weight);justify-content:space-between;line-height:1;margin-bottom:2em}.area-chart-axis>span{padding-top:10px;width:0;display:flex;align-items:flex-start;justify-content:center;white-space:nowrap}.area-chart-axis>span:first-child{justify-content:flex-start}.area-chart-axis>span:last-child{justify-content:flex-end}.area-chart-tooltip{pointer-events:none;text-align:left;font-size:var(--f7-area-chart-tooltip-font-size);line-height:1.4}.area-chart-tooltip-label{color:var(--f7-area-chart-tooltip-total-label-text-color)}.area-chart-tooltip-total{font-size:var(--f7-area-chart-tooltip-total-font-size);font-weight:var(--f7-area-chart-tooltip-total-font-weight)}.area-chart-tooltip-list{list-style:none;margin:0;padding:0}.area-chart-tooltip-list li{white-space:nowrap}.area-chart-tooltip-list span{display:inline-block;width:var(--f7-area-chart-tooltip-color-size);height:var(--f7-area-chart-tooltip-color-size);border-radius:50%;margin-right:4px}.area-chart-axis~.area-chart-legend{margin-top:2em}.area-chart-legend{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;font-size:var(--f7-area-chart-legend-font-size);width:100%;margin-top:1em}.area-chart-legend-button{-webkit-appearance:none!important;appearance:none!important;background-color:transparent;border-radius:0;border:none;outline:0!important;cursor:pointer;font-family:inherit;font-size:inherit;box-shadow:none!important}.area-chart-legend-item{position:relative;color:var(--f7-area-chart-legend-text-color);width:auto;display:flex;align-items:center;font-weight:var(--f7-area-chart-legend-font-weight);transition-duration:.2s;padding:var(--f7-area-chart-legend-padding);border-radius:var(--f7-area-chart-legend-border-radius);overflow:hidden}.area-chart-legend-item span{width:var(--f7-area-chart-legend-color-size);height:var(--f7-area-chart-legend-color-size);margin-right:4px;border-radius:50%;transition-duration:.2s}.area-chart-legend-item-hidden{color:var(--f7-area-chart-legend-disabled-text-color)}.area-chart-legend-item-hidden span{background-color:var(--f7-area-chart-legend-disabled-text-color)!important}
package/components/area-chart/area-chart-vars.less CHANGED
@@ -6,7 +6,6 @@
6
6
  --f7-area-chart-axis-font-size: 10px;
7
7
  --f7-area-chart-axis-font-weight: 500;
8
8
  --f7-area-chart-tooltip-font-size: 12px;
9
- --f7-area-chart-tooltip-total-label-text-color: rgba(255, 255, 255, 0.75);
10
9
  --f7-area-chart-tooltip-total-font-size: 16px;
11
10
  --f7-area-chart-tooltip-total-font-weight: bold;
12
11
  --f7-area-chart-tooltip-color-size: 10px;
@@ -27,3 +26,10 @@
27
26
  --f7-area-chart-legend-disabled-text-color: rgba(255, 255, 255, 0.22);
28
27
  });
29
28
  }
29
+
30
+ .ios-vars({
31
+ --f7-area-chart-tooltip-total-label-text-color: rgba(255, 255, 255, 0.75);
32
+ });
33
+ .md-vars({
34
+ --f7-area-chart-tooltip-total-label-text-color: inherit;
35
+ });
package/components/area-chart/area-chart.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-area-chart-current-line-stroke-width:2px;--f7-area-chart-current-line-stroke:rgba(0, 0, 0, 0.15);--f7-area-chart-axis-text-color:inherit;--f7-area-chart-axis-height:1px;--f7-area-chart-axis-font-size:10px;--f7-area-chart-axis-font-weight:500;--f7-area-chart-tooltip-font-size:12px;--f7-area-chart-tooltip-total-label-text-color:rgba(255, 255, 255, 0.75);--f7-area-chart-tooltip-total-font-size:16px;--f7-area-chart-tooltip-total-font-weight:bold;--f7-area-chart-tooltip-color-size:10px;--f7-area-chart-legend-font-size:14px;--f7-area-chart-legend-font-weight:500;--f7-area-chart-legend-text-color:inherit;--f7-area-chart-legend-padding:4px 8px;--f7-area-chart-legend-border-radius:4px;--f7-area-chart-legend-color-size:14px;--f7-area-chart-line-stroke-width:2px;--f7-area-chart-axis-bg-color:rgba(0, 0, 0, 0.15);--f7-area-chart-legend-disabled-text-color:rgba(0, 0, 0, 0.22)}:root .dark,:root.dark{--f7-area-chart-axis-bg-color:rgba(255, 255, 255, 0.15);--f7-area-chart-legend-disabled-text-color:rgba(255, 255, 255, 0.22)}.area-chart{position:relative}.area-chart svg{display:block;width:100%;font-size:0;height:auto;margin:0 auto}.area-chart path{fill:none;stroke-width:var(--f7-area-chart-line-stroke-width)}.area-chart-current-line{stroke:var(--f7-area-chart-current-line-stroke);stroke-width:var(--f7-area-chart-current-line-stroke-width)}.area-chart-axis{height:var(--f7-area-chart-axis-height);background:var(--f7-area-chart-axis-bg-color);color:var(--f7-area-chart-axis-text-color);display:flex;font-size:var(--f7-area-chart-axis-font-size);font-weight:var(--f7-area-chart-axis-font-weight);justify-content:space-between;line-height:1;margin-bottom:2em}.area-chart-axis>span{padding-top:10px;width:0;display:flex;align-items:flex-start;justify-content:center;white-space:nowrap}.area-chart-axis>span:first-child{justify-content:flex-start}.area-chart-axis>span:last-child{justify-content:flex-end}.area-chart-tooltip{pointer-events:none;text-align:left;font-size:var(--f7-area-chart-tooltip-font-size);line-height:1.4}.area-chart-tooltip-label{color:var(--f7-area-chart-tooltip-total-label-text-color)}.area-chart-tooltip-total{font-size:var(--f7-area-chart-tooltip-total-font-size);font-weight:var(--f7-area-chart-tooltip-total-font-weight)}.area-chart-tooltip-list{list-style:none;margin:0;padding:0}.area-chart-tooltip-list li{white-space:nowrap}.area-chart-tooltip-list span{display:inline-block;width:var(--f7-area-chart-tooltip-color-size);height:var(--f7-area-chart-tooltip-color-size);border-radius:50%;margin-right:4px}.area-chart-axis~.area-chart-legend{margin-top:2em}.area-chart-legend{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;font-size:var(--f7-area-chart-legend-font-size);width:100%;margin-top:1em}.area-chart-legend-button{-webkit-appearance:none!important;appearance:none!important;background-color:transparent;border-radius:0;border:none;outline:0!important;cursor:pointer;font-family:inherit;font-size:inherit;box-shadow:none!important}.area-chart-legend-item{position:relative;color:var(--f7-area-chart-legend-text-color);width:auto;display:flex;align-items:center;font-weight:var(--f7-area-chart-legend-font-weight);transition-duration:.2s;padding:var(--f7-area-chart-legend-padding);border-radius:var(--f7-area-chart-legend-border-radius);overflow:hidden}.area-chart-legend-item span{width:var(--f7-area-chart-legend-color-size);height:var(--f7-area-chart-legend-color-size);margin-right:4px;border-radius:50%;transition-duration:.2s}.area-chart-legend-item-hidden{color:var(--f7-area-chart-legend-disabled-text-color)}.area-chart-legend-item-hidden span{background-color:var(--f7-area-chart-legend-disabled-text-color)!important}
1
+ :root{--f7-area-chart-current-line-stroke-width:2px;--f7-area-chart-current-line-stroke:rgba(0, 0, 0, 0.15);--f7-area-chart-axis-text-color:inherit;--f7-area-chart-axis-height:1px;--f7-area-chart-axis-font-size:10px;--f7-area-chart-axis-font-weight:500;--f7-area-chart-tooltip-font-size:12px;--f7-area-chart-tooltip-total-font-size:16px;--f7-area-chart-tooltip-total-font-weight:bold;--f7-area-chart-tooltip-color-size:10px;--f7-area-chart-legend-font-size:14px;--f7-area-chart-legend-font-weight:500;--f7-area-chart-legend-text-color:inherit;--f7-area-chart-legend-padding:4px 8px;--f7-area-chart-legend-border-radius:4px;--f7-area-chart-legend-color-size:14px;--f7-area-chart-line-stroke-width:2px;--f7-area-chart-axis-bg-color:rgba(0, 0, 0, 0.15);--f7-area-chart-legend-disabled-text-color:rgba(0, 0, 0, 0.22)}:root .dark,:root.dark{--f7-area-chart-axis-bg-color:rgba(255, 255, 255, 0.15);--f7-area-chart-legend-disabled-text-color:rgba(255, 255, 255, 0.22)}.ios{--f7-area-chart-tooltip-total-label-text-color:rgba(255, 255, 255, 0.75)}.md{--f7-area-chart-tooltip-total-label-text-color:inherit}.area-chart{position:relative}.area-chart svg{display:block;width:100%;font-size:0;height:auto;margin:0 auto}.area-chart path{fill:none;stroke-width:var(--f7-area-chart-line-stroke-width)}.area-chart-current-line{stroke:var(--f7-area-chart-current-line-stroke);stroke-width:var(--f7-area-chart-current-line-stroke-width)}.area-chart-axis{height:var(--f7-area-chart-axis-height);background:var(--f7-area-chart-axis-bg-color);color:var(--f7-area-chart-axis-text-color);display:flex;font-size:var(--f7-area-chart-axis-font-size);font-weight:var(--f7-area-chart-axis-font-weight);justify-content:space-between;line-height:1;margin-bottom:2em}.area-chart-axis>span{padding-top:10px;width:0;display:flex;align-items:flex-start;justify-content:center;white-space:nowrap}.area-chart-axis>span:first-child{justify-content:flex-start}.area-chart-axis>span:last-child{justify-content:flex-end}.area-chart-tooltip{pointer-events:none;text-align:left;font-size:var(--f7-area-chart-tooltip-font-size);line-height:1.4}.area-chart-tooltip-label{color:var(--f7-area-chart-tooltip-total-label-text-color)}.area-chart-tooltip-total{font-size:var(--f7-area-chart-tooltip-total-font-size);font-weight:var(--f7-area-chart-tooltip-total-font-weight)}.area-chart-tooltip-list{list-style:none;margin:0;padding:0}.area-chart-tooltip-list li{white-space:nowrap}.area-chart-tooltip-list span{display:inline-block;width:var(--f7-area-chart-tooltip-color-size);height:var(--f7-area-chart-tooltip-color-size);border-radius:50%;margin-right:4px}.area-chart-axis~.area-chart-legend{margin-top:2em}.area-chart-legend{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;font-size:var(--f7-area-chart-legend-font-size);width:100%;margin-top:1em}.area-chart-legend-button{-webkit-appearance:none!important;appearance:none!important;background-color:transparent;border-radius:0;border:none;outline:0!important;cursor:pointer;font-family:inherit;font-size:inherit;box-shadow:none!important}.area-chart-legend-item{position:relative;color:var(--f7-area-chart-legend-text-color);width:auto;display:flex;align-items:center;font-weight:var(--f7-area-chart-legend-font-weight);transition-duration:.2s;padding:var(--f7-area-chart-legend-padding);border-radius:var(--f7-area-chart-legend-border-radius);overflow:hidden}.area-chart-legend-item span{width:var(--f7-area-chart-legend-color-size);height:var(--f7-area-chart-legend-color-size);margin-right:4px;border-radius:50%;transition-duration:.2s}.area-chart-legend-item-hidden{color:var(--f7-area-chart-legend-disabled-text-color)}.area-chart-legend-item-hidden span{background-color:var(--f7-area-chart-legend-disabled-text-color)!important}
package/components/button/button-vars.less CHANGED
@@ -41,7 +41,9 @@
41
41
  --f7-button-border-radius: 4px;
42
42
  --f7-button-font-weight: 600;
43
43
  --f7-button-letter-spacing: 0;
44
+ /*
44
45
  --f7-button-outline-border-color: var(--f7-theme-color);
46
+ */
45
47
  --f7-button-outline-border-width: 2px;
46
48
  /*
47
49
  --f7-button-pressed-bg-color: rgba(var(--f7-theme-color-rgb), .15);
package/components/calendar/calendar-class.js CHANGED
@@ -169,7 +169,7 @@ class Calendar extends Framework7Class {
169
169
  $wrapperEl
170
170
  } = calendar;
171
171
  function handleTouchStart(e) {
172
- if (isMoved || isTouched) return;
172
+ if (isMoved || isTouched || !e.isTrusted) return;
173
173
  isTouched = true;
174
174
  touchStartX = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX;
175
175
  touchCurrentX = touchStartX;
@@ -182,7 +182,7 @@ class Calendar extends Framework7Class {
182
182
  currentTranslate = calendar.monthsTranslate;
183
183
  }
184
184
  function handleTouchMove(e) {
185
- if (!isTouched) return;
185
+ if (!isTouched || !e.isTrusted) return;
186
186
  const {
187
187
  isHorizontal: isH
188
188
  } = calendar;
@@ -215,8 +215,8 @@ class Calendar extends Framework7Class {
215
215
  // Transform wrapper
216
216
  $wrapperEl.transform(`translate3d(${isH ? currentTranslate : 0}%, ${isH ? 0 : currentTranslate}%, 0)`);
217
217
  }
218
- function handleTouchEnd() {
219
- if (!isTouched || !isMoved) {
218
+ function handleTouchEnd(e) {
219
+ if (!isTouched || !isMoved || !e.isTrusted) {
220
220
  isTouched = false;
221
221
  isMoved = false;
222
222
  return;
package/components/card/card.js CHANGED
@@ -229,7 +229,7 @@ const CardExpandable = {
229
229
  let isH;
230
230
  let $cardScrollableEl;
231
231
  function onTouchStart(e) {
232
- if (!$(e.target).closest($cardEl).length) return;
232
+ if (!$(e.target).closest($cardEl).length || !e.isTrusted) return;
233
233
  if (!$cardEl.hasClass('card-opened')) return;
234
234
  $cardScrollableEl = $cardEl.find(cardParams.scrollableEl);
235
235
  if ($cardScrollableEl[0] && $cardScrollableEl[0] !== $cardContentEl[0] && !$cardScrollableEl[0].contains(e.target)) {
@@ -245,7 +245,7 @@ const CardExpandable = {
245
245
  isH = false;
246
246
  }
247
247
  function onTouchMove(e) {
248
- if (!isTouched) return;
248
+ if (!isTouched || !e.isTrusted) return;
249
249
  touchEndX = e.targetTouches[0].pageX;
250
250
  touchEndY = e.targetTouches[0].pageY;
251
251
  if (typeof isScrolling === 'undefined') {
@@ -284,8 +284,8 @@ const CardExpandable = {
284
284
  $cardEl.transform(`translate3d(${app.rtl ? -translateX : translateX}px, ${translateY}px, 0) scale(${scaleX * (1 - progress * 0.2)}, ${scaleY * (1 - progress * 0.2)})`);
285
285
  }
286
286
  }
287
- function onTouchEnd() {
288
- if (!isTouched || !isMoved) return;
287
+ function onTouchEnd(e) {
288
+ if (!isTouched || !isMoved || !e.isTrusted) return;
289
289
  isTouched = false;
290
290
  isMoved = false;
291
291
  if (device.ios) {
package/components/chip/chip-ios.less CHANGED
@@ -1,4 +1,12 @@
1
1
  .ios {
2
+ .chip-media {
3
+ .ltr({
4
+ margin-left: calc(-1 * var(--f7-chip-padding-horizontal));
5
+ });
6
+ .rtl({
7
+ margin-right: calc(-1 * var(--f7-chip-padding-horizontal));
8
+ });
9
+ }
2
10
  .chip-delete {
3
11
  &::after {
4
12
  content: 'delete_round_ios';
package/components/chip/chip-md.less CHANGED
@@ -1,4 +1,12 @@
1
1
  .md {
2
+ .chip-media {
3
+ .ltr({
4
+ margin-left: calc(-1 * var(--f7-chip-padding-horizontal) + 4px);
5
+ });
6
+ .rtl({
7
+ margin-right: calc(-1 * var(--f7-chip-padding-horizontal) + 4px);
8
+ });
9
+ }
2
10
  .chip-label + .chip-delete {
3
11
  .ltr({
4
12
  margin-left: 4px;
package/components/chip/chip-rtl.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-chip-font-size:14px;--f7-chip-media-font-size:16px;--f7-chip-delete-button-color:#000}:root .dark,:root.dark{--f7-chip-delete-button-color:#fff}.ios{--f7-chip-height:28px;--f7-chip-media-size:28px;--f7-chip-padding-horizontal:10px;--f7-chip-border-radius:28px;--f7-chip-font-weight:normal;--f7-chip-outline-border-color:rgba(0, 0, 0, 0.12);--f7-chip-bg-color:rgba(0, 0, 0, 0.12);--f7-chip-text-color:#000;--f7-chip-outline-text-color:#000}.ios .dark,.ios.dark{--f7-chip-bg-color:#333;--f7-chip-text-color:#fff;--f7-chip-outline-text-color:#fff;--f7-chip-outline-border-color:rgba(255, 255, 255, 0.12)}.md{--f7-chip-font-weight:500;--f7-chip-media-size:24px;--f7-chip-height:32px;--f7-chip-padding-horizontal:12px;--f7-chip-border-radius:8px}.md,.md .dark,.md [class*=color-]{--f7-chip-bg-color:var(--f7-md-secondary-container);--f7-chip-text-color:var(--f7-md-on-secondary-container);--f7-chip-outline-text-color:var(--f7-md-on-surface);--f7-chip-outline-border-color:var(--f7-md-outline)}.chip{padding-left:var(--f7-chip-padding-horizontal);padding-right:var(--f7-chip-padding-horizontal);font-weight:var(--f7-chip-font-weight);display:inline-flex;box-sizing:border-box;vertical-align:middle;align-items:center;margin:2px 0;background-color:var(--f7-chip-bg-color);font-size:var(--f7-chip-font-size);color:var(--f7-chip-text-color);height:var(--f7-chip-height);line-height:var(--f7-chip-height);border-radius:var(--f7-chip-border-radius);position:relative}.chip-media{border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;height:var(--f7-chip-media-size);width:var(--f7-chip-media-size);border-radius:var(--f7-chip-media-size);text-align:center;line-height:var(--f7-chip-media-size);box-sizing:border-box;color:#fff;font-size:var(--f7-chip-media-font-size);vertical-align:middle;margin-right:calc(-1 * var(--f7-chip-padding-horizontal) + 4px)}.chip-media i.icon{font-size:calc(var(--f7-chip-media-size) - 8px);height:calc(var(--f7-chip-media-size) - 8px)}.chip-media img{max-width:100%;max-height:100%;width:auto;height:auto;border-radius:50%;display:block}.chip-media+.chip-label{margin-right:4px}.chip-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;flex-shrink:1;min-width:0}.chip-delete{text-align:center;cursor:pointer;flex-shrink:0;background-repeat:no-repeat;width:24px;height:24px;color:var(--f7-chip-delete-button-color);opacity:.54;position:relative}.chip-delete:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px;line-height:24px}.chip .chip-delete.active-state{opacity:1}.chip-outline,.ios .chip-outline-ios,.md .chip-outline-md{border:1px solid var(--f7-chip-outline-border-color);color:var(--f7-chip-outline-text-color);background:0 0}.ios .chip[class*=color-]{--f7-chip-bg-color:var(--f7-theme-color);--f7-chip-text-color:#fff}.ios .chip-outline-ios[class*=color-],.ios .chip-outline[class*=color-]{--f7-chip-outline-border-color:var(--f7-theme-color);--f7-chip-outline-text-color:var(--f7-theme-color)}.ios .chip-delete{margin-left:calc(-1 * var(--f7-chip-padding-horizontal))}.ios .chip-delete::after{content:'delete_round_ios'}.ios .chip-delete:after{font-size:10px}.md .chip-label+.chip-delete{margin-right:4px}.md .chip-delete{margin-left:calc(-1 * var(--f7-chip-padding-horizontal) + 4px)}.md .chip-delete::after{content:'delete_round_md';font-size:16px}
1
+ :root{--f7-chip-font-size:14px;--f7-chip-media-font-size:16px;--f7-chip-delete-button-color:#000}:root .dark,:root.dark{--f7-chip-delete-button-color:#fff}.ios{--f7-chip-height:28px;--f7-chip-media-size:28px;--f7-chip-padding-horizontal:10px;--f7-chip-border-radius:28px;--f7-chip-font-weight:normal;--f7-chip-outline-border-color:rgba(0, 0, 0, 0.12);--f7-chip-bg-color:rgba(0, 0, 0, 0.12);--f7-chip-text-color:#000;--f7-chip-outline-text-color:#000}.ios .dark,.ios.dark{--f7-chip-bg-color:#333;--f7-chip-text-color:#fff;--f7-chip-outline-text-color:#fff;--f7-chip-outline-border-color:rgba(255, 255, 255, 0.12)}.md{--f7-chip-font-weight:500;--f7-chip-media-size:24px;--f7-chip-height:32px;--f7-chip-padding-horizontal:12px;--f7-chip-border-radius:8px}.md,.md .dark,.md [class*=color-]{--f7-chip-bg-color:var(--f7-md-secondary-container);--f7-chip-text-color:var(--f7-md-on-secondary-container);--f7-chip-outline-text-color:var(--f7-md-on-surface);--f7-chip-outline-border-color:var(--f7-md-outline)}.chip{padding-left:var(--f7-chip-padding-horizontal);padding-right:var(--f7-chip-padding-horizontal);font-weight:var(--f7-chip-font-weight);display:inline-flex;box-sizing:border-box;vertical-align:middle;align-items:center;margin:2px 0;background-color:var(--f7-chip-bg-color);font-size:var(--f7-chip-font-size);color:var(--f7-chip-text-color);height:var(--f7-chip-height);line-height:var(--f7-chip-height);border-radius:var(--f7-chip-border-radius);position:relative}.chip-media{border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;height:var(--f7-chip-media-size);width:var(--f7-chip-media-size);border-radius:var(--f7-chip-media-size);text-align:center;line-height:var(--f7-chip-media-size);box-sizing:border-box;color:#fff;font-size:var(--f7-chip-media-font-size);vertical-align:middle}.chip-media i.icon{font-size:calc(var(--f7-chip-media-size) - 8px);height:calc(var(--f7-chip-media-size) - 8px)}.chip-media img{max-width:100%;max-height:100%;width:auto;height:auto;border-radius:50%;display:block}.chip-media+.chip-label{margin-right:4px}.chip-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;flex-shrink:1;min-width:0}.chip-delete{text-align:center;cursor:pointer;flex-shrink:0;background-repeat:no-repeat;width:24px;height:24px;color:var(--f7-chip-delete-button-color);opacity:.54;position:relative}.chip-delete:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px;line-height:24px}.chip .chip-delete.active-state{opacity:1}.chip-outline,.ios .chip-outline-ios,.md .chip-outline-md{border:1px solid var(--f7-chip-outline-border-color);color:var(--f7-chip-outline-text-color);background:0 0}.ios .chip[class*=color-]{--f7-chip-bg-color:var(--f7-theme-color);--f7-chip-text-color:#fff}.ios .chip-outline-ios[class*=color-],.ios .chip-outline[class*=color-]{--f7-chip-outline-border-color:var(--f7-theme-color);--f7-chip-outline-text-color:var(--f7-theme-color)}.ios .chip-media{margin-right:calc(-1 * var(--f7-chip-padding-horizontal))}.ios .chip-delete{margin-left:calc(-1 * var(--f7-chip-padding-horizontal))}.ios .chip-delete::after{content:'delete_round_ios'}.ios .chip-delete:after{font-size:10px}.md .chip-media{margin-right:calc(-1 * var(--f7-chip-padding-horizontal) + 4px)}.md .chip-label+.chip-delete{margin-right:4px}.md .chip-delete{margin-left:calc(-1 * var(--f7-chip-padding-horizontal) + 4px)}.md .chip-delete::after{content:'delete_round_md';font-size:16px}
package/components/chip/chip.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-chip-font-size:14px;--f7-chip-media-font-size:16px;--f7-chip-delete-button-color:#000}:root .dark,:root.dark{--f7-chip-delete-button-color:#fff}.ios{--f7-chip-height:28px;--f7-chip-media-size:28px;--f7-chip-padding-horizontal:10px;--f7-chip-border-radius:28px;--f7-chip-font-weight:normal;--f7-chip-outline-border-color:rgba(0, 0, 0, 0.12);--f7-chip-bg-color:rgba(0, 0, 0, 0.12);--f7-chip-text-color:#000;--f7-chip-outline-text-color:#000}.ios .dark,.ios.dark{--f7-chip-bg-color:#333;--f7-chip-text-color:#fff;--f7-chip-outline-text-color:#fff;--f7-chip-outline-border-color:rgba(255, 255, 255, 0.12)}.md{--f7-chip-font-weight:500;--f7-chip-media-size:24px;--f7-chip-height:32px;--f7-chip-padding-horizontal:12px;--f7-chip-border-radius:8px}.md,.md .dark,.md [class*=color-]{--f7-chip-bg-color:var(--f7-md-secondary-container);--f7-chip-text-color:var(--f7-md-on-secondary-container);--f7-chip-outline-text-color:var(--f7-md-on-surface);--f7-chip-outline-border-color:var(--f7-md-outline)}.chip{padding-left:var(--f7-chip-padding-horizontal);padding-right:var(--f7-chip-padding-horizontal);font-weight:var(--f7-chip-font-weight);display:inline-flex;box-sizing:border-box;vertical-align:middle;align-items:center;margin:2px 0;background-color:var(--f7-chip-bg-color);font-size:var(--f7-chip-font-size);color:var(--f7-chip-text-color);height:var(--f7-chip-height);line-height:var(--f7-chip-height);border-radius:var(--f7-chip-border-radius);position:relative}.chip-media{border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;height:var(--f7-chip-media-size);width:var(--f7-chip-media-size);border-radius:var(--f7-chip-media-size);text-align:center;line-height:var(--f7-chip-media-size);box-sizing:border-box;color:#fff;font-size:var(--f7-chip-media-font-size);vertical-align:middle;margin-left:calc(-1 * var(--f7-chip-padding-horizontal) + 4px)}.chip-media i.icon{font-size:calc(var(--f7-chip-media-size) - 8px);height:calc(var(--f7-chip-media-size) - 8px)}.chip-media img{max-width:100%;max-height:100%;width:auto;height:auto;border-radius:50%;display:block}.chip-media+.chip-label{margin-left:4px}.chip-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;flex-shrink:1;min-width:0}.chip-delete{text-align:center;cursor:pointer;flex-shrink:0;background-repeat:no-repeat;width:24px;height:24px;color:var(--f7-chip-delete-button-color);opacity:.54;position:relative}.chip-delete:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px;line-height:24px}.chip .chip-delete.active-state{opacity:1}.chip-outline,.ios .chip-outline-ios,.md .chip-outline-md{border:1px solid var(--f7-chip-outline-border-color);color:var(--f7-chip-outline-text-color);background:0 0}.ios .chip[class*=color-]{--f7-chip-bg-color:var(--f7-theme-color);--f7-chip-text-color:#fff}.ios .chip-outline-ios[class*=color-],.ios .chip-outline[class*=color-]{--f7-chip-outline-border-color:var(--f7-theme-color);--f7-chip-outline-text-color:var(--f7-theme-color)}.ios .chip-delete{margin-right:calc(-1 * var(--f7-chip-padding-horizontal))}.ios .chip-delete::after{content:'delete_round_ios'}.ios .chip-delete:after{font-size:10px}.md .chip-label+.chip-delete{margin-left:4px}.md .chip-delete{margin-right:calc(-1 * var(--f7-chip-padding-horizontal) + 4px)}.md .chip-delete::after{content:'delete_round_md';font-size:16px}
1
+ :root{--f7-chip-font-size:14px;--f7-chip-media-font-size:16px;--f7-chip-delete-button-color:#000}:root .dark,:root.dark{--f7-chip-delete-button-color:#fff}.ios{--f7-chip-height:28px;--f7-chip-media-size:28px;--f7-chip-padding-horizontal:10px;--f7-chip-border-radius:28px;--f7-chip-font-weight:normal;--f7-chip-outline-border-color:rgba(0, 0, 0, 0.12);--f7-chip-bg-color:rgba(0, 0, 0, 0.12);--f7-chip-text-color:#000;--f7-chip-outline-text-color:#000}.ios .dark,.ios.dark{--f7-chip-bg-color:#333;--f7-chip-text-color:#fff;--f7-chip-outline-text-color:#fff;--f7-chip-outline-border-color:rgba(255, 255, 255, 0.12)}.md{--f7-chip-font-weight:500;--f7-chip-media-size:24px;--f7-chip-height:32px;--f7-chip-padding-horizontal:12px;--f7-chip-border-radius:8px}.md,.md .dark,.md [class*=color-]{--f7-chip-bg-color:var(--f7-md-secondary-container);--f7-chip-text-color:var(--f7-md-on-secondary-container);--f7-chip-outline-text-color:var(--f7-md-on-surface);--f7-chip-outline-border-color:var(--f7-md-outline)}.chip{padding-left:var(--f7-chip-padding-horizontal);padding-right:var(--f7-chip-padding-horizontal);font-weight:var(--f7-chip-font-weight);display:inline-flex;box-sizing:border-box;vertical-align:middle;align-items:center;margin:2px 0;background-color:var(--f7-chip-bg-color);font-size:var(--f7-chip-font-size);color:var(--f7-chip-text-color);height:var(--f7-chip-height);line-height:var(--f7-chip-height);border-radius:var(--f7-chip-border-radius);position:relative}.chip-media{border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;height:var(--f7-chip-media-size);width:var(--f7-chip-media-size);border-radius:var(--f7-chip-media-size);text-align:center;line-height:var(--f7-chip-media-size);box-sizing:border-box;color:#fff;font-size:var(--f7-chip-media-font-size);vertical-align:middle}.chip-media i.icon{font-size:calc(var(--f7-chip-media-size) - 8px);height:calc(var(--f7-chip-media-size) - 8px)}.chip-media img{max-width:100%;max-height:100%;width:auto;height:auto;border-radius:50%;display:block}.chip-media+.chip-label{margin-left:4px}.chip-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;flex-shrink:1;min-width:0}.chip-delete{text-align:center;cursor:pointer;flex-shrink:0;background-repeat:no-repeat;width:24px;height:24px;color:var(--f7-chip-delete-button-color);opacity:.54;position:relative}.chip-delete:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px;line-height:24px}.chip .chip-delete.active-state{opacity:1}.chip-outline,.ios .chip-outline-ios,.md .chip-outline-md{border:1px solid var(--f7-chip-outline-border-color);color:var(--f7-chip-outline-text-color);background:0 0}.ios .chip[class*=color-]{--f7-chip-bg-color:var(--f7-theme-color);--f7-chip-text-color:#fff}.ios .chip-outline-ios[class*=color-],.ios .chip-outline[class*=color-]{--f7-chip-outline-border-color:var(--f7-theme-color);--f7-chip-outline-text-color:var(--f7-theme-color)}.ios .chip-media{margin-left:calc(-1 * var(--f7-chip-padding-horizontal))}.ios .chip-delete{margin-right:calc(-1 * var(--f7-chip-padding-horizontal))}.ios .chip-delete::after{content:'delete_round_ios'}.ios .chip-delete:after{font-size:10px}.md .chip-media{margin-left:calc(-1 * var(--f7-chip-padding-horizontal) + 4px)}.md .chip-label+.chip-delete{margin-left:4px}.md .chip-delete{margin-right:calc(-1 * var(--f7-chip-padding-horizontal) + 4px)}.md .chip-delete::after{content:'delete_round_md';font-size:16px}
package/components/chip/chip.less CHANGED
@@ -46,18 +46,14 @@
46
46
  border-radius: 50%;
47
47
  display: block;
48
48
  }
49
- .ltr({
50
- margin-left: calc(-1 * var(--f7-chip-padding-horizontal) + 4px);
51
- + .chip-label {
49
+ + .chip-label {
50
+ .ltr({
52
51
  margin-left: 4px;
53
- }
54
- });
55
- .rtl({
56
- margin-right: calc(-1 * var(--f7-chip-padding-horizontal) + 4px);
57
- + .chip-label {
52
+ });
53
+ .rtl({
58
54
  margin-right: 4px;
59
- }
60
- });
55
+ });
56
+ }
61
57
  }
62
58
  .chip-label {
63
59
  white-space: nowrap;
package/components/input/input-rtl.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-input-bg-color:transparent;--f7-label-font-weight:400;--f7-label-height:16px;--f7-label-font-size:12px;--f7-floating-label-scale:calc(16 / 12);--f7-input-padding-left:0px;--f7-input-padding-right:0px;--f7-input-error-text-color:#ff3b30;--f7-input-error-font-size:12px;--f7-input-error-line-height:1.4;--f7-input-error-font-weight:400;--f7-input-info-font-size:12px;--f7-input-info-line-height:1.4;--f7-textarea-height:100px}.ios{--f7-input-item-bg-color:transparent;--f7-input-item-border-radius:0px;--f7-input-height:40px;--f7-input-font-size:16px;--f7-input-placeholder-color:#a9a9a9;--f7-textarea-padding-vertical:8px;--f7-label-text-color:inherit;--f7-input-clear-button-size:14px;--f7-input-outline-border-radius:8px;--f7-input-text-color:#000000;--f7-input-info-text-color:rgba(0, 0, 0, 0.45);--f7-input-clear-button-color:rgba(0, 0, 0, 0.45);--f7-input-outline-border-color:#bbb}.ios .dark,.ios.dark{--f7-input-text-color:#fff;--f7-input-info-text-color:rgba(255, 255, 255, 0.55);--f7-input-clear-button-color:rgba(255, 255, 255, 0.5);--f7-input-outline-border-color:#444}.md{--f7-input-item-border-radius:4px 4px 0 0;--f7-input-height:24px;--f7-input-font-size:16px;--f7-textarea-padding-vertical:0px;--f7-input-outline-border-radius:4px;--f7-floating-label-scale:calc(16 / 12);--f7-input-clear-button-size:24px;--f7-input-info-text-color:rgba(0, 0, 0, 0.45)}.md .dark,.md.dark{--f7-input-info-text-color:rgba(255, 255, 255, 0.45)}.md,.md .dark,.md [class*=color-]{--f7-input-placeholder-color:var(--f7-md-on-surface-variant);--f7-input-item-bg-color:var(--f7-md-surface-variant);--f7-input-border-color:var(--f7-md-outline);--f7-input-clear-button-color:var(--f7-md-on-surface-variant);--f7-input-outline-border-color:var(--f7-md-outline);--f7-input-text-color:var(--f7-md-on-surface);--f7-label-text-color:var(--f7-md-on-surface-variant)}input[type=date],input[type=datetime-local],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],select,textarea{box-sizing:border-box;-webkit-appearance:none;appearance:none;border:none;box-shadow:none;border-radius:0;outline:0;display:block;padding:0;margin:0;font-family:inherit;background:0 0;resize:none;font-size:inherit;color:inherit}input[type=date]:-internal-autofill-selected,input[type=datetime-local]:-internal-autofill-selected,input[type=email]:-internal-autofill-selected,input[type=month]:-internal-autofill-selected,input[type=number]:-internal-autofill-selected,input[type=password]:-internal-autofill-selected,input[type=search]:-internal-autofill-selected,input[type=tel]:-internal-autofill-selected,input[type=text]:-internal-autofill-selected,input[type=time]:-internal-autofill-selected,input[type=url]:-internal-autofill-selected,select:-internal-autofill-selected,textarea:-internal-autofill-selected{background-color:transparent!important;transition:background-color 5000s ease-in-out 0s!important}input[type=date]:-webkit-autofill,input[type=datetime-local]:-webkit-autofill,input[type=email]:-webkit-autofill,input[type=month]:-webkit-autofill,input[type=number]:-webkit-autofill,input[type=password]:-webkit-autofill,input[type=search]:-webkit-autofill,input[type=tel]:-webkit-autofill,input[type=text]:-webkit-autofill,input[type=time]:-webkit-autofill,input[type=url]:-webkit-autofill,select:-webkit-autofill,textarea:-webkit-autofill{background-color:transparent!important;-webkit-transition:background-color 5000s ease-in-out 0s!important;transition:background-color 5000s ease-in-out 0s!important}input[type=date]:-webkit-autofill-and-obscured,input[type=date]:autofill,input[type=datetime-local]:-webkit-autofill-and-obscured,input[type=datetime-local]:autofill,input[type=email]:-webkit-autofill-and-obscured,input[type=email]:autofill,input[type=month]:-webkit-autofill-and-obscured,input[type=month]:autofill,input[type=number]:-webkit-autofill-and-obscured,input[type=number]:autofill,input[type=password]:-webkit-autofill-and-obscured,input[type=password]:autofill,input[type=search]:-webkit-autofill-and-obscured,input[type=search]:autofill,input[type=tel]:-webkit-autofill-and-obscured,input[type=tel]:autofill,input[type=text]:-webkit-autofill-and-obscured,input[type=text]:autofill,input[type=time]:-webkit-autofill-and-obscured,input[type=time]:autofill,input[type=url]:-webkit-autofill-and-obscured,input[type=url]:autofill,select:-webkit-autofill-and-obscured,select:autofill,textarea:-webkit-autofill-and-obscured,textarea:autofill{background-color:transparent!important;-webkit-transition:background-color 5000s ease-in-out 0s!important;transition:background-color 5000s ease-in-out 0s!important}.textarea-resizable-shadow{opacity:0;position:absolute;z-index:-1000;pointer-events:none;left:-1000px;top:-1000px;visibility:hidden}.list input[type=date],.list input[type=datetime-local],.list input[type=email],.list input[type=month],.list input[type=number],.list input[type=password],.list input[type=search],.list input[type=tel],.list input[type=text],.list input[type=time],.list input[type=url],.list select{width:100%;height:var(--f7-input-height);color:var(--f7-input-text-color);font-size:var(--f7-input-font-size);background-color:var(--f7-input-bg-color,transparent);padding-left:var(--f7-input-padding-left);padding-right:var(--f7-input-padding-right)}.list input[type=date]::placeholder,.list input[type=datetime-local]::placeholder,.list input[type=email]::placeholder,.list input[type=month]::placeholder,.list input[type=number]::placeholder,.list input[type=password]::placeholder,.list input[type=search]::placeholder,.list input[type=tel]::placeholder,.list input[type=text]::placeholder,.list input[type=time]::placeholder,.list input[type=url]::placeholder,.list select::placeholder{color:var(--f7-input-placeholder-color)}.list textarea{width:100%;color:var(--f7-input-text-color);font-size:var(--f7-input-font-size);resize:none;line-height:1.4;height:var(--f7-textarea-height);background-color:var(--f7-input-bg-color,transparent);padding-top:var(--f7-textarea-padding-vertical);padding-bottom:var(--f7-textarea-padding-vertical);padding-left:var(--f7-input-padding-left);padding-right:var(--f7-input-padding-right)}.list textarea::placeholder{color:var(--f7-input-placeholder-color)}.list textarea.resizable{height:calc(var(--f7-input-height) + var(--f7-textarea-padding-vertical) * 2)}.list input[type=datetime-local]{max-width:50vw}.list input[type=date],.list input[type=datetime-local],.list input[type=month],.list input[type=time]{line-height:var(--f7-input-height)}.list input[type=date],.list input[type=datetime-local],.list input[type=month]{text-align:right;flex-direction:row-reverse;width:auto}.list .item-floating-label,.list .item-label{width:auto;vertical-align:top;flex-shrink:0;font-size:var(--f7-label-font-size);font-weight:var(--f7-label-font-weight);line-height:var(--f7-label-height);color:var(--f7-label-text-color);transition-duration:.2s;transition-property:transform,color}.list .item-floating-label{color:var(--f7-input-placeholder-color);max-width:calc(100% / var(--f7-floating-label-scale));pointer-events:none;right:var(--f7-input-padding-right);transform-origin:right center}.list .item-floating-label~.item-input-wrap input::placeholder,.list .item-floating-label~.item-input-wrap textarea::placeholder{opacity:0;transition-duration:.1s}.list .item-floating-label~.item-input-wrap input.input-focused::placeholder,.list .item-floating-label~.item-input-wrap textarea.input-focused::placeholder{opacity:1;transition-duration:.3s}.list .item-input-with-value .item-floating-label{color:var(--f7-label-text-color)}.list .item-input-focused .item-floating-label,.list .item-input-with-value .item-floating-label{transform:scale(1) translateY(0)!important}.list .item-input-wrap{width:100%;flex-shrink:1;position:relative}.input,.item-input{position:relative}.item-input .item-inner{display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.input-error-message,.item-input-error-message{font-size:var(--f7-input-error-font-size);line-height:var(--f7-input-error-line-height);color:var(--f7-input-error-text-color);font-weight:var(--f7-input-error-font-weight);display:none;box-sizing:border-box}.input-info,.item-input-info{font-size:var(--f7-input-info-font-size);line-height:var(--f7-input-info-line-height);color:var(--f7-input-info-text-color)}.input-invalid .input-error-message,.input-invalid .item-input-error-message,.item-input-invalid .input-error-message,.item-input-invalid .item-input-error-message{display:block}.input-invalid .input-info,.input-invalid .item-input-info,.item-input-invalid .input-info,.item-input-invalid .item-input-info{display:none}.input{position:relative}.input input,.input select,.input textarea{width:100%}.input-clear-button{opacity:0;pointer-events:none;visibility:hidden;transition-duration:.1s;position:absolute;top:50%;border:none;padding:0;margin:0;outline:0;z-index:1;cursor:pointer;background:0 0;width:var(--f7-input-clear-button-size);height:var(--f7-input-clear-button-size);margin-top:calc(-1 * var(--f7-input-clear-button-size)/ 2);color:var(--f7-input-clear-button-color);left:0}.input-clear-button:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px}.input-clear-button:before{position:absolute;content:'';left:50%;top:50%}.item-input-wrap .input-clear-button{top:calc(var(--f7-input-height)/ 2)}.input-clear-button.active-state{opacity:.75!important}.input-with-value .input-clear-button,.input-with-value~.input-clear-button,.item-input-with-value .input-clear-button{opacity:1;pointer-events:auto;visibility:visible}.input-dropdown,.input-dropdown-wrap{position:relative}.input-dropdown-wrap:before,.input-dropdown:before{content:'';pointer-events:none;position:absolute;top:50%;margin-top:-2px;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #727272;left:6px}.input-dropdown input,.input-dropdown select,.input-dropdown textarea,.input-dropdown-wrap input,.input-dropdown-wrap select,.input-dropdown-wrap textarea{padding-left:calc(20px + var(--f7-input-padding-left))}.input-outline::after,.item-input-outline .item-content::after,.item-input-outline.item-content::after{content:'';position:absolute;left:0;right:0;top:8px;bottom:8px;border:1px solid var(--f7-input-outline-border-color);border-radius:var(--f7-input-outline-border-radius);pointer-events:none;box-sizing:border-box;transition-duration:.2s}.input-outline .item-floating-label,.input-outline .item-label,.item-input-outline .item-content .item-floating-label,.item-input-outline .item-content .item-label,.item-input-outline.item-content .item-floating-label,.item-input-outline.item-content .item-label{pointer-events:none;background:var(--f7-page-bg-color);z-index:1;padding:4px}.input-outline.input-focused::after,.input-outline.item-input-focused::after,.item-input-outline .item-content.input-focused::after,.item-input-outline .item-content.item-input-focused::after,.item-input-outline.item-content.input-focused::after,.item-input-outline.item-content.item-input-focused::after{border-width:2px;border-color:var(--f7-input-outline-invalid-border-color,var(--f7-theme-color))}.input-outline.input-invalid::after,.input-outline.item-input-invalid::after,.item-input-outline .item-content.input-invalid::after,.item-input-outline .item-content.item-input-invalid::after,.item-input-outline.item-content.input-invalid::after,.item-input-outline.item-content.item-input-invalid::after{border-width:2px;border-color:var(--f7-input-outline-invalid-border-color,var(--f7-input-error-text-color))}.block-strong .item-input-outline .item-floating-label,.block-strong .item-input-outline .item-label,.ios .block-strong-ios .item-input-outline .item-floating-label,.ios .block-strong-ios .item-input-outline .item-label,.md .block-strong-md .item-input-outline .item-floating-label,.md .block-strong-md .item-input-outline .item-label{background:var(--f7-block-strong-bg-color)!important}.ios .list-strong-ios .item-input-outline .item-floating-label,.ios .list-strong-ios .item-input-outline .item-label,.list-strong .item-input-outline .item-floating-label,.list-strong .item-input-outline .item-label,.md .list-strong-md .item-input-outline .item-floating-label,.md .list-strong-md .item-input-outline .item-label{background:var(--f7-list-strong-bg-color)!important}.dark option{background-color:var(--f7-page-bg-color)}.ios .item-floating-label+.item-input-wrap,.ios .item-label+.item-input-wrap{margin-top:0}.ios .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc(var(--f7-label-height) + 25%))}.ios .item-input-focused .item-floating-label{color:var(--f7-label-text-color)}.ios .item-input .item-media{align-self:flex-start}.ios .item-input-wrap{margin-top:calc(-1 * var(--f7-list-item-padding-vertical));margin-bottom:calc(-1 * var(--f7-list-item-padding-vertical))}.ios .item-input:not(.item-input-outline) .item-content,.ios .item-input:not(.item-input-outline).item-content{background:var(--f7-input-item-bg-color)}.ios .input-error-message,.ios .input-info,.ios .item-input-error-message,.ios .item-input-info{position:relative;margin-bottom:6px;margin-top:-8px}.ios .item-input-focused .item-floating-label,.ios .item-input-focused .item-label{color:var(--f7-label-focused-text-color,var(--f7-label-text-color))}.ios .item-input-focused .item-inner:after{background:var(--f7-input-focused-border-color,var(--f7-list-item-border-color))}.ios .item-input-invalid .item-floating-label,.ios .item-input-invalid .item-label{color:var(--f7-label-invalid-text-color,var(--f7-label-text-color))}.ios .item-input-invalid .item-inner:after{background:var(--f7-input-invalid-border-color,var(--f7-list-item-border-color))}.ios .input-invalid input,.ios .input-invalid select,.ios .input-invalid textarea,.ios .item-input-invalid input,.ios .item-input-invalid select,.ios .item-input-invalid textarea{color:var(--f7-input-invalid-text-color,var(--f7-input-error-text-color))}.ios .input-clear-button:after{content:'delete_round_ios';font-size:calc(var(--f7-input-clear-button-size) / (14 / 10));line-height:1.4}.ios .input-clear-button:before{width:44px;height:44px;margin-left:-22px;margin-top:-22px}.ios .item-input-outline .item-content,.ios .item-input-outline.item-content{padding-top:8px;padding-bottom:8px;margin-left:16px;margin-right:16px}.ios li.item-input-outline:first-child,.ios li:first-child>.item-input-outline{padding-top:16px}.ios li.item-input-outline:first-child::after,.ios li:first-child>.item-input-outline::after{top:16px}.ios li.item-input-outline:last-child,.ios li:last-child>.item-input-outline{padding-bottom:16px}.ios li.item-input-outline:last-child::after,.ios li:last-child>.item-input-outline::after{bottom:16px}.ios .input-outline .item-inner,.ios .item-input-outline .item-content .item-inner,.ios .item-input-outline.item-content .item-inner{display:block;padding-top:0px;padding-bottom:0px}.ios .input-outline .item-input-wrap,.ios .item-input-outline .item-content .item-input-wrap,.ios .item-input-outline.item-content .item-input-wrap{margin-top:-22px}.ios .input-outline .item-floating-label,.ios .input-outline .item-label,.ios .item-input-outline .item-content .item-floating-label,.ios .item-input-outline .item-content .item-label,.ios .item-input-outline.item-content .item-floating-label,.ios .item-input-outline.item-content .item-label{display:inline-flex;margin:-8px -4px -4px;top:-4px}.ios .input-outline .item-floating-label,.ios .item-input-outline .item-content .item-floating-label,.ios .item-input-outline.item-content .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc(var(--f7-label-height)))}.md .item-input-wrap{min-height:var(--f7-input-height)}.md .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc((var(--f7-input-height)/ 2)/ var(--f7-floating-label-scale)))}.md .item-input .item-inner:after{display:none!important}.md .item-input .item-content,.md .item-input.item-content{margin-left:16px;margin-right:16px;padding-top:8px;padding-bottom:8px}.md .input:after{content:'';position:absolute;background-color:var(--f7-input-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.md .input::after{transform:scaleY(1)!important;transition-duration:.2s;bottom:0px}.md .input.input-focused::after{transform:scaleY(2)!important;background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .input.input-invalid::after{transform:scaleY(2)!important;background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .item-input:not(.item-input-outline) .item-content:after,.md .item-input:not(.item-input-outline).item-content:after{content:'';position:absolute;background-color:var(--f7-input-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.md .item-input:not(.item-input-outline) .item-content::before,.md .item-input:not(.item-input-outline).item-content::before{content:'';position:absolute;left:0;top:8px;bottom:8px;right:0;border-radius:var(--f7-input-item-border-radius);background:var(--f7-input-item-bg-color);pointer-events:none}.md .item-input:not(.item-input-outline) .item-content::after,.md .item-input:not(.item-input-outline).item-content::after{transform:scaleY(1)!important;transition-duration:.2s;bottom:8px}.md .item-input:not(.item-input-outline) .item-content.item-input-focused::after,.md .item-input:not(.item-input-outline).item-content.item-input-focused::after{transform:scaleY(2)!important;background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .item-input:not(.item-input-outline) .item-content.input-invalid::after,.md .item-input:not(.item-input-outline) .item-content.item-input-invalid::after,.md .item-input:not(.item-input-outline).item-content.input-invalid::after,.md .item-input:not(.item-input-outline).item-content.item-input-invalid::after{transform:scaleY(2)!important;background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .input-outline .item-inner,.md .item-input-outline .item-content .item-inner,.md .item-input-outline.item-content .item-inner{padding-top:16px;padding-bottom:16px}.md .input-outline .item-floating-label,.md .input-outline .item-label,.md .item-input-outline .item-content .item-floating-label,.md .item-input-outline .item-content .item-label,.md .item-input-outline.item-content .item-floating-label,.md .item-input-outline.item-content .item-label{--label-height:calc(var(--f7-label-height) + 8px);margin:calc(0px - 16px - var(--label-height)/ 2) -4px 4px}.md .input-outline .item-floating-label,.md .item-input-outline .item-content .item-floating-label,.md .item-input-outline.item-content .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc((var(--f7-input-height)/ 2) + 8px))}.md .input-with-error-message,.md .input-with-info,.md .item-input-with-error-message,.md .item-input-with-info{padding-bottom:24px!important}.md .input-error-message,.md .input-info,.md .item-input-error-message,.md .item-input-info{position:absolute;top:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;right:0}.md .item-input-focused .item-floating-label,.md .item-input-focused .item-label{color:var(--f7-label-focused-text-color,var(--f7-theme-color))}.md .input-focused:not(.input-outline):after,.md .item-input-focused:not(.item-input-outline) .item-input-wrap:after{background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .input-focused:not(.input-outline):after,.md .input-invalid:not(.input-outline):after,.md .item-input-focused:not(.item-input-outline) .item-input-wrap:after,.md .item-input-invalid:not(.item-input-outline) .item-input-wrap:after{transform:scaleY(2)!important}.md .input-invalid:not(.input-outline):after,.md .item-input-invalid:not(.item-input-outline) .item-input-wrap:after{background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .item-input-invalid .item-floating-label,.md .item-input-invalid .item-label{color:var(--f7-label-invalid-text-color,var(--f7-input-error-text-color))}.md .input-invalid input,.md .input-invalid select,.md .input-invalid textarea,.md .item-input-invalid input,.md .item-input-invalid select,.md .item-input-invalid textarea{color:var(--f7-input-invalid-text-color,var(--f7-input-text-color))}.md .input-clear-button:after{font-size:var(--f7-input-clear-button-size);content:'delete_round_md';line-height:1}.md .input-clear-button:before{width:48px;height:48px;margin-left:-24px;margin-top:-24px}
1
+ :root{--f7-input-bg-color:transparent;--f7-label-font-weight:400;--f7-label-height:16px;--f7-label-font-size:12px;--f7-floating-label-scale:calc(16 / 12);--f7-input-padding-left:0px;--f7-input-padding-right:0px;--f7-input-error-text-color:#ff3b30;--f7-input-error-font-size:12px;--f7-input-error-line-height:1.4;--f7-input-error-font-weight:400;--f7-input-info-font-size:12px;--f7-input-info-line-height:1.4;--f7-textarea-height:100px}.ios{--f7-input-item-bg-color:transparent;--f7-input-item-border-radius:0px;--f7-input-height:40px;--f7-input-font-size:16px;--f7-input-placeholder-color:#a9a9a9;--f7-textarea-padding-vertical:8px;--f7-label-text-color:inherit;--f7-input-clear-button-size:14px;--f7-input-outline-border-radius:8px;--f7-input-text-color:#000000;--f7-input-info-text-color:rgba(0, 0, 0, 0.45);--f7-input-clear-button-color:rgba(0, 0, 0, 0.45);--f7-input-outline-border-color:#bbb}.ios .dark,.ios.dark{--f7-input-text-color:#fff;--f7-input-info-text-color:rgba(255, 255, 255, 0.55);--f7-input-clear-button-color:rgba(255, 255, 255, 0.5);--f7-input-outline-border-color:#444}.md{--f7-input-item-border-radius:4px 4px 0 0;--f7-input-height:24px;--f7-input-font-size:16px;--f7-textarea-padding-vertical:0px;--f7-input-outline-border-radius:4px;--f7-floating-label-scale:calc(16 / 12);--f7-input-clear-button-size:24px;--f7-input-info-text-color:rgba(0, 0, 0, 0.45)}.md .dark,.md.dark{--f7-input-info-text-color:rgba(255, 255, 255, 0.45)}.md,.md .dark,.md [class*=color-]{--f7-input-placeholder-color:var(--f7-md-on-surface-variant);--f7-input-item-bg-color:var(--f7-md-surface-variant);--f7-input-border-color:var(--f7-md-outline);--f7-input-clear-button-color:var(--f7-md-on-surface-variant);--f7-input-outline-border-color:var(--f7-md-outline);--f7-input-text-color:var(--f7-md-on-surface);--f7-label-text-color:var(--f7-md-on-surface-variant)}input[type=date],input[type=datetime-local],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],select,textarea{box-sizing:border-box;-webkit-appearance:none;appearance:none;border:none;box-shadow:none;border-radius:0;outline:0;display:block;padding:0;margin:0;font-family:inherit;background:0 0;resize:none;font-size:inherit;color:inherit}input[type=date]:-internal-autofill-selected,input[type=datetime-local]:-internal-autofill-selected,input[type=email]:-internal-autofill-selected,input[type=month]:-internal-autofill-selected,input[type=number]:-internal-autofill-selected,input[type=password]:-internal-autofill-selected,input[type=search]:-internal-autofill-selected,input[type=tel]:-internal-autofill-selected,input[type=text]:-internal-autofill-selected,input[type=time]:-internal-autofill-selected,input[type=url]:-internal-autofill-selected,select:-internal-autofill-selected,textarea:-internal-autofill-selected{background-color:transparent!important;transition:background-color 5000s ease-in-out 0s!important}input[type=date]:-webkit-autofill,input[type=datetime-local]:-webkit-autofill,input[type=email]:-webkit-autofill,input[type=month]:-webkit-autofill,input[type=number]:-webkit-autofill,input[type=password]:-webkit-autofill,input[type=search]:-webkit-autofill,input[type=tel]:-webkit-autofill,input[type=text]:-webkit-autofill,input[type=time]:-webkit-autofill,input[type=url]:-webkit-autofill,select:-webkit-autofill,textarea:-webkit-autofill{background-color:transparent!important;-webkit-transition:background-color 5000s ease-in-out 0s!important;transition:background-color 5000s ease-in-out 0s!important}input[type=date]:-webkit-autofill-and-obscured,input[type=date]:autofill,input[type=datetime-local]:-webkit-autofill-and-obscured,input[type=datetime-local]:autofill,input[type=email]:-webkit-autofill-and-obscured,input[type=email]:autofill,input[type=month]:-webkit-autofill-and-obscured,input[type=month]:autofill,input[type=number]:-webkit-autofill-and-obscured,input[type=number]:autofill,input[type=password]:-webkit-autofill-and-obscured,input[type=password]:autofill,input[type=search]:-webkit-autofill-and-obscured,input[type=search]:autofill,input[type=tel]:-webkit-autofill-and-obscured,input[type=tel]:autofill,input[type=text]:-webkit-autofill-and-obscured,input[type=text]:autofill,input[type=time]:-webkit-autofill-and-obscured,input[type=time]:autofill,input[type=url]:-webkit-autofill-and-obscured,input[type=url]:autofill,select:-webkit-autofill-and-obscured,select:autofill,textarea:-webkit-autofill-and-obscured,textarea:autofill{background-color:transparent!important;-webkit-transition:background-color 5000s ease-in-out 0s!important;transition:background-color 5000s ease-in-out 0s!important}.textarea-resizable-shadow{opacity:0;position:absolute;z-index:-1000;pointer-events:none;left:-1000px;top:-1000px;visibility:hidden}.list input[type=date],.list input[type=datetime-local],.list input[type=email],.list input[type=month],.list input[type=number],.list input[type=password],.list input[type=search],.list input[type=tel],.list input[type=text],.list input[type=time],.list input[type=url],.list select{width:100%;height:var(--f7-input-height);color:var(--f7-input-text-color);font-size:var(--f7-input-font-size);background-color:var(--f7-input-bg-color,transparent);padding-left:var(--f7-input-padding-left);padding-right:var(--f7-input-padding-right)}.list input[type=date]::placeholder,.list input[type=datetime-local]::placeholder,.list input[type=email]::placeholder,.list input[type=month]::placeholder,.list input[type=number]::placeholder,.list input[type=password]::placeholder,.list input[type=search]::placeholder,.list input[type=tel]::placeholder,.list input[type=text]::placeholder,.list input[type=time]::placeholder,.list input[type=url]::placeholder,.list select::placeholder{color:var(--f7-input-placeholder-color)}.list textarea{width:100%;color:var(--f7-input-text-color);font-size:var(--f7-input-font-size);resize:none;line-height:1.4;height:var(--f7-textarea-height);background-color:var(--f7-input-bg-color,transparent);padding-top:var(--f7-textarea-padding-vertical);padding-bottom:var(--f7-textarea-padding-vertical);padding-left:var(--f7-input-padding-left);padding-right:var(--f7-input-padding-right)}.list textarea::placeholder{color:var(--f7-input-placeholder-color)}.list textarea.resizable{height:calc(var(--f7-input-height) + var(--f7-textarea-padding-vertical) * 2)}.list input[type=date],.list input[type=datetime-local],.list input[type=month],.list input[type=time]{line-height:var(--f7-input-height)}.list input[type=date],.list input[type=datetime-local],.list input[type=month]{text-align:right;flex-direction:row-reverse;width:auto}.list .item-floating-label,.list .item-label{width:auto;vertical-align:top;flex-shrink:0;font-size:var(--f7-label-font-size);font-weight:var(--f7-label-font-weight);line-height:var(--f7-label-height);color:var(--f7-label-text-color);transition-duration:.2s;transition-property:transform,color}.list .item-floating-label{color:var(--f7-input-placeholder-color);max-width:calc(100% / var(--f7-floating-label-scale));pointer-events:none;right:var(--f7-input-padding-right);transform-origin:right center}.list .item-floating-label~.item-input-wrap input::placeholder,.list .item-floating-label~.item-input-wrap textarea::placeholder{opacity:0;transition-duration:.1s}.list .item-floating-label~.item-input-wrap input.input-focused::placeholder,.list .item-floating-label~.item-input-wrap textarea.input-focused::placeholder{opacity:1;transition-duration:.3s}.list .item-input-with-value .item-floating-label{color:var(--f7-label-text-color)}.list .item-input-focused .item-floating-label,.list .item-input-with-value .item-floating-label{transform:scale(1) translateY(0)!important}.list .item-input-wrap{width:100%;flex-shrink:1;position:relative}.input,.item-input{position:relative}.item-input .item-inner{display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.input-error-message,.item-input-error-message{font-size:var(--f7-input-error-font-size);line-height:var(--f7-input-error-line-height);color:var(--f7-input-error-text-color);font-weight:var(--f7-input-error-font-weight);display:none;box-sizing:border-box}.input-info,.item-input-info{font-size:var(--f7-input-info-font-size);line-height:var(--f7-input-info-line-height);color:var(--f7-input-info-text-color)}.input-invalid .input-error-message,.input-invalid .item-input-error-message,.item-input-invalid .input-error-message,.item-input-invalid .item-input-error-message{display:block}.input-invalid .input-info,.input-invalid .item-input-info,.item-input-invalid .input-info,.item-input-invalid .item-input-info{display:none}.input{position:relative}.input input,.input select,.input textarea{width:100%}.input-clear-button{opacity:0;pointer-events:none;visibility:hidden;transition-duration:.1s;position:absolute;top:50%;border:none;padding:0;margin:0;outline:0;z-index:1;cursor:pointer;background:0 0;width:var(--f7-input-clear-button-size);height:var(--f7-input-clear-button-size);margin-top:calc(-1 * var(--f7-input-clear-button-size)/ 2);color:var(--f7-input-clear-button-color);left:0}.input-clear-button:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px}.input-clear-button:before{position:absolute;content:'';left:50%;top:50%}.item-input-wrap .input-clear-button{top:calc(var(--f7-input-height)/ 2)}.input-clear-button.active-state{opacity:.75!important}.input-with-value .input-clear-button,.input-with-value~.input-clear-button,.item-input-with-value .input-clear-button{opacity:1;pointer-events:auto;visibility:visible}.input-dropdown,.input-dropdown-wrap{position:relative}.input-dropdown-wrap:before,.input-dropdown:before{content:'';pointer-events:none;position:absolute;top:50%;margin-top:-2px;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #727272;left:6px}.input-dropdown input,.input-dropdown select,.input-dropdown textarea,.input-dropdown-wrap input,.input-dropdown-wrap select,.input-dropdown-wrap textarea{padding-left:calc(20px + var(--f7-input-padding-left))}.input-outline::after,.item-input-outline .item-content::after,.item-input-outline.item-content::after{content:'';position:absolute;left:0;right:0;top:8px;bottom:8px;border:1px solid var(--f7-input-outline-border-color);border-radius:var(--f7-input-outline-border-radius);pointer-events:none;box-sizing:border-box;transition-duration:.2s}.input-outline .item-floating-label,.input-outline .item-label,.item-input-outline .item-content .item-floating-label,.item-input-outline .item-content .item-label,.item-input-outline.item-content .item-floating-label,.item-input-outline.item-content .item-label{pointer-events:none;background:var(--f7-page-bg-color);z-index:1;padding:4px}.input-outline.input-focused::after,.input-outline.item-input-focused::after,.item-input-outline .item-content.input-focused::after,.item-input-outline .item-content.item-input-focused::after,.item-input-outline.item-content.input-focused::after,.item-input-outline.item-content.item-input-focused::after{border-width:2px;border-color:var(--f7-input-outline-invalid-border-color,var(--f7-theme-color))}.input-outline.input-invalid::after,.input-outline.item-input-invalid::after,.item-input-outline .item-content.input-invalid::after,.item-input-outline .item-content.item-input-invalid::after,.item-input-outline.item-content.input-invalid::after,.item-input-outline.item-content.item-input-invalid::after{border-width:2px;border-color:var(--f7-input-outline-invalid-border-color,var(--f7-input-error-text-color))}.block-strong .item-input-outline .item-floating-label,.block-strong .item-input-outline .item-label,.ios .block-strong-ios .item-input-outline .item-floating-label,.ios .block-strong-ios .item-input-outline .item-label,.md .block-strong-md .item-input-outline .item-floating-label,.md .block-strong-md .item-input-outline .item-label{background:var(--f7-block-strong-bg-color)!important}.ios .list-strong-ios .item-input-outline .item-floating-label,.ios .list-strong-ios .item-input-outline .item-label,.list-strong .item-input-outline .item-floating-label,.list-strong .item-input-outline .item-label,.md .list-strong-md .item-input-outline .item-floating-label,.md .list-strong-md .item-input-outline .item-label{background:var(--f7-list-strong-bg-color)!important}.dark option{background-color:var(--f7-page-bg-color)}.ios .item-floating-label+.item-input-wrap,.ios .item-label+.item-input-wrap{margin-top:0}.ios .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc(var(--f7-label-height) + 25%))}.ios .item-input-focused .item-floating-label{color:var(--f7-label-text-color)}.ios .item-input .item-media{align-self:flex-start}.ios .item-input-wrap{margin-top:calc(-1 * var(--f7-list-item-padding-vertical));margin-bottom:calc(-1 * var(--f7-list-item-padding-vertical))}.ios .item-input:not(.item-input-outline) .item-content,.ios .item-input:not(.item-input-outline).item-content{background:var(--f7-input-item-bg-color)}.ios .input-error-message,.ios .input-info,.ios .item-input-error-message,.ios .item-input-info{position:relative;margin-bottom:6px;margin-top:-8px}.ios .item-input-focused .item-floating-label,.ios .item-input-focused .item-label{color:var(--f7-label-focused-text-color,var(--f7-label-text-color))}.ios .item-input-focused .item-inner:after{background:var(--f7-input-focused-border-color,var(--f7-list-item-border-color))}.ios .item-input-invalid .item-floating-label,.ios .item-input-invalid .item-label{color:var(--f7-label-invalid-text-color,var(--f7-label-text-color))}.ios .item-input-invalid .item-inner:after{background:var(--f7-input-invalid-border-color,var(--f7-list-item-border-color))}.ios .input-invalid input,.ios .input-invalid select,.ios .input-invalid textarea,.ios .item-input-invalid input,.ios .item-input-invalid select,.ios .item-input-invalid textarea{color:var(--f7-input-invalid-text-color,var(--f7-input-error-text-color))}.ios .input-clear-button:after{content:'delete_round_ios';font-size:calc(var(--f7-input-clear-button-size) / (14 / 10));line-height:1.4}.ios .input-clear-button:before{width:44px;height:44px;margin-left:-22px;margin-top:-22px}.ios .item-input-outline .item-content,.ios .item-input-outline.item-content{padding-top:8px;padding-bottom:8px;margin-left:16px;margin-right:16px}.ios li.item-input-outline:first-child,.ios li:first-child>.item-input-outline{padding-top:16px}.ios li.item-input-outline:first-child::after,.ios li:first-child>.item-input-outline::after{top:16px}.ios li.item-input-outline:last-child,.ios li:last-child>.item-input-outline{padding-bottom:16px}.ios li.item-input-outline:last-child::after,.ios li:last-child>.item-input-outline::after{bottom:16px}.ios .input-outline .item-inner,.ios .item-input-outline .item-content .item-inner,.ios .item-input-outline.item-content .item-inner{display:block;padding-top:0px;padding-bottom:0px}.ios .input-outline .item-input-wrap,.ios .item-input-outline .item-content .item-input-wrap,.ios .item-input-outline.item-content .item-input-wrap{margin-top:-22px}.ios .input-outline .item-floating-label,.ios .input-outline .item-label,.ios .item-input-outline .item-content .item-floating-label,.ios .item-input-outline .item-content .item-label,.ios .item-input-outline.item-content .item-floating-label,.ios .item-input-outline.item-content .item-label{display:inline-flex;margin:-8px -4px -4px;top:-4px}.ios .input-outline .item-floating-label,.ios .item-input-outline .item-content .item-floating-label,.ios .item-input-outline.item-content .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc(var(--f7-label-height)))}.md .item-input-wrap{min-height:var(--f7-input-height)}.md .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc((var(--f7-input-height)/ 2)/ var(--f7-floating-label-scale)))}.md .item-input .item-inner:after{display:none!important}.md .item-input .item-content,.md .item-input.item-content{margin-left:16px;margin-right:16px;padding-top:8px;padding-bottom:8px}.md .input:after{content:'';position:absolute;background-color:var(--f7-input-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.md .input::after{transform:scaleY(1)!important;transition-duration:.2s;bottom:0px}.md .input.input-focused::after{transform:scaleY(2)!important;background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .input.input-invalid::after{transform:scaleY(2)!important;background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .item-input:not(.item-input-outline) .item-content:after,.md .item-input:not(.item-input-outline).item-content:after{content:'';position:absolute;background-color:var(--f7-input-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.md .item-input:not(.item-input-outline) .item-content::before,.md .item-input:not(.item-input-outline).item-content::before{content:'';position:absolute;left:0;top:8px;bottom:8px;right:0;border-radius:var(--f7-input-item-border-radius);background:var(--f7-input-item-bg-color);pointer-events:none}.md .item-input:not(.item-input-outline) .item-content::after,.md .item-input:not(.item-input-outline).item-content::after{transform:scaleY(1)!important;transition-duration:.2s;bottom:8px}.md .item-input:not(.item-input-outline) .item-content.item-input-focused::after,.md .item-input:not(.item-input-outline).item-content.item-input-focused::after{transform:scaleY(2)!important;background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .item-input:not(.item-input-outline) .item-content.input-invalid::after,.md .item-input:not(.item-input-outline) .item-content.item-input-invalid::after,.md .item-input:not(.item-input-outline).item-content.input-invalid::after,.md .item-input:not(.item-input-outline).item-content.item-input-invalid::after{transform:scaleY(2)!important;background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .input-outline .item-inner,.md .item-input-outline .item-content .item-inner,.md .item-input-outline.item-content .item-inner{padding-top:16px;padding-bottom:16px}.md .input-outline .item-floating-label,.md .input-outline .item-label,.md .item-input-outline .item-content .item-floating-label,.md .item-input-outline .item-content .item-label,.md .item-input-outline.item-content .item-floating-label,.md .item-input-outline.item-content .item-label{--label-height:calc(var(--f7-label-height) + 8px);margin:calc(0px - 16px - var(--label-height)/ 2) -4px 4px}.md .input-outline .item-floating-label,.md .item-input-outline .item-content .item-floating-label,.md .item-input-outline.item-content .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc((var(--f7-input-height)/ 2) + 8px))}.md .input-with-error-message,.md .input-with-info,.md .item-input-with-error-message,.md .item-input-with-info{padding-bottom:24px!important}.md .input-error-message,.md .input-info,.md .item-input-error-message,.md .item-input-info{position:absolute;top:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;right:0}.md .item-input-focused .item-floating-label,.md .item-input-focused .item-label{color:var(--f7-label-focused-text-color,var(--f7-theme-color))}.md .input-focused:not(.input-outline):after,.md .item-input-focused:not(.item-input-outline) .item-input-wrap:after{background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .input-focused:not(.input-outline):after,.md .input-invalid:not(.input-outline):after,.md .item-input-focused:not(.item-input-outline) .item-input-wrap:after,.md .item-input-invalid:not(.item-input-outline) .item-input-wrap:after{transform:scaleY(2)!important}.md .input-invalid:not(.input-outline):after,.md .item-input-invalid:not(.item-input-outline) .item-input-wrap:after{background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .item-input-invalid .item-floating-label,.md .item-input-invalid .item-label{color:var(--f7-label-invalid-text-color,var(--f7-input-error-text-color))}.md .input-invalid input,.md .input-invalid select,.md .input-invalid textarea,.md .item-input-invalid input,.md .item-input-invalid select,.md .item-input-invalid textarea{color:var(--f7-input-invalid-text-color,var(--f7-input-text-color))}.md .input-clear-button:after{font-size:var(--f7-input-clear-button-size);content:'delete_round_md';line-height:1}.md .input-clear-button:before{width:48px;height:48px;margin-left:-24px;margin-top:-24px}
package/components/input/input.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-input-bg-color:transparent;--f7-label-font-weight:400;--f7-label-height:16px;--f7-label-font-size:12px;--f7-floating-label-scale:calc(16 / 12);--f7-input-padding-left:0px;--f7-input-padding-right:0px;--f7-input-error-text-color:#ff3b30;--f7-input-error-font-size:12px;--f7-input-error-line-height:1.4;--f7-input-error-font-weight:400;--f7-input-info-font-size:12px;--f7-input-info-line-height:1.4;--f7-textarea-height:100px}.ios{--f7-input-item-bg-color:transparent;--f7-input-item-border-radius:0px;--f7-input-height:40px;--f7-input-font-size:16px;--f7-input-placeholder-color:#a9a9a9;--f7-textarea-padding-vertical:8px;--f7-label-text-color:inherit;--f7-input-clear-button-size:14px;--f7-input-outline-border-radius:8px;--f7-input-text-color:#000000;--f7-input-info-text-color:rgba(0, 0, 0, 0.45);--f7-input-clear-button-color:rgba(0, 0, 0, 0.45);--f7-input-outline-border-color:#bbb}.ios .dark,.ios.dark{--f7-input-text-color:#fff;--f7-input-info-text-color:rgba(255, 255, 255, 0.55);--f7-input-clear-button-color:rgba(255, 255, 255, 0.5);--f7-input-outline-border-color:#444}.md{--f7-input-item-border-radius:4px 4px 0 0;--f7-input-height:24px;--f7-input-font-size:16px;--f7-textarea-padding-vertical:0px;--f7-input-outline-border-radius:4px;--f7-floating-label-scale:calc(16 / 12);--f7-input-clear-button-size:24px;--f7-input-info-text-color:rgba(0, 0, 0, 0.45)}.md .dark,.md.dark{--f7-input-info-text-color:rgba(255, 255, 255, 0.45)}.md,.md .dark,.md [class*=color-]{--f7-input-placeholder-color:var(--f7-md-on-surface-variant);--f7-input-item-bg-color:var(--f7-md-surface-variant);--f7-input-border-color:var(--f7-md-outline);--f7-input-clear-button-color:var(--f7-md-on-surface-variant);--f7-input-outline-border-color:var(--f7-md-outline);--f7-input-text-color:var(--f7-md-on-surface);--f7-label-text-color:var(--f7-md-on-surface-variant)}input[type=date],input[type=datetime-local],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],select,textarea{box-sizing:border-box;-webkit-appearance:none;appearance:none;border:none;box-shadow:none;border-radius:0;outline:0;display:block;padding:0;margin:0;font-family:inherit;background:0 0;resize:none;font-size:inherit;color:inherit}input[type=date]:-internal-autofill-selected,input[type=datetime-local]:-internal-autofill-selected,input[type=email]:-internal-autofill-selected,input[type=month]:-internal-autofill-selected,input[type=number]:-internal-autofill-selected,input[type=password]:-internal-autofill-selected,input[type=search]:-internal-autofill-selected,input[type=tel]:-internal-autofill-selected,input[type=text]:-internal-autofill-selected,input[type=time]:-internal-autofill-selected,input[type=url]:-internal-autofill-selected,select:-internal-autofill-selected,textarea:-internal-autofill-selected{background-color:transparent!important;transition:background-color 5000s ease-in-out 0s!important}input[type=date]:-webkit-autofill,input[type=datetime-local]:-webkit-autofill,input[type=email]:-webkit-autofill,input[type=month]:-webkit-autofill,input[type=number]:-webkit-autofill,input[type=password]:-webkit-autofill,input[type=search]:-webkit-autofill,input[type=tel]:-webkit-autofill,input[type=text]:-webkit-autofill,input[type=time]:-webkit-autofill,input[type=url]:-webkit-autofill,select:-webkit-autofill,textarea:-webkit-autofill{background-color:transparent!important;-webkit-transition:background-color 5000s ease-in-out 0s!important;transition:background-color 5000s ease-in-out 0s!important}input[type=date]:-webkit-autofill-and-obscured,input[type=date]:autofill,input[type=datetime-local]:-webkit-autofill-and-obscured,input[type=datetime-local]:autofill,input[type=email]:-webkit-autofill-and-obscured,input[type=email]:autofill,input[type=month]:-webkit-autofill-and-obscured,input[type=month]:autofill,input[type=number]:-webkit-autofill-and-obscured,input[type=number]:autofill,input[type=password]:-webkit-autofill-and-obscured,input[type=password]:autofill,input[type=search]:-webkit-autofill-and-obscured,input[type=search]:autofill,input[type=tel]:-webkit-autofill-and-obscured,input[type=tel]:autofill,input[type=text]:-webkit-autofill-and-obscured,input[type=text]:autofill,input[type=time]:-webkit-autofill-and-obscured,input[type=time]:autofill,input[type=url]:-webkit-autofill-and-obscured,input[type=url]:autofill,select:-webkit-autofill-and-obscured,select:autofill,textarea:-webkit-autofill-and-obscured,textarea:autofill{background-color:transparent!important;-webkit-transition:background-color 5000s ease-in-out 0s!important;transition:background-color 5000s ease-in-out 0s!important}.textarea-resizable-shadow{opacity:0;position:absolute;z-index:-1000;pointer-events:none;left:-1000px;top:-1000px;visibility:hidden}.list input[type=date],.list input[type=datetime-local],.list input[type=email],.list input[type=month],.list input[type=number],.list input[type=password],.list input[type=search],.list input[type=tel],.list input[type=text],.list input[type=time],.list input[type=url],.list select{width:100%;height:var(--f7-input-height);color:var(--f7-input-text-color);font-size:var(--f7-input-font-size);background-color:var(--f7-input-bg-color,transparent);padding-left:var(--f7-input-padding-left);padding-right:var(--f7-input-padding-right)}.list input[type=date]::placeholder,.list input[type=datetime-local]::placeholder,.list input[type=email]::placeholder,.list input[type=month]::placeholder,.list input[type=number]::placeholder,.list input[type=password]::placeholder,.list input[type=search]::placeholder,.list input[type=tel]::placeholder,.list input[type=text]::placeholder,.list input[type=time]::placeholder,.list input[type=url]::placeholder,.list select::placeholder{color:var(--f7-input-placeholder-color)}.list textarea{width:100%;color:var(--f7-input-text-color);font-size:var(--f7-input-font-size);resize:none;line-height:1.4;height:var(--f7-textarea-height);background-color:var(--f7-input-bg-color,transparent);padding-top:var(--f7-textarea-padding-vertical);padding-bottom:var(--f7-textarea-padding-vertical);padding-left:var(--f7-input-padding-left);padding-right:var(--f7-input-padding-right)}.list textarea::placeholder{color:var(--f7-input-placeholder-color)}.list textarea.resizable{height:calc(var(--f7-input-height) + var(--f7-textarea-padding-vertical) * 2)}.list input[type=datetime-local]{max-width:50vw}.list input[type=date],.list input[type=datetime-local],.list input[type=month],.list input[type=time]{line-height:var(--f7-input-height)}.list .item-floating-label,.list .item-label{width:auto;vertical-align:top;flex-shrink:0;font-size:var(--f7-label-font-size);font-weight:var(--f7-label-font-weight);line-height:var(--f7-label-height);color:var(--f7-label-text-color);transition-duration:.2s;transition-property:transform,color}.list .item-floating-label{color:var(--f7-input-placeholder-color);max-width:calc(100% / var(--f7-floating-label-scale));pointer-events:none;left:var(--f7-input-padding-left);transform-origin:left center}.list .item-floating-label~.item-input-wrap input::placeholder,.list .item-floating-label~.item-input-wrap textarea::placeholder{opacity:0;transition-duration:.1s}.list .item-floating-label~.item-input-wrap input.input-focused::placeholder,.list .item-floating-label~.item-input-wrap textarea.input-focused::placeholder{opacity:1;transition-duration:.3s}.list .item-input-with-value .item-floating-label{color:var(--f7-label-text-color)}.list .item-input-focused .item-floating-label,.list .item-input-with-value .item-floating-label{transform:scale(1) translateY(0)!important}.list .item-input-wrap{width:100%;flex-shrink:1;position:relative}.input,.item-input{position:relative}.item-input .item-inner{display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.input-error-message,.item-input-error-message{font-size:var(--f7-input-error-font-size);line-height:var(--f7-input-error-line-height);color:var(--f7-input-error-text-color);font-weight:var(--f7-input-error-font-weight);display:none;box-sizing:border-box}.input-info,.item-input-info{font-size:var(--f7-input-info-font-size);line-height:var(--f7-input-info-line-height);color:var(--f7-input-info-text-color)}.input-invalid .input-error-message,.input-invalid .item-input-error-message,.item-input-invalid .input-error-message,.item-input-invalid .item-input-error-message{display:block}.input-invalid .input-info,.input-invalid .item-input-info,.item-input-invalid .input-info,.item-input-invalid .item-input-info{display:none}.input{position:relative}.input input,.input select,.input textarea{width:100%}.input-clear-button{opacity:0;pointer-events:none;visibility:hidden;transition-duration:.1s;position:absolute;top:50%;border:none;padding:0;margin:0;outline:0;z-index:1;cursor:pointer;background:0 0;width:var(--f7-input-clear-button-size);height:var(--f7-input-clear-button-size);margin-top:calc(-1 * var(--f7-input-clear-button-size)/ 2);color:var(--f7-input-clear-button-color);right:0}.input-clear-button:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px}.input-clear-button:before{position:absolute;content:'';left:50%;top:50%}.item-input-wrap .input-clear-button{top:calc(var(--f7-input-height)/ 2)}.input-clear-button.active-state{opacity:.75!important}.input-with-value .input-clear-button,.input-with-value~.input-clear-button,.item-input-with-value .input-clear-button{opacity:1;pointer-events:auto;visibility:visible}.input-dropdown,.input-dropdown-wrap{position:relative}.input-dropdown-wrap:before,.input-dropdown:before{content:'';pointer-events:none;position:absolute;top:50%;margin-top:-2px;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #727272;right:6px}.input-dropdown input,.input-dropdown select,.input-dropdown textarea,.input-dropdown-wrap input,.input-dropdown-wrap select,.input-dropdown-wrap textarea{padding-right:calc(20px + var(--f7-input-padding-right))}.input-outline::after,.item-input-outline .item-content::after,.item-input-outline.item-content::after{content:'';position:absolute;left:0;right:0;top:8px;bottom:8px;border:1px solid var(--f7-input-outline-border-color);border-radius:var(--f7-input-outline-border-radius);pointer-events:none;box-sizing:border-box;transition-duration:.2s}.input-outline .item-floating-label,.input-outline .item-label,.item-input-outline .item-content .item-floating-label,.item-input-outline .item-content .item-label,.item-input-outline.item-content .item-floating-label,.item-input-outline.item-content .item-label{pointer-events:none;background:var(--f7-page-bg-color);z-index:1;padding:4px}.input-outline.input-focused::after,.input-outline.item-input-focused::after,.item-input-outline .item-content.input-focused::after,.item-input-outline .item-content.item-input-focused::after,.item-input-outline.item-content.input-focused::after,.item-input-outline.item-content.item-input-focused::after{border-width:2px;border-color:var(--f7-input-outline-invalid-border-color,var(--f7-theme-color))}.input-outline.input-invalid::after,.input-outline.item-input-invalid::after,.item-input-outline .item-content.input-invalid::after,.item-input-outline .item-content.item-input-invalid::after,.item-input-outline.item-content.input-invalid::after,.item-input-outline.item-content.item-input-invalid::after{border-width:2px;border-color:var(--f7-input-outline-invalid-border-color,var(--f7-input-error-text-color))}.block-strong .item-input-outline .item-floating-label,.block-strong .item-input-outline .item-label,.ios .block-strong-ios .item-input-outline .item-floating-label,.ios .block-strong-ios .item-input-outline .item-label,.md .block-strong-md .item-input-outline .item-floating-label,.md .block-strong-md .item-input-outline .item-label{background:var(--f7-block-strong-bg-color)!important}.ios .list-strong-ios .item-input-outline .item-floating-label,.ios .list-strong-ios .item-input-outline .item-label,.list-strong .item-input-outline .item-floating-label,.list-strong .item-input-outline .item-label,.md .list-strong-md .item-input-outline .item-floating-label,.md .list-strong-md .item-input-outline .item-label{background:var(--f7-list-strong-bg-color)!important}.dark option{background-color:var(--f7-page-bg-color)}.ios .item-floating-label+.item-input-wrap,.ios .item-label+.item-input-wrap{margin-top:0}.ios .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc(var(--f7-label-height) + 25%))}.ios .item-input-focused .item-floating-label{color:var(--f7-label-text-color)}.ios .item-input .item-media{align-self:flex-start}.ios .item-input-wrap{margin-top:calc(-1 * var(--f7-list-item-padding-vertical));margin-bottom:calc(-1 * var(--f7-list-item-padding-vertical))}.ios .item-input:not(.item-input-outline) .item-content,.ios .item-input:not(.item-input-outline).item-content{background:var(--f7-input-item-bg-color)}.ios .input-error-message,.ios .input-info,.ios .item-input-error-message,.ios .item-input-info{position:relative;margin-bottom:6px;margin-top:-8px}.ios .item-input-focused .item-floating-label,.ios .item-input-focused .item-label{color:var(--f7-label-focused-text-color,var(--f7-label-text-color))}.ios .item-input-focused .item-inner:after{background:var(--f7-input-focused-border-color,var(--f7-list-item-border-color))}.ios .item-input-invalid .item-floating-label,.ios .item-input-invalid .item-label{color:var(--f7-label-invalid-text-color,var(--f7-label-text-color))}.ios .item-input-invalid .item-inner:after{background:var(--f7-input-invalid-border-color,var(--f7-list-item-border-color))}.ios .input-invalid input,.ios .input-invalid select,.ios .input-invalid textarea,.ios .item-input-invalid input,.ios .item-input-invalid select,.ios .item-input-invalid textarea{color:var(--f7-input-invalid-text-color,var(--f7-input-error-text-color))}.ios .input-clear-button:after{content:'delete_round_ios';font-size:calc(var(--f7-input-clear-button-size) / (14 / 10));line-height:1.4}.ios .input-clear-button:before{width:44px;height:44px;margin-left:-22px;margin-top:-22px}.ios .item-input-outline .item-content,.ios .item-input-outline.item-content{padding-top:8px;padding-bottom:8px;margin-left:16px;margin-right:16px}.ios li.item-input-outline:first-child,.ios li:first-child>.item-input-outline{padding-top:16px}.ios li.item-input-outline:first-child::after,.ios li:first-child>.item-input-outline::after{top:16px}.ios li.item-input-outline:last-child,.ios li:last-child>.item-input-outline{padding-bottom:16px}.ios li.item-input-outline:last-child::after,.ios li:last-child>.item-input-outline::after{bottom:16px}.ios .input-outline .item-inner,.ios .item-input-outline .item-content .item-inner,.ios .item-input-outline.item-content .item-inner{display:block;padding-top:0px;padding-bottom:0px}.ios .input-outline .item-input-wrap,.ios .item-input-outline .item-content .item-input-wrap,.ios .item-input-outline.item-content .item-input-wrap{margin-top:-22px}.ios .input-outline .item-floating-label,.ios .input-outline .item-label,.ios .item-input-outline .item-content .item-floating-label,.ios .item-input-outline .item-content .item-label,.ios .item-input-outline.item-content .item-floating-label,.ios .item-input-outline.item-content .item-label{display:inline-flex;margin:-8px -4px -4px;top:-4px}.ios .input-outline .item-floating-label,.ios .item-input-outline .item-content .item-floating-label,.ios .item-input-outline.item-content .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc(var(--f7-label-height)))}.md .item-input-wrap{min-height:var(--f7-input-height)}.md .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc((var(--f7-input-height)/ 2)/ var(--f7-floating-label-scale)))}.md .item-input .item-inner:after{display:none!important}.md .item-input .item-content,.md .item-input.item-content{margin-left:16px;margin-right:16px;padding-top:8px;padding-bottom:8px}.md .input:after{content:'';position:absolute;background-color:var(--f7-input-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.md .input::after{transform:scaleY(1)!important;transition-duration:.2s;bottom:0px}.md .input.input-focused::after{transform:scaleY(2)!important;background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .input.input-invalid::after{transform:scaleY(2)!important;background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .item-input:not(.item-input-outline) .item-content:after,.md .item-input:not(.item-input-outline).item-content:after{content:'';position:absolute;background-color:var(--f7-input-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.md .item-input:not(.item-input-outline) .item-content::before,.md .item-input:not(.item-input-outline).item-content::before{content:'';position:absolute;left:0;top:8px;bottom:8px;right:0;border-radius:var(--f7-input-item-border-radius);background:var(--f7-input-item-bg-color);pointer-events:none}.md .item-input:not(.item-input-outline) .item-content::after,.md .item-input:not(.item-input-outline).item-content::after{transform:scaleY(1)!important;transition-duration:.2s;bottom:8px}.md .item-input:not(.item-input-outline) .item-content.item-input-focused::after,.md .item-input:not(.item-input-outline).item-content.item-input-focused::after{transform:scaleY(2)!important;background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .item-input:not(.item-input-outline) .item-content.input-invalid::after,.md .item-input:not(.item-input-outline) .item-content.item-input-invalid::after,.md .item-input:not(.item-input-outline).item-content.input-invalid::after,.md .item-input:not(.item-input-outline).item-content.item-input-invalid::after{transform:scaleY(2)!important;background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .input-outline .item-inner,.md .item-input-outline .item-content .item-inner,.md .item-input-outline.item-content .item-inner{padding-top:16px;padding-bottom:16px}.md .input-outline .item-floating-label,.md .input-outline .item-label,.md .item-input-outline .item-content .item-floating-label,.md .item-input-outline .item-content .item-label,.md .item-input-outline.item-content .item-floating-label,.md .item-input-outline.item-content .item-label{--label-height:calc(var(--f7-label-height) + 8px);margin:calc(0px - 16px - var(--label-height)/ 2) -4px 4px}.md .input-outline .item-floating-label,.md .item-input-outline .item-content .item-floating-label,.md .item-input-outline.item-content .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc((var(--f7-input-height)/ 2) + 8px))}.md .input-with-error-message,.md .input-with-info,.md .item-input-with-error-message,.md .item-input-with-info{padding-bottom:24px!important}.md .input-error-message,.md .input-info,.md .item-input-error-message,.md .item-input-info{position:absolute;top:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;left:0}.md .item-input-focused .item-floating-label,.md .item-input-focused .item-label{color:var(--f7-label-focused-text-color,var(--f7-theme-color))}.md .input-focused:not(.input-outline):after,.md .item-input-focused:not(.item-input-outline) .item-input-wrap:after{background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .input-focused:not(.input-outline):after,.md .input-invalid:not(.input-outline):after,.md .item-input-focused:not(.item-input-outline) .item-input-wrap:after,.md .item-input-invalid:not(.item-input-outline) .item-input-wrap:after{transform:scaleY(2)!important}.md .input-invalid:not(.input-outline):after,.md .item-input-invalid:not(.item-input-outline) .item-input-wrap:after{background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .item-input-invalid .item-floating-label,.md .item-input-invalid .item-label{color:var(--f7-label-invalid-text-color,var(--f7-input-error-text-color))}.md .input-invalid input,.md .input-invalid select,.md .input-invalid textarea,.md .item-input-invalid input,.md .item-input-invalid select,.md .item-input-invalid textarea{color:var(--f7-input-invalid-text-color,var(--f7-input-text-color))}.md .input-clear-button:after{font-size:var(--f7-input-clear-button-size);content:'delete_round_md';line-height:1}.md .input-clear-button:before{width:48px;height:48px;margin-left:-24px;margin-top:-24px}
1
+ :root{--f7-input-bg-color:transparent;--f7-label-font-weight:400;--f7-label-height:16px;--f7-label-font-size:12px;--f7-floating-label-scale:calc(16 / 12);--f7-input-padding-left:0px;--f7-input-padding-right:0px;--f7-input-error-text-color:#ff3b30;--f7-input-error-font-size:12px;--f7-input-error-line-height:1.4;--f7-input-error-font-weight:400;--f7-input-info-font-size:12px;--f7-input-info-line-height:1.4;--f7-textarea-height:100px}.ios{--f7-input-item-bg-color:transparent;--f7-input-item-border-radius:0px;--f7-input-height:40px;--f7-input-font-size:16px;--f7-input-placeholder-color:#a9a9a9;--f7-textarea-padding-vertical:8px;--f7-label-text-color:inherit;--f7-input-clear-button-size:14px;--f7-input-outline-border-radius:8px;--f7-input-text-color:#000000;--f7-input-info-text-color:rgba(0, 0, 0, 0.45);--f7-input-clear-button-color:rgba(0, 0, 0, 0.45);--f7-input-outline-border-color:#bbb}.ios .dark,.ios.dark{--f7-input-text-color:#fff;--f7-input-info-text-color:rgba(255, 255, 255, 0.55);--f7-input-clear-button-color:rgba(255, 255, 255, 0.5);--f7-input-outline-border-color:#444}.md{--f7-input-item-border-radius:4px 4px 0 0;--f7-input-height:24px;--f7-input-font-size:16px;--f7-textarea-padding-vertical:0px;--f7-input-outline-border-radius:4px;--f7-floating-label-scale:calc(16 / 12);--f7-input-clear-button-size:24px;--f7-input-info-text-color:rgba(0, 0, 0, 0.45)}.md .dark,.md.dark{--f7-input-info-text-color:rgba(255, 255, 255, 0.45)}.md,.md .dark,.md [class*=color-]{--f7-input-placeholder-color:var(--f7-md-on-surface-variant);--f7-input-item-bg-color:var(--f7-md-surface-variant);--f7-input-border-color:var(--f7-md-outline);--f7-input-clear-button-color:var(--f7-md-on-surface-variant);--f7-input-outline-border-color:var(--f7-md-outline);--f7-input-text-color:var(--f7-md-on-surface);--f7-label-text-color:var(--f7-md-on-surface-variant)}input[type=date],input[type=datetime-local],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],select,textarea{box-sizing:border-box;-webkit-appearance:none;appearance:none;border:none;box-shadow:none;border-radius:0;outline:0;display:block;padding:0;margin:0;font-family:inherit;background:0 0;resize:none;font-size:inherit;color:inherit}input[type=date]:-internal-autofill-selected,input[type=datetime-local]:-internal-autofill-selected,input[type=email]:-internal-autofill-selected,input[type=month]:-internal-autofill-selected,input[type=number]:-internal-autofill-selected,input[type=password]:-internal-autofill-selected,input[type=search]:-internal-autofill-selected,input[type=tel]:-internal-autofill-selected,input[type=text]:-internal-autofill-selected,input[type=time]:-internal-autofill-selected,input[type=url]:-internal-autofill-selected,select:-internal-autofill-selected,textarea:-internal-autofill-selected{background-color:transparent!important;transition:background-color 5000s ease-in-out 0s!important}input[type=date]:-webkit-autofill,input[type=datetime-local]:-webkit-autofill,input[type=email]:-webkit-autofill,input[type=month]:-webkit-autofill,input[type=number]:-webkit-autofill,input[type=password]:-webkit-autofill,input[type=search]:-webkit-autofill,input[type=tel]:-webkit-autofill,input[type=text]:-webkit-autofill,input[type=time]:-webkit-autofill,input[type=url]:-webkit-autofill,select:-webkit-autofill,textarea:-webkit-autofill{background-color:transparent!important;-webkit-transition:background-color 5000s ease-in-out 0s!important;transition:background-color 5000s ease-in-out 0s!important}input[type=date]:-webkit-autofill-and-obscured,input[type=date]:autofill,input[type=datetime-local]:-webkit-autofill-and-obscured,input[type=datetime-local]:autofill,input[type=email]:-webkit-autofill-and-obscured,input[type=email]:autofill,input[type=month]:-webkit-autofill-and-obscured,input[type=month]:autofill,input[type=number]:-webkit-autofill-and-obscured,input[type=number]:autofill,input[type=password]:-webkit-autofill-and-obscured,input[type=password]:autofill,input[type=search]:-webkit-autofill-and-obscured,input[type=search]:autofill,input[type=tel]:-webkit-autofill-and-obscured,input[type=tel]:autofill,input[type=text]:-webkit-autofill-and-obscured,input[type=text]:autofill,input[type=time]:-webkit-autofill-and-obscured,input[type=time]:autofill,input[type=url]:-webkit-autofill-and-obscured,input[type=url]:autofill,select:-webkit-autofill-and-obscured,select:autofill,textarea:-webkit-autofill-and-obscured,textarea:autofill{background-color:transparent!important;-webkit-transition:background-color 5000s ease-in-out 0s!important;transition:background-color 5000s ease-in-out 0s!important}.textarea-resizable-shadow{opacity:0;position:absolute;z-index:-1000;pointer-events:none;left:-1000px;top:-1000px;visibility:hidden}.list input[type=date],.list input[type=datetime-local],.list input[type=email],.list input[type=month],.list input[type=number],.list input[type=password],.list input[type=search],.list input[type=tel],.list input[type=text],.list input[type=time],.list input[type=url],.list select{width:100%;height:var(--f7-input-height);color:var(--f7-input-text-color);font-size:var(--f7-input-font-size);background-color:var(--f7-input-bg-color,transparent);padding-left:var(--f7-input-padding-left);padding-right:var(--f7-input-padding-right)}.list input[type=date]::placeholder,.list input[type=datetime-local]::placeholder,.list input[type=email]::placeholder,.list input[type=month]::placeholder,.list input[type=number]::placeholder,.list input[type=password]::placeholder,.list input[type=search]::placeholder,.list input[type=tel]::placeholder,.list input[type=text]::placeholder,.list input[type=time]::placeholder,.list input[type=url]::placeholder,.list select::placeholder{color:var(--f7-input-placeholder-color)}.list textarea{width:100%;color:var(--f7-input-text-color);font-size:var(--f7-input-font-size);resize:none;line-height:1.4;height:var(--f7-textarea-height);background-color:var(--f7-input-bg-color,transparent);padding-top:var(--f7-textarea-padding-vertical);padding-bottom:var(--f7-textarea-padding-vertical);padding-left:var(--f7-input-padding-left);padding-right:var(--f7-input-padding-right)}.list textarea::placeholder{color:var(--f7-input-placeholder-color)}.list textarea.resizable{height:calc(var(--f7-input-height) + var(--f7-textarea-padding-vertical) * 2)}.list input[type=date],.list input[type=datetime-local],.list input[type=month],.list input[type=time]{line-height:var(--f7-input-height)}.list .item-floating-label,.list .item-label{width:auto;vertical-align:top;flex-shrink:0;font-size:var(--f7-label-font-size);font-weight:var(--f7-label-font-weight);line-height:var(--f7-label-height);color:var(--f7-label-text-color);transition-duration:.2s;transition-property:transform,color}.list .item-floating-label{color:var(--f7-input-placeholder-color);max-width:calc(100% / var(--f7-floating-label-scale));pointer-events:none;left:var(--f7-input-padding-left);transform-origin:left center}.list .item-floating-label~.item-input-wrap input::placeholder,.list .item-floating-label~.item-input-wrap textarea::placeholder{opacity:0;transition-duration:.1s}.list .item-floating-label~.item-input-wrap input.input-focused::placeholder,.list .item-floating-label~.item-input-wrap textarea.input-focused::placeholder{opacity:1;transition-duration:.3s}.list .item-input-with-value .item-floating-label{color:var(--f7-label-text-color)}.list .item-input-focused .item-floating-label,.list .item-input-with-value .item-floating-label{transform:scale(1) translateY(0)!important}.list .item-input-wrap{width:100%;flex-shrink:1;position:relative}.input,.item-input{position:relative}.item-input .item-inner{display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.input-error-message,.item-input-error-message{font-size:var(--f7-input-error-font-size);line-height:var(--f7-input-error-line-height);color:var(--f7-input-error-text-color);font-weight:var(--f7-input-error-font-weight);display:none;box-sizing:border-box}.input-info,.item-input-info{font-size:var(--f7-input-info-font-size);line-height:var(--f7-input-info-line-height);color:var(--f7-input-info-text-color)}.input-invalid .input-error-message,.input-invalid .item-input-error-message,.item-input-invalid .input-error-message,.item-input-invalid .item-input-error-message{display:block}.input-invalid .input-info,.input-invalid .item-input-info,.item-input-invalid .input-info,.item-input-invalid .item-input-info{display:none}.input{position:relative}.input input,.input select,.input textarea{width:100%}.input-clear-button{opacity:0;pointer-events:none;visibility:hidden;transition-duration:.1s;position:absolute;top:50%;border:none;padding:0;margin:0;outline:0;z-index:1;cursor:pointer;background:0 0;width:var(--f7-input-clear-button-size);height:var(--f7-input-clear-button-size);margin-top:calc(-1 * var(--f7-input-clear-button-size)/ 2);color:var(--f7-input-clear-button-color);right:0}.input-clear-button:after{font-family:framework7-core-icons;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';text-align:center;display:block;width:100%;height:100%;font-size:20px}.input-clear-button:before{position:absolute;content:'';left:50%;top:50%}.item-input-wrap .input-clear-button{top:calc(var(--f7-input-height)/ 2)}.input-clear-button.active-state{opacity:.75!important}.input-with-value .input-clear-button,.input-with-value~.input-clear-button,.item-input-with-value .input-clear-button{opacity:1;pointer-events:auto;visibility:visible}.input-dropdown,.input-dropdown-wrap{position:relative}.input-dropdown-wrap:before,.input-dropdown:before{content:'';pointer-events:none;position:absolute;top:50%;margin-top:-2px;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid #727272;right:6px}.input-dropdown input,.input-dropdown select,.input-dropdown textarea,.input-dropdown-wrap input,.input-dropdown-wrap select,.input-dropdown-wrap textarea{padding-right:calc(20px + var(--f7-input-padding-right))}.input-outline::after,.item-input-outline .item-content::after,.item-input-outline.item-content::after{content:'';position:absolute;left:0;right:0;top:8px;bottom:8px;border:1px solid var(--f7-input-outline-border-color);border-radius:var(--f7-input-outline-border-radius);pointer-events:none;box-sizing:border-box;transition-duration:.2s}.input-outline .item-floating-label,.input-outline .item-label,.item-input-outline .item-content .item-floating-label,.item-input-outline .item-content .item-label,.item-input-outline.item-content .item-floating-label,.item-input-outline.item-content .item-label{pointer-events:none;background:var(--f7-page-bg-color);z-index:1;padding:4px}.input-outline.input-focused::after,.input-outline.item-input-focused::after,.item-input-outline .item-content.input-focused::after,.item-input-outline .item-content.item-input-focused::after,.item-input-outline.item-content.input-focused::after,.item-input-outline.item-content.item-input-focused::after{border-width:2px;border-color:var(--f7-input-outline-invalid-border-color,var(--f7-theme-color))}.input-outline.input-invalid::after,.input-outline.item-input-invalid::after,.item-input-outline .item-content.input-invalid::after,.item-input-outline .item-content.item-input-invalid::after,.item-input-outline.item-content.input-invalid::after,.item-input-outline.item-content.item-input-invalid::after{border-width:2px;border-color:var(--f7-input-outline-invalid-border-color,var(--f7-input-error-text-color))}.block-strong .item-input-outline .item-floating-label,.block-strong .item-input-outline .item-label,.ios .block-strong-ios .item-input-outline .item-floating-label,.ios .block-strong-ios .item-input-outline .item-label,.md .block-strong-md .item-input-outline .item-floating-label,.md .block-strong-md .item-input-outline .item-label{background:var(--f7-block-strong-bg-color)!important}.ios .list-strong-ios .item-input-outline .item-floating-label,.ios .list-strong-ios .item-input-outline .item-label,.list-strong .item-input-outline .item-floating-label,.list-strong .item-input-outline .item-label,.md .list-strong-md .item-input-outline .item-floating-label,.md .list-strong-md .item-input-outline .item-label{background:var(--f7-list-strong-bg-color)!important}.dark option{background-color:var(--f7-page-bg-color)}.ios .item-floating-label+.item-input-wrap,.ios .item-label+.item-input-wrap{margin-top:0}.ios .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc(var(--f7-label-height) + 25%))}.ios .item-input-focused .item-floating-label{color:var(--f7-label-text-color)}.ios .item-input .item-media{align-self:flex-start}.ios .item-input-wrap{margin-top:calc(-1 * var(--f7-list-item-padding-vertical));margin-bottom:calc(-1 * var(--f7-list-item-padding-vertical))}.ios .item-input:not(.item-input-outline) .item-content,.ios .item-input:not(.item-input-outline).item-content{background:var(--f7-input-item-bg-color)}.ios .input-error-message,.ios .input-info,.ios .item-input-error-message,.ios .item-input-info{position:relative;margin-bottom:6px;margin-top:-8px}.ios .item-input-focused .item-floating-label,.ios .item-input-focused .item-label{color:var(--f7-label-focused-text-color,var(--f7-label-text-color))}.ios .item-input-focused .item-inner:after{background:var(--f7-input-focused-border-color,var(--f7-list-item-border-color))}.ios .item-input-invalid .item-floating-label,.ios .item-input-invalid .item-label{color:var(--f7-label-invalid-text-color,var(--f7-label-text-color))}.ios .item-input-invalid .item-inner:after{background:var(--f7-input-invalid-border-color,var(--f7-list-item-border-color))}.ios .input-invalid input,.ios .input-invalid select,.ios .input-invalid textarea,.ios .item-input-invalid input,.ios .item-input-invalid select,.ios .item-input-invalid textarea{color:var(--f7-input-invalid-text-color,var(--f7-input-error-text-color))}.ios .input-clear-button:after{content:'delete_round_ios';font-size:calc(var(--f7-input-clear-button-size) / (14 / 10));line-height:1.4}.ios .input-clear-button:before{width:44px;height:44px;margin-left:-22px;margin-top:-22px}.ios .item-input-outline .item-content,.ios .item-input-outline.item-content{padding-top:8px;padding-bottom:8px;margin-left:16px;margin-right:16px}.ios li.item-input-outline:first-child,.ios li:first-child>.item-input-outline{padding-top:16px}.ios li.item-input-outline:first-child::after,.ios li:first-child>.item-input-outline::after{top:16px}.ios li.item-input-outline:last-child,.ios li:last-child>.item-input-outline{padding-bottom:16px}.ios li.item-input-outline:last-child::after,.ios li:last-child>.item-input-outline::after{bottom:16px}.ios .input-outline .item-inner,.ios .item-input-outline .item-content .item-inner,.ios .item-input-outline.item-content .item-inner{display:block;padding-top:0px;padding-bottom:0px}.ios .input-outline .item-input-wrap,.ios .item-input-outline .item-content .item-input-wrap,.ios .item-input-outline.item-content .item-input-wrap{margin-top:-22px}.ios .input-outline .item-floating-label,.ios .input-outline .item-label,.ios .item-input-outline .item-content .item-floating-label,.ios .item-input-outline .item-content .item-label,.ios .item-input-outline.item-content .item-floating-label,.ios .item-input-outline.item-content .item-label{display:inline-flex;margin:-8px -4px -4px;top:-4px}.ios .input-outline .item-floating-label,.ios .item-input-outline .item-content .item-floating-label,.ios .item-input-outline.item-content .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc(var(--f7-label-height)))}.md .item-input-wrap{min-height:var(--f7-input-height)}.md .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc((var(--f7-input-height)/ 2)/ var(--f7-floating-label-scale)))}.md .item-input .item-inner:after{display:none!important}.md .item-input .item-content,.md .item-input.item-content{margin-left:16px;margin-right:16px;padding-top:8px;padding-bottom:8px}.md .input:after{content:'';position:absolute;background-color:var(--f7-input-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.md .input::after{transform:scaleY(1)!important;transition-duration:.2s;bottom:0px}.md .input.input-focused::after{transform:scaleY(2)!important;background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .input.input-invalid::after{transform:scaleY(2)!important;background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .item-input:not(.item-input-outline) .item-content:after,.md .item-input:not(.item-input-outline).item-content:after{content:'';position:absolute;background-color:var(--f7-input-border-color);display:block;z-index:15;top:auto;right:auto;bottom:0;left:0;height:1px;width:100%;transform-origin:50% 100%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.md .item-input:not(.item-input-outline) .item-content::before,.md .item-input:not(.item-input-outline).item-content::before{content:'';position:absolute;left:0;top:8px;bottom:8px;right:0;border-radius:var(--f7-input-item-border-radius);background:var(--f7-input-item-bg-color);pointer-events:none}.md .item-input:not(.item-input-outline) .item-content::after,.md .item-input:not(.item-input-outline).item-content::after{transform:scaleY(1)!important;transition-duration:.2s;bottom:8px}.md .item-input:not(.item-input-outline) .item-content.item-input-focused::after,.md .item-input:not(.item-input-outline).item-content.item-input-focused::after{transform:scaleY(2)!important;background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .item-input:not(.item-input-outline) .item-content.input-invalid::after,.md .item-input:not(.item-input-outline) .item-content.item-input-invalid::after,.md .item-input:not(.item-input-outline).item-content.input-invalid::after,.md .item-input:not(.item-input-outline).item-content.item-input-invalid::after{transform:scaleY(2)!important;background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .input-outline .item-inner,.md .item-input-outline .item-content .item-inner,.md .item-input-outline.item-content .item-inner{padding-top:16px;padding-bottom:16px}.md .input-outline .item-floating-label,.md .input-outline .item-label,.md .item-input-outline .item-content .item-floating-label,.md .item-input-outline .item-content .item-label,.md .item-input-outline.item-content .item-floating-label,.md .item-input-outline.item-content .item-label{--label-height:calc(var(--f7-label-height) + 8px);margin:calc(0px - 16px - var(--label-height)/ 2) -4px 4px}.md .input-outline .item-floating-label,.md .item-input-outline .item-content .item-floating-label,.md .item-input-outline.item-content .item-floating-label{transform:scale(var(--f7-floating-label-scale)) translateY(calc((var(--f7-input-height)/ 2) + 8px))}.md .input-with-error-message,.md .input-with-info,.md .item-input-with-error-message,.md .item-input-with-info{padding-bottom:24px!important}.md .input-error-message,.md .input-info,.md .item-input-error-message,.md .item-input-info{position:absolute;top:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;left:0}.md .item-input-focused .item-floating-label,.md .item-input-focused .item-label{color:var(--f7-label-focused-text-color,var(--f7-theme-color))}.md .input-focused:not(.input-outline):after,.md .item-input-focused:not(.item-input-outline) .item-input-wrap:after{background:var(--f7-input-focused-border-color,var(--f7-theme-color))}.md .input-focused:not(.input-outline):after,.md .input-invalid:not(.input-outline):after,.md .item-input-focused:not(.item-input-outline) .item-input-wrap:after,.md .item-input-invalid:not(.item-input-outline) .item-input-wrap:after{transform:scaleY(2)!important}.md .input-invalid:not(.input-outline):after,.md .item-input-invalid:not(.item-input-outline) .item-input-wrap:after{background:var(--f7-input-invalid-border-color,var(--f7-input-error-text-color))}.md .item-input-invalid .item-floating-label,.md .item-input-invalid .item-label{color:var(--f7-label-invalid-text-color,var(--f7-input-error-text-color))}.md .input-invalid input,.md .input-invalid select,.md .input-invalid textarea,.md .item-input-invalid input,.md .item-input-invalid select,.md .item-input-invalid textarea{color:var(--f7-input-invalid-text-color,var(--f7-input-text-color))}.md .input-clear-button:after{font-size:var(--f7-input-clear-button-size);content:'delete_round_md';line-height:1}.md .input-clear-button:before{width:48px;height:48px;margin-left:-24px;margin-top:-24px}
package/components/input/input.less CHANGED
@@ -90,9 +90,6 @@ textarea {
90
90
  height: calc(var(--f7-input-height) + var(--f7-textarea-padding-vertical) * 2);
91
91
  }
92
92
  }
93
- input[type='datetime-local'] {
94
- max-width: 50vw;
95
- }
96
93
  input[type='time'],
97
94
  input[type='date'],
98
95
  input[type='month'],
package/components/popup/popup-class.js CHANGED
@@ -107,7 +107,7 @@ class Popup extends Modal {
107
107
  let popupHeight;
108
108
  let $pushEl;
109
109
  function handleTouchStart(e) {
110
- if (isTouched || !allowSwipeToClose || !popup.params.swipeToClose) return;
110
+ if (isTouched || !allowSwipeToClose || !popup.params.swipeToClose || !e.isTrusted) return;
111
111
  if (popup.params.swipeHandler && $(e.target).closest(popup.params.swipeHandler).length === 0) {
112
112
  return;
113
113
  }
@@ -124,7 +124,7 @@ class Popup extends Modal {
124
124
  }
125
125
  }
126
126
  function handleTouchMove(e) {
127
- if (!isTouched) return;
127
+ if (!isTouched || !e.isTrusted) return;
128
128
  currentTouch = {
129
129
  x: e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX,
130
130
  y: e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY
@@ -197,7 +197,8 @@ class Popup extends Modal {
197
197
  }
198
198
  $el.transition(0).transform(`translate3d(0,${-touchesDiff}px,0)`);
199
199
  }
200
- function handleTouchEnd() {
200
+ function handleTouchEnd(e) {
201
+ if (!e.isTrusted) return;
201
202
  isTouched = false;
202
203
  if (!isMoved) {
203
204
  return;
package/components/pull-to-refresh/pull-to-refresh-class.js CHANGED
@@ -108,6 +108,7 @@ class PullToRefresh extends Framework7Class {
108
108
  $preloaderEl.find('.preloader-inner-line').css('opacity', '');
109
109
  }
110
110
  function handleTouchStart(e) {
111
+ if (!e.isTrusted) return;
111
112
  if (isTouched) {
112
113
  if (device.os === 'android') {
113
114
  if ('targetTouches' in e && e.targetTouches.length > 1) return;
@@ -127,7 +128,7 @@ class PullToRefresh extends Framework7Class {
127
128
  touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
128
129
  }
129
130
  function handleTouchMove(e) {
130
- if (!isTouched) return;
131
+ if (!isTouched || !e.isTrusted) return;
131
132
  let pageX;
132
133
  let pageY;
133
134
  let touch;
@@ -269,6 +270,7 @@ class PullToRefresh extends Framework7Class {
269
270
  }
270
271
  }
271
272
  function handleTouchEnd(e) {
273
+ if (!e.isTrusted) return;
272
274
  if (e.type === 'touchend' && e.changedTouches && e.changedTouches.length > 0 && touchId) {
273
275
  if (e.changedTouches[0].identifier !== touchId) {
274
276
  isTouched = false;
package/components/sheet/sheet-class.js CHANGED
@@ -141,7 +141,7 @@ class Sheet extends Modal {
141
141
  let sheetPageContentScrollHeight;
142
142
  let sheetPageContentOffsetHeight;
143
143
  function handleTouchStart(e) {
144
- if (isTouched || !(sheet.params.swipeToClose || sheet.params.swipeToStep)) return;
144
+ if (isTouched || !(sheet.params.swipeToClose || sheet.params.swipeToStep) || !e.isTrusted) return;
145
145
  if (sheet.params.swipeHandler && $(e.target).closest(sheet.params.swipeHandler).length === 0) {
146
146
  return;
147
147
  }
@@ -159,7 +159,7 @@ class Sheet extends Modal {
159
159
  }
160
160
  }
161
161
  function handleTouchMove(e) {
162
- if (!isTouched) return;
162
+ if (!isTouched || !e.isTrusted) return;
163
163
  currentTouch = {
164
164
  x: e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX,
165
165
  y: e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY
package/framework7-bundle-rtl.css CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * Framework7 8.0.2
2
+ * Framework7 8.0.4
3
3
  * Full featured mobile HTML framework for building iOS & Android apps
4
4
  * https://framework7.io/
5
5
  *
@@ -7,7 +7,7 @@
7
7
  *
8
8
  * Released under the MIT License
9
9
  *
10
- * Released on: April 12, 2023
10
+ * Released on: May 3, 2023
11
11
  */
12
12
 
13
13
  /*====================
@@ -4542,7 +4542,9 @@ li.list-group-title:after,
4542
4542
  --f7-button-border-radius: 4px;
4543
4543
  --f7-button-font-weight: 600;
4544
4544
  --f7-button-letter-spacing: 0;
4545
+ /*
4545
4546
  --f7-button-outline-border-color: var(--f7-theme-color);
4547
+ */
4546
4548
  --f7-button-outline-border-width: 2px;
4547
4549
  /*
4548
4550
  --f7-button-pressed-bg-color: rgba(var(--f7-theme-color-rgb), .15);
@@ -10055,7 +10057,6 @@ html.with-modal-sheet-push-closing .framework7-root > .panel-in.panel-push.panel
10055
10057
  color: #fff;
10056
10058
  font-size: var(--f7-chip-media-font-size);
10057
10059
  vertical-align: middle;
10058
- margin-right: calc(-1 * var(--f7-chip-padding-horizontal) + 4px);
10059
10060
  }
10060
10061
  .chip-media i.icon {
10061
10062
  font-size: calc(var(--f7-chip-media-size) - 8px);
@@ -10131,6 +10132,9 @@ html.with-modal-sheet-push-closing .framework7-root > .panel-in.panel-push.panel
10131
10132
  --f7-chip-outline-border-color: var(--f7-theme-color);
10132
10133
  --f7-chip-outline-text-color: var(--f7-theme-color);
10133
10134
  }
10135
+ .ios .chip-media {
10136
+ margin-right: calc(-1 * var(--f7-chip-padding-horizontal));
10137
+ }
10134
10138
  .ios .chip-delete {
10135
10139
  margin-left: calc(-1 * var(--f7-chip-padding-horizontal));
10136
10140
  }
@@ -10140,6 +10144,9 @@ html.with-modal-sheet-push-closing .framework7-root > .panel-in.panel-push.panel
10140
10144
  .ios .chip-delete:after {
10141
10145
  font-size: 10px;
10142
10146
  }
10147
+ .md .chip-media {
10148
+ margin-right: calc(-1 * var(--f7-chip-padding-horizontal) + 4px);
10149
+ }
10143
10150
  .md .chip-label + .chip-delete {
10144
10151
  margin-right: 4px;
10145
10152
  }
@@ -10379,9 +10386,6 @@ textarea:-webkit-autofill-and-obscured {
10379
10386
  .list textarea.resizable {
10380
10387
  height: calc(var(--f7-input-height) + var(--f7-textarea-padding-vertical) * 2);
10381
10388
  }
10382
- .list input[type='datetime-local'] {
10383
- max-width: 50vw;
10384
- }
10385
10389
  .list input[type='time'],
10386
10390
  .list input[type='date'],
10387
10391
  .list input[type='month'],
@@ -19073,7 +19077,6 @@ button.text-editor-button .material-icons sub {
19073
19077
  --f7-area-chart-axis-font-size: 10px;
19074
19078
  --f7-area-chart-axis-font-weight: 500;
19075
19079
  --f7-area-chart-tooltip-font-size: 12px;
19076
- --f7-area-chart-tooltip-total-label-text-color: rgba(255, 255, 255, 0.75);
19077
19080
  --f7-area-chart-tooltip-total-font-size: 16px;
19078
19081
  --f7-area-chart-tooltip-total-font-weight: bold;
19079
19082
  --f7-area-chart-tooltip-color-size: 10px;
@@ -19092,6 +19095,12 @@ button.text-editor-button .material-icons sub {
19092
19095
  --f7-area-chart-axis-bg-color: rgba(255, 255, 255, 0.15);
19093
19096
  --f7-area-chart-legend-disabled-text-color: rgba(255, 255, 255, 0.22);
19094
19097
  }
19098
+ .ios {
19099
+ --f7-area-chart-tooltip-total-label-text-color: rgba(255, 255, 255, 0.75);
19100
+ }
19101
+ .md {
19102
+ --f7-area-chart-tooltip-total-label-text-color: inherit;
19103
+ }
19095
19104
  .area-chart {
19096
19105
  position: relative;
19097
19106
  }