framework7 8.0.5 → 8.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (64) hide show
  1. package/components/app/app-class.js +2 -3
  2. package/components/app/app.less +1 -15
  3. package/components/breadcrumbs/breadcrumbs-rtl.css +1 -1
  4. package/components/breadcrumbs/breadcrumbs.css +1 -1
  5. package/components/breadcrumbs/breadcrumbs.less +1 -4
  6. package/components/calendar/calendar-rtl.css +1 -1
  7. package/components/calendar/calendar.css +1 -1
  8. package/components/calendar/calendar.d.ts +2 -0
  9. package/components/calendar/calendar.less +4 -0
  10. package/components/input/input-ios.less +3 -0
  11. package/components/input/input-rtl.css +1 -1
  12. package/components/input/input.css +1 -1
  13. package/components/list-index/list-index-rtl.css +1 -1
  14. package/components/list-index/list-index-vars.less +7 -2
  15. package/components/list-index/list-index.css +1 -1
  16. package/components/notification/notification-md.less +4 -4
  17. package/components/notification/notification-rtl.css +1 -1
  18. package/components/notification/notification-vars.less +4 -2
  19. package/components/notification/notification.css +1 -1
  20. package/components/notification/notification.less +1 -1
  21. package/components/panel/panel-class.js +2 -0
  22. package/components/panel/panel-rtl.css +1 -1
  23. package/components/panel/panel.css +1 -1
  24. package/components/panel/panel.less +7 -2
  25. package/components/panel/resizable-panel.js +6 -5
  26. package/components/picker/picker-rtl.css +1 -1
  27. package/components/picker/picker.css +1 -1
  28. package/components/picker/picker.less +4 -4
  29. package/components/pull-to-refresh/pull-to-refresh-md.less +2 -1
  30. package/components/pull-to-refresh/pull-to-refresh-rtl.css +1 -1
  31. package/components/pull-to-refresh/pull-to-refresh-vars.less +4 -0
  32. package/components/pull-to-refresh/pull-to-refresh.css +1 -1
  33. package/components/searchbar/searchbar-md.less +1 -2
  34. package/components/searchbar/searchbar-rtl.css +1 -1
  35. package/components/searchbar/searchbar.css +1 -1
  36. package/components/swiper/swiper-rtl.css +1 -1
  37. package/components/swiper/swiper.css +1 -1
  38. package/components/swiper/swiper.less +1 -1
  39. package/components/text-editor/text-editor-rtl.css +1 -1
  40. package/components/text-editor/text-editor.css +1 -1
  41. package/components/text-editor/text-editor.less +1 -3
  42. package/components/toolbar/toolbar.less +1 -7
  43. package/framework7-bundle-rtl.css +231 -97
  44. package/framework7-bundle-rtl.min.css +5 -5
  45. package/framework7-bundle.css +231 -97
  46. package/framework7-bundle.esm.js +2 -2
  47. package/framework7-bundle.js +875 -687
  48. package/framework7-bundle.js.map +1 -1
  49. package/framework7-bundle.less +2 -2
  50. package/framework7-bundle.min.css +5 -5
  51. package/framework7-bundle.min.js +3 -3
  52. package/framework7-bundle.min.js.map +1 -1
  53. package/framework7-lite-bundle.esm.js +2 -2
  54. package/framework7-lite.esm.js +2 -2
  55. package/framework7-rtl.css +25 -7
  56. package/framework7-rtl.min.css +4 -4
  57. package/framework7.css +25 -7
  58. package/framework7.esm.js +2 -2
  59. package/framework7.less +2 -2
  60. package/framework7.min.css +4 -4
  61. package/less/mixins.less +22 -0
  62. package/modules/router/modal.js +1 -1
  63. package/modules/router/router-class.js +3 -0
  64. package/package.json +3 -3
package/components/notification/notification-rtl.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-notification-max-width:568px;--f7-notification-subtitle-text-transform:none;--f7-notification-subtitle-line-height:1.35;--f7-notification-text-text-transform:none;--f7-notification-text-font-weight:400}.ios{--f7-notification-margin:8px;--f7-notification-padding:10px;--f7-notification-border-radius:12px;--f7-notification-box-shadow:0px 5px 25px -10px rgba(0, 0, 0, 0.7);--f7-notification-icon-size:20px;--f7-notification-title-font-size:13px;--f7-notification-title-text-transform:uppercase;--f7-notification-title-line-height:1.4;--f7-notification-title-font-weight:400;--f7-notification-title-letter-spacing:0.02em;--f7-notification-title-right-font-size:13px;--f7-notification-subtitle-font-size:15px;--f7-notification-subtitle-font-weight:600;--f7-notification-text-font-size:15px;--f7-notification-text-line-height:1.2;--f7-notification-bg-color:rgba(250, 250, 250, 0.95);--f7-notification-bg-color-rgb:255,255,255;--f7-notification-title-color:#000;--f7-notification-title-right-color:rgba(0, 0, 0, 0.45);--f7-notification-subtitle-color:#000;--f7-notification-text-color:#000}.ios .dark,.ios.dark{--f7-notification-bg-color:rgba(30, 30, 30, 0.95);--f7-notification-bg-color-rgb:30,30,30;--f7-notification-title-color:#fff;--f7-notification-text-color:#fff;--f7-notification-subtitle-color:#fff;--f7-notification-title-right-color:rgba(255, 255, 255, 0.55)}.md{--f7-notification-margin:16px;--f7-notification-padding:16px;--f7-notification-border-radius:16px;--f7-notification-box-shadow:none;--f7-notification-icon-size:24px;--f7-notification-title-font-size:16px;--f7-notification-title-text-transform:none;--f7-notification-title-line-height:1.35;--f7-notification-title-font-weight:500;--f7-notification-title-right-font-size:12px;--f7-notification-subtitle-font-size:14px;--f7-notification-subtitle-font-weight:400;--f7-notification-text-font-size:14px;--f7-notification-text-line-height:1.35}.md,.md .dark,.md [class*=color-]{--f7-notification-title-color:var(--f7-md-on-surface);--f7-notification-bg-color:var(--f7-md-surface-5);--f7-notification-text-color:var(--f7-md-on-surface-variant);--f7-notification-title-right-color:var(--f7-md-on-surface-variant);--f7-notification-subtitle-color:var(--f7-md-on-surface)}.notification{position:absolute;left:var(--f7-notification-margin);top:var(--f7-notification-margin);width:calc(100% - var(--f7-notification-margin) * 2);z-index:20000;font-size:14px;margin:0;border:none;display:none;box-sizing:border-box;transition-property:transform;direction:ltr;max-width:var(--f7-notification-max-width);padding:var(--f7-notification-padding);border-radius:var(--f7-notification-border-radius);box-shadow:var(--f7-notification-box-shadow);background:var(--f7-notification-bg-color);margin-top:var(--f7-safe-area-top)}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-modals .notification{background-color:rgba(var(--f7-notification-bg-color-rgb),.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}@media (min-width:568px){.notification{left:50%;width:var(--f7-notification-max-width);margin-left:calc(-1 * var(--f7-notification-max-width)/ 2)}}.notification-title{color:var(--f7-notification-title-color,var(--f7-theme-color));font-size:var(--f7-notification-title-font-size);text-transform:var(--f7-notification-title-text-transform);line-height:var(--f7-notification-title-line-height);font-weight:var(--f7-notification-title-font-weight);letter-spacing:var(--f7-notification-title-letter-spacing)}.notification-subtitle{color:var(--f7-notification-subtitle-color);font-size:var(--f7-notification-subtitle-font-size);text-transform:var(--f7-notification-subtitle-text-transform);line-height:var(--f7-notification-subtitle-line-height);font-weight:var(--f7-notification-subtitle-font-weight)}.notification-text{color:var(--f7-notification-text-color);font-size:var(--f7-notification-text-font-size);text-transform:var(--f7-notification-text-text-transform);line-height:var(--f7-notification-text-line-height);font-weight:var(--f7-notification-text-font-weight)}.notification-title-right-text{color:var(--f7-notification-title-right-color);font-size:var(--f7-notification-title-right-font-size)}.notification-icon{font-size:0;line-height:var(--f7-notification-icon-size)}.notification-icon,.notification-icon i{width:var(--f7-notification-icon-size)!important;height:var(--f7-notification-icon-size)!important}.notification-icon i{font-size:var(--f7-notification-icon-size)}.notification-icon img{height:var(--f7-notification-icon-size)}.notification-header{display:flex;justify-content:flex-start;align-items:center}.notification-close-button{margin-left:auto;cursor:pointer;position:relative}.notification-close-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';display:block;width:100%;height:100%;font-size:20px;position:absolute;left:50%;top:50%;text-align:center}.ios .notification{transition-duration:450ms;transform:translate3d(0%,-200%,0)}.ios .notification.modal-in{transform:translate3d(0%,0%,0);opacity:1}.ios .notification.modal-out{transform:translate3d(0%,-200%,0)}.ios .notification-icon{margin-right:8px}.ios .notification-header+.notification-content{margin-top:10px}.ios .notification-title-right-text{margin-right:6px;margin-left:auto}.ios .notification-title-right-text+.notification-close-button{margin-left:10px}.ios .notification-close-button{font-size:14px;width:20px;height:20px;opacity:.3;transition-duration:.3s}.ios .notification-close-button.active-state{transition-duration:0s;opacity:.1}.ios .notification-close-button:after{color:#000;content:'notification_close_ios';font-size:.65em;line-height:44px;width:44px;height:44px;margin-left:-22px;margin-top:-22px}.ios .dark .notification-close-button:after,.ios.dark .notification-close-button:after{color:#fff}.md .notification{transform:translate3d(0,-150%,0)}.md .notification.modal-in{transition-duration:.2s;transform:translate3d(0,0%,0);transition-timing-function:cubic-bezier(0,0.8,0.34,1)}.md .notification.modal-in.notification-transitioning{transition-duration:.2s}.md .notification.modal-out{animation:none;transition-duration:.2s;transition-timing-function:ease-in;transform:translate3d(0,-150%,0)}.md .notification-with-icon .notification-icon{position:absolute;left:var(--f7-notification-padding);top:var(--f7-notification-padding)}.md .notification-with-icon .notification-content,.md .notification-with-icon .notification-header{margin-left:calc(var(--f7-notification-icon-size) + 16px)}.md .notification-icon{margin-right:8px}.md .notification-subtitle+.notification-text{margin-top:4px}.md .notification-header+.notification-content{margin-top:4px}.md .notification-title-right-text{margin-left:4px}.md .notification-title-right-text:before{content:'';width:3px;height:3px;border-radius:50%;display:inline-block;vertical-align:middle;margin-right:4px;background:var(--f7-notification-title-right-color)}.md .notification-close-button{width:16px;height:16px;transition-duration:.3s}.md .notification-close-button:after,.md .notification-close-button:before{width:48px;height:48px;left:50%;top:50%;margin-left:-24px;margin-top:-24px}.md .notification-close-button:after{color:var(--f7-md-on-surface-variant);content:'delete_round_md';line-height:48px;font-size:24px}@keyframes notification-md-in{0%{transform:translate3d(0,-150%,0)}50%{transform:translate3d(0,10%,0)}100%{transform:translate3d(0,0%,0)}}
1
+ :root{--f7-notification-max-width:568px;--f7-notification-subtitle-text-transform:none;--f7-notification-subtitle-line-height:1.35;--f7-notification-text-text-transform:none;--f7-notification-text-font-weight:400}.ios{--f7-notification-margin:8px;--f7-notification-padding-horizontal:10px;--f7-notification-padding-vertical:10px;--f7-notification-border-radius:12px;--f7-notification-box-shadow:0px 5px 25px -10px rgba(0, 0, 0, 0.7);--f7-notification-icon-size:20px;--f7-notification-title-font-size:13px;--f7-notification-title-text-transform:uppercase;--f7-notification-title-line-height:1.4;--f7-notification-title-font-weight:400;--f7-notification-title-letter-spacing:0.02em;--f7-notification-title-right-font-size:13px;--f7-notification-subtitle-font-size:15px;--f7-notification-subtitle-font-weight:600;--f7-notification-text-font-size:15px;--f7-notification-text-line-height:1.2;--f7-notification-bg-color:rgba(250, 250, 250, 0.95);--f7-notification-bg-color-rgb:255,255,255;--f7-notification-title-color:#000;--f7-notification-title-right-color:rgba(0, 0, 0, 0.45);--f7-notification-subtitle-color:#000;--f7-notification-text-color:#000}.ios .dark,.ios.dark{--f7-notification-bg-color:rgba(30, 30, 30, 0.95);--f7-notification-bg-color-rgb:30,30,30;--f7-notification-title-color:#fff;--f7-notification-text-color:#fff;--f7-notification-subtitle-color:#fff;--f7-notification-title-right-color:rgba(255, 255, 255, 0.55)}.md{--f7-notification-margin:16px;--f7-notification-padding-vertical:20px;--f7-notification-padding-horizontal:16px;--f7-notification-border-radius:16px;--f7-notification-box-shadow:none;--f7-notification-icon-size:24px;--f7-notification-title-font-size:16px;--f7-notification-title-text-transform:none;--f7-notification-title-line-height:1.35;--f7-notification-title-font-weight:500;--f7-notification-title-right-font-size:12px;--f7-notification-subtitle-font-size:14px;--f7-notification-subtitle-font-weight:400;--f7-notification-text-font-size:14px;--f7-notification-text-line-height:1.35}.md,.md .dark,.md [class*=color-]{--f7-notification-title-color:var(--f7-md-on-surface);--f7-notification-bg-color:var(--f7-md-surface-5);--f7-notification-text-color:var(--f7-md-on-surface-variant);--f7-notification-title-right-color:var(--f7-md-on-surface-variant);--f7-notification-subtitle-color:var(--f7-md-on-surface)}.notification{position:absolute;left:var(--f7-notification-margin);top:var(--f7-notification-margin);width:calc(100% - var(--f7-notification-margin) * 2);z-index:20000;font-size:14px;margin:0;border:none;display:none;box-sizing:border-box;transition-property:transform;direction:ltr;max-width:var(--f7-notification-max-width);padding:var(--f7-notification-padding-vertical) var(--f7-notification-padding-horizontal);border-radius:var(--f7-notification-border-radius);box-shadow:var(--f7-notification-box-shadow);background:var(--f7-notification-bg-color);margin-top:var(--f7-safe-area-top)}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-modals .notification{background-color:rgba(var(--f7-notification-bg-color-rgb),.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}@media (min-width:568px){.notification{left:50%;width:var(--f7-notification-max-width);margin-left:calc(-1 * var(--f7-notification-max-width)/ 2)}}.notification-title{color:var(--f7-notification-title-color,var(--f7-theme-color));font-size:var(--f7-notification-title-font-size);text-transform:var(--f7-notification-title-text-transform);line-height:var(--f7-notification-title-line-height);font-weight:var(--f7-notification-title-font-weight);letter-spacing:var(--f7-notification-title-letter-spacing)}.notification-subtitle{color:var(--f7-notification-subtitle-color);font-size:var(--f7-notification-subtitle-font-size);text-transform:var(--f7-notification-subtitle-text-transform);line-height:var(--f7-notification-subtitle-line-height);font-weight:var(--f7-notification-subtitle-font-weight)}.notification-text{color:var(--f7-notification-text-color);font-size:var(--f7-notification-text-font-size);text-transform:var(--f7-notification-text-text-transform);line-height:var(--f7-notification-text-line-height);font-weight:var(--f7-notification-text-font-weight)}.notification-title-right-text{color:var(--f7-notification-title-right-color);font-size:var(--f7-notification-title-right-font-size)}.notification-icon{font-size:0;line-height:var(--f7-notification-icon-size)}.notification-icon,.notification-icon i{width:var(--f7-notification-icon-size)!important;height:var(--f7-notification-icon-size)!important}.notification-icon i{font-size:var(--f7-notification-icon-size)}.notification-icon img{height:var(--f7-notification-icon-size)}.notification-header{display:flex;justify-content:flex-start;align-items:center}.notification-close-button{margin-left:auto;cursor:pointer;position:relative}.notification-close-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';display:block;width:100%;height:100%;font-size:20px;position:absolute;left:50%;top:50%;text-align:center}.ios .notification{transition-duration:450ms;transform:translate3d(0%,-200%,0)}.ios .notification.modal-in{transform:translate3d(0%,0%,0);opacity:1}.ios .notification.modal-out{transform:translate3d(0%,-200%,0)}.ios .notification-icon{margin-right:8px}.ios .notification-header+.notification-content{margin-top:10px}.ios .notification-title-right-text{margin-right:6px;margin-left:auto}.ios .notification-title-right-text+.notification-close-button{margin-left:10px}.ios .notification-close-button{font-size:14px;width:20px;height:20px;opacity:.3;transition-duration:.3s}.ios .notification-close-button.active-state{transition-duration:0s;opacity:.1}.ios .notification-close-button:after{color:#000;content:'notification_close_ios';font-size:.65em;line-height:44px;width:44px;height:44px;margin-left:-22px;margin-top:-22px}.ios .dark .notification-close-button:after,.ios.dark .notification-close-button:after{color:#fff}.md .notification{transform:translate3d(0,-150%,0)}.md .notification.modal-in{transition-duration:.5s;transform:translate3d(0,0%,0);transition-timing-function:cubic-bezier(0,0.8,0.34,1)}.md .notification.modal-in.notification-transitioning{transition-duration:.2s}.md .notification.modal-out{animation:none;transition-duration:.2s;transition-timing-function:ease-in;transform:translate3d(0,-150%,0)}.md .notification-with-icon .notification-icon{position:absolute;left:var(--f7-notification-padding-horizontal);top:var(--f7-notification-padding-vertical)}.md .notification-with-icon .notification-content,.md .notification-with-icon .notification-header{margin-left:calc(var(--f7-notification-icon-size) + 16px)}.md .notification-icon{margin-right:8px}.md .notification-subtitle+.notification-text{margin-top:4px}.md .notification-header+.notification-content{margin-top:8px}.md .notification-title-right-text{margin-left:4px}.md .notification-title-right-text:before{content:'';width:3px;height:3px;border-radius:50%;display:inline-block;vertical-align:middle;margin-right:4px;background:var(--f7-notification-title-right-color)}.md .notification-close-button{width:16px;height:16px;transition-duration:.3s}.md .notification-close-button:after,.md .notification-close-button:before{width:48px;height:48px;left:50%;top:50%;margin-left:-24px;margin-top:-24px}.md .notification-close-button:after{color:var(--f7-md-on-surface-variant);content:'delete_round_md';line-height:48px;font-size:24px}@keyframes notification-md-in{0%{transform:translate3d(0,-150%,0)}50%{transform:translate3d(0,10%,0)}100%{transform:translate3d(0,0%,0)}}
package/components/notification/notification-vars.less CHANGED
@@ -7,7 +7,8 @@
7
7
  }
8
8
  .ios-vars({
9
9
  --f7-notification-margin: 8px;
10
- --f7-notification-padding: 10px;
10
+ --f7-notification-padding-horizontal: 10px;
11
+ --f7-notification-padding-vertical: 10px;
11
12
  --f7-notification-border-radius: 12px;
12
13
  --f7-notification-box-shadow: 0px 5px 25px -10px rgba(0, 0, 0, 0.7);
13
14
  --f7-notification-icon-size: 20px;
@@ -44,7 +45,8 @@
44
45
  });
45
46
  .md-vars({
46
47
  --f7-notification-margin: 16px;
47
- --f7-notification-padding: 16px;
48
+ --f7-notification-padding-vertical: 20px;
49
+ --f7-notification-padding-horizontal: 16px;
48
50
  --f7-notification-border-radius: 16px;
49
51
  --f7-notification-box-shadow: none;
50
52
  --f7-notification-icon-size: 24px;
package/components/notification/notification.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-notification-max-width:568px;--f7-notification-subtitle-text-transform:none;--f7-notification-subtitle-line-height:1.35;--f7-notification-text-text-transform:none;--f7-notification-text-font-weight:400}.ios{--f7-notification-margin:8px;--f7-notification-padding:10px;--f7-notification-border-radius:12px;--f7-notification-box-shadow:0px 5px 25px -10px rgba(0, 0, 0, 0.7);--f7-notification-icon-size:20px;--f7-notification-title-font-size:13px;--f7-notification-title-text-transform:uppercase;--f7-notification-title-line-height:1.4;--f7-notification-title-font-weight:400;--f7-notification-title-letter-spacing:0.02em;--f7-notification-title-right-font-size:13px;--f7-notification-subtitle-font-size:15px;--f7-notification-subtitle-font-weight:600;--f7-notification-text-font-size:15px;--f7-notification-text-line-height:1.2;--f7-notification-bg-color:rgba(250, 250, 250, 0.95);--f7-notification-bg-color-rgb:255,255,255;--f7-notification-title-color:#000;--f7-notification-title-right-color:rgba(0, 0, 0, 0.45);--f7-notification-subtitle-color:#000;--f7-notification-text-color:#000}.ios .dark,.ios.dark{--f7-notification-bg-color:rgba(30, 30, 30, 0.95);--f7-notification-bg-color-rgb:30,30,30;--f7-notification-title-color:#fff;--f7-notification-text-color:#fff;--f7-notification-subtitle-color:#fff;--f7-notification-title-right-color:rgba(255, 255, 255, 0.55)}.md{--f7-notification-margin:16px;--f7-notification-padding:16px;--f7-notification-border-radius:16px;--f7-notification-box-shadow:none;--f7-notification-icon-size:24px;--f7-notification-title-font-size:16px;--f7-notification-title-text-transform:none;--f7-notification-title-line-height:1.35;--f7-notification-title-font-weight:500;--f7-notification-title-right-font-size:12px;--f7-notification-subtitle-font-size:14px;--f7-notification-subtitle-font-weight:400;--f7-notification-text-font-size:14px;--f7-notification-text-line-height:1.35}.md,.md .dark,.md [class*=color-]{--f7-notification-title-color:var(--f7-md-on-surface);--f7-notification-bg-color:var(--f7-md-surface-5);--f7-notification-text-color:var(--f7-md-on-surface-variant);--f7-notification-title-right-color:var(--f7-md-on-surface-variant);--f7-notification-subtitle-color:var(--f7-md-on-surface)}.notification{position:absolute;left:var(--f7-notification-margin);top:var(--f7-notification-margin);width:calc(100% - var(--f7-notification-margin) * 2);z-index:20000;font-size:14px;margin:0;border:none;display:none;box-sizing:border-box;transition-property:transform;direction:ltr;max-width:var(--f7-notification-max-width);padding:var(--f7-notification-padding);border-radius:var(--f7-notification-border-radius);box-shadow:var(--f7-notification-box-shadow);background:var(--f7-notification-bg-color);margin-top:var(--f7-safe-area-top)}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-modals .notification{background-color:rgba(var(--f7-notification-bg-color-rgb),.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}@media (min-width:568px){.notification{left:50%;width:var(--f7-notification-max-width);margin-left:calc(-1 * var(--f7-notification-max-width)/ 2)}}.notification-title{color:var(--f7-notification-title-color,var(--f7-theme-color));font-size:var(--f7-notification-title-font-size);text-transform:var(--f7-notification-title-text-transform);line-height:var(--f7-notification-title-line-height);font-weight:var(--f7-notification-title-font-weight);letter-spacing:var(--f7-notification-title-letter-spacing)}.notification-subtitle{color:var(--f7-notification-subtitle-color);font-size:var(--f7-notification-subtitle-font-size);text-transform:var(--f7-notification-subtitle-text-transform);line-height:var(--f7-notification-subtitle-line-height);font-weight:var(--f7-notification-subtitle-font-weight)}.notification-text{color:var(--f7-notification-text-color);font-size:var(--f7-notification-text-font-size);text-transform:var(--f7-notification-text-text-transform);line-height:var(--f7-notification-text-line-height);font-weight:var(--f7-notification-text-font-weight)}.notification-title-right-text{color:var(--f7-notification-title-right-color);font-size:var(--f7-notification-title-right-font-size)}.notification-icon{font-size:0;line-height:var(--f7-notification-icon-size)}.notification-icon,.notification-icon i{width:var(--f7-notification-icon-size)!important;height:var(--f7-notification-icon-size)!important}.notification-icon i{font-size:var(--f7-notification-icon-size)}.notification-icon img{height:var(--f7-notification-icon-size)}.notification-header{display:flex;justify-content:flex-start;align-items:center}.notification-close-button{margin-left:auto;cursor:pointer;position:relative}.notification-close-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';display:block;width:100%;height:100%;font-size:20px;position:absolute;left:50%;top:50%;text-align:center}.ios .notification{transition-duration:450ms;transform:translate3d(0%,-200%,0)}.ios .notification.modal-in{transform:translate3d(0%,0%,0);opacity:1}.ios .notification.modal-out{transform:translate3d(0%,-200%,0)}.ios .notification-icon{margin-right:8px}.ios .notification-header+.notification-content{margin-top:10px}.ios .notification-title-right-text{margin-right:6px;margin-left:auto}.ios .notification-title-right-text+.notification-close-button{margin-left:10px}.ios .notification-close-button{font-size:14px;width:20px;height:20px;opacity:.3;transition-duration:.3s}.ios .notification-close-button.active-state{transition-duration:0s;opacity:.1}.ios .notification-close-button:after{color:#000;content:'notification_close_ios';font-size:.65em;line-height:44px;width:44px;height:44px;margin-left:-22px;margin-top:-22px}.ios .dark .notification-close-button:after,.ios.dark .notification-close-button:after{color:#fff}.md .notification{transform:translate3d(0,-150%,0)}.md .notification.modal-in{transition-duration:.2s;transform:translate3d(0,0%,0);transition-timing-function:cubic-bezier(0,0.8,0.34,1)}.md .notification.modal-in.notification-transitioning{transition-duration:.2s}.md .notification.modal-out{animation:none;transition-duration:.2s;transition-timing-function:ease-in;transform:translate3d(0,-150%,0)}.md .notification-with-icon .notification-icon{position:absolute;left:var(--f7-notification-padding);top:var(--f7-notification-padding)}.md .notification-with-icon .notification-content,.md .notification-with-icon .notification-header{margin-left:calc(var(--f7-notification-icon-size) + 16px)}.md .notification-icon{margin-right:8px}.md .notification-subtitle+.notification-text{margin-top:4px}.md .notification-header+.notification-content{margin-top:4px}.md .notification-title-right-text{margin-left:4px}.md .notification-title-right-text:before{content:'';width:3px;height:3px;border-radius:50%;display:inline-block;vertical-align:middle;margin-right:4px;background:var(--f7-notification-title-right-color)}.md .notification-close-button{width:16px;height:16px;transition-duration:.3s}.md .notification-close-button:after,.md .notification-close-button:before{width:48px;height:48px;left:50%;top:50%;margin-left:-24px;margin-top:-24px}.md .notification-close-button:after{color:var(--f7-md-on-surface-variant);content:'delete_round_md';line-height:48px;font-size:24px}@keyframes notification-md-in{0%{transform:translate3d(0,-150%,0)}50%{transform:translate3d(0,10%,0)}100%{transform:translate3d(0,0%,0)}}
1
+ :root{--f7-notification-max-width:568px;--f7-notification-subtitle-text-transform:none;--f7-notification-subtitle-line-height:1.35;--f7-notification-text-text-transform:none;--f7-notification-text-font-weight:400}.ios{--f7-notification-margin:8px;--f7-notification-padding-horizontal:10px;--f7-notification-padding-vertical:10px;--f7-notification-border-radius:12px;--f7-notification-box-shadow:0px 5px 25px -10px rgba(0, 0, 0, 0.7);--f7-notification-icon-size:20px;--f7-notification-title-font-size:13px;--f7-notification-title-text-transform:uppercase;--f7-notification-title-line-height:1.4;--f7-notification-title-font-weight:400;--f7-notification-title-letter-spacing:0.02em;--f7-notification-title-right-font-size:13px;--f7-notification-subtitle-font-size:15px;--f7-notification-subtitle-font-weight:600;--f7-notification-text-font-size:15px;--f7-notification-text-line-height:1.2;--f7-notification-bg-color:rgba(250, 250, 250, 0.95);--f7-notification-bg-color-rgb:255,255,255;--f7-notification-title-color:#000;--f7-notification-title-right-color:rgba(0, 0, 0, 0.45);--f7-notification-subtitle-color:#000;--f7-notification-text-color:#000}.ios .dark,.ios.dark{--f7-notification-bg-color:rgba(30, 30, 30, 0.95);--f7-notification-bg-color-rgb:30,30,30;--f7-notification-title-color:#fff;--f7-notification-text-color:#fff;--f7-notification-subtitle-color:#fff;--f7-notification-title-right-color:rgba(255, 255, 255, 0.55)}.md{--f7-notification-margin:16px;--f7-notification-padding-vertical:20px;--f7-notification-padding-horizontal:16px;--f7-notification-border-radius:16px;--f7-notification-box-shadow:none;--f7-notification-icon-size:24px;--f7-notification-title-font-size:16px;--f7-notification-title-text-transform:none;--f7-notification-title-line-height:1.35;--f7-notification-title-font-weight:500;--f7-notification-title-right-font-size:12px;--f7-notification-subtitle-font-size:14px;--f7-notification-subtitle-font-weight:400;--f7-notification-text-font-size:14px;--f7-notification-text-line-height:1.35}.md,.md .dark,.md [class*=color-]{--f7-notification-title-color:var(--f7-md-on-surface);--f7-notification-bg-color:var(--f7-md-surface-5);--f7-notification-text-color:var(--f7-md-on-surface-variant);--f7-notification-title-right-color:var(--f7-md-on-surface-variant);--f7-notification-subtitle-color:var(--f7-md-on-surface)}.notification{position:absolute;left:var(--f7-notification-margin);top:var(--f7-notification-margin);width:calc(100% - var(--f7-notification-margin) * 2);z-index:20000;font-size:14px;margin:0;border:none;display:none;box-sizing:border-box;transition-property:transform;direction:ltr;max-width:var(--f7-notification-max-width);padding:var(--f7-notification-padding-vertical) var(--f7-notification-padding-horizontal);border-radius:var(--f7-notification-border-radius);box-shadow:var(--f7-notification-box-shadow);background:var(--f7-notification-bg-color);margin-top:var(--f7-safe-area-top)}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-modals .notification{background-color:rgba(var(--f7-notification-bg-color-rgb),.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}}@media (min-width:568px){.notification{left:50%;width:var(--f7-notification-max-width);margin-left:calc(-1 * var(--f7-notification-max-width)/ 2)}}.notification-title{color:var(--f7-notification-title-color,var(--f7-theme-color));font-size:var(--f7-notification-title-font-size);text-transform:var(--f7-notification-title-text-transform);line-height:var(--f7-notification-title-line-height);font-weight:var(--f7-notification-title-font-weight);letter-spacing:var(--f7-notification-title-letter-spacing)}.notification-subtitle{color:var(--f7-notification-subtitle-color);font-size:var(--f7-notification-subtitle-font-size);text-transform:var(--f7-notification-subtitle-text-transform);line-height:var(--f7-notification-subtitle-line-height);font-weight:var(--f7-notification-subtitle-font-weight)}.notification-text{color:var(--f7-notification-text-color);font-size:var(--f7-notification-text-font-size);text-transform:var(--f7-notification-text-text-transform);line-height:var(--f7-notification-text-line-height);font-weight:var(--f7-notification-text-font-weight)}.notification-title-right-text{color:var(--f7-notification-title-right-color);font-size:var(--f7-notification-title-right-font-size)}.notification-icon{font-size:0;line-height:var(--f7-notification-icon-size)}.notification-icon,.notification-icon i{width:var(--f7-notification-icon-size)!important;height:var(--f7-notification-icon-size)!important}.notification-icon i{font-size:var(--f7-notification-icon-size)}.notification-icon img{height:var(--f7-notification-icon-size)}.notification-header{display:flex;justify-content:flex-start;align-items:center}.notification-close-button{margin-left:auto;cursor:pointer;position:relative}.notification-close-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';display:block;width:100%;height:100%;font-size:20px;position:absolute;left:50%;top:50%;text-align:center}.ios .notification{transition-duration:450ms;transform:translate3d(0%,-200%,0)}.ios .notification.modal-in{transform:translate3d(0%,0%,0);opacity:1}.ios .notification.modal-out{transform:translate3d(0%,-200%,0)}.ios .notification-icon{margin-right:8px}.ios .notification-header+.notification-content{margin-top:10px}.ios .notification-title-right-text{margin-right:6px;margin-left:auto}.ios .notification-title-right-text+.notification-close-button{margin-left:10px}.ios .notification-close-button{font-size:14px;width:20px;height:20px;opacity:.3;transition-duration:.3s}.ios .notification-close-button.active-state{transition-duration:0s;opacity:.1}.ios .notification-close-button:after{color:#000;content:'notification_close_ios';font-size:.65em;line-height:44px;width:44px;height:44px;margin-left:-22px;margin-top:-22px}.ios .dark .notification-close-button:after,.ios.dark .notification-close-button:after{color:#fff}.md .notification{transform:translate3d(0,-150%,0)}.md .notification.modal-in{transition-duration:.5s;transform:translate3d(0,0%,0);transition-timing-function:cubic-bezier(0,0.8,0.34,1)}.md .notification.modal-in.notification-transitioning{transition-duration:.2s}.md .notification.modal-out{animation:none;transition-duration:.2s;transition-timing-function:ease-in;transform:translate3d(0,-150%,0)}.md .notification-with-icon .notification-icon{position:absolute;left:var(--f7-notification-padding-horizontal);top:var(--f7-notification-padding-vertical)}.md .notification-with-icon .notification-content,.md .notification-with-icon .notification-header{margin-left:calc(var(--f7-notification-icon-size) + 16px)}.md .notification-icon{margin-right:8px}.md .notification-subtitle+.notification-text{margin-top:4px}.md .notification-header+.notification-content{margin-top:8px}.md .notification-title-right-text{margin-left:4px}.md .notification-title-right-text:before{content:'';width:3px;height:3px;border-radius:50%;display:inline-block;vertical-align:middle;margin-right:4px;background:var(--f7-notification-title-right-color)}.md .notification-close-button{width:16px;height:16px;transition-duration:.3s}.md .notification-close-button:after,.md .notification-close-button:before{width:48px;height:48px;left:50%;top:50%;margin-left:-24px;margin-top:-24px}.md .notification-close-button:after{color:var(--f7-md-on-surface-variant);content:'delete_round_md';line-height:48px;font-size:24px}@keyframes notification-md-in{0%{transform:translate3d(0,-150%,0)}50%{transform:translate3d(0,10%,0)}100%{transform:translate3d(0,0%,0)}}
package/components/notification/notification.less CHANGED
@@ -15,7 +15,7 @@
15
15
  transition-property: transform;
16
16
  direction: ltr;
17
17
  max-width: var(--f7-notification-max-width);
18
- padding: var(--f7-notification-padding);
18
+ padding: var(--f7-notification-padding-vertical) var(--f7-notification-padding-horizontal);
19
19
  border-radius: var(--f7-notification-border-radius);
20
20
  box-shadow: var(--f7-notification-box-shadow);
21
21
  background: var(--f7-notification-bg-color);
package/components/panel/panel-class.js CHANGED
@@ -442,6 +442,8 @@ class Panel extends Framework7Class {
442
442
  $el.removeClass('panel-out').addClass('panel-in not-animated');
443
443
  panel.onOpen();
444
444
  panel.onOpened();
445
+ // eslint-disable-next-line
446
+ panel._openTransitionStarted = true;
445
447
  }
446
448
  return true;
447
449
  }
package/components/panel/panel-rtl.css CHANGED
@@ -1,3 +1,3 @@
1
1
  :root{--f7-panel-width:260px;--f7-panel-backdrop-bg-color:rgba(0, 0, 0, 0.3);--f7-panel-bg-color:#fff}:root .dark,:root.dark{--f7-panel-bg-color:#000}.ios{--f7-panel-collapsed-width:58px;--f7-panel-transition-duration:400ms;--f7-panel-transition-timing-function:initial}.md{--f7-panel-collapsed-width:60px;--f7-panel-transition-duration:400ms;--f7-panel-transition-timing-function:cubic-bezier(0, 0.8, 0.34, 1)}.panel-backdrop{position:absolute;left:0;top:0px;width:100%;height:100%;opacity:0;z-index:5999;visibility:hidden;pointer-events:none;transform:translate3d(0,0,0);background-color:var(--f7-panel-backdrop-bg-color);transition-property:transform,opacity;transition-duration:var(--f7-panel-transition-duration)}.panel-backdrop .with-panel,.panel-backdrop .with-panel-closing{visibility:visible}.panel-backdrop.not-animated{transition-duration:0s!important}.panel{z-index:1000;box-sizing:border-box;position:absolute;top:0px;height:100%;transform:translate3d(0,0,0);width:var(--f7-panel-width);background-color:var(--f7-panel-bg-color);overflow:visible;transition-property:transform;transition-duration:var(--f7-panel-transition-duration)}.panel:not(.panel-in):not(.panel-out):not(.panel-in-breakpoint):not(.panel-in-collapsed):not(
2
2
  .panel-in-swipe
3
- ){display:none}.panel:after{pointer-events:none;opacity:0;z-index:5999;position:absolute;content:'';top:0;width:20px;height:100%;transition-property:transform,opacity;transition-duration:var(--f7-panel-transition-duration)}.panel.not-animated,.panel.not-animated:after{transition-duration:0s!important}.panel.panel-reveal.not-animated~.view,.panel.panel-reveal.not-animated~.views{transition-duration:0s!important}.panel.panel-resizing{-webkit-user-select:none;user-select:none}.panel.panel-resizing,.panel.panel-resizing:after,.panel.panel-resizing~.view,.panel.panel-resizing~.views{transition-duration:0s!important}.panel-cover,.panel-floating{z-index:6000}.panel-floating{overflow:hidden;border-radius:16px;height:auto;top:calc(8px + var(--f7-safe-area-top,0px));bottom:calc(8px + var(--f7-safe-area-bottom,0px))}.panel-floating .view,.panel-floating .views{--f7-safe-area-top:0px;--f7-safe-area-bottom:0px}.page .panel-floating{top:calc(8px + var(--f7-page-navbar-offset,0px));bottom:calc(8px + var(--f7-safe-area-bottom,0px))}.page .panel-floating .page{--f7-page-navbar-offset:0px}.page .panel-floating .navbars~*,.page .panel-floating .navbar~*{--f7-page-navbar-offset:calc(var(--f7-navbar-height))}.panel-left{left:0;width:var(--f7-panel-left-width,var(--f7-panel-width))}.panel-left.panel-cover,.panel-left.panel-floating,.panel-left.panel-push{transform:translate3d(calc(-1 * var(--f7-panel-left-width,var(--f7-panel-width))),0,0)}.panel-right{right:0;width:var(--f7-panel-right-width,var(--f7-panel-width))}.panel-right.panel-cover,.panel-right.panel-floating,.panel-right.panel-push{transform:translate3d(var(--f7-panel-right-width,var(--f7-panel-width)),0,0)}.panel-in-breakpoint{transform:translate3d(0,0,0)!important;transition-duration:0s}.panel-in-breakpoint:after{display:none}.panel-in-breakpoint.panel-cover,.panel-in-breakpoint.panel-floating{z-index:5900}.panel,.panel-backdrop{transition-timing-function:var(--f7-panel-transition-timing-function)}html.with-panel-closing .framework7-root>.view,html.with-panel-closing .views,html.with-panel-left-push .framework7-root>.view,html.with-panel-left-push .views,html.with-panel-left-reveal .framework7-root>.view,html.with-panel-left-reveal .views,html.with-panel-right-push .framework7-root>.view,html.with-panel-right-push .views,html.with-panel-right-reveal .framework7-root>.view,html.with-panel-right-reveal .views{transition-duration:var(--f7-panel-transition-duration);transition-property:transform;transition-timing-function:var(--f7-panel-transition-timing-function)}html.with-panel .framework7-root>.view .page-content,html.with-panel .framework7-root>.views .page-content{overflow:hidden;-webkit-overflow-scrolling:auto}html.with-panel-left-push .framework7-root>.view,html.with-panel-left-push .views,html.with-panel-left-reveal .framework7-root>.view,html.with-panel-left-reveal .views{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}html.with-panel-right-push .framework7-root>.view,html.with-panel-right-push .views,html.with-panel-right-reveal .framework7-root>.view,html.with-panel-right-reveal .views{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.page>.panel-backdrop{z-index:290}.page .panel-push,.page>.panel-reveal{z-index:1}.page>.panel-cover,.page>.panel-floating{z-index:300}.page.with-panel-closing>.page-content,.page.with-panel-closing>.tabs,.page.with-panel-left-push>.page-content,.page.with-panel-left-push>.tabs,.page.with-panel-left-reveal>.page-content,.page.with-panel-left-reveal>.tabs,.page.with-panel-right-push>.page-content,.page.with-panel-right-push>.tabs,.page.with-panel-right-reveal>.page-content,.page.with-panel-right-reveal>.tabs{transition-duration:var(--f7-panel-transition-duration);transition-property:transform;transition-timing-function:var(--f7-panel-transition-timing-function)}.page.with-panel-left-push>.page-content,.page.with-panel-left-push>.tabs,.page.with-panel-left-reveal>.page-content,.page.with-panel-left-reveal>.tabs{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}.page.with-panel-right-push>.page-content,.page.with-panel-right-push>.tabs,.page.with-panel-right-reveal>.page-content,.page.with-panel-right-reveal>.tabs{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.with-panel-closing .panel-backdrop-in{visibility:visible;pointer-events:auto;opacity:0}.with-panel-left-cover .panel-backdrop-in,.with-panel-left-floating .panel-backdrop-in,.with-panel-left-push .panel-backdrop-in,.with-panel-left-reveal .panel-backdrop-in,.with-panel-right-cover .panel-backdrop-in,.with-panel-right-floating .panel-backdrop-in,.with-panel-right-push .panel-backdrop-in,.with-panel-right-reveal .panel-backdrop-in{visibility:visible;pointer-events:auto;opacity:1}.with-panel-left-push .panel-backdrop-in,.with-panel-left-reveal .panel-backdrop-in{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}.with-panel-right-push .panel-backdrop-in,.with-panel-right-reveal .panel-backdrop-in{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.with-panel-left-cover .panel-left,.with-panel-left-push .panel-left{transform:translate3d(0px,0,0)}.with-panel-left-floating .panel-left{transform:translate3d(8px,0,0)}.with-panel-right-cover .panel-right,.with-panel-right-push .panel-right{transform:translate3d(0px,0,0)}.with-panel-right-floating .panel-right{transform:translate3d(-8px,0,0)}.panel-resize-handler{position:absolute;top:0;height:100%;width:6px;cursor:col-resize;z-index:6000;display:none}.panel-resizable .panel-resize-handler{display:block}.panel-left.panel-cover .panel-resize-handler{right:-3px}.panel-left.panel-push .panel-resize-handler,.panel-resize-handler .panel-left.panel-reveal{right:0}.panel-right.panel-cover .panel-resize-handler{left:-3px}.panel-resize-handler .panel-right.panel-reveal,.panel-right.panel-push .panel-resize-handler{left:0}.panel-left.panel-in-collapsed~.page-content,.panel-left.panel-in-collapsed~.tabs,.panel-left.panel-in-collapsed~.view,.panel-left.panel-in-collapsed~.views{margin-left:var(--f7-panel-left-collapsed-width,var(--f7-panel-collapsed-width))}.page.with-panel-left-reveal .panel-left.panel-in-collapsed~.page-content,.page.with-panel-left-reveal .panel-left.panel-in-collapsed~.tabs,html.with-panel-left-reveal .panel-left.panel-in-collapsed~.view,html.with-panel-left-reveal .panel-left.panel-in-collapsed~.views{transform:translate3d(calc(var(--f7-panel-left-width,var(--f7-panel-width)) - var(--f7-panel-left-collapsed-width,var(--f7-panel-collapsed-width))),0,0)}.panel-right.panel-in-collapsed~.page-content,.panel-right.panel-in-collapsed~.tabs,.panel-right.panel-in-collapsed~.view,.panel-right.panel-in-collapsed~.views{margin-right:var(--f7-panel-right-collapsed-width,var(--f7-panel-collapsed-width))}.page.with-panel-right-reveal .panel-right.panel-in-collapsed~.page-content,.page.with-panel-right-reveal .panel-right.panel-in-collapsed~.tabs,html.with-panel-right-reveal .panel-right.panel-in-collapsed~.view,html.with-panel-right-reveal .panel-right.panel-in-collapsed~.views{transform:translate3d(calc(var(--f7-panel-right-collapsed-width,var(--f7-panel-collapsed-width)) - var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}html.with-modal-popup-push .framework7-root,html.with-modal-popup-push-closing .framework7-root{--f7-panelPushScale:var(--f7-popup-push-scale);--f7-panelPushTransitionDuration:var(--f7-popup-transition-duration);--f7-panelPushTransitionTimingFunction:var(--f7-popup-transition-timing-function);--f7-panelPushBorderRadius:var(--f7-popup-push-border-radius)}html.with-modal-sheet-push .framework7-root,html.with-modal-sheet-push-closing .framework7-root{--f7-panelPushScale:var(--f7-sheet-push-scale);--f7-panelPushTransitionDuration:var(--f7-sheet-transition-duration);--f7-panelPushTransitionTimingFunction:var(--f7-sheet-transition-timing-function);--f7-panelPushBorderRadius:var(--f7-sheet-push-border-radius)}html.with-modal-popup-push .framework7-root>.panel-in,html.with-modal-popup-push .framework7-root>.panel-out,html.with-modal-sheet-push .framework7-root>.panel-in,html.with-modal-sheet-push .framework7-root>.panel-out{transition-duration:var(--f7-panelPushTransitionDuration);transition-timing-function:var(--f7-panelPushTransitionTimingFunction)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-left{transform:scale(var(--f7-panelPushScale,1));transform-origin:50vw center;border-top-left-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-left .view{border-top-left-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-right{transform:scale(var(--f7-panelPushScale,1));transform-origin:calc(var(--f7-panel-left-width,var(--f7-panel-width)) - 50vw) center;border-top-right-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-right .view{border-top-right-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-cover.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-cover.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-cover.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-cover.panel-left{transform:translate3d(calc(-1 * var(--f7-panel-left-width,var(--f7-panel-width))),0,0px)}html.with-modal-popup-push .framework7-root>.panel-in.panel-cover.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-cover.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-cover.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-cover.panel-right{transform:translate3d(var(--f7-panel-right-width,var(--f7-panel-width)),0,0px)}html.with-modal-popup-push-closing .framework7-root>.panel-in,html.with-modal-sheet-push-closing .framework7-root>.panel-in{transition-duration:var(--f7-panelPushTransitionDuration);transition-timing-function:var(--f7-panelPushTransitionTimingFunction)}html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-reveal.panel-left{transform-origin:50vw center}html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-reveal.panel-right{transform-origin:calc(var(--f7-panel-right-width,var(--f7-panel-width)) - 50vw) center}.md .panel-cover{overflow:hidden}.md .panel-cover.panel-left{border-radius:0 16px 16px 0}.md .panel-cover.panel-right{border-radius:16px 0 0 16px}
3
+ ){display:none}.panel:after{pointer-events:none;opacity:0;z-index:5999;position:absolute;content:'';top:0;width:20px;height:100%;transition-property:transform,opacity;transition-duration:var(--f7-panel-transition-duration)}.panel.not-animated,.panel.not-animated:after{transition-duration:0s!important}.panel.panel-reveal.not-animated~.view,.panel.panel-reveal.not-animated~.views{transition-duration:0s!important}.panel.panel-resizing{-webkit-user-select:none;user-select:none}.panel.panel-resizing,.panel.panel-resizing:after,.panel.panel-resizing~.view,.panel.panel-resizing~.views{transition-duration:0s!important}.panel-cover,.panel-floating{z-index:6000}.panel-floating{overflow:hidden;border-radius:16px;height:auto;top:calc(8px + var(--f7-safe-area-top,0px));bottom:calc(8px + var(--f7-safe-area-bottom,0px))}.panel-floating .view,.panel-floating .views{--f7-safe-area-top:0px;--f7-safe-area-bottom:0px}.page .panel-floating{top:calc(8px + var(--f7-page-navbar-offset,0px));bottom:calc(8px + var(--f7-safe-area-bottom,0px))}.page .panel-floating .page{--f7-page-navbar-offset:0px}.page .panel-floating .navbars~*,.page .panel-floating .navbar~*{--f7-page-navbar-offset:calc(var(--f7-navbar-height))}.panel-left{left:0;width:var(--f7-panel-left-width,var(--f7-panel-width))}.panel-left.panel-cover,.panel-left.panel-floating,.panel-left.panel-push{transform:translate3d(calc(-1 * var(--f7-panel-left-width,var(--f7-panel-width))),0,0)}.panel-right{right:0;width:var(--f7-panel-right-width,var(--f7-panel-width))}.panel-right.panel-cover,.panel-right.panel-floating,.panel-right.panel-push{transform:translate3d(var(--f7-panel-right-width,var(--f7-panel-width)),0,0)}.panel-in-breakpoint{transform:translate3d(0,0,0)!important;transition-duration:0s}.panel-in-breakpoint:after{display:none}.panel-in-breakpoint.panel-cover,.panel-in-breakpoint.panel-floating{z-index:5900}.panel,.panel-backdrop{transition-timing-function:var(--f7-panel-transition-timing-function)}html.with-panel-closing .framework7-root>.view,html.with-panel-closing .views,html.with-panel-left-push .framework7-root>.view,html.with-panel-left-push .views,html.with-panel-left-reveal .framework7-root>.view,html.with-panel-left-reveal .views,html.with-panel-right-push .framework7-root>.view,html.with-panel-right-push .views,html.with-panel-right-reveal .framework7-root>.view,html.with-panel-right-reveal .views{transition-duration:var(--f7-panel-transition-duration);transition-property:transform;transition-timing-function:var(--f7-panel-transition-timing-function)}html.with-panel .framework7-root>.view .page-content,html.with-panel .framework7-root>.views .page-content{overflow:hidden;-webkit-overflow-scrolling:auto}html.with-panel-left-push .framework7-root>.view,html.with-panel-left-push .views,html.with-panel-left-reveal .framework7-root>.view,html.with-panel-left-reveal .views{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}html.with-panel-right-push .framework7-root>.view,html.with-panel-right-push .views,html.with-panel-right-reveal .framework7-root>.view,html.with-panel-right-reveal .views{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.page>.panel-backdrop{z-index:290}.page .panel-push,.page>.panel-reveal{z-index:1}.page>.panel-cover,.page>.panel-floating{z-index:300}.page.with-panel-closing>.page-content,.page.with-panel-closing>.tabs,.page.with-panel-left-push>.page-content,.page.with-panel-left-push>.tabs,.page.with-panel-left-reveal>.page-content,.page.with-panel-left-reveal>.tabs,.page.with-panel-right-push>.page-content,.page.with-panel-right-push>.tabs,.page.with-panel-right-reveal>.page-content,.page.with-panel-right-reveal>.tabs{transition-duration:var(--f7-panel-transition-duration);transition-property:transform;transition-timing-function:var(--f7-panel-transition-timing-function)}.page.with-panel-left-push>.page-content,.page.with-panel-left-push>.tabs,.page.with-panel-left-reveal>.page-content,.page.with-panel-left-reveal>.tabs{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}.page.with-panel-right-push>.page-content,.page.with-panel-right-push>.tabs,.page.with-panel-right-reveal>.page-content,.page.with-panel-right-reveal>.tabs{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.with-panel-closing .panel-backdrop-in{visibility:visible;pointer-events:auto;opacity:0}.with-panel-left-cover .panel-backdrop-in,.with-panel-left-floating .panel-backdrop-in,.with-panel-left-push .panel-backdrop-in,.with-panel-left-reveal .panel-backdrop-in,.with-panel-right-cover .panel-backdrop-in,.with-panel-right-floating .panel-backdrop-in,.with-panel-right-push .panel-backdrop-in,.with-panel-right-reveal .panel-backdrop-in{visibility:visible;pointer-events:auto;opacity:1}.with-panel-left-push .panel-backdrop-in,.with-panel-left-reveal .panel-backdrop-in{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}.with-panel-right-push .panel-backdrop-in,.with-panel-right-reveal .panel-backdrop-in{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.with-panel-left-cover .panel-left,.with-panel-left-push .panel-left{transform:translate3d(0px,0,0)}.with-panel-left-floating .panel-left{transform:translate3d(8px,0,0)}.with-panel-right-cover .panel-right,.with-panel-right-push .panel-right{transform:translate3d(0px,0,0)}.with-panel-right-floating .panel-right{transform:translate3d(-8px,0,0)}.panel-resizable{max-width:100%}.panel-resize-handler{position:absolute;top:0;height:100%;width:6px;cursor:col-resize;z-index:6000;display:none}.panel-resizable .panel-resize-handler{display:block}.panel-left.panel-cover .panel-resize-handler,.panel-left.panel-floating .panel-resize-handler{right:-3px}.panel-left.panel-push .panel-resize-handler,.panel-resize-handler .panel-left.panel-reveal{right:0}.panel-right.panel-cover .panel-resize-handler,.panel-right.panel-floating .panel-resize-handler{left:-3px}.panel-resize-handler .panel-right.panel-reveal,.panel-right.panel-push .panel-resize-handler{left:0}.panel-left.panel-in-collapsed~.page-content,.panel-left.panel-in-collapsed~.tabs,.panel-left.panel-in-collapsed~.view,.panel-left.panel-in-collapsed~.views{margin-left:var(--f7-panel-left-collapsed-width,var(--f7-panel-collapsed-width))}.page.with-panel-left-reveal .panel-left.panel-in-collapsed~.page-content,.page.with-panel-left-reveal .panel-left.panel-in-collapsed~.tabs,html.with-panel-left-reveal .panel-left.panel-in-collapsed~.view,html.with-panel-left-reveal .panel-left.panel-in-collapsed~.views{transform:translate3d(calc(var(--f7-panel-left-width,var(--f7-panel-width)) - var(--f7-panel-left-collapsed-width,var(--f7-panel-collapsed-width))),0,0)}.panel-right.panel-in-collapsed~.page-content,.panel-right.panel-in-collapsed~.tabs,.panel-right.panel-in-collapsed~.view,.panel-right.panel-in-collapsed~.views{margin-right:var(--f7-panel-right-collapsed-width,var(--f7-panel-collapsed-width))}.page.with-panel-right-reveal .panel-right.panel-in-collapsed~.page-content,.page.with-panel-right-reveal .panel-right.panel-in-collapsed~.tabs,html.with-panel-right-reveal .panel-right.panel-in-collapsed~.view,html.with-panel-right-reveal .panel-right.panel-in-collapsed~.views{transform:translate3d(calc(var(--f7-panel-right-collapsed-width,var(--f7-panel-collapsed-width)) - var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}html.with-modal-popup-push .framework7-root,html.with-modal-popup-push-closing .framework7-root{--f7-panelPushScale:var(--f7-popup-push-scale);--f7-panelPushTransitionDuration:var(--f7-popup-transition-duration);--f7-panelPushTransitionTimingFunction:var(--f7-popup-transition-timing-function);--f7-panelPushBorderRadius:var(--f7-popup-push-border-radius)}html.with-modal-sheet-push .framework7-root,html.with-modal-sheet-push-closing .framework7-root{--f7-panelPushScale:var(--f7-sheet-push-scale);--f7-panelPushTransitionDuration:var(--f7-sheet-transition-duration);--f7-panelPushTransitionTimingFunction:var(--f7-sheet-transition-timing-function);--f7-panelPushBorderRadius:var(--f7-sheet-push-border-radius)}html.with-modal-popup-push .framework7-root>.panel-in,html.with-modal-popup-push .framework7-root>.panel-out,html.with-modal-sheet-push .framework7-root>.panel-in,html.with-modal-sheet-push .framework7-root>.panel-out{transition-duration:var(--f7-panelPushTransitionDuration);transition-timing-function:var(--f7-panelPushTransitionTimingFunction)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-left{transform:scale(var(--f7-panelPushScale,1));transform-origin:50vw center;border-top-left-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-left .view{border-top-left-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-right{transform:scale(var(--f7-panelPushScale,1));transform-origin:calc(var(--f7-panel-left-width,var(--f7-panel-width)) - 50vw) center;border-top-right-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-right .view{border-top-right-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-cover.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-cover.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-cover.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-cover.panel-left{transform:translate3d(calc(-1 * var(--f7-panel-left-width,var(--f7-panel-width))),0,0px)}html.with-modal-popup-push .framework7-root>.panel-in.panel-cover.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-cover.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-cover.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-cover.panel-right{transform:translate3d(var(--f7-panel-right-width,var(--f7-panel-width)),0,0px)}html.with-modal-popup-push-closing .framework7-root>.panel-in,html.with-modal-sheet-push-closing .framework7-root>.panel-in{transition-duration:var(--f7-panelPushTransitionDuration);transition-timing-function:var(--f7-panelPushTransitionTimingFunction)}html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-reveal.panel-left{transform-origin:50vw center}html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-reveal.panel-right{transform-origin:calc(var(--f7-panel-right-width,var(--f7-panel-width)) - 50vw) center}.md .panel-cover{overflow:hidden}.md .panel-cover.panel-left{border-radius:0 16px 16px 0}.md .panel-cover.panel-right{border-radius:16px 0 0 16px}
package/components/panel/panel.css CHANGED
@@ -1,3 +1,3 @@
1
1
  :root{--f7-panel-width:260px;--f7-panel-backdrop-bg-color:rgba(0, 0, 0, 0.3);--f7-panel-bg-color:#fff}:root .dark,:root.dark{--f7-panel-bg-color:#000}.ios{--f7-panel-collapsed-width:58px;--f7-panel-transition-duration:400ms;--f7-panel-transition-timing-function:initial}.md{--f7-panel-collapsed-width:60px;--f7-panel-transition-duration:400ms;--f7-panel-transition-timing-function:cubic-bezier(0, 0.8, 0.34, 1)}.panel-backdrop{position:absolute;left:0;top:0px;width:100%;height:100%;opacity:0;z-index:5999;visibility:hidden;pointer-events:none;transform:translate3d(0,0,0);background-color:var(--f7-panel-backdrop-bg-color);transition-property:transform,opacity;transition-duration:var(--f7-panel-transition-duration)}.panel-backdrop .with-panel,.panel-backdrop .with-panel-closing{visibility:visible}.panel-backdrop.not-animated{transition-duration:0s!important}.panel{z-index:1000;box-sizing:border-box;position:absolute;top:0px;height:100%;transform:translate3d(0,0,0);width:var(--f7-panel-width);background-color:var(--f7-panel-bg-color);overflow:visible;transition-property:transform;transition-duration:var(--f7-panel-transition-duration)}.panel:not(.panel-in):not(.panel-out):not(.panel-in-breakpoint):not(.panel-in-collapsed):not(
2
2
  .panel-in-swipe
3
- ){display:none}.panel:after{pointer-events:none;opacity:0;z-index:5999;position:absolute;content:'';top:0;width:20px;height:100%;transition-property:transform,opacity;transition-duration:var(--f7-panel-transition-duration)}.panel.not-animated,.panel.not-animated:after{transition-duration:0s!important}.panel.panel-reveal.not-animated~.view,.panel.panel-reveal.not-animated~.views{transition-duration:0s!important}.panel.panel-resizing{-webkit-user-select:none;user-select:none}.panel.panel-resizing,.panel.panel-resizing:after,.panel.panel-resizing~.view,.panel.panel-resizing~.views{transition-duration:0s!important}.panel-cover,.panel-floating{z-index:6000}.panel-floating{overflow:hidden;border-radius:16px;height:auto;top:calc(8px + var(--f7-safe-area-top,0px));bottom:calc(8px + var(--f7-safe-area-bottom,0px))}.panel-floating .view,.panel-floating .views{--f7-safe-area-top:0px;--f7-safe-area-bottom:0px}.page .panel-floating{top:calc(8px + var(--f7-page-navbar-offset,0px));bottom:calc(8px + var(--f7-safe-area-bottom,0px))}.page .panel-floating .page{--f7-page-navbar-offset:0px}.page .panel-floating .navbars~*,.page .panel-floating .navbar~*{--f7-page-navbar-offset:calc(var(--f7-navbar-height))}.panel-left{left:0;width:var(--f7-panel-left-width,var(--f7-panel-width))}.panel-left.panel-cover,.panel-left.panel-floating,.panel-left.panel-push{transform:translate3d(calc(-1 * var(--f7-panel-left-width,var(--f7-panel-width))),0,0)}.panel-right{right:0;width:var(--f7-panel-right-width,var(--f7-panel-width))}.panel-right.panel-cover,.panel-right.panel-floating,.panel-right.panel-push{transform:translate3d(var(--f7-panel-right-width,var(--f7-panel-width)),0,0)}.panel-in-breakpoint{transform:translate3d(0,0,0)!important;transition-duration:0s}.panel-in-breakpoint:after{display:none}.panel-in-breakpoint.panel-cover,.panel-in-breakpoint.panel-floating{z-index:5900}.panel,.panel-backdrop{transition-timing-function:var(--f7-panel-transition-timing-function)}html.with-panel-closing .framework7-root>.view,html.with-panel-closing .views,html.with-panel-left-push .framework7-root>.view,html.with-panel-left-push .views,html.with-panel-left-reveal .framework7-root>.view,html.with-panel-left-reveal .views,html.with-panel-right-push .framework7-root>.view,html.with-panel-right-push .views,html.with-panel-right-reveal .framework7-root>.view,html.with-panel-right-reveal .views{transition-duration:var(--f7-panel-transition-duration);transition-property:transform;transition-timing-function:var(--f7-panel-transition-timing-function)}html.with-panel .framework7-root>.view .page-content,html.with-panel .framework7-root>.views .page-content{overflow:hidden;-webkit-overflow-scrolling:auto}html.with-panel-left-push .framework7-root>.view,html.with-panel-left-push .views,html.with-panel-left-reveal .framework7-root>.view,html.with-panel-left-reveal .views{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}html.with-panel-right-push .framework7-root>.view,html.with-panel-right-push .views,html.with-panel-right-reveal .framework7-root>.view,html.with-panel-right-reveal .views{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.page>.panel-backdrop{z-index:290}.page .panel-push,.page>.panel-reveal{z-index:1}.page>.panel-cover,.page>.panel-floating{z-index:300}.page.with-panel-closing>.page-content,.page.with-panel-closing>.tabs,.page.with-panel-left-push>.page-content,.page.with-panel-left-push>.tabs,.page.with-panel-left-reveal>.page-content,.page.with-panel-left-reveal>.tabs,.page.with-panel-right-push>.page-content,.page.with-panel-right-push>.tabs,.page.with-panel-right-reveal>.page-content,.page.with-panel-right-reveal>.tabs{transition-duration:var(--f7-panel-transition-duration);transition-property:transform;transition-timing-function:var(--f7-panel-transition-timing-function)}.page.with-panel-left-push>.page-content,.page.with-panel-left-push>.tabs,.page.with-panel-left-reveal>.page-content,.page.with-panel-left-reveal>.tabs{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}.page.with-panel-right-push>.page-content,.page.with-panel-right-push>.tabs,.page.with-panel-right-reveal>.page-content,.page.with-panel-right-reveal>.tabs{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.with-panel-closing .panel-backdrop-in{visibility:visible;pointer-events:auto;opacity:0}.with-panel-left-cover .panel-backdrop-in,.with-panel-left-floating .panel-backdrop-in,.with-panel-left-push .panel-backdrop-in,.with-panel-left-reveal .panel-backdrop-in,.with-panel-right-cover .panel-backdrop-in,.with-panel-right-floating .panel-backdrop-in,.with-panel-right-push .panel-backdrop-in,.with-panel-right-reveal .panel-backdrop-in{visibility:visible;pointer-events:auto;opacity:1}.with-panel-left-push .panel-backdrop-in,.with-panel-left-reveal .panel-backdrop-in{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}.with-panel-right-push .panel-backdrop-in,.with-panel-right-reveal .panel-backdrop-in{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.with-panel-left-cover .panel-left,.with-panel-left-push .panel-left{transform:translate3d(0px,0,0)}.with-panel-left-floating .panel-left{transform:translate3d(8px,0,0)}.with-panel-right-cover .panel-right,.with-panel-right-push .panel-right{transform:translate3d(0px,0,0)}.with-panel-right-floating .panel-right{transform:translate3d(-8px,0,0)}.panel-resize-handler{position:absolute;top:0;height:100%;width:6px;cursor:col-resize;z-index:6000;display:none}.panel-resizable .panel-resize-handler{display:block}.panel-left.panel-cover .panel-resize-handler{right:-3px}.panel-left.panel-push .panel-resize-handler,.panel-resize-handler .panel-left.panel-reveal{right:0}.panel-right.panel-cover .panel-resize-handler{left:-3px}.panel-resize-handler .panel-right.panel-reveal,.panel-right.panel-push .panel-resize-handler{left:0}.panel-left.panel-in-collapsed~.page-content,.panel-left.panel-in-collapsed~.tabs,.panel-left.panel-in-collapsed~.view,.panel-left.panel-in-collapsed~.views{margin-left:var(--f7-panel-left-collapsed-width,var(--f7-panel-collapsed-width))}.page.with-panel-left-reveal .panel-left.panel-in-collapsed~.page-content,.page.with-panel-left-reveal .panel-left.panel-in-collapsed~.tabs,html.with-panel-left-reveal .panel-left.panel-in-collapsed~.view,html.with-panel-left-reveal .panel-left.panel-in-collapsed~.views{transform:translate3d(calc(var(--f7-panel-left-width,var(--f7-panel-width)) - var(--f7-panel-left-collapsed-width,var(--f7-panel-collapsed-width))),0,0)}.panel-right.panel-in-collapsed~.page-content,.panel-right.panel-in-collapsed~.tabs,.panel-right.panel-in-collapsed~.view,.panel-right.panel-in-collapsed~.views{margin-right:var(--f7-panel-right-collapsed-width,var(--f7-panel-collapsed-width))}.page.with-panel-right-reveal .panel-right.panel-in-collapsed~.page-content,.page.with-panel-right-reveal .panel-right.panel-in-collapsed~.tabs,html.with-panel-right-reveal .panel-right.panel-in-collapsed~.view,html.with-panel-right-reveal .panel-right.panel-in-collapsed~.views{transform:translate3d(calc(var(--f7-panel-right-collapsed-width,var(--f7-panel-collapsed-width)) - var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}html.with-modal-popup-push .framework7-root,html.with-modal-popup-push-closing .framework7-root{--f7-panelPushScale:var(--f7-popup-push-scale);--f7-panelPushTransitionDuration:var(--f7-popup-transition-duration);--f7-panelPushTransitionTimingFunction:var(--f7-popup-transition-timing-function);--f7-panelPushBorderRadius:var(--f7-popup-push-border-radius)}html.with-modal-sheet-push .framework7-root,html.with-modal-sheet-push-closing .framework7-root{--f7-panelPushScale:var(--f7-sheet-push-scale);--f7-panelPushTransitionDuration:var(--f7-sheet-transition-duration);--f7-panelPushTransitionTimingFunction:var(--f7-sheet-transition-timing-function);--f7-panelPushBorderRadius:var(--f7-sheet-push-border-radius)}html.with-modal-popup-push .framework7-root>.panel-in,html.with-modal-popup-push .framework7-root>.panel-out,html.with-modal-sheet-push .framework7-root>.panel-in,html.with-modal-sheet-push .framework7-root>.panel-out{transition-duration:var(--f7-panelPushTransitionDuration);transition-timing-function:var(--f7-panelPushTransitionTimingFunction)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-left{transform:scale(var(--f7-panelPushScale,1));transform-origin:50vw center;border-top-left-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-left .view{border-top-left-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-right{transform:scale(var(--f7-panelPushScale,1));transform-origin:calc(var(--f7-panel-left-width,var(--f7-panel-width)) - 50vw) center;border-top-right-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-right .view{border-top-right-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-cover.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-cover.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-cover.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-cover.panel-left{transform:translate3d(calc(-1 * var(--f7-panel-left-width,var(--f7-panel-width))),0,0px)}html.with-modal-popup-push .framework7-root>.panel-in.panel-cover.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-cover.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-cover.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-cover.panel-right{transform:translate3d(var(--f7-panel-right-width,var(--f7-panel-width)),0,0px)}html.with-modal-popup-push-closing .framework7-root>.panel-in,html.with-modal-sheet-push-closing .framework7-root>.panel-in{transition-duration:var(--f7-panelPushTransitionDuration);transition-timing-function:var(--f7-panelPushTransitionTimingFunction)}html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-reveal.panel-left{transform-origin:50vw center}html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-reveal.panel-right{transform-origin:calc(var(--f7-panel-right-width,var(--f7-panel-width)) - 50vw) center}.md .panel-cover{overflow:hidden}.md .panel-cover.panel-left{border-radius:0 16px 16px 0}.md .panel-cover.panel-right{border-radius:16px 0 0 16px}
3
+ ){display:none}.panel:after{pointer-events:none;opacity:0;z-index:5999;position:absolute;content:'';top:0;width:20px;height:100%;transition-property:transform,opacity;transition-duration:var(--f7-panel-transition-duration)}.panel.not-animated,.panel.not-animated:after{transition-duration:0s!important}.panel.panel-reveal.not-animated~.view,.panel.panel-reveal.not-animated~.views{transition-duration:0s!important}.panel.panel-resizing{-webkit-user-select:none;user-select:none}.panel.panel-resizing,.panel.panel-resizing:after,.panel.panel-resizing~.view,.panel.panel-resizing~.views{transition-duration:0s!important}.panel-cover,.panel-floating{z-index:6000}.panel-floating{overflow:hidden;border-radius:16px;height:auto;top:calc(8px + var(--f7-safe-area-top,0px));bottom:calc(8px + var(--f7-safe-area-bottom,0px))}.panel-floating .view,.panel-floating .views{--f7-safe-area-top:0px;--f7-safe-area-bottom:0px}.page .panel-floating{top:calc(8px + var(--f7-page-navbar-offset,0px));bottom:calc(8px + var(--f7-safe-area-bottom,0px))}.page .panel-floating .page{--f7-page-navbar-offset:0px}.page .panel-floating .navbars~*,.page .panel-floating .navbar~*{--f7-page-navbar-offset:calc(var(--f7-navbar-height))}.panel-left{left:0;width:var(--f7-panel-left-width,var(--f7-panel-width))}.panel-left.panel-cover,.panel-left.panel-floating,.panel-left.panel-push{transform:translate3d(calc(-1 * var(--f7-panel-left-width,var(--f7-panel-width))),0,0)}.panel-right{right:0;width:var(--f7-panel-right-width,var(--f7-panel-width))}.panel-right.panel-cover,.panel-right.panel-floating,.panel-right.panel-push{transform:translate3d(var(--f7-panel-right-width,var(--f7-panel-width)),0,0)}.panel-in-breakpoint{transform:translate3d(0,0,0)!important;transition-duration:0s}.panel-in-breakpoint:after{display:none}.panel-in-breakpoint.panel-cover,.panel-in-breakpoint.panel-floating{z-index:5900}.panel,.panel-backdrop{transition-timing-function:var(--f7-panel-transition-timing-function)}html.with-panel-closing .framework7-root>.view,html.with-panel-closing .views,html.with-panel-left-push .framework7-root>.view,html.with-panel-left-push .views,html.with-panel-left-reveal .framework7-root>.view,html.with-panel-left-reveal .views,html.with-panel-right-push .framework7-root>.view,html.with-panel-right-push .views,html.with-panel-right-reveal .framework7-root>.view,html.with-panel-right-reveal .views{transition-duration:var(--f7-panel-transition-duration);transition-property:transform;transition-timing-function:var(--f7-panel-transition-timing-function)}html.with-panel .framework7-root>.view .page-content,html.with-panel .framework7-root>.views .page-content{overflow:hidden;-webkit-overflow-scrolling:auto}html.with-panel-left-push .framework7-root>.view,html.with-panel-left-push .views,html.with-panel-left-reveal .framework7-root>.view,html.with-panel-left-reveal .views{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}html.with-panel-right-push .framework7-root>.view,html.with-panel-right-push .views,html.with-panel-right-reveal .framework7-root>.view,html.with-panel-right-reveal .views{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.page>.panel-backdrop{z-index:290}.page .panel-push,.page>.panel-reveal{z-index:1}.page>.panel-cover,.page>.panel-floating{z-index:300}.page.with-panel-closing>.page-content,.page.with-panel-closing>.tabs,.page.with-panel-left-push>.page-content,.page.with-panel-left-push>.tabs,.page.with-panel-left-reveal>.page-content,.page.with-panel-left-reveal>.tabs,.page.with-panel-right-push>.page-content,.page.with-panel-right-push>.tabs,.page.with-panel-right-reveal>.page-content,.page.with-panel-right-reveal>.tabs{transition-duration:var(--f7-panel-transition-duration);transition-property:transform;transition-timing-function:var(--f7-panel-transition-timing-function)}.page.with-panel-left-push>.page-content,.page.with-panel-left-push>.tabs,.page.with-panel-left-reveal>.page-content,.page.with-panel-left-reveal>.tabs{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}.page.with-panel-right-push>.page-content,.page.with-panel-right-push>.tabs,.page.with-panel-right-reveal>.page-content,.page.with-panel-right-reveal>.tabs{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.with-panel-closing .panel-backdrop-in{visibility:visible;pointer-events:auto;opacity:0}.with-panel-left-cover .panel-backdrop-in,.with-panel-left-floating .panel-backdrop-in,.with-panel-left-push .panel-backdrop-in,.with-panel-left-reveal .panel-backdrop-in,.with-panel-right-cover .panel-backdrop-in,.with-panel-right-floating .panel-backdrop-in,.with-panel-right-push .panel-backdrop-in,.with-panel-right-reveal .panel-backdrop-in{visibility:visible;pointer-events:auto;opacity:1}.with-panel-left-push .panel-backdrop-in,.with-panel-left-reveal .panel-backdrop-in{transform:translate3d(var(--f7-panel-left-width,var(--f7-panel-width)),0,0)}.with-panel-right-push .panel-backdrop-in,.with-panel-right-reveal .panel-backdrop-in{transform:translate3d(calc(-1 * var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}.with-panel-left-cover .panel-left,.with-panel-left-push .panel-left{transform:translate3d(0px,0,0)}.with-panel-left-floating .panel-left{transform:translate3d(8px,0,0)}.with-panel-right-cover .panel-right,.with-panel-right-push .panel-right{transform:translate3d(0px,0,0)}.with-panel-right-floating .panel-right{transform:translate3d(-8px,0,0)}.panel-resizable{max-width:100%}.panel-resize-handler{position:absolute;top:0;height:100%;width:6px;cursor:col-resize;z-index:6000;display:none}.panel-resizable .panel-resize-handler{display:block}.panel-left.panel-cover .panel-resize-handler,.panel-left.panel-floating .panel-resize-handler{right:-3px}.panel-left.panel-push .panel-resize-handler,.panel-resize-handler .panel-left.panel-reveal{right:0}.panel-right.panel-cover .panel-resize-handler,.panel-right.panel-floating .panel-resize-handler{left:-3px}.panel-resize-handler .panel-right.panel-reveal,.panel-right.panel-push .panel-resize-handler{left:0}.panel-left.panel-in-collapsed~.page-content,.panel-left.panel-in-collapsed~.tabs,.panel-left.panel-in-collapsed~.view,.panel-left.panel-in-collapsed~.views{margin-left:var(--f7-panel-left-collapsed-width,var(--f7-panel-collapsed-width))}.page.with-panel-left-reveal .panel-left.panel-in-collapsed~.page-content,.page.with-panel-left-reveal .panel-left.panel-in-collapsed~.tabs,html.with-panel-left-reveal .panel-left.panel-in-collapsed~.view,html.with-panel-left-reveal .panel-left.panel-in-collapsed~.views{transform:translate3d(calc(var(--f7-panel-left-width,var(--f7-panel-width)) - var(--f7-panel-left-collapsed-width,var(--f7-panel-collapsed-width))),0,0)}.panel-right.panel-in-collapsed~.page-content,.panel-right.panel-in-collapsed~.tabs,.panel-right.panel-in-collapsed~.view,.panel-right.panel-in-collapsed~.views{margin-right:var(--f7-panel-right-collapsed-width,var(--f7-panel-collapsed-width))}.page.with-panel-right-reveal .panel-right.panel-in-collapsed~.page-content,.page.with-panel-right-reveal .panel-right.panel-in-collapsed~.tabs,html.with-panel-right-reveal .panel-right.panel-in-collapsed~.view,html.with-panel-right-reveal .panel-right.panel-in-collapsed~.views{transform:translate3d(calc(var(--f7-panel-right-collapsed-width,var(--f7-panel-collapsed-width)) - var(--f7-panel-right-width,var(--f7-panel-width))),0,0)}html.with-modal-popup-push .framework7-root,html.with-modal-popup-push-closing .framework7-root{--f7-panelPushScale:var(--f7-popup-push-scale);--f7-panelPushTransitionDuration:var(--f7-popup-transition-duration);--f7-panelPushTransitionTimingFunction:var(--f7-popup-transition-timing-function);--f7-panelPushBorderRadius:var(--f7-popup-push-border-radius)}html.with-modal-sheet-push .framework7-root,html.with-modal-sheet-push-closing .framework7-root{--f7-panelPushScale:var(--f7-sheet-push-scale);--f7-panelPushTransitionDuration:var(--f7-sheet-transition-duration);--f7-panelPushTransitionTimingFunction:var(--f7-sheet-transition-timing-function);--f7-panelPushBorderRadius:var(--f7-sheet-push-border-radius)}html.with-modal-popup-push .framework7-root>.panel-in,html.with-modal-popup-push .framework7-root>.panel-out,html.with-modal-sheet-push .framework7-root>.panel-in,html.with-modal-sheet-push .framework7-root>.panel-out{transition-duration:var(--f7-panelPushTransitionDuration);transition-timing-function:var(--f7-panelPushTransitionTimingFunction)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-left{transform:scale(var(--f7-panelPushScale,1));transform-origin:50vw center;border-top-left-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-left .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-left .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-left .view{border-top-left-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-right{transform:scale(var(--f7-panelPushScale,1));transform-origin:calc(var(--f7-panel-left-width,var(--f7-panel-width)) - 50vw) center;border-top-right-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-push.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-in.panel-reveal.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-push.panel-right .view,html.with-modal-popup-push .framework7-root>.panel-out.panel-reveal.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-push.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-in.panel-reveal.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-push.panel-right .view,html.with-modal-sheet-push .framework7-root>.panel-out.panel-reveal.panel-right .view{border-top-right-radius:var(--f7-panelPushBorderRadius)}html.with-modal-popup-push .framework7-root>.panel-in.panel-cover.panel-left,html.with-modal-popup-push .framework7-root>.panel-out.panel-cover.panel-left,html.with-modal-sheet-push .framework7-root>.panel-in.panel-cover.panel-left,html.with-modal-sheet-push .framework7-root>.panel-out.panel-cover.panel-left{transform:translate3d(calc(-1 * var(--f7-panel-left-width,var(--f7-panel-width))),0,0px)}html.with-modal-popup-push .framework7-root>.panel-in.panel-cover.panel-right,html.with-modal-popup-push .framework7-root>.panel-out.panel-cover.panel-right,html.with-modal-sheet-push .framework7-root>.panel-in.panel-cover.panel-right,html.with-modal-sheet-push .framework7-root>.panel-out.panel-cover.panel-right{transform:translate3d(var(--f7-panel-right-width,var(--f7-panel-width)),0,0px)}html.with-modal-popup-push-closing .framework7-root>.panel-in,html.with-modal-sheet-push-closing .framework7-root>.panel-in{transition-duration:var(--f7-panelPushTransitionDuration);transition-timing-function:var(--f7-panelPushTransitionTimingFunction)}html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-reveal.panel-left,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-push.panel-left,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-reveal.panel-left{transform-origin:50vw center}html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-popup-push-closing .framework7-root>.panel-in.panel-reveal.panel-right,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-push.panel-right,html.with-modal-sheet-push-closing .framework7-root>.panel-in.panel-reveal.panel-right{transform-origin:calc(var(--f7-panel-right-width,var(--f7-panel-width)) - 50vw) center}.md .panel-cover{overflow:hidden}.md .panel-cover.panel-left{border-radius:0 16px 16px 0}.md .panel-cover.panel-right{border-radius:16px 0 0 16px}
package/components/panel/panel.less CHANGED
@@ -258,6 +258,9 @@ html {
258
258
  .with-panel-right-floating .panel-right {
259
259
  transform: translate3d(-8px, 0, 0);
260
260
  }
261
+ .panel-resizable {
262
+ max-width: 100%;
263
+ }
261
264
  .panel-resize-handler {
262
265
  position: absolute;
263
266
  top: 0;
@@ -269,14 +272,16 @@ html {
269
272
  .panel-resizable & {
270
273
  display: block;
271
274
  }
272
- .panel-left.panel-cover & {
275
+ .panel-left.panel-cover &,
276
+ .panel-left.panel-floating & {
273
277
  right: -3px;
274
278
  }
275
279
  .panel-left.panel-reveal,
276
280
  .panel-left.panel-push & {
277
281
  right: 0;
278
282
  }
279
- .panel-right.panel-cover & {
283
+ .panel-right.panel-cover &,
284
+ .panel-right.panel-floating & {
280
285
  left: -3px;
281
286
  }
282
287
  .panel-right.panel-reveal,
package/components/panel/resizable-panel.js CHANGED
@@ -27,6 +27,7 @@ function resizablePanel(panel) {
27
27
  let panelMinWidth;
28
28
  let panelMaxWidth;
29
29
  let visibleByBreakpoint;
30
+ const isPushingPanel = effect !== 'cover' && effect !== 'floating';
30
31
  function transformCSSWidth(v) {
31
32
  if (!v) return null;
32
33
  if (v.indexOf('%') >= 0 || v.indexOf('vw') >= 0) {
@@ -57,13 +58,13 @@ function resizablePanel(panel) {
57
58
  $el.transition(0);
58
59
  $el.addClass('panel-resizing');
59
60
  $htmlEl.css('cursor', 'col-resize');
60
- if (effect !== 'cover' || visibleByBreakpoint) {
61
+ if (isPushingPanel || visibleByBreakpoint) {
61
62
  $viewEl = $(panel.getViewEl());
62
63
  if (panel.$containerEl && panel.$containerEl.hasClass('page')) {
63
64
  $viewEl.add(panel.$containerEl.children('.page-content, .tabs, .fab'));
64
65
  }
65
66
  }
66
- if (effect !== 'cover' && !visibleByBreakpoint) {
67
+ if (isPushingPanel && !visibleByBreakpoint) {
67
68
  $backdropEl.transition(0);
68
69
  $viewEl.transition(0);
69
70
  }
@@ -81,7 +82,7 @@ function resizablePanel(panel) {
81
82
  newPanelWidth = Math.min(Math.max(newPanelWidth, 0), app.width);
82
83
  panel.resizableWidth = newPanelWidth;
83
84
  $el[0].style.width = `${newPanelWidth}px`;
84
- if (effect !== 'cover' && !visibleByBreakpoint) {
85
+ if (isPushingPanel && !visibleByBreakpoint) {
85
86
  if ($viewEl) {
86
87
  $viewEl.transform(`translate3d(${side === 'left' ? newPanelWidth : -newPanelWidth}px, 0, 0)`);
87
88
  }
@@ -105,14 +106,14 @@ function resizablePanel(panel) {
105
106
  isMoved = false;
106
107
  $htmlEl[0].style.setProperty(`--f7-panel-${side}-width`, `${panel.resizableWidth}px`);
107
108
  $el[0].style.width = '';
108
- if (effect !== 'cover' && !visibleByBreakpoint) {
109
+ if (isPushingPanel && !visibleByBreakpoint) {
109
110
  $viewEl.transform('');
110
111
  $backdropEl.transform('');
111
112
  }
112
113
  $el.removeClass('panel-resizing');
113
114
  nextFrame(() => {
114
115
  $el.transition('');
115
- if (effect !== 'cover') {
116
+ if (isPushingPanel) {
116
117
  $backdropEl.transition('');
117
118
  if ($viewEl) $viewEl.transition('');
118
119
  }
package/components/picker/picker-rtl.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-picker-height:260px;--f7-picker-inline-height:200px;--f7-picker-popover-height:260px;--f7-picker-popover-width:280px;--f7-picker-landscape-height:200px;--f7-picker-item-height:36px}.ios{--f7-picker-column-font-size:20px;--f7-picker-item-selected-text-color:#000;--f7-picker-item-selected-bg-color:rgba(0, 0, 0, 0.12);--f7-picker-divider-text-color:#000;--f7-picker-item-text-color:rgba(0, 0, 0, 0.45)}.ios .dark,.ios.dark{--f7-picker-item-selected-text-color:#fff;--f7-picker-item-selected-bg-color:rgba(255, 255, 255, 0.1);--f7-picker-divider-text-color:#fff;--f7-picker-item-text-color:rgba(255, 255, 255, 0.55)}.md{--f7-picker-column-font-size:20px}.md,.md .dark,.md [class*=color-]{--f7-picker-item-selected-text-color:var(--f7-md-on-surface);--f7-picker-item-text-color:var(--f7-md-on-surface-variant);--f7-picker-divider-text-color:var(--f7-md-on-surface);--f7-picker-item-selected-border-color:var(--f7-md-outline)}.picker{width:100%;height:var(--f7-picker-height)}.picker.picker-inline{height:var(--f7-picker-inline-height)}.popover .picker{height:var(--f7-picker-popover-height)}@media (orientation:landscape) and (max-height:415px){.picker:not(.picker-inline){height:var(--f7-picker-landscape-height)}}.picker.sheet-modal{background:var(--f7-picker-sheet-bg-color,var(--f7-sheet-bg-color))}.picker-popover{width:var(--f7-picker-popover-width)}.picker-popover .toolbar{background:0 0;border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.picker-popover .toolbar:before{display:none!important}.picker-popover .toolbar+.picker-columns{height:calc(100% - var(--f7-toolbar-height))}.picker-columns{display:flex;overflow:hidden;justify-content:center;padding:0;text-align:right;height:100%;position:relative;font-size:var(--f7-picker-column-font-size);--f7-picker-mask-bg-color:transparent}.popover .picker-columns{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.picker-columns::after,.picker-columns::before{content:'';position:absolute;left:0;width:100%;height:20%;z-index:100;pointer-events:none}.page .picker-columns{--f7-picker-mask-bg-color:var(--f7-page-bg-color)}.block-strong .picker-columns{--f7-picker-mask-bg-color:var(--f7-block-strong-bg-color)}.picker-sheet .picker-columns{--f7-picker-mask-bg-color:var(--f7-picker-sheet-bg-color, var(--f7-sheet-bg-color))}.picker-popover .picker-columns{--f7-picker-mask-bg-color:var(--f7-popover-bg-color)}.picker-columns::before{top:0;background-image:linear-gradient(to bottom,var(--f7-picker-mask-bg-color),transparent)}.picker-columns::after{bottom:0;background-image:linear-gradient(to top,var(--f7-picker-mask-bg-color),transparent)}.picker-column{position:relative;max-height:100%;z-index:10}.picker-column.picker-column-left{text-align:left}.picker-column.picker-column-center{text-align:center}.picker-column.picker-column-right{text-align:right}.picker-column.picker-column-divider{display:flex;align-items:center;color:var(--f7-picker-divider-text-color)}.picker-items{overflow:auto;scrollbar-width:none;scroll-snap-type:y mandatory;height:100%;box-sizing:border-box;padding:var(--f7-picker-scroll-padding,0px) 0px}.picker-items::-webkit-scrollbar{display:none;opacity:0}.picker-item{height:var(--f7-picker-item-height);line-height:var(--f7-picker-item-height);white-space:nowrap;position:relative;overflow:hidden;text-overflow:ellipsis;left:0;top:0;width:100%;box-sizing:border-box;color:var(--f7-picker-item-text-color);cursor:pointer;scroll-snap-align:center}.picker-item span{padding:0 10px}.picker-item.picker-item-far{pointer-events:none}.picker-item.picker-item-selected{color:var(--f7-picker-item-selected-text-color);transform:translate3d(0,0,0) rotateX(0deg)}.picker-column-free-mode .picker-item{scroll-snap-align:none}.picker-center-highlight{height:var(--f7-picker-item-height);box-sizing:border-box;position:absolute;top:50%;margin-top:calc(-1 * var(--f7-picker-item-height)/ 2);pointer-events:none}.picker-3d .picker-columns{overflow:hidden}.picker-3d .picker-column,.picker-3d .picker-item,.picker-3d .picker-items{transform-style:preserve-3d}.picker-3d .picker-column{overflow:visible}.picker-3d .picker-item{perspective:1200px;overflow:visible}.picker-3d .picker-item>span{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:block;transform-style:preserve-3d;position:relative;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;max-width:100%;transform-origin:center center -100px}.ios .picker-center-highlight{left:16px;right:16px;background-color:var(--f7-picker-item-selected-bg-color);border-radius:8px}.popover .ios .picker-center-highlight{left:8px;right:8px}.md .picker-center-highlight{left:0;right:0;border-top:1px solid var(--f7-md-outline);border-bottom:1px solid var(--f7-md-outline)}
1
+ :root{--f7-picker-height:260px;--f7-picker-inline-height:200px;--f7-picker-popover-height:260px;--f7-picker-popover-width:280px;--f7-picker-landscape-height:200px;--f7-picker-item-height:36px}.ios{--f7-picker-column-font-size:20px;--f7-picker-item-selected-text-color:#000;--f7-picker-item-selected-bg-color:rgba(0, 0, 0, 0.12);--f7-picker-divider-text-color:#000;--f7-picker-item-text-color:rgba(0, 0, 0, 0.45)}.ios .dark,.ios.dark{--f7-picker-item-selected-text-color:#fff;--f7-picker-item-selected-bg-color:rgba(255, 255, 255, 0.1);--f7-picker-divider-text-color:#fff;--f7-picker-item-text-color:rgba(255, 255, 255, 0.55)}.md{--f7-picker-column-font-size:20px}.md,.md .dark,.md [class*=color-]{--f7-picker-item-selected-text-color:var(--f7-md-on-surface);--f7-picker-item-text-color:var(--f7-md-on-surface-variant);--f7-picker-divider-text-color:var(--f7-md-on-surface);--f7-picker-item-selected-border-color:var(--f7-md-outline)}.picker{width:100%;height:var(--f7-picker-height)}.picker.picker-inline{height:var(--f7-picker-inline-height)}.popover .picker{height:var(--f7-picker-popover-height)}@media (orientation:landscape) and (max-height:415px){.picker:not(.picker-inline){height:var(--f7-picker-landscape-height)}}.picker.sheet-modal{background:var(--f7-picker-sheet-bg-color,var(--f7-sheet-bg-color))}.picker-popover{width:var(--f7-picker-popover-width)}.picker-popover .toolbar{background:0 0;border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.picker-popover .toolbar:before{display:none!important}.picker-popover .toolbar+.picker-columns{height:calc(100% - var(--f7-toolbar-height))}.picker-columns{display:flex;overflow:hidden;justify-content:center;padding:0;text-align:right;height:100%;position:relative;font-size:var(--f7-picker-column-font-size);--f7-picker-mask-bg-color:transparent}.popover .picker-columns{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.picker-columns::after,.picker-columns::before{content:'';position:absolute;left:0;width:100%;height:20%;z-index:100;pointer-events:none}.page .picker-columns{--f7-picker-mask-bg-color:var(--f7-page-bg-color)}.block-strong .picker-columns{--f7-picker-mask-bg-color:var(--f7-block-strong-bg-color)}.picker-sheet .picker-columns{--f7-picker-mask-bg-color:var(--f7-picker-sheet-bg-color, var(--f7-sheet-bg-color))}.picker-popover .picker-columns{--f7-picker-mask-bg-color:var(--f7-popover-bg-color)}.picker-columns::before{top:0;background-image:linear-gradient(to bottom,var(--f7-picker-mask-bg-color),transparent)}.picker-columns::after{bottom:0;background-image:linear-gradient(to top,var(--f7-picker-mask-bg-color),transparent)}.picker-column{position:relative;max-height:100%;z-index:10}.picker-column.picker-column-first.picker-column-last{width:100%}.picker-column.picker-column-left{text-align:left}.picker-column.picker-column-center{text-align:center}.picker-column.picker-column-right{text-align:right}.picker-column.picker-column-divider{display:flex;align-items:center;color:var(--f7-picker-divider-text-color)}.picker-items{overflow:auto;scroll-snap-type:y mandatory;height:100%;box-sizing:border-box;padding:var(--f7-picker-scroll-padding,0px) 0px;scrollbar-width:none;scrollbar-color:transparent}.picker-items::-webkit-scrollbar{-webkit-appearance:none;appearance:none;width:0px;display:none;opacity:0;background:0 0}.picker-items::-webkit-scrollbar-track{box-shadow:none;background:0 0}.picker-items::-webkit-scrollbar-thumb{background-color:transparent;outline:0;border-radius:9999px;position:relative}.picker-item{height:var(--f7-picker-item-height);line-height:var(--f7-picker-item-height);white-space:nowrap;position:relative;overflow:hidden;text-overflow:ellipsis;left:0;top:0;width:100%;box-sizing:border-box;color:var(--f7-picker-item-text-color);cursor:pointer;scroll-snap-align:center}.picker-item span{padding:0 10px}.picker-item.picker-item-far{pointer-events:none}.picker-item.picker-item-selected{color:var(--f7-picker-item-selected-text-color);transform:translate3d(0,0,0) rotateX(0deg)}.picker-column-free-mode .picker-item{scroll-snap-align:none}.picker-center-highlight{height:var(--f7-picker-item-height);box-sizing:border-box;position:absolute;top:50%;margin-top:calc(-1 * var(--f7-picker-item-height)/ 2);pointer-events:none}.picker-3d .picker-columns{overflow:hidden}.picker-3d .picker-column,.picker-3d .picker-item,.picker-3d .picker-items{transform-style:preserve-3d}.picker-3d .picker-column{overflow:visible}.picker-3d .picker-item{perspective:1200px;overflow:visible}.picker-3d .picker-item>span{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:block;transform-style:preserve-3d;position:relative;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;max-width:100%;transform-origin:center center -100px}.ios .picker-center-highlight{left:16px;right:16px;background-color:var(--f7-picker-item-selected-bg-color);border-radius:8px}.popover .ios .picker-center-highlight{left:8px;right:8px}.md .picker-center-highlight{left:0;right:0;border-top:1px solid var(--f7-md-outline);border-bottom:1px solid var(--f7-md-outline)}
package/components/picker/picker.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-picker-height:260px;--f7-picker-inline-height:200px;--f7-picker-popover-height:260px;--f7-picker-popover-width:280px;--f7-picker-landscape-height:200px;--f7-picker-item-height:36px}.ios{--f7-picker-column-font-size:20px;--f7-picker-item-selected-text-color:#000;--f7-picker-item-selected-bg-color:rgba(0, 0, 0, 0.12);--f7-picker-divider-text-color:#000;--f7-picker-item-text-color:rgba(0, 0, 0, 0.45)}.ios .dark,.ios.dark{--f7-picker-item-selected-text-color:#fff;--f7-picker-item-selected-bg-color:rgba(255, 255, 255, 0.1);--f7-picker-divider-text-color:#fff;--f7-picker-item-text-color:rgba(255, 255, 255, 0.55)}.md{--f7-picker-column-font-size:20px}.md,.md .dark,.md [class*=color-]{--f7-picker-item-selected-text-color:var(--f7-md-on-surface);--f7-picker-item-text-color:var(--f7-md-on-surface-variant);--f7-picker-divider-text-color:var(--f7-md-on-surface);--f7-picker-item-selected-border-color:var(--f7-md-outline)}.picker{width:100%;height:var(--f7-picker-height)}.picker.picker-inline{height:var(--f7-picker-inline-height)}.popover .picker{height:var(--f7-picker-popover-height)}@media (orientation:landscape) and (max-height:415px){.picker:not(.picker-inline){height:var(--f7-picker-landscape-height)}}.picker.sheet-modal{background:var(--f7-picker-sheet-bg-color,var(--f7-sheet-bg-color))}.picker-popover{width:var(--f7-picker-popover-width)}.picker-popover .toolbar{background:0 0;border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.picker-popover .toolbar:before{display:none!important}.picker-popover .toolbar+.picker-columns{height:calc(100% - var(--f7-toolbar-height))}.picker-columns{display:flex;overflow:hidden;justify-content:center;padding:0;text-align:right;height:100%;position:relative;font-size:var(--f7-picker-column-font-size);--f7-picker-mask-bg-color:transparent}.popover .picker-columns{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.picker-columns::after,.picker-columns::before{content:'';position:absolute;left:0;width:100%;height:20%;z-index:100;pointer-events:none}.page .picker-columns{--f7-picker-mask-bg-color:var(--f7-page-bg-color)}.block-strong .picker-columns{--f7-picker-mask-bg-color:var(--f7-block-strong-bg-color)}.picker-sheet .picker-columns{--f7-picker-mask-bg-color:var(--f7-picker-sheet-bg-color, var(--f7-sheet-bg-color))}.picker-popover .picker-columns{--f7-picker-mask-bg-color:var(--f7-popover-bg-color)}.picker-columns::before{top:0;background-image:linear-gradient(to bottom,var(--f7-picker-mask-bg-color),transparent)}.picker-columns::after{bottom:0;background-image:linear-gradient(to top,var(--f7-picker-mask-bg-color),transparent)}.picker-column{position:relative;max-height:100%;z-index:10}.picker-column.picker-column-left{text-align:left}.picker-column.picker-column-center{text-align:center}.picker-column.picker-column-right{text-align:right}.picker-column.picker-column-divider{display:flex;align-items:center;color:var(--f7-picker-divider-text-color)}.picker-items{overflow:auto;scrollbar-width:none;scroll-snap-type:y mandatory;height:100%;box-sizing:border-box;padding:var(--f7-picker-scroll-padding,0px) 0px}.picker-items::-webkit-scrollbar{display:none;opacity:0}.picker-item{height:var(--f7-picker-item-height);line-height:var(--f7-picker-item-height);white-space:nowrap;position:relative;overflow:hidden;text-overflow:ellipsis;left:0;top:0;width:100%;box-sizing:border-box;color:var(--f7-picker-item-text-color);cursor:pointer;scroll-snap-align:center}.picker-item span{padding:0 10px}.picker-item.picker-item-far{pointer-events:none}.picker-item.picker-item-selected{color:var(--f7-picker-item-selected-text-color);transform:translate3d(0,0,0) rotateX(0deg)}.picker-column-free-mode .picker-item{scroll-snap-align:none}.picker-center-highlight{height:var(--f7-picker-item-height);box-sizing:border-box;position:absolute;top:50%;margin-top:calc(-1 * var(--f7-picker-item-height)/ 2);pointer-events:none}.picker-3d .picker-columns{overflow:hidden}.picker-3d .picker-column,.picker-3d .picker-item,.picker-3d .picker-items{transform-style:preserve-3d}.picker-3d .picker-column{overflow:visible}.picker-3d .picker-item{perspective:1200px;overflow:visible}.picker-3d .picker-item>span{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:block;transform-style:preserve-3d;position:relative;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;max-width:100%;transform-origin:center center -100px}.ios .picker-center-highlight{left:16px;right:16px;background-color:var(--f7-picker-item-selected-bg-color);border-radius:8px}.popover .ios .picker-center-highlight{left:8px;right:8px}.md .picker-center-highlight{left:0;right:0;border-top:1px solid var(--f7-md-outline);border-bottom:1px solid var(--f7-md-outline)}
1
+ :root{--f7-picker-height:260px;--f7-picker-inline-height:200px;--f7-picker-popover-height:260px;--f7-picker-popover-width:280px;--f7-picker-landscape-height:200px;--f7-picker-item-height:36px}.ios{--f7-picker-column-font-size:20px;--f7-picker-item-selected-text-color:#000;--f7-picker-item-selected-bg-color:rgba(0, 0, 0, 0.12);--f7-picker-divider-text-color:#000;--f7-picker-item-text-color:rgba(0, 0, 0, 0.45)}.ios .dark,.ios.dark{--f7-picker-item-selected-text-color:#fff;--f7-picker-item-selected-bg-color:rgba(255, 255, 255, 0.1);--f7-picker-divider-text-color:#fff;--f7-picker-item-text-color:rgba(255, 255, 255, 0.55)}.md{--f7-picker-column-font-size:20px}.md,.md .dark,.md [class*=color-]{--f7-picker-item-selected-text-color:var(--f7-md-on-surface);--f7-picker-item-text-color:var(--f7-md-on-surface-variant);--f7-picker-divider-text-color:var(--f7-md-on-surface);--f7-picker-item-selected-border-color:var(--f7-md-outline)}.picker{width:100%;height:var(--f7-picker-height)}.picker.picker-inline{height:var(--f7-picker-inline-height)}.popover .picker{height:var(--f7-picker-popover-height)}@media (orientation:landscape) and (max-height:415px){.picker:not(.picker-inline){height:var(--f7-picker-landscape-height)}}.picker.sheet-modal{background:var(--f7-picker-sheet-bg-color,var(--f7-sheet-bg-color))}.picker-popover{width:var(--f7-picker-popover-width)}.picker-popover .toolbar{background:0 0;border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0}.picker-popover .toolbar:before{display:none!important}.picker-popover .toolbar+.picker-columns{height:calc(100% - var(--f7-toolbar-height))}.picker-columns{display:flex;overflow:hidden;justify-content:center;padding:0;text-align:right;height:100%;position:relative;font-size:var(--f7-picker-column-font-size);--f7-picker-mask-bg-color:transparent}.popover .picker-columns{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.picker-columns::after,.picker-columns::before{content:'';position:absolute;left:0;width:100%;height:20%;z-index:100;pointer-events:none}.page .picker-columns{--f7-picker-mask-bg-color:var(--f7-page-bg-color)}.block-strong .picker-columns{--f7-picker-mask-bg-color:var(--f7-block-strong-bg-color)}.picker-sheet .picker-columns{--f7-picker-mask-bg-color:var(--f7-picker-sheet-bg-color, var(--f7-sheet-bg-color))}.picker-popover .picker-columns{--f7-picker-mask-bg-color:var(--f7-popover-bg-color)}.picker-columns::before{top:0;background-image:linear-gradient(to bottom,var(--f7-picker-mask-bg-color),transparent)}.picker-columns::after{bottom:0;background-image:linear-gradient(to top,var(--f7-picker-mask-bg-color),transparent)}.picker-column{position:relative;max-height:100%;z-index:10}.picker-column.picker-column-first.picker-column-last{width:100%}.picker-column.picker-column-left{text-align:left}.picker-column.picker-column-center{text-align:center}.picker-column.picker-column-right{text-align:right}.picker-column.picker-column-divider{display:flex;align-items:center;color:var(--f7-picker-divider-text-color)}.picker-items{overflow:auto;scroll-snap-type:y mandatory;height:100%;box-sizing:border-box;padding:var(--f7-picker-scroll-padding,0px) 0px;scrollbar-width:none;scrollbar-color:transparent}.picker-items::-webkit-scrollbar{-webkit-appearance:none;appearance:none;width:0px;display:none;opacity:0;background:0 0}.picker-items::-webkit-scrollbar-track{box-shadow:none;background:0 0}.picker-items::-webkit-scrollbar-thumb{background-color:transparent;outline:0;border-radius:9999px;position:relative}.picker-item{height:var(--f7-picker-item-height);line-height:var(--f7-picker-item-height);white-space:nowrap;position:relative;overflow:hidden;text-overflow:ellipsis;left:0;top:0;width:100%;box-sizing:border-box;color:var(--f7-picker-item-text-color);cursor:pointer;scroll-snap-align:center}.picker-item span{padding:0 10px}.picker-item.picker-item-far{pointer-events:none}.picker-item.picker-item-selected{color:var(--f7-picker-item-selected-text-color);transform:translate3d(0,0,0) rotateX(0deg)}.picker-column-free-mode .picker-item{scroll-snap-align:none}.picker-center-highlight{height:var(--f7-picker-item-height);box-sizing:border-box;position:absolute;top:50%;margin-top:calc(-1 * var(--f7-picker-item-height)/ 2);pointer-events:none}.picker-3d .picker-columns{overflow:hidden}.picker-3d .picker-column,.picker-3d .picker-item,.picker-3d .picker-items{transform-style:preserve-3d}.picker-3d .picker-column{overflow:visible}.picker-3d .picker-item{perspective:1200px;overflow:visible}.picker-3d .picker-item>span{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:block;transform-style:preserve-3d;position:relative;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;max-width:100%;transform-origin:center center -100px}.ios .picker-center-highlight{left:16px;right:16px;background-color:var(--f7-picker-item-selected-bg-color);border-radius:8px}.popover .ios .picker-center-highlight{left:8px;right:8px}.md .picker-center-highlight{left:0;right:0;border-top:1px solid var(--f7-md-outline);border-bottom:1px solid var(--f7-md-outline)}
package/components/picker/picker.less CHANGED
@@ -78,6 +78,9 @@
78
78
  position: relative;
79
79
  max-height: 100%;
80
80
  z-index: 10;
81
+ &.picker-column-first.picker-column-last {
82
+ width: 100%;
83
+ }
81
84
 
82
85
  &.picker-column-left {
83
86
  text-align: left;
@@ -101,10 +104,7 @@
101
104
  height: 100%;
102
105
  box-sizing: border-box;
103
106
  padding: var(--f7-picker-scroll-padding, 0px) 0px;
104
- &::-webkit-scrollbar {
105
- display: none;
106
- opacity: 0;
107
- }
107
+ .no-scrollbar();
108
108
  }
109
109
  .picker-item {
110
110
  height: var(--f7-picker-item-height);
package/components/pull-to-refresh/pull-to-refresh-md.less CHANGED
@@ -3,7 +3,8 @@
3
3
  .ptr-preloader {
4
4
  width: var(--f7-ptr-size);
5
5
  border-radius: 50%;
6
- background: #fff;
6
+ background: var(--f7-ptr-preloader-bg-color);
7
+ --f7-preloader-color: var(--f7-ptr-preloader-color);
7
8
 
8
9
  margin-top: calc(-1 * var(--f7-ptr-size));
9
10
  z-index: 100;
package/components/pull-to-refresh/pull-to-refresh-rtl.css CHANGED
@@ -1 +1 @@
1
- .ios{--f7-ptr-preloader-size:28px;--f7-ptr-size:44px}.md{--f7-ptr-preloader-size:22px;--f7-ptr-size:40px}.ptr-preloader{position:relative;top:var(--f7-ptr-top,0);height:var(--f7-ptr-size);pointer-events:none}.ptr-preloader .preloader{position:absolute;left:50%;width:var(--f7-ptr-preloader-size);height:var(--f7-ptr-preloader-size);margin-left:calc(-1 * var(--f7-ptr-preloader-size)/ 2);margin-top:calc(-1 * var(--f7-ptr-preloader-size)/ 2);top:50%;visibility:hidden}.ptr-bottom .ptr-preloader{top:auto;bottom:0;position:fixed}.ptr-with-navbar-large-transparent .ptr-preloader,.ptr-with-navbar-transparent .ptr-preloader{top:calc(-1 * var(--f7-page-navbar-offset,0px) + var(--f7-safe-area-top))}.ios .ptr-preloader{margin-bottom:calc(-1 * var(--f7-ptr-size));width:100%;left:0;top:0;position:relative}.ios .ptr-preloader .preloader{visibility:visible}.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader,.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader-inner{animation:none}.ios .ptr-content.ptr-closing .ptr-preloader .preloader-inner-line,.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up):not(.ptr-pull-down) .ptr-preloader .preloader-inner-line{opacity:0!important}.ios .ptr-refreshing>*,.ios .ptr-transitioning>*{transition-duration:.2s;transition-property:transform}.ios .ptr-transitioning .ptr-preloader .preloader-inner-line{transition-duration:.2s}.ios .ptr-pull-up .ptr-preloader .preloader{animation:ios-ptr-preloader-spin 1s ease-out forwards}.ios .ptr-refreshing:not(.ptr-bottom){transform:none}.ios .ptr-refreshing:not(.ptr-bottom)>*{transform:translate3d(0,var(--f7-ptr-size),0)}.ios .ptr-refreshing:not(.ptr-bottom)>.ptr-preloader{transform:translate3d(0,0,0)}.ios .ptr-bottom .ptr-preloader{margin-bottom:0;margin-top:calc(-1 * var(--f7-ptr-size));position:relative}.ios .ptr-bottom.ptr-refreshing>*,.ios .ptr-bottom.ptr-transitioning>*{transition-duration:.3s;transition-property:transform}.ios .ptr-bottom.ptr-refreshing{transform:none}.ios .ptr-bottom.ptr-refreshing>*{transform:translate3d(0,calc(-1 * var(--f7-ptr-size)),0)}.ios .ptr-bottom.ptr-refreshing>.ptr-preloader{transform:translate3d(0,0,0)}@keyframes ios-ptr-preloader-spin{from{transform:rotate(0deg)}to{transform:rotate(135deg)}}.md{--f7-ptr-top:-4px}.md .ptr-preloader{width:var(--f7-ptr-size);border-radius:50%;background:#fff;margin-top:calc(-1 * var(--f7-ptr-size));z-index:100;box-shadow:0px 2px 1px -1px rgba(0,0,0,.2),0px 1px 1px 0px rgba(0,0,0,.14),0px 1px 3px 0px rgba(0,0,0,.12);right:50%;margin-right:calc(-1 * var(--f7-ptr-size)/ 2)}.md .ptr-preloader .preloader circle{stroke-width:4}.md .ptr-arrow{width:22px;height:22px;box-sizing:border-box;border:3px solid var(--f7-preloader-color);position:absolute;left:50%;top:50%;margin-left:-11px;margin-top:-11px;border-left-color:transparent;border-radius:50%;opacity:1;transform:rotate(150deg)}.md .ptr-arrow:after{content:'';width:0px;height:0px;position:absolute;left:-5px;bottom:0px;border-bottom-width:6px;border-bottom-style:solid;border-bottom-color:inherit;border-left:5px solid transparent;border-right:5px solid transparent;transform:rotate(-40deg)}.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader,.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader-inner,.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader circle{animation:none}.md .ptr-pull-up .ptr-preloader .preloader,.md .ptr-refreshing .ptr-preloader .preloader{visibility:visible}.md .ptr-pull-up .ptr-arrow,.md .ptr-refreshing .ptr-arrow{visibility:hidden}.md .ptr-refreshing .ptr-preloader{transform:translate3d(0,66px,0)}.md .ptr-transitioning .ptr-arrow{transition:.3s}.md .ptr-pull-up .ptr-arrow{transition:.4s;transform:rotate(620deg)!important;opacity:0}.md .ptr-refreshing .ptr-preloader,.md .ptr-transitioning .ptr-preloader{transition-duration:.3s;transition-property:transform,opacity}.md .ptr-bottom .ptr-preloader{margin-top:0;margin-bottom:calc(-1 * var(--f7-ptr-size) - 4px)}.md .ptr-bottom.ptr-refreshing .ptr-preloader{transform:translate3d(0,-66px,0)}.md .ptr-with-navbar-large-transparent .ptr-preloader,.md .ptr-with-navbar-transparent .ptr-preloader{opacity:0}.md .ptr-with-navbar-large-transparent.ptr-pull-down .ptr-preloader,.md .ptr-with-navbar-large-transparent.ptr-pull-up .ptr-preloader,.md .ptr-with-navbar-large-transparent.ptr-refreshing .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-pull-down .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-pull-up .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-refreshing .ptr-preloader{opacity:1}.md .ptr-with-navbar-large-transparent.ptr-closing .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-closing .ptr-preloader{opacity:0;transition-duration:.3s}
1
+ .ios{--f7-ptr-preloader-size:28px;--f7-ptr-size:44px}.md{--f7-ptr-preloader-size:22px;--f7-ptr-size:40px}.md,.md .dark,.md [class*=color-]{--f7-ptr-preloader-bg-color:var(--f7-md-surface-1);--f7-ptr-preloader-color:var(--f7-md-primary)}.ptr-preloader{position:relative;top:var(--f7-ptr-top,0);height:var(--f7-ptr-size);pointer-events:none}.ptr-preloader .preloader{position:absolute;left:50%;width:var(--f7-ptr-preloader-size);height:var(--f7-ptr-preloader-size);margin-left:calc(-1 * var(--f7-ptr-preloader-size)/ 2);margin-top:calc(-1 * var(--f7-ptr-preloader-size)/ 2);top:50%;visibility:hidden}.ptr-bottom .ptr-preloader{top:auto;bottom:0;position:fixed}.ptr-with-navbar-large-transparent .ptr-preloader,.ptr-with-navbar-transparent .ptr-preloader{top:calc(-1 * var(--f7-page-navbar-offset,0px) + var(--f7-safe-area-top))}.ios .ptr-preloader{margin-bottom:calc(-1 * var(--f7-ptr-size));width:100%;left:0;top:0;position:relative}.ios .ptr-preloader .preloader{visibility:visible}.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader,.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader-inner{animation:none}.ios .ptr-content.ptr-closing .ptr-preloader .preloader-inner-line,.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up):not(.ptr-pull-down) .ptr-preloader .preloader-inner-line{opacity:0!important}.ios .ptr-refreshing>*,.ios .ptr-transitioning>*{transition-duration:.2s;transition-property:transform}.ios .ptr-transitioning .ptr-preloader .preloader-inner-line{transition-duration:.2s}.ios .ptr-pull-up .ptr-preloader .preloader{animation:ios-ptr-preloader-spin 1s ease-out forwards}.ios .ptr-refreshing:not(.ptr-bottom){transform:none}.ios .ptr-refreshing:not(.ptr-bottom)>*{transform:translate3d(0,var(--f7-ptr-size),0)}.ios .ptr-refreshing:not(.ptr-bottom)>.ptr-preloader{transform:translate3d(0,0,0)}.ios .ptr-bottom .ptr-preloader{margin-bottom:0;margin-top:calc(-1 * var(--f7-ptr-size));position:relative}.ios .ptr-bottom.ptr-refreshing>*,.ios .ptr-bottom.ptr-transitioning>*{transition-duration:.3s;transition-property:transform}.ios .ptr-bottom.ptr-refreshing{transform:none}.ios .ptr-bottom.ptr-refreshing>*{transform:translate3d(0,calc(-1 * var(--f7-ptr-size)),0)}.ios .ptr-bottom.ptr-refreshing>.ptr-preloader{transform:translate3d(0,0,0)}@keyframes ios-ptr-preloader-spin{from{transform:rotate(0deg)}to{transform:rotate(135deg)}}.md{--f7-ptr-top:-4px}.md .ptr-preloader{width:var(--f7-ptr-size);border-radius:50%;background:var(--f7-ptr-preloader-bg-color);--f7-preloader-color:var(--f7-ptr-preloader-color);margin-top:calc(-1 * var(--f7-ptr-size));z-index:100;box-shadow:0px 2px 1px -1px rgba(0,0,0,.2),0px 1px 1px 0px rgba(0,0,0,.14),0px 1px 3px 0px rgba(0,0,0,.12);right:50%;margin-right:calc(-1 * var(--f7-ptr-size)/ 2)}.md .ptr-preloader .preloader circle{stroke-width:4}.md .ptr-arrow{width:22px;height:22px;box-sizing:border-box;border:3px solid var(--f7-preloader-color);position:absolute;left:50%;top:50%;margin-left:-11px;margin-top:-11px;border-left-color:transparent;border-radius:50%;opacity:1;transform:rotate(150deg)}.md .ptr-arrow:after{content:'';width:0px;height:0px;position:absolute;left:-5px;bottom:0px;border-bottom-width:6px;border-bottom-style:solid;border-bottom-color:inherit;border-left:5px solid transparent;border-right:5px solid transparent;transform:rotate(-40deg)}.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader,.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader-inner,.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader circle{animation:none}.md .ptr-pull-up .ptr-preloader .preloader,.md .ptr-refreshing .ptr-preloader .preloader{visibility:visible}.md .ptr-pull-up .ptr-arrow,.md .ptr-refreshing .ptr-arrow{visibility:hidden}.md .ptr-refreshing .ptr-preloader{transform:translate3d(0,66px,0)}.md .ptr-transitioning .ptr-arrow{transition:.3s}.md .ptr-pull-up .ptr-arrow{transition:.4s;transform:rotate(620deg)!important;opacity:0}.md .ptr-refreshing .ptr-preloader,.md .ptr-transitioning .ptr-preloader{transition-duration:.3s;transition-property:transform,opacity}.md .ptr-bottom .ptr-preloader{margin-top:0;margin-bottom:calc(-1 * var(--f7-ptr-size) - 4px)}.md .ptr-bottom.ptr-refreshing .ptr-preloader{transform:translate3d(0,-66px,0)}.md .ptr-with-navbar-large-transparent .ptr-preloader,.md .ptr-with-navbar-transparent .ptr-preloader{opacity:0}.md .ptr-with-navbar-large-transparent.ptr-pull-down .ptr-preloader,.md .ptr-with-navbar-large-transparent.ptr-pull-up .ptr-preloader,.md .ptr-with-navbar-large-transparent.ptr-refreshing .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-pull-down .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-pull-up .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-refreshing .ptr-preloader{opacity:1}.md .ptr-with-navbar-large-transparent.ptr-closing .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-closing .ptr-preloader{opacity:0;transition-duration:.3s}
package/components/pull-to-refresh/pull-to-refresh-vars.less CHANGED
@@ -8,3 +8,7 @@
8
8
  --f7-ptr-preloader-size: 22px;
9
9
  --f7-ptr-size: 40px;
10
10
  });
11
+ .md-color-vars({
12
+ --f7-ptr-preloader-bg-color: var(--f7-md-surface-1);
13
+ --f7-ptr-preloader-color: var(--f7-md-primary);
14
+ });
package/components/pull-to-refresh/pull-to-refresh.css CHANGED
@@ -1 +1 @@
1
- .ios{--f7-ptr-preloader-size:28px;--f7-ptr-size:44px}.md{--f7-ptr-preloader-size:22px;--f7-ptr-size:40px}.ptr-preloader{position:relative;top:var(--f7-ptr-top,0);height:var(--f7-ptr-size);pointer-events:none}.ptr-preloader .preloader{position:absolute;left:50%;width:var(--f7-ptr-preloader-size);height:var(--f7-ptr-preloader-size);margin-left:calc(-1 * var(--f7-ptr-preloader-size)/ 2);margin-top:calc(-1 * var(--f7-ptr-preloader-size)/ 2);top:50%;visibility:hidden}.ptr-bottom .ptr-preloader{top:auto;bottom:0;position:fixed}.ptr-with-navbar-large-transparent .ptr-preloader,.ptr-with-navbar-transparent .ptr-preloader{top:calc(-1 * var(--f7-page-navbar-offset,0px) + var(--f7-safe-area-top))}.ios .ptr-preloader{margin-bottom:calc(-1 * var(--f7-ptr-size));width:100%;left:0;top:0;position:relative}.ios .ptr-preloader .preloader{visibility:visible}.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader,.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader-inner{animation:none}.ios .ptr-content.ptr-closing .ptr-preloader .preloader-inner-line,.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up):not(.ptr-pull-down) .ptr-preloader .preloader-inner-line{opacity:0!important}.ios .ptr-refreshing>*,.ios .ptr-transitioning>*{transition-duration:.2s;transition-property:transform}.ios .ptr-transitioning .ptr-preloader .preloader-inner-line{transition-duration:.2s}.ios .ptr-pull-up .ptr-preloader .preloader{animation:ios-ptr-preloader-spin 1s ease-out forwards}.ios .ptr-refreshing:not(.ptr-bottom){transform:none}.ios .ptr-refreshing:not(.ptr-bottom)>*{transform:translate3d(0,var(--f7-ptr-size),0)}.ios .ptr-refreshing:not(.ptr-bottom)>.ptr-preloader{transform:translate3d(0,0,0)}.ios .ptr-bottom .ptr-preloader{margin-bottom:0;margin-top:calc(-1 * var(--f7-ptr-size));position:relative}.ios .ptr-bottom.ptr-refreshing>*,.ios .ptr-bottom.ptr-transitioning>*{transition-duration:.3s;transition-property:transform}.ios .ptr-bottom.ptr-refreshing{transform:none}.ios .ptr-bottom.ptr-refreshing>*{transform:translate3d(0,calc(-1 * var(--f7-ptr-size)),0)}.ios .ptr-bottom.ptr-refreshing>.ptr-preloader{transform:translate3d(0,0,0)}@keyframes ios-ptr-preloader-spin{from{transform:rotate(0deg)}to{transform:rotate(135deg)}}.md{--f7-ptr-top:-4px}.md .ptr-preloader{width:var(--f7-ptr-size);border-radius:50%;background:#fff;margin-top:calc(-1 * var(--f7-ptr-size));z-index:100;box-shadow:0px 2px 1px -1px rgba(0,0,0,.2),0px 1px 1px 0px rgba(0,0,0,.14),0px 1px 3px 0px rgba(0,0,0,.12);left:50%;margin-left:calc(-1 * var(--f7-ptr-size)/ 2)}.md .ptr-preloader .preloader circle{stroke-width:4}.md .ptr-arrow{width:22px;height:22px;box-sizing:border-box;border:3px solid var(--f7-preloader-color);position:absolute;left:50%;top:50%;margin-left:-11px;margin-top:-11px;border-left-color:transparent;border-radius:50%;opacity:1;transform:rotate(150deg)}.md .ptr-arrow:after{content:'';width:0px;height:0px;position:absolute;left:-5px;bottom:0px;border-bottom-width:6px;border-bottom-style:solid;border-bottom-color:inherit;border-left:5px solid transparent;border-right:5px solid transparent;transform:rotate(-40deg)}.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader,.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader-inner,.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader circle{animation:none}.md .ptr-pull-up .ptr-preloader .preloader,.md .ptr-refreshing .ptr-preloader .preloader{visibility:visible}.md .ptr-pull-up .ptr-arrow,.md .ptr-refreshing .ptr-arrow{visibility:hidden}.md .ptr-refreshing .ptr-preloader{transform:translate3d(0,66px,0)}.md .ptr-transitioning .ptr-arrow{transition:.3s}.md .ptr-pull-up .ptr-arrow{transition:.4s;transform:rotate(620deg)!important;opacity:0}.md .ptr-refreshing .ptr-preloader,.md .ptr-transitioning .ptr-preloader{transition-duration:.3s;transition-property:transform,opacity}.md .ptr-bottom .ptr-preloader{margin-top:0;margin-bottom:calc(-1 * var(--f7-ptr-size) - 4px)}.md .ptr-bottom.ptr-refreshing .ptr-preloader{transform:translate3d(0,-66px,0)}.md .ptr-with-navbar-large-transparent .ptr-preloader,.md .ptr-with-navbar-transparent .ptr-preloader{opacity:0}.md .ptr-with-navbar-large-transparent.ptr-pull-down .ptr-preloader,.md .ptr-with-navbar-large-transparent.ptr-pull-up .ptr-preloader,.md .ptr-with-navbar-large-transparent.ptr-refreshing .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-pull-down .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-pull-up .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-refreshing .ptr-preloader{opacity:1}.md .ptr-with-navbar-large-transparent.ptr-closing .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-closing .ptr-preloader{opacity:0;transition-duration:.3s}
1
+ .ios{--f7-ptr-preloader-size:28px;--f7-ptr-size:44px}.md{--f7-ptr-preloader-size:22px;--f7-ptr-size:40px}.md,.md .dark,.md [class*=color-]{--f7-ptr-preloader-bg-color:var(--f7-md-surface-1);--f7-ptr-preloader-color:var(--f7-md-primary)}.ptr-preloader{position:relative;top:var(--f7-ptr-top,0);height:var(--f7-ptr-size);pointer-events:none}.ptr-preloader .preloader{position:absolute;left:50%;width:var(--f7-ptr-preloader-size);height:var(--f7-ptr-preloader-size);margin-left:calc(-1 * var(--f7-ptr-preloader-size)/ 2);margin-top:calc(-1 * var(--f7-ptr-preloader-size)/ 2);top:50%;visibility:hidden}.ptr-bottom .ptr-preloader{top:auto;bottom:0;position:fixed}.ptr-with-navbar-large-transparent .ptr-preloader,.ptr-with-navbar-transparent .ptr-preloader{top:calc(-1 * var(--f7-page-navbar-offset,0px) + var(--f7-safe-area-top))}.ios .ptr-preloader{margin-bottom:calc(-1 * var(--f7-ptr-size));width:100%;left:0;top:0;position:relative}.ios .ptr-preloader .preloader{visibility:visible}.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader,.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader-inner{animation:none}.ios .ptr-content.ptr-closing .ptr-preloader .preloader-inner-line,.ios .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up):not(.ptr-pull-down) .ptr-preloader .preloader-inner-line{opacity:0!important}.ios .ptr-refreshing>*,.ios .ptr-transitioning>*{transition-duration:.2s;transition-property:transform}.ios .ptr-transitioning .ptr-preloader .preloader-inner-line{transition-duration:.2s}.ios .ptr-pull-up .ptr-preloader .preloader{animation:ios-ptr-preloader-spin 1s ease-out forwards}.ios .ptr-refreshing:not(.ptr-bottom){transform:none}.ios .ptr-refreshing:not(.ptr-bottom)>*{transform:translate3d(0,var(--f7-ptr-size),0)}.ios .ptr-refreshing:not(.ptr-bottom)>.ptr-preloader{transform:translate3d(0,0,0)}.ios .ptr-bottom .ptr-preloader{margin-bottom:0;margin-top:calc(-1 * var(--f7-ptr-size));position:relative}.ios .ptr-bottom.ptr-refreshing>*,.ios .ptr-bottom.ptr-transitioning>*{transition-duration:.3s;transition-property:transform}.ios .ptr-bottom.ptr-refreshing{transform:none}.ios .ptr-bottom.ptr-refreshing>*{transform:translate3d(0,calc(-1 * var(--f7-ptr-size)),0)}.ios .ptr-bottom.ptr-refreshing>.ptr-preloader{transform:translate3d(0,0,0)}@keyframes ios-ptr-preloader-spin{from{transform:rotate(0deg)}to{transform:rotate(135deg)}}.md{--f7-ptr-top:-4px}.md .ptr-preloader{width:var(--f7-ptr-size);border-radius:50%;background:var(--f7-ptr-preloader-bg-color);--f7-preloader-color:var(--f7-ptr-preloader-color);margin-top:calc(-1 * var(--f7-ptr-size));z-index:100;box-shadow:0px 2px 1px -1px rgba(0,0,0,.2),0px 1px 1px 0px rgba(0,0,0,.14),0px 1px 3px 0px rgba(0,0,0,.12);left:50%;margin-left:calc(-1 * var(--f7-ptr-size)/ 2)}.md .ptr-preloader .preloader circle{stroke-width:4}.md .ptr-arrow{width:22px;height:22px;box-sizing:border-box;border:3px solid var(--f7-preloader-color);position:absolute;left:50%;top:50%;margin-left:-11px;margin-top:-11px;border-left-color:transparent;border-radius:50%;opacity:1;transform:rotate(150deg)}.md .ptr-arrow:after{content:'';width:0px;height:0px;position:absolute;left:-5px;bottom:0px;border-bottom-width:6px;border-bottom-style:solid;border-bottom-color:inherit;border-left:5px solid transparent;border-right:5px solid transparent;transform:rotate(-40deg)}.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader,.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader .preloader-inner,.md .ptr-content:not(.ptr-refreshing):not(.ptr-pull-up) .ptr-preloader circle{animation:none}.md .ptr-pull-up .ptr-preloader .preloader,.md .ptr-refreshing .ptr-preloader .preloader{visibility:visible}.md .ptr-pull-up .ptr-arrow,.md .ptr-refreshing .ptr-arrow{visibility:hidden}.md .ptr-refreshing .ptr-preloader{transform:translate3d(0,66px,0)}.md .ptr-transitioning .ptr-arrow{transition:.3s}.md .ptr-pull-up .ptr-arrow{transition:.4s;transform:rotate(620deg)!important;opacity:0}.md .ptr-refreshing .ptr-preloader,.md .ptr-transitioning .ptr-preloader{transition-duration:.3s;transition-property:transform,opacity}.md .ptr-bottom .ptr-preloader{margin-top:0;margin-bottom:calc(-1 * var(--f7-ptr-size) - 4px)}.md .ptr-bottom.ptr-refreshing .ptr-preloader{transform:translate3d(0,-66px,0)}.md .ptr-with-navbar-large-transparent .ptr-preloader,.md .ptr-with-navbar-transparent .ptr-preloader{opacity:0}.md .ptr-with-navbar-large-transparent.ptr-pull-down .ptr-preloader,.md .ptr-with-navbar-large-transparent.ptr-pull-up .ptr-preloader,.md .ptr-with-navbar-large-transparent.ptr-refreshing .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-pull-down .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-pull-up .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-refreshing .ptr-preloader{opacity:1}.md .ptr-with-navbar-large-transparent.ptr-closing .ptr-preloader,.md .ptr-with-navbar-transparent.ptr-closing .ptr-preloader{opacity:0;transition-duration:.3s}
package/components/searchbar/searchbar-md.less CHANGED
@@ -79,8 +79,7 @@
79
79
  opacity: 1;
80
80
  }
81
81
  &:before {
82
- margin-left: 0;
83
- margin-top: 0;
82
+ display: none;
84
83
  }
85
84
  }
86
85
  }
package/components/searchbar/searchbar-rtl.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-searchbar-input-border-width:0px;--f7-searchbar-input-border-color:transparent}.ios{--f7-searchbar-height:44px;--f7-searchbar-inner-padding-left:8px;--f7-searchbar-inner-padding-right:8px;--f7-searchbar-input-font-size:17px;--f7-searchbar-input-border-radius:8px;--f7-searchbar-input-height:32px;--f7-searchbar-inline-input-height:32px;--f7-searchbar-input-padding-horizontal:28px;--f7-searchbar-backdrop-bg-color:rgba(0, 0, 0, 0.4);--f7-searchbar-in-page-content-margin:0px;--f7-searchbar-in-page-content-box-shadow:none;--f7-searchbar-in-page-content-border-radius:0;--f7-searchbar-in-page-content-input-border-radius:0;--f7-searchbar-placeholder-color:rgba(0, 0, 0, 0.4);--f7-searchbar-input-text-color:#000;--f7-searchbar-search-icon-color:rgba(0, 0, 0, 0.4);--f7-searchbar-input-bg-color:#e4e4e4}.ios .dark,.ios.dark{--f7-searchbar-placeholder-color:rgba(255, 255, 255, 0.4);--f7-searchbar-input-text-color:#fff;--f7-searchbar-search-icon-color:rgba(255, 255, 255, 0.4);--f7-searchbar-input-bg-color:#2a2a2a}.md{--f7-searchbar-border-color:transparent;--f7-searchbar-height:48px;--f7-searchbar-inner-padding-left:8px;--f7-searchbar-inner-padding-right:8px;--f7-searchbar-input-font-size:16px;--f7-searchbar-input-border-radius:24px;--f7-searchbar-input-height:48px;--f7-searchbar-inline-input-height:48px;--f7-searchbar-inline-input-border-radius:24px;--f7-searchbar-input-padding-horizontal:16px;--f7-searchbar-inline-input-padding-horizontal:16px;--f7-searchbar-backdrop-bg-color:rgba(0, 0, 0, 0.25);--f7-searchbar-in-page-content-margin:16px 0;--f7-searchbar-in-page-content-box-shadow:none;--f7-searchbar-in-page-content-border-radius:24px;--f7-searchbar-in-page-content-input-border-radius:24px;--f7-searchbar-bg-color:transparent}.md,.md .dark,.md [class*=color-]{--f7-searchbar-link-color:var(--f7-md-on-surface);--f7-searchbar-search-icon-color:var(--f7-md-on-surface);--f7-searchbar-input-clear-button-color:var(--f7-md-on-surface);--f7-searchbar-placeholder-color:var(--f7-md-on-surface-variant);--f7-searchbar-input-bg-color:var(--f7-md-secondary-container);--f7-searchbar-input-text-color:var(--f7-md-on-surface)}.searchbar{--f7-link-highlight-color:var(--f7-link-highlight-black);width:100%;position:relative;z-index:200;height:var(--f7-searchbar-height);background-color:var(--f7-searchbar-bg-color,var(--f7-bars-bg-color))}.dark .searchbar{--f7-link-highlight-color:var(--f7-link-highlight-white)}.searchbar input[type=search]::-webkit-search-decoration{display:none}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-bars .searchbar{background-color:rgba(var(--f7-searchbar-bg-color-rgb,var(--f7-bars-bg-color-rgb)),var(--f7-bars-translucent-opacity));-webkit-backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur));backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur))}}.ios .subnavbar .searchbar{background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.ios .subnavbar .searchbar:after{display:none!important}.searchbar.no-outline:after{display:none!important}.searchbar:after{content:'';position:absolute;background-color:var(--f7-searchbar-border-color,var(--f7-bars-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)))}.page>.searchbar:not(.searchbar-inline){z-index:600}.searchbar input[type=search],.searchbar input[type=text]{box-sizing:border-box;width:100%;height:100%;display:block;border:var(--f7-searchbar-input-border-width) solid var(--f7-searchbar-input-border-color);-webkit-appearance:none;appearance:none;font-family:inherit;font-weight:400;color:var(--f7-searchbar-input-text-color);font-size:var(--f7-searchbar-input-font-size);background-color:var(--f7-searchbar-input-bg-color);border-radius:var(--f7-searchbar-input-border-radius);position:relative;padding:0;padding-left:calc(var(--f7-searchbar-input-padding-horizontal) + var(--f7-searchbar-input-extra-padding-right,0px));padding-right:calc(var(--f7-searchbar-input-padding-horizontal) + var(--f7-searchbar-input-extra-padding-left,0px))}.searchbar input[type=search]::placeholder,.searchbar input[type=text]::placeholder{color:var(--f7-searchbar-placeholder-color);opacity:1}.searchbar input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}.searchbar .searchbar-input-wrap{flex-shrink:1;width:100%;height:var(--f7-searchbar-input-height);position:relative}.searchbar a{color:var(--f7-searchbar-link-color,var(--f7-bars-link-color,var(--f7-theme-color)))}.page>.searchbar:not(.searchbar-inline){position:absolute;left:0;top:0}.page-content .searchbar:not(.searchbar-inline){border-radius:var(--f7-searchbar-in-page-content-border-radius);margin:var(--f7-searchbar-in-page-content-margin);width:auto;box-shadow:var(--f7-searchbar-in-page-content-box-shadow)}.page-content .searchbar:not(.searchbar-inline) .searchbar-inner,.page-content .searchbar:not(.searchbar-inline) input[type=search],.page-content .searchbar:not(.searchbar-inline) input[type=text]{border-radius:var(--f7-searchbar-in-page-content-input-border-radius,var(--f7-searchbar-input-border-radius))}.searchbar .input-clear-button{color:var(--f7-searchbar-input-clear-button-color,var(--f7-input-clear-button-color))}.searchbar-expandable{--f7-searchbar-expandable-size:var(--f7-searchbar-height);position:absolute;transition-duration:.3s;pointer-events:none}.navbar .searchbar-expandable{background:0 0}.navbar .searchbar-expandable:after{display:none!important}.navbar .searchbar.searchbar-expandable{--f7-searchbar-expandable-size:calc(var(--f7-navbar-height) + var(--f7-safe-area-top))}.navbar .searchbar.searchbar-expandable .searchbar-inner{top:var(--f7-safe-area-top);height:calc(100% - var(--f7-safe-area-top))}.toolbar .searchbar.searchbar-expandable{--f7-searchbar-expandable-size:var(--f7-toolbar-height)}.subnavbar .searchbar.searchbar-expandable{--f7-searchbar-expandable-size:var(--f7-subnavbar-height)}.tabbar-icons .searchbar.searchbar-expandable{--f7-searchbar-expandable-size:var(--f7-tabbar-icons-height)}.searchbar-inner{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;box-sizing:border-box;padding:0 calc(var(--f7-searchbar-inner-padding-right) + var(--f7-safe-area-right)) 0 calc(var(--f7-searchbar-inner-padding-left) + var(--f7-safe-area-left))}.searchbar-disable-button{cursor:pointer;pointer-events:none;-webkit-appearance:none;appearance:none;background:0 0;border:none;outline:0;padding:0;margin:0;width:auto;opacity:0}.searchbar-icon{pointer-events:none;background-position:center;background-repeat:no-repeat}.searchbar-icon:after{color:var(--f7-searchbar-search-icon-color);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}.searchbar-backdrop{position:absolute;left:0;top:0;width:100%;height:100%;z-index:100;opacity:0;pointer-events:none;transition-duration:.3s;transform:translate3d(0,0,0);background:var(--f7-searchbar-backdrop-bg-color)}.searchbar-backdrop.searchbar-backdrop-in{opacity:1;pointer-events:auto}.page-content>.searchbar-backdrop{position:fixed}.searchbar-not-found{display:none}.hidden-by-searchbar,.list .hidden-by-searchbar,.list li.hidden-by-searchbar,.list.li.hidden-by-searchbar{display:none!important}.navbar.with-searchbar-expandable-enabled-no-transition{--f7-navbar-large-collapse-progress:1}.navbar.with-searchbar-expandable-enabled{--f7-navbar-large-collapse-progress:1}.navbar.with-searchbar-expandable-enabled .navbar-bg,.navbar.with-searchbar-expandable-enabled .title-large,.navbar.with-searchbar-expandable-enabled .title-large-text{transition-duration:.3s}.navbar.with-searchbar-expandable-closing .navbar-bg,.navbar.with-searchbar-expandable-closing .title-large,.navbar.with-searchbar-expandable-closing .title-large-text{transition-duration:.3s}.page-content.with-searchbar-expandable-enabled{height:calc(100% + var(--f7-navbar-large-title-height));transform:translateY(calc(-1 * var(--f7-navbar-large-title-height)));transition-duration:.3s;transition-property:transform}.page-content.with-searchbar-expandable-closing{transition-duration:.3s}.navbars~.page:not(.no-navbar)>.searchbar,.navbar~.page:not(.no-navbar)>.searchbar,.page>.navbar~.searchbar{top:calc(var(--f7-navbar-height) + var(--f7-safe-area-top))}.navbars~.page-with-navbar-large:not(.no-navbar) .searchbar,.navbar~.page-with-navbar-large:not(.no-navbar) .searchbar,.page-with-navbar-large .navbar~* .searchbar,.page-with-navbar-large .navbar~.searchbar{top:calc(var(--f7-navbar-height) + var(--f7-navbar-large-title-height) + var(--f7-safe-area-top));transform:translate3d(0,calc(-1 * var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)),0)}.navbars~.page-with-navbar-large:not(.no-navbar) .page-content .searchbar,.page-with-navbar-large .page-content .searchbar{top:0;transform:none}.searchbar~*{--f7-page-searchbar-offset:var(--f7-searchbar-height)}.ios .page>.toolbar-top-ios~.searchbar,.md .page>.toolbar-top-md~.searchbar,.page>.toolbar-top~.searchbar{top:var(--f7-toolbar-height)}.ios .page>.tabbar-icons.toolbar-top-ios~.searchbar,.md .page>.tabbar-icons.toolbar-top-md~.searchbar,.page>.tabbar-icons.toolbar-top~.searchbar{top:var(--f7-tabbar-icons-height)}.ios .page>.navbar~.toolbar-top-ios~.searchbar,.md .page>.navbar~.toolbar-top-md~.searchbar,.page>.navbar~.toolbar-top~.searchbar{top:calc(var(--f7-navbar-height) + var(--f7-toolbar-height) + var(--f7-safe-area-top))}.ios .page>.navbar~.tabbar-icons.toolbar-top-ios~.searchbar,.md .page>.navbar~.tabbar-icons.toolbar-top-md~.searchbar,.page>.navbar~.tabbar-icons.toolbar-top~.searchbar{top:calc(var(--f7-navbar-height) + var(--f7-tabbar-icons-height) + var(--f7-safe-area-top))}.searchbar.searchbar-inline{width:auto;height:auto;background-color:transparent;background-image:none}.searchbar.searchbar-inline:after,.searchbar.searchbar-inline:before{display:none!important}.searchbar.searchbar-inline .searchbar-input-wrap{height:var(--f7-searchbar-inline-input-height,var(--f7-searchbar-input-height))}.searchbar.searchbar-inline .searchbar-inner{padding:0;position:static;width:auto;height:auto}.searchbar.searchbar-inline input[type=search],.searchbar.searchbar-inline input[type=text]{font-size:var(--f7-searchbar-inline-input-font-size, var(--f7-searchbar-input-font-size));border-radius:var(--f7-searchbar-inline-input-border-radius,var(--f7-searchbar-input-border-radius));padding-left:calc(var(--f7-searchbar-inline-input-padding-horizontal,var(--f7-searchbar-input-padding-horizontal)) + var(--f7-searchbar-input-extra-padding-right,0px));padding-right:calc(var(--f7-searchbar-inline-input-padding-horizontal,var(--f7-searchbar-input-padding-horizontal)) + var(--f7-searchbar-input-extra-padding-left,0px))}.ios .searchbar input[type=search],.ios .searchbar input[type=text]{z-index:30}.ios .searchbar .input-clear-button{z-index:40;left:7px}.ios .searchbar-icon{width:13px;height:13px;position:absolute;top:50%;margin-top:-6px;z-index:40;right:8px}.ios .searchbar-icon:after{content:'search_ios';line-height:13px}.ios .searchbar-disable-button{font-size:17px;flex-shrink:0;transform:translate3d(0,0,0);transition-duration:.3s;color:var(--f7-searchbar-link-color,var(--f7-bars-link-color,var(--f7-theme-color)));display:none}.ios .searchbar-disable-button.active-state{transition-duration:0s;opacity:.3!important}.ios .searchbar-enabled .searchbar-disable-button{pointer-events:auto;opacity:1;margin-right:8px}.ios .searchbar:not(.searchbar-enabled) .searchbar-disable-button{transition-duration:.3s!important}.ios .searchbar-expandable{right:0;bottom:0;opacity:1;width:100%;height:0%;transform:translate3d(0,0,0);overflow:hidden}.ios .searchbar-expandable .searchbar-disable-button{margin-right:8px;opacity:1;display:block}.ios .searchbar-expandable .searchbar-inner{height:var(--f7-searchbar-expandable-size)}.ios .navbar.with-searchbar-expandable-closing .navbar-bg,.ios .navbar.with-searchbar-expandable-enabled .navbar-bg{transition-property:transform,opacity}.ios .navbar.with-searchbar-expandable-closing .left,.ios .navbar.with-searchbar-expandable-closing .navbar-bg,.ios .navbar.with-searchbar-expandable-closing .right,.ios .navbar.with-searchbar-expandable-closing .title,.ios .navbar.with-searchbar-expandable-enabled .left,.ios .navbar.with-searchbar-expandable-enabled .navbar-bg,.ios .navbar.with-searchbar-expandable-enabled .right,.ios .navbar.with-searchbar-expandable-enabled .title{transition-duration:.3s}.ios .navbar.with-searchbar-expandable-enabled .left,.ios .navbar.with-searchbar-expandable-enabled .right,.ios .navbar.with-searchbar-expandable-enabled .title,.ios .navbar.with-searchbar-expandable-enabled-no-transition .left,.ios .navbar.with-searchbar-expandable-enabled-no-transition .right,.ios .navbar.with-searchbar-expandable-enabled-no-transition .title{transform:translateY(calc(-1 * var(--f7-navbar-height)));opacity:0!important}.ios .searchbar-expandable.searchbar-enabled{opacity:1;height:var(--f7-searchbar-expandable-size);pointer-events:auto}.md .searchbar-disable-button,.md .searchbar-icon{position:absolute;top:50%;transition-duration:.3s}.md .searchbar-icon{width:48px;height:48px;left:0;top:0;display:flex;align-items:center;justify-content:center;right:var(--f7-safe-area-right)}.md .searchbar-icon:after{width:auto;height:auto;content:'search_md';line-height:1.2}.md .searchbar-disable-button{width:48px;height:48px;transform:rotate(-90deg) scale(.5);font-size:0!important;display:block;margin-top:-24px;color:var(--f7-searchbar-link-color,var(--f7-bars-link-color,var(--f7-theme-color)));right:calc(var(--f7-searchbar-inner-padding-right) + var(--f7-safe-area-right))}.md .searchbar-disable-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;line-height:48px;content:'arrow_right_md'}.md .searchbar-enabled:not(.searchbar-enabled-no-disable-button) .searchbar-disable-button{transform:rotate(0deg) scale(1);pointer-events:auto;opacity:1}.md .searchbar-enabled:not(.searchbar-enabled-no-disable-button) .searchbar-icon{opacity:0;transform:rotate(90deg) scale(.5)}.md .searchbar{--f7-searchbar-input-extra-padding-left:34px}.md .searchbar .input-clear-button{width:48px;height:48px;margin-top:-24px;left:0}.md .searchbar .input-clear-button:after{line-height:48px;content:'delete_round_md';opacity:1}.md .searchbar .input-clear-button:before{margin-left:0;margin-top:0}.md .searchbar-inline{--f7-searchbar-input-extra-padding-left:32px}.md .page>.searchbar,.md .searchbar-expandable,.md .subnavbar .searchbar{--f7-searchbar-input-extra-padding-left:34px}.md .page>.searchbar .searchbar-disable-button,.md .searchbar-expandable .searchbar-disable-button,.md .subnavbar .searchbar .searchbar-disable-button{right:calc(var(--f7-searchbar-inner-padding-right) + var(--f7-safe-area-right))}.md .page>.searchbar .searchbar-icon,.md .searchbar-expandable .searchbar-icon,.md .subnavbar .searchbar .searchbar-icon{right:var(--f7-safe-area-right)}.md .searchbar-expandable{--f7-searchbar-inner-padding-left:4px;--f7-searchbar-inner-padding-right:4px;height:var(--f7-searchbar-expandable-size);opacity:0;bottom:0;border-radius:calc(var(--f7-searchbar-expandable-size));width:calc(var(--f7-searchbar-expandable-size));margin-top:calc(var(--f7-searchbar-expandable-size) * -1 / 2);transform:translate3d(0px,0px,0px);background-color:var(--f7-searchbar-input-bg-color);right:100%;margin-right:calc(var(--f7-searchbar-expandable-size) * -1)}.md .searchbar-expandable.searchbar-enabled{width:100%;border-radius:0;opacity:1;pointer-events:auto;margin-top:0;right:0;margin-right:0}
1
+ :root{--f7-searchbar-input-border-width:0px;--f7-searchbar-input-border-color:transparent}.ios{--f7-searchbar-height:44px;--f7-searchbar-inner-padding-left:8px;--f7-searchbar-inner-padding-right:8px;--f7-searchbar-input-font-size:17px;--f7-searchbar-input-border-radius:8px;--f7-searchbar-input-height:32px;--f7-searchbar-inline-input-height:32px;--f7-searchbar-input-padding-horizontal:28px;--f7-searchbar-backdrop-bg-color:rgba(0, 0, 0, 0.4);--f7-searchbar-in-page-content-margin:0px;--f7-searchbar-in-page-content-box-shadow:none;--f7-searchbar-in-page-content-border-radius:0;--f7-searchbar-in-page-content-input-border-radius:0;--f7-searchbar-placeholder-color:rgba(0, 0, 0, 0.4);--f7-searchbar-input-text-color:#000;--f7-searchbar-search-icon-color:rgba(0, 0, 0, 0.4);--f7-searchbar-input-bg-color:#e4e4e4}.ios .dark,.ios.dark{--f7-searchbar-placeholder-color:rgba(255, 255, 255, 0.4);--f7-searchbar-input-text-color:#fff;--f7-searchbar-search-icon-color:rgba(255, 255, 255, 0.4);--f7-searchbar-input-bg-color:#2a2a2a}.md{--f7-searchbar-border-color:transparent;--f7-searchbar-height:48px;--f7-searchbar-inner-padding-left:8px;--f7-searchbar-inner-padding-right:8px;--f7-searchbar-input-font-size:16px;--f7-searchbar-input-border-radius:24px;--f7-searchbar-input-height:48px;--f7-searchbar-inline-input-height:48px;--f7-searchbar-inline-input-border-radius:24px;--f7-searchbar-input-padding-horizontal:16px;--f7-searchbar-inline-input-padding-horizontal:16px;--f7-searchbar-backdrop-bg-color:rgba(0, 0, 0, 0.25);--f7-searchbar-in-page-content-margin:16px 0;--f7-searchbar-in-page-content-box-shadow:none;--f7-searchbar-in-page-content-border-radius:24px;--f7-searchbar-in-page-content-input-border-radius:24px;--f7-searchbar-bg-color:transparent}.md,.md .dark,.md [class*=color-]{--f7-searchbar-link-color:var(--f7-md-on-surface);--f7-searchbar-search-icon-color:var(--f7-md-on-surface);--f7-searchbar-input-clear-button-color:var(--f7-md-on-surface);--f7-searchbar-placeholder-color:var(--f7-md-on-surface-variant);--f7-searchbar-input-bg-color:var(--f7-md-secondary-container);--f7-searchbar-input-text-color:var(--f7-md-on-surface)}.searchbar{--f7-link-highlight-color:var(--f7-link-highlight-black);width:100%;position:relative;z-index:200;height:var(--f7-searchbar-height);background-color:var(--f7-searchbar-bg-color,var(--f7-bars-bg-color))}.dark .searchbar{--f7-link-highlight-color:var(--f7-link-highlight-white)}.searchbar input[type=search]::-webkit-search-decoration{display:none}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-bars .searchbar{background-color:rgba(var(--f7-searchbar-bg-color-rgb,var(--f7-bars-bg-color-rgb)),var(--f7-bars-translucent-opacity));-webkit-backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur));backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur))}}.ios .subnavbar .searchbar{background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.ios .subnavbar .searchbar:after{display:none!important}.searchbar.no-outline:after{display:none!important}.searchbar:after{content:'';position:absolute;background-color:var(--f7-searchbar-border-color,var(--f7-bars-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)))}.page>.searchbar:not(.searchbar-inline){z-index:600}.searchbar input[type=search],.searchbar input[type=text]{box-sizing:border-box;width:100%;height:100%;display:block;border:var(--f7-searchbar-input-border-width) solid var(--f7-searchbar-input-border-color);-webkit-appearance:none;appearance:none;font-family:inherit;font-weight:400;color:var(--f7-searchbar-input-text-color);font-size:var(--f7-searchbar-input-font-size);background-color:var(--f7-searchbar-input-bg-color);border-radius:var(--f7-searchbar-input-border-radius);position:relative;padding:0;padding-left:calc(var(--f7-searchbar-input-padding-horizontal) + var(--f7-searchbar-input-extra-padding-right,0px));padding-right:calc(var(--f7-searchbar-input-padding-horizontal) + var(--f7-searchbar-input-extra-padding-left,0px))}.searchbar input[type=search]::placeholder,.searchbar input[type=text]::placeholder{color:var(--f7-searchbar-placeholder-color);opacity:1}.searchbar input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}.searchbar .searchbar-input-wrap{flex-shrink:1;width:100%;height:var(--f7-searchbar-input-height);position:relative}.searchbar a{color:var(--f7-searchbar-link-color,var(--f7-bars-link-color,var(--f7-theme-color)))}.page>.searchbar:not(.searchbar-inline){position:absolute;left:0;top:0}.page-content .searchbar:not(.searchbar-inline){border-radius:var(--f7-searchbar-in-page-content-border-radius);margin:var(--f7-searchbar-in-page-content-margin);width:auto;box-shadow:var(--f7-searchbar-in-page-content-box-shadow)}.page-content .searchbar:not(.searchbar-inline) .searchbar-inner,.page-content .searchbar:not(.searchbar-inline) input[type=search],.page-content .searchbar:not(.searchbar-inline) input[type=text]{border-radius:var(--f7-searchbar-in-page-content-input-border-radius,var(--f7-searchbar-input-border-radius))}.searchbar .input-clear-button{color:var(--f7-searchbar-input-clear-button-color,var(--f7-input-clear-button-color))}.searchbar-expandable{--f7-searchbar-expandable-size:var(--f7-searchbar-height);position:absolute;transition-duration:.3s;pointer-events:none}.navbar .searchbar-expandable{background:0 0}.navbar .searchbar-expandable:after{display:none!important}.navbar .searchbar.searchbar-expandable{--f7-searchbar-expandable-size:calc(var(--f7-navbar-height) + var(--f7-safe-area-top))}.navbar .searchbar.searchbar-expandable .searchbar-inner{top:var(--f7-safe-area-top);height:calc(100% - var(--f7-safe-area-top))}.toolbar .searchbar.searchbar-expandable{--f7-searchbar-expandable-size:var(--f7-toolbar-height)}.subnavbar .searchbar.searchbar-expandable{--f7-searchbar-expandable-size:var(--f7-subnavbar-height)}.tabbar-icons .searchbar.searchbar-expandable{--f7-searchbar-expandable-size:var(--f7-tabbar-icons-height)}.searchbar-inner{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;box-sizing:border-box;padding:0 calc(var(--f7-searchbar-inner-padding-right) + var(--f7-safe-area-right)) 0 calc(var(--f7-searchbar-inner-padding-left) + var(--f7-safe-area-left))}.searchbar-disable-button{cursor:pointer;pointer-events:none;-webkit-appearance:none;appearance:none;background:0 0;border:none;outline:0;padding:0;margin:0;width:auto;opacity:0}.searchbar-icon{pointer-events:none;background-position:center;background-repeat:no-repeat}.searchbar-icon:after{color:var(--f7-searchbar-search-icon-color);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}.searchbar-backdrop{position:absolute;left:0;top:0;width:100%;height:100%;z-index:100;opacity:0;pointer-events:none;transition-duration:.3s;transform:translate3d(0,0,0);background:var(--f7-searchbar-backdrop-bg-color)}.searchbar-backdrop.searchbar-backdrop-in{opacity:1;pointer-events:auto}.page-content>.searchbar-backdrop{position:fixed}.searchbar-not-found{display:none}.hidden-by-searchbar,.list .hidden-by-searchbar,.list li.hidden-by-searchbar,.list.li.hidden-by-searchbar{display:none!important}.navbar.with-searchbar-expandable-enabled-no-transition{--f7-navbar-large-collapse-progress:1}.navbar.with-searchbar-expandable-enabled{--f7-navbar-large-collapse-progress:1}.navbar.with-searchbar-expandable-enabled .navbar-bg,.navbar.with-searchbar-expandable-enabled .title-large,.navbar.with-searchbar-expandable-enabled .title-large-text{transition-duration:.3s}.navbar.with-searchbar-expandable-closing .navbar-bg,.navbar.with-searchbar-expandable-closing .title-large,.navbar.with-searchbar-expandable-closing .title-large-text{transition-duration:.3s}.page-content.with-searchbar-expandable-enabled{height:calc(100% + var(--f7-navbar-large-title-height));transform:translateY(calc(-1 * var(--f7-navbar-large-title-height)));transition-duration:.3s;transition-property:transform}.page-content.with-searchbar-expandable-closing{transition-duration:.3s}.navbars~.page:not(.no-navbar)>.searchbar,.navbar~.page:not(.no-navbar)>.searchbar,.page>.navbar~.searchbar{top:calc(var(--f7-navbar-height) + var(--f7-safe-area-top))}.navbars~.page-with-navbar-large:not(.no-navbar) .searchbar,.navbar~.page-with-navbar-large:not(.no-navbar) .searchbar,.page-with-navbar-large .navbar~* .searchbar,.page-with-navbar-large .navbar~.searchbar{top:calc(var(--f7-navbar-height) + var(--f7-navbar-large-title-height) + var(--f7-safe-area-top));transform:translate3d(0,calc(-1 * var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)),0)}.navbars~.page-with-navbar-large:not(.no-navbar) .page-content .searchbar,.page-with-navbar-large .page-content .searchbar{top:0;transform:none}.searchbar~*{--f7-page-searchbar-offset:var(--f7-searchbar-height)}.ios .page>.toolbar-top-ios~.searchbar,.md .page>.toolbar-top-md~.searchbar,.page>.toolbar-top~.searchbar{top:var(--f7-toolbar-height)}.ios .page>.tabbar-icons.toolbar-top-ios~.searchbar,.md .page>.tabbar-icons.toolbar-top-md~.searchbar,.page>.tabbar-icons.toolbar-top~.searchbar{top:var(--f7-tabbar-icons-height)}.ios .page>.navbar~.toolbar-top-ios~.searchbar,.md .page>.navbar~.toolbar-top-md~.searchbar,.page>.navbar~.toolbar-top~.searchbar{top:calc(var(--f7-navbar-height) + var(--f7-toolbar-height) + var(--f7-safe-area-top))}.ios .page>.navbar~.tabbar-icons.toolbar-top-ios~.searchbar,.md .page>.navbar~.tabbar-icons.toolbar-top-md~.searchbar,.page>.navbar~.tabbar-icons.toolbar-top~.searchbar{top:calc(var(--f7-navbar-height) + var(--f7-tabbar-icons-height) + var(--f7-safe-area-top))}.searchbar.searchbar-inline{width:auto;height:auto;background-color:transparent;background-image:none}.searchbar.searchbar-inline:after,.searchbar.searchbar-inline:before{display:none!important}.searchbar.searchbar-inline .searchbar-input-wrap{height:var(--f7-searchbar-inline-input-height,var(--f7-searchbar-input-height))}.searchbar.searchbar-inline .searchbar-inner{padding:0;position:static;width:auto;height:auto}.searchbar.searchbar-inline input[type=search],.searchbar.searchbar-inline input[type=text]{font-size:var(--f7-searchbar-inline-input-font-size, var(--f7-searchbar-input-font-size));border-radius:var(--f7-searchbar-inline-input-border-radius,var(--f7-searchbar-input-border-radius));padding-left:calc(var(--f7-searchbar-inline-input-padding-horizontal,var(--f7-searchbar-input-padding-horizontal)) + var(--f7-searchbar-input-extra-padding-right,0px));padding-right:calc(var(--f7-searchbar-inline-input-padding-horizontal,var(--f7-searchbar-input-padding-horizontal)) + var(--f7-searchbar-input-extra-padding-left,0px))}.ios .searchbar input[type=search],.ios .searchbar input[type=text]{z-index:30}.ios .searchbar .input-clear-button{z-index:40;left:7px}.ios .searchbar-icon{width:13px;height:13px;position:absolute;top:50%;margin-top:-6px;z-index:40;right:8px}.ios .searchbar-icon:after{content:'search_ios';line-height:13px}.ios .searchbar-disable-button{font-size:17px;flex-shrink:0;transform:translate3d(0,0,0);transition-duration:.3s;color:var(--f7-searchbar-link-color,var(--f7-bars-link-color,var(--f7-theme-color)));display:none}.ios .searchbar-disable-button.active-state{transition-duration:0s;opacity:.3!important}.ios .searchbar-enabled .searchbar-disable-button{pointer-events:auto;opacity:1;margin-right:8px}.ios .searchbar:not(.searchbar-enabled) .searchbar-disable-button{transition-duration:.3s!important}.ios .searchbar-expandable{right:0;bottom:0;opacity:1;width:100%;height:0%;transform:translate3d(0,0,0);overflow:hidden}.ios .searchbar-expandable .searchbar-disable-button{margin-right:8px;opacity:1;display:block}.ios .searchbar-expandable .searchbar-inner{height:var(--f7-searchbar-expandable-size)}.ios .navbar.with-searchbar-expandable-closing .navbar-bg,.ios .navbar.with-searchbar-expandable-enabled .navbar-bg{transition-property:transform,opacity}.ios .navbar.with-searchbar-expandable-closing .left,.ios .navbar.with-searchbar-expandable-closing .navbar-bg,.ios .navbar.with-searchbar-expandable-closing .right,.ios .navbar.with-searchbar-expandable-closing .title,.ios .navbar.with-searchbar-expandable-enabled .left,.ios .navbar.with-searchbar-expandable-enabled .navbar-bg,.ios .navbar.with-searchbar-expandable-enabled .right,.ios .navbar.with-searchbar-expandable-enabled .title{transition-duration:.3s}.ios .navbar.with-searchbar-expandable-enabled .left,.ios .navbar.with-searchbar-expandable-enabled .right,.ios .navbar.with-searchbar-expandable-enabled .title,.ios .navbar.with-searchbar-expandable-enabled-no-transition .left,.ios .navbar.with-searchbar-expandable-enabled-no-transition .right,.ios .navbar.with-searchbar-expandable-enabled-no-transition .title{transform:translateY(calc(-1 * var(--f7-navbar-height)));opacity:0!important}.ios .searchbar-expandable.searchbar-enabled{opacity:1;height:var(--f7-searchbar-expandable-size);pointer-events:auto}.md .searchbar-disable-button,.md .searchbar-icon{position:absolute;top:50%;transition-duration:.3s}.md .searchbar-icon{width:48px;height:48px;left:0;top:0;display:flex;align-items:center;justify-content:center;right:var(--f7-safe-area-right)}.md .searchbar-icon:after{width:auto;height:auto;content:'search_md';line-height:1.2}.md .searchbar-disable-button{width:48px;height:48px;transform:rotate(-90deg) scale(.5);font-size:0!important;display:block;margin-top:-24px;color:var(--f7-searchbar-link-color,var(--f7-bars-link-color,var(--f7-theme-color)));right:calc(var(--f7-searchbar-inner-padding-right) + var(--f7-safe-area-right))}.md .searchbar-disable-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;line-height:48px;content:'arrow_right_md'}.md .searchbar-enabled:not(.searchbar-enabled-no-disable-button) .searchbar-disable-button{transform:rotate(0deg) scale(1);pointer-events:auto;opacity:1}.md .searchbar-enabled:not(.searchbar-enabled-no-disable-button) .searchbar-icon{opacity:0;transform:rotate(90deg) scale(.5)}.md .searchbar{--f7-searchbar-input-extra-padding-left:34px}.md .searchbar .input-clear-button{width:48px;height:48px;margin-top:-24px;left:0}.md .searchbar .input-clear-button:after{line-height:48px;content:'delete_round_md';opacity:1}.md .searchbar .input-clear-button:before{display:none}.md .searchbar-inline{--f7-searchbar-input-extra-padding-left:32px}.md .page>.searchbar,.md .searchbar-expandable,.md .subnavbar .searchbar{--f7-searchbar-input-extra-padding-left:34px}.md .page>.searchbar .searchbar-disable-button,.md .searchbar-expandable .searchbar-disable-button,.md .subnavbar .searchbar .searchbar-disable-button{right:calc(var(--f7-searchbar-inner-padding-right) + var(--f7-safe-area-right))}.md .page>.searchbar .searchbar-icon,.md .searchbar-expandable .searchbar-icon,.md .subnavbar .searchbar .searchbar-icon{right:var(--f7-safe-area-right)}.md .searchbar-expandable{--f7-searchbar-inner-padding-left:4px;--f7-searchbar-inner-padding-right:4px;height:var(--f7-searchbar-expandable-size);opacity:0;bottom:0;border-radius:calc(var(--f7-searchbar-expandable-size));width:calc(var(--f7-searchbar-expandable-size));margin-top:calc(var(--f7-searchbar-expandable-size) * -1 / 2);transform:translate3d(0px,0px,0px);background-color:var(--f7-searchbar-input-bg-color);right:100%;margin-right:calc(var(--f7-searchbar-expandable-size) * -1)}.md .searchbar-expandable.searchbar-enabled{width:100%;border-radius:0;opacity:1;pointer-events:auto;margin-top:0;right:0;margin-right:0}