framework7 8.0.4 → 8.1.0

package/components/app/app-class.js

@@ -276,11 +276,10 @@ class Framework7 extends Framework7Class {
       $('html').removeClass('ios md').addClass(app.theme);
 
       // iOS Translucent
-      const device = app.device;
-      if (app.params.iosTranslucentBars && app.theme === 'ios' && device.ios) {
+      if (app.params.iosTranslucentBars && app.theme === 'ios') {
         $('html').addClass('ios-translucent-bars');
       }
-      if (app.params.iosTranslucentModals && app.theme === 'ios' && device.ios) {
+      if (app.params.iosTranslucentModals && app.theme === 'ios') {
         $('html').addClass('ios-translucent-modals');
       }
 

package/components/app/app.less

@@ -36,21 +36,7 @@ body {
   font-size: var(--f7-font-size);
   line-height: var(--f7-line-height);
   color: var(--f7-text-color);
-  &::-webkit-scrollbar {
-    width: 0px;
-    background: transparent;
-    position: relative;
-  }
-  &::-webkit-scrollbar-track {
-    box-shadow: none;
-    background: transparent;
-  }
-  &::-webkit-scrollbar-thumb {
-    background-color: transparent;
-    outline: none;
-    border-radius: 9999px;
-    position: relative;
-  }
+  .no-scrollbar();
 }
 .dark body,
 body.dark {

package/components/breadcrumbs/breadcrumbs-rtl.css

@@ -1 +1 @@
-:root{--f7-breadcrumbs-spacing:12px;--f7-breadcrumbs-padding:2px 0;--f7-breadcrumbs-icon-size:24px;--f7-breadcrumbs-separator-color:rgba(0, 0, 0, 0.35)}:root .dark,:root.dark{--f7-breadcrumbs-separator-color:rgba(255, 255, 255, 0.35)}.ios{--f7-breadcrumbs-item-bg-color:transparent;--f7-breadcrumbs-collapsed-border-radius:4px;--f7-breadcrumbs-collapsed-padding:0px 6px;--f7-breadcrumbs-separator-icon:'chevron_right_ios';--f7-breadcrumbs-font-size:17px;--f7-breadcrumbs-item-border-radius:0px;--f7-breadcrumbs-item-padding:0px;--f7-breadcrumbs-item-font-weight:normal;--f7-breadcrumbs-item-active-font-weight:600;--f7-breadcrumbs-item-color:rgba(0, 0, 0, 0.55);--f7-breadcrumbs-item-active-color:#000;--f7-breadcrumbs-collapsed-bg-color:rgba(0, 0, 0, 0.15);--f7-breadcrumbs-collapsed-color:rgba(0, 0, 0, 0.75)}.ios .dark,.ios.dark{--f7-breadcrumbs-item-color:rgba(255, 255, 255, 0.75);--f7-breadcrumbs-item-active-color:#fff;--f7-breadcrumbs-collapsed-bg-color:rgba(255, 255, 255, 0.15);--f7-breadcrumbs-collapsed-color:rgba(255, 255, 255, 0.75)}.md{--f7-breadcrumbs-collapsed-border-radius:8px;--f7-breadcrumbs-collapsed-padding:12px 8px;--f7-breadcrumbs-separator-icon:'chevron_right_md';--f7-breadcrumbs-font-size:14px;--f7-breadcrumbs-item-border-radius:8px;--f7-breadcrumbs-item-padding:4px 8px;--f7-breadcrumbs-item-font-weight:500;--f7-breadcrumbs-item-active-font-weight:500}.md,.md .dark,.md [class*=color-]{--f7-breadcrumbs-item-color:var(--f7-theme-color);--f7-breadcrumbs-item-bg-color:var(--f7-md-secondary-container);--f7-breadcrumbs-item-active-color:var(--f7-md-on-secondary-container);--f7-breadcrumbs-collapsed-color:var(--f7-theme-color);--f7-breadcrumbs-collapsed-bg-color:var(--f7-md-secondary-container)}.breadcrumbs{display:flex;align-items:center;justify-content:flex-start;font-size:var(--f7-breadcrumbs-font-size);overflow:auto;white-space:nowrap;padding:var(--f7-breadcrumbs-padding)}.breadcrumbs::-webkit-scrollbar{display:none;opacity:0}.breadcrumbs-collapsed,.breadcrumbs-item,.breadcrumbs-separator{flex-shrink:0;--f7-touch-ripple-color:transparent!important}.breadcrumbs-collapsed+.breadcrumbs-collapsed,.breadcrumbs-collapsed+.breadcrumbs-item,.breadcrumbs-collapsed+.breadcrumbs-separator,.breadcrumbs-item+.breadcrumbs-collapsed,.breadcrumbs-item+.breadcrumbs-item,.breadcrumbs-item+.breadcrumbs-separator,.breadcrumbs-separator+.breadcrumbs-collapsed,.breadcrumbs-separator+.breadcrumbs-item,.breadcrumbs-separator+.breadcrumbs-separator{margin-left:var(--f7-breadcrumbs-spacing)}.breadcrumbs-item{color:var(--f7-breadcrumbs-item-color);font-weight:var(--f7-breadcrumbs-item-font-weight);padding:var(--f7-breadcrumbs-item-padding);background-color:var(--f7-breadcrumbs-item-bg-color);display:flex;align-items:center;border-radius:var(--f7-breadcrumbs-item-border-radius)}.breadcrumbs-item .icon{font-size:var(--f7-breadcrumbs-icon-size);width:var(--f7-breadcrumbs-icon-size);height:var(--f7-breadcrumbs-icon-size)}.breadcrumbs-item a{color:inherit;--f7-touch-ripple-color:transparent!important}.breadcrumbs-item-active{color:var(--f7-breadcrumbs-item-active-color,var(--f7-breadcrumbs-item-color));font-weight:var(--f7-breadcrumbs-item-active-font-weight)}.breadcrumbs-separator{color:var(--f7-breadcrumbs-separator-color);height:24px;overflow:hidden;display:flex;align-items:center}.breadcrumbs-separator::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;content:var(--f7-breadcrumbs-separator-icon);width:12px}.ios .breadcrumbs-separator::after{font-size:12px;height:11px}.md .breadcrumbs-separator::after{font-size:18px;height:18px}.breadcrumbs-collapsed{display:flex;align-items:center;padding:var(--f7-breadcrumbs-collapsed-padding);background:var(--f7-breadcrumbs-collapsed-bg-color);min-height:1em;border-radius:var(--f7-breadcrumbs-collapsed-border-radius);cursor:pointer}.breadcrumbs-collapsed span,.breadcrumbs-collapsed::after,.breadcrumbs-collapsed::before{content:'';width:4px;height:4px;background:var(--f7-breadcrumbs-collapsed-color);border-radius:50%}.breadcrumbs-collapsed span{margin:0 3px}
+:root{--f7-breadcrumbs-spacing:12px;--f7-breadcrumbs-padding:2px 0;--f7-breadcrumbs-icon-size:24px;--f7-breadcrumbs-separator-color:rgba(0, 0, 0, 0.35)}:root .dark,:root.dark{--f7-breadcrumbs-separator-color:rgba(255, 255, 255, 0.35)}.ios{--f7-breadcrumbs-item-bg-color:transparent;--f7-breadcrumbs-collapsed-border-radius:4px;--f7-breadcrumbs-collapsed-padding:0px 6px;--f7-breadcrumbs-separator-icon:'chevron_right_ios';--f7-breadcrumbs-font-size:17px;--f7-breadcrumbs-item-border-radius:0px;--f7-breadcrumbs-item-padding:0px;--f7-breadcrumbs-item-font-weight:normal;--f7-breadcrumbs-item-active-font-weight:600;--f7-breadcrumbs-item-color:rgba(0, 0, 0, 0.55);--f7-breadcrumbs-item-active-color:#000;--f7-breadcrumbs-collapsed-bg-color:rgba(0, 0, 0, 0.15);--f7-breadcrumbs-collapsed-color:rgba(0, 0, 0, 0.75)}.ios .dark,.ios.dark{--f7-breadcrumbs-item-color:rgba(255, 255, 255, 0.75);--f7-breadcrumbs-item-active-color:#fff;--f7-breadcrumbs-collapsed-bg-color:rgba(255, 255, 255, 0.15);--f7-breadcrumbs-collapsed-color:rgba(255, 255, 255, 0.75)}.md{--f7-breadcrumbs-collapsed-border-radius:8px;--f7-breadcrumbs-collapsed-padding:12px 8px;--f7-breadcrumbs-separator-icon:'chevron_right_md';--f7-breadcrumbs-font-size:14px;--f7-breadcrumbs-item-border-radius:8px;--f7-breadcrumbs-item-padding:4px 8px;--f7-breadcrumbs-item-font-weight:500;--f7-breadcrumbs-item-active-font-weight:500}.md,.md .dark,.md [class*=color-]{--f7-breadcrumbs-item-color:var(--f7-theme-color);--f7-breadcrumbs-item-bg-color:var(--f7-md-secondary-container);--f7-breadcrumbs-item-active-color:var(--f7-md-on-secondary-container);--f7-breadcrumbs-collapsed-color:var(--f7-theme-color);--f7-breadcrumbs-collapsed-bg-color:var(--f7-md-secondary-container)}.breadcrumbs{display:flex;align-items:center;justify-content:flex-start;font-size:var(--f7-breadcrumbs-font-size);overflow:auto;white-space:nowrap;padding:var(--f7-breadcrumbs-padding);scrollbar-width:none;scrollbar-color:transparent}.breadcrumbs::-webkit-scrollbar{-webkit-appearance:none;appearance:none;width:0px;display:none;opacity:0;background:0 0}.breadcrumbs::-webkit-scrollbar-track{box-shadow:none;background:0 0}.breadcrumbs::-webkit-scrollbar-thumb{background-color:transparent;outline:0;border-radius:9999px;position:relative}.breadcrumbs-collapsed,.breadcrumbs-item,.breadcrumbs-separator{flex-shrink:0;--f7-touch-ripple-color:transparent!important}.breadcrumbs-collapsed+.breadcrumbs-collapsed,.breadcrumbs-collapsed+.breadcrumbs-item,.breadcrumbs-collapsed+.breadcrumbs-separator,.breadcrumbs-item+.breadcrumbs-collapsed,.breadcrumbs-item+.breadcrumbs-item,.breadcrumbs-item+.breadcrumbs-separator,.breadcrumbs-separator+.breadcrumbs-collapsed,.breadcrumbs-separator+.breadcrumbs-item,.breadcrumbs-separator+.breadcrumbs-separator{margin-left:var(--f7-breadcrumbs-spacing)}.breadcrumbs-item{color:var(--f7-breadcrumbs-item-color);font-weight:var(--f7-breadcrumbs-item-font-weight);padding:var(--f7-breadcrumbs-item-padding);background-color:var(--f7-breadcrumbs-item-bg-color);display:flex;align-items:center;border-radius:var(--f7-breadcrumbs-item-border-radius)}.breadcrumbs-item .icon{font-size:var(--f7-breadcrumbs-icon-size);width:var(--f7-breadcrumbs-icon-size);height:var(--f7-breadcrumbs-icon-size)}.breadcrumbs-item a{color:inherit;--f7-touch-ripple-color:transparent!important}.breadcrumbs-item-active{color:var(--f7-breadcrumbs-item-active-color,var(--f7-breadcrumbs-item-color));font-weight:var(--f7-breadcrumbs-item-active-font-weight)}.breadcrumbs-separator{color:var(--f7-breadcrumbs-separator-color);height:24px;overflow:hidden;display:flex;align-items:center}.breadcrumbs-separator::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;content:var(--f7-breadcrumbs-separator-icon);width:12px}.ios .breadcrumbs-separator::after{font-size:12px;height:11px}.md .breadcrumbs-separator::after{font-size:18px;height:18px}.breadcrumbs-collapsed{display:flex;align-items:center;padding:var(--f7-breadcrumbs-collapsed-padding);background:var(--f7-breadcrumbs-collapsed-bg-color);min-height:1em;border-radius:var(--f7-breadcrumbs-collapsed-border-radius);cursor:pointer}.breadcrumbs-collapsed span,.breadcrumbs-collapsed::after,.breadcrumbs-collapsed::before{content:'';width:4px;height:4px;background:var(--f7-breadcrumbs-collapsed-color);border-radius:50%}.breadcrumbs-collapsed span{margin:0 3px}

package/components/breadcrumbs/breadcrumbs.css

@@ -1 +1 @@
-:root{--f7-breadcrumbs-spacing:12px;--f7-breadcrumbs-padding:2px 0;--f7-breadcrumbs-icon-size:24px;--f7-breadcrumbs-separator-color:rgba(0, 0, 0, 0.35)}:root .dark,:root.dark{--f7-breadcrumbs-separator-color:rgba(255, 255, 255, 0.35)}.ios{--f7-breadcrumbs-item-bg-color:transparent;--f7-breadcrumbs-collapsed-border-radius:4px;--f7-breadcrumbs-collapsed-padding:0px 6px;--f7-breadcrumbs-separator-icon:'chevron_right_ios';--f7-breadcrumbs-font-size:17px;--f7-breadcrumbs-item-border-radius:0px;--f7-breadcrumbs-item-padding:0px;--f7-breadcrumbs-item-font-weight:normal;--f7-breadcrumbs-item-active-font-weight:600;--f7-breadcrumbs-item-color:rgba(0, 0, 0, 0.55);--f7-breadcrumbs-item-active-color:#000;--f7-breadcrumbs-collapsed-bg-color:rgba(0, 0, 0, 0.15);--f7-breadcrumbs-collapsed-color:rgba(0, 0, 0, 0.75)}.ios .dark,.ios.dark{--f7-breadcrumbs-item-color:rgba(255, 255, 255, 0.75);--f7-breadcrumbs-item-active-color:#fff;--f7-breadcrumbs-collapsed-bg-color:rgba(255, 255, 255, 0.15);--f7-breadcrumbs-collapsed-color:rgba(255, 255, 255, 0.75)}.md{--f7-breadcrumbs-collapsed-border-radius:8px;--f7-breadcrumbs-collapsed-padding:12px 8px;--f7-breadcrumbs-separator-icon:'chevron_right_md';--f7-breadcrumbs-font-size:14px;--f7-breadcrumbs-item-border-radius:8px;--f7-breadcrumbs-item-padding:4px 8px;--f7-breadcrumbs-item-font-weight:500;--f7-breadcrumbs-item-active-font-weight:500}.md,.md .dark,.md [class*=color-]{--f7-breadcrumbs-item-color:var(--f7-theme-color);--f7-breadcrumbs-item-bg-color:var(--f7-md-secondary-container);--f7-breadcrumbs-item-active-color:var(--f7-md-on-secondary-container);--f7-breadcrumbs-collapsed-color:var(--f7-theme-color);--f7-breadcrumbs-collapsed-bg-color:var(--f7-md-secondary-container)}.breadcrumbs{display:flex;align-items:center;justify-content:flex-start;font-size:var(--f7-breadcrumbs-font-size);overflow:auto;white-space:nowrap;padding:var(--f7-breadcrumbs-padding)}.breadcrumbs::-webkit-scrollbar{display:none;opacity:0}.breadcrumbs-collapsed,.breadcrumbs-item,.breadcrumbs-separator{flex-shrink:0;--f7-touch-ripple-color:transparent!important}.breadcrumbs-collapsed+.breadcrumbs-collapsed,.breadcrumbs-collapsed+.breadcrumbs-item,.breadcrumbs-collapsed+.breadcrumbs-separator,.breadcrumbs-item+.breadcrumbs-collapsed,.breadcrumbs-item+.breadcrumbs-item,.breadcrumbs-item+.breadcrumbs-separator,.breadcrumbs-separator+.breadcrumbs-collapsed,.breadcrumbs-separator+.breadcrumbs-item,.breadcrumbs-separator+.breadcrumbs-separator{margin-left:var(--f7-breadcrumbs-spacing)}.breadcrumbs-item{color:var(--f7-breadcrumbs-item-color);font-weight:var(--f7-breadcrumbs-item-font-weight);padding:var(--f7-breadcrumbs-item-padding);background-color:var(--f7-breadcrumbs-item-bg-color);display:flex;align-items:center;border-radius:var(--f7-breadcrumbs-item-border-radius)}.breadcrumbs-item .icon{font-size:var(--f7-breadcrumbs-icon-size);width:var(--f7-breadcrumbs-icon-size);height:var(--f7-breadcrumbs-icon-size)}.breadcrumbs-item a{color:inherit;--f7-touch-ripple-color:transparent!important}.breadcrumbs-item-active{color:var(--f7-breadcrumbs-item-active-color,var(--f7-breadcrumbs-item-color));font-weight:var(--f7-breadcrumbs-item-active-font-weight)}.breadcrumbs-separator{color:var(--f7-breadcrumbs-separator-color);height:24px;overflow:hidden;display:flex;align-items:center}.breadcrumbs-separator::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;content:var(--f7-breadcrumbs-separator-icon);width:12px}.ios .breadcrumbs-separator::after{font-size:12px;height:11px}.md .breadcrumbs-separator::after{font-size:18px;height:18px}.breadcrumbs-collapsed{display:flex;align-items:center;padding:var(--f7-breadcrumbs-collapsed-padding);background:var(--f7-breadcrumbs-collapsed-bg-color);min-height:1em;border-radius:var(--f7-breadcrumbs-collapsed-border-radius);cursor:pointer}.breadcrumbs-collapsed span,.breadcrumbs-collapsed::after,.breadcrumbs-collapsed::before{content:'';width:4px;height:4px;background:var(--f7-breadcrumbs-collapsed-color);border-radius:50%}.breadcrumbs-collapsed span{margin:0 3px}
+:root{--f7-breadcrumbs-spacing:12px;--f7-breadcrumbs-padding:2px 0;--f7-breadcrumbs-icon-size:24px;--f7-breadcrumbs-separator-color:rgba(0, 0, 0, 0.35)}:root .dark,:root.dark{--f7-breadcrumbs-separator-color:rgba(255, 255, 255, 0.35)}.ios{--f7-breadcrumbs-item-bg-color:transparent;--f7-breadcrumbs-collapsed-border-radius:4px;--f7-breadcrumbs-collapsed-padding:0px 6px;--f7-breadcrumbs-separator-icon:'chevron_right_ios';--f7-breadcrumbs-font-size:17px;--f7-breadcrumbs-item-border-radius:0px;--f7-breadcrumbs-item-padding:0px;--f7-breadcrumbs-item-font-weight:normal;--f7-breadcrumbs-item-active-font-weight:600;--f7-breadcrumbs-item-color:rgba(0, 0, 0, 0.55);--f7-breadcrumbs-item-active-color:#000;--f7-breadcrumbs-collapsed-bg-color:rgba(0, 0, 0, 0.15);--f7-breadcrumbs-collapsed-color:rgba(0, 0, 0, 0.75)}.ios .dark,.ios.dark{--f7-breadcrumbs-item-color:rgba(255, 255, 255, 0.75);--f7-breadcrumbs-item-active-color:#fff;--f7-breadcrumbs-collapsed-bg-color:rgba(255, 255, 255, 0.15);--f7-breadcrumbs-collapsed-color:rgba(255, 255, 255, 0.75)}.md{--f7-breadcrumbs-collapsed-border-radius:8px;--f7-breadcrumbs-collapsed-padding:12px 8px;--f7-breadcrumbs-separator-icon:'chevron_right_md';--f7-breadcrumbs-font-size:14px;--f7-breadcrumbs-item-border-radius:8px;--f7-breadcrumbs-item-padding:4px 8px;--f7-breadcrumbs-item-font-weight:500;--f7-breadcrumbs-item-active-font-weight:500}.md,.md .dark,.md [class*=color-]{--f7-breadcrumbs-item-color:var(--f7-theme-color);--f7-breadcrumbs-item-bg-color:var(--f7-md-secondary-container);--f7-breadcrumbs-item-active-color:var(--f7-md-on-secondary-container);--f7-breadcrumbs-collapsed-color:var(--f7-theme-color);--f7-breadcrumbs-collapsed-bg-color:var(--f7-md-secondary-container)}.breadcrumbs{display:flex;align-items:center;justify-content:flex-start;font-size:var(--f7-breadcrumbs-font-size);overflow:auto;white-space:nowrap;padding:var(--f7-breadcrumbs-padding);scrollbar-width:none;scrollbar-color:transparent}.breadcrumbs::-webkit-scrollbar{-webkit-appearance:none;appearance:none;width:0px;display:none;opacity:0;background:0 0}.breadcrumbs::-webkit-scrollbar-track{box-shadow:none;background:0 0}.breadcrumbs::-webkit-scrollbar-thumb{background-color:transparent;outline:0;border-radius:9999px;position:relative}.breadcrumbs-collapsed,.breadcrumbs-item,.breadcrumbs-separator{flex-shrink:0;--f7-touch-ripple-color:transparent!important}.breadcrumbs-collapsed+.breadcrumbs-collapsed,.breadcrumbs-collapsed+.breadcrumbs-item,.breadcrumbs-collapsed+.breadcrumbs-separator,.breadcrumbs-item+.breadcrumbs-collapsed,.breadcrumbs-item+.breadcrumbs-item,.breadcrumbs-item+.breadcrumbs-separator,.breadcrumbs-separator+.breadcrumbs-collapsed,.breadcrumbs-separator+.breadcrumbs-item,.breadcrumbs-separator+.breadcrumbs-separator{margin-left:var(--f7-breadcrumbs-spacing)}.breadcrumbs-item{color:var(--f7-breadcrumbs-item-color);font-weight:var(--f7-breadcrumbs-item-font-weight);padding:var(--f7-breadcrumbs-item-padding);background-color:var(--f7-breadcrumbs-item-bg-color);display:flex;align-items:center;border-radius:var(--f7-breadcrumbs-item-border-radius)}.breadcrumbs-item .icon{font-size:var(--f7-breadcrumbs-icon-size);width:var(--f7-breadcrumbs-icon-size);height:var(--f7-breadcrumbs-icon-size)}.breadcrumbs-item a{color:inherit;--f7-touch-ripple-color:transparent!important}.breadcrumbs-item-active{color:var(--f7-breadcrumbs-item-active-color,var(--f7-breadcrumbs-item-color));font-weight:var(--f7-breadcrumbs-item-active-font-weight)}.breadcrumbs-separator{color:var(--f7-breadcrumbs-separator-color);height:24px;overflow:hidden;display:flex;align-items:center}.breadcrumbs-separator::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;content:var(--f7-breadcrumbs-separator-icon);width:12px}.ios .breadcrumbs-separator::after{font-size:12px;height:11px}.md .breadcrumbs-separator::after{font-size:18px;height:18px}.breadcrumbs-collapsed{display:flex;align-items:center;padding:var(--f7-breadcrumbs-collapsed-padding);background:var(--f7-breadcrumbs-collapsed-bg-color);min-height:1em;border-radius:var(--f7-breadcrumbs-collapsed-border-radius);cursor:pointer}.breadcrumbs-collapsed span,.breadcrumbs-collapsed::after,.breadcrumbs-collapsed::before{content:'';width:4px;height:4px;background:var(--f7-breadcrumbs-collapsed-color);border-radius:50%}.breadcrumbs-collapsed span{margin:0 3px}

package/components/breadcrumbs/breadcrumbs.less

@@ -9,10 +9,7 @@
   overflow: auto;
   white-space: nowrap;
   padding: var(--f7-breadcrumbs-padding);
-  &::-webkit-scrollbar {
-    display: none;
-    opacity: 0;
-  }
+  .no-scrollbar();
 }
 .breadcrumbs-separator,
 .breadcrumbs-item,

package/components/calendar/calendar-rtl.css

@@ -1 +1 @@
-:root{--f7-calendar-height:340px;--f7-calendar-sheet-landscape-height:220px;--f7-calendar-popover-width:320px;--f7-calendar-popover-height:320px;--f7-calendar-modal-height:420px;--f7-calendar-modal-max-width:380px;--f7-calendar-week-header-bg-color:transparent;--f7-calendar-footer-padding:0 8px;--f7-calendar-week-header-font-size:11px;--f7-calendar-disabled-text-color:#d4d4d4;--f7-calendar-event-dot-size:4px;--f7-calendar-time-selector-height:28px;--f7-calendar-picker-pressed-bg-color:rgba(0, 0, 0, 0.1);--f7-calendar-picker-hover-bg-color:rgba(0, 0, 0, 0.03);--f7-calendar-time-selector-bg-color:rgba(0, 0, 0, 0.05)}:root .dark,:root.dark{--f7-calendar-picker-pressed-bg-color:rgba(255, 255, 255, 0.08);--f7-calendar-picker-hover-bg-color:rgba(255, 255, 255, 0.03);--f7-calendar-time-selector-bg-color:rgba(255, 255, 255, 0.1)}.ios{--f7-calendar-selected-text-color:#fff;--f7-calendar-header-height:44px;--f7-calendar-header-font-size:17px;--f7-calendar-header-font-weight:600;--f7-calendar-header-padding:0 8px;--f7-calendar-footer-height:44px;--f7-calendar-footer-font-size:17px;--f7-calendar-week-header-height:18px;--f7-calendar-day-font-size:15px;--f7-calendar-day-size:30px;--f7-calendar-picker-font-size:17px;--f7-calendar-time-selector-font-size:17px;--f7-calendar-modal-border-radius:4px;--f7-calendar-modal-box-shadow:0px 11px 15px -7px rgba(0, 0, 0, 0.2),0px 24px 38px 3px rgba(0, 0, 0, 0.14),0px 9px 46px 8px rgba(0, 0, 0, 0.12);--f7-calendar-prev-next-text-color:#c8c8c8;--f7-calendar-sheet-border-color:#929499;--f7-calendar-sheet-bg-color:#fff;--f7-calendar-week-header-text-color:#5e5e5e;--f7-calendar-modal-bg-color:#fff;--f7-calendar-day-text-color:#000;--f7-calendar-today-text-color:#000;--f7-calendar-today-bg-color:#e3e3e3}.ios .dark,.ios.dark{--f7-calendar-prev-next-text-color:#5e5e5e;--f7-calendar-sheet-border-color:var(--f7-bars-border-color);--f7-calendar-sheet-bg-color:#121212;--f7-calendar-week-header-text-color:#aaa;--f7-calendar-modal-bg-color:#121212;--f7-calendar-day-text-color:#fff;--f7-calendar-today-text-color:#fff;--f7-calendar-today-bg-color:#333}.md{--f7-calendar-sheet-border-color:transparent;--f7-calendar-header-height:64px;--f7-calendar-header-font-size:24px;--f7-calendar-header-font-weight:400;--f7-calendar-header-padding:0 24px;--f7-calendar-footer-height:56px;--f7-calendar-footer-font-size:14px;--f7-calendar-week-header-height:24px;--f7-calendar-day-font-size:14px;--f7-calendar-today-bg-color:none;--f7-calendar-day-size:32px;--f7-calendar-picker-font-size:14px;--f7-calendar-time-selector-font-size:14px;--f7-calendar-modal-border-radius:28px;--f7-calendar-modal-box-shadow:none}.md,.md .dark,.md [class*=color-]{--f7-calendar-sheet-bg-color:var(--f7-md-surface-1);--f7-calendar-selected-text-color:var(--f7-md-on-primary);--f7-calendar-week-header-text-color:var(--f7-md-on-surface-variant);--f7-calendar-day-text-color:var(--f7-md-on-surface);--f7-calendar-prev-next-text-color:rgba(var(--f7-md-on-surface-variant-rgb), 0.55);--f7-calendar-today-text-color:var(--f7-theme-color);--f7-calendar-modal-bg-color:var(--f7-md-surface-1)}.calendar{overflow:hidden;height:var(--f7-calendar-height);width:100%;display:flex;flex-direction:column}.calendar.modal-in{display:flex}@media (orientation:landscape) and (max-height:415px){.calendar.calendar-sheet{height:var(--f7-calendar-sheet-landscape-height)}.calendar.calendar-modal{height:calc(100vh - var(--f7-navbar-height))}}.calendar.calendar-inline,.calendar.calendar-popover .calendar{position:relative}.calendar-sheet{--f7-sheet-border-color:var(--f7-calendar-sheet-border-color);background:var(--f7-calendar-sheet-bg-color);padding-bottom:var(--f7-safe-area-bottom);height:calc(var(--f7-calendar-height) + var(--f7-safe-area-bottom))}.calendar-sheet:before{z-index:600}.calendar-modal .toolbar:before,.calendar-popover .toolbar:before,.calendar-sheet .toolbar:before{display:none}.calendar-popover{width:var(--f7-calendar-popover-width)}.calendar-popover .calendar-header,.calendar-popover .toolbar-top{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0;overflow:hidden}.calendar-popover .calendar-header+.toolbar-top{border-radius:0}.calendar-popover .calendar-footer,.calendar-popover .toolbar-bottom{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.calendar-popover .calendar{height:var(--f7-calendar-popover-height);position:relative;z-index:1}.calendar-popover .calendar-month-picker,.calendar-popover .calendar-time-picker,.calendar-popover .calendar-year-picker{border-radius:var(--f7-popover-border-radius)}.calendar-popover .calendar-month-picker .picker,.calendar-popover .calendar-time-picker .picker,.calendar-popover .calendar-year-picker .picker{height:100%;display:flex;flex-direction:column}.calendar-header{width:100%;position:relative;overflow:hidden;flex-shrink:0;white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;padding:var(--f7-calendar-header-padding);background-color:var(--f7-calendar-header-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-header-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-header-height);line-height:var(--f7-calendar-header-height);font-size:var(--f7-calendar-header-font-size);font-weight:var(--f7-calendar-header-font-weight)}.calendar-header a{color:var(--f7-calendar-header-link-color,var(--f7-bars-link-color,var(--f7-theme-color)))}.calendar-footer{width:100%;flex-shrink:0;padding:var(--f7-calendar-footer-padding);background-color:var(--f7-calendar-footer-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-footer-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-footer-height);font-size:var(--f7-calendar-header-font-size);display:flex;justify-content:flex-end;box-sizing:border-box;align-items:center;position:relative}.calendar-footer a{color:var(--f7-calendar-footer-link-color,var(--f7-bars-link-color,var(--f7-theme-color)))}.calendar-footer:before{content:'';position:absolute;background-color:var(--f7-calendar-footer-border-color,var(--f7-bars-border-color));display:block;z-index:15;top:0;right:auto;bottom:auto;left:0;height:1px;width:100%;transform-origin:50% 0%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.calendar-modal{position:absolute;height:var(--f7-calendar-modal-height);overflow:hidden;top:50%;left:50%;min-width:300px;max-width:var(--f7-calendar-modal-max-width);transform:translate3d(-50%,100vh,0);transition-property:transform;display:flex;z-index:13500;background:var(--f7-calendar-modal-bg-color);width:90%;border-radius:var(--f7-calendar-modal-border-radius);box-shadow:var(--f7-calendar-modal-box-shadow);transition-timing-function:cubic-bezier(0,1,0.2,1)}.calendar-modal.modal-in,.calendar-modal.modal-out{transition-duration:.4s}.calendar-modal.modal-in{transform:translate3d(-50%,-50%,0)}.calendar-modal.modal-out{transform:translate3d(-50%,100vh,0)}.calendar-week-header{display:flex;box-sizing:border-box;position:relative;font-size:var(--f7-calendar-week-header-font-size);background-color:var(--f7-calendar-week-header-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-week-header-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-week-header-height);padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}.calendar-week-header .calendar-week-day{flex-shrink:1;width:calc(100% / 7);text-align:center;line-height:var(--f7-calendar-week-header-height)}.calendar-months{width:100%;height:100%;overflow:hidden;position:relative;flex-shrink:10}.calendar-months-wrapper{position:relative;width:100%;height:100%;transition:.3s}.calendar-month{display:flex;flex-direction:column;width:100%;height:100%;position:absolute;left:0;top:0}.calendar-row{height:16.66666667%;display:flex;flex-shrink:1;width:100%;position:relative;box-sizing:border-box;padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}.calendar-modal .calendar-months:first-child .calendar-row:first-child:before,.calendar-popover .calendar-months:first-child .calendar-row:first-child:before{display:none!important}.calendar-day{flex-shrink:1;display:flex;justify-content:center;align-items:center;box-sizing:border-box;width:14.28571429%;text-align:center;cursor:pointer;z-index:20;color:var(--f7-calendar-day-text-color);height:100%;font-size:var(--f7-calendar-day-font-size)}.calendar-day-today .calendar-day-number{color:var(--f7-calendar-today-text-color,var(--f7-theme-color));background-color:var(--f7-calendar-today-bg-color)}.calendar-day-next,.calendar-day-prev{color:var(--f7-calendar-prev-next-text-color)}.calendar-day-disabled{color:var(--f7-calendar-disabled-text-color);cursor:auto}.calendar-day-selected .calendar-day-number{color:var(--f7-calendar-selected-text-color);background-color:var(--f7-calendar-selected-bg-color,var(--f7-theme-color))}.calendar-day-number{display:inline-block;border-radius:50%;position:relative;width:var(--f7-calendar-day-size);height:var(--f7-calendar-day-size);line-height:var(--f7-calendar-day-size)}.calendar-day-events{position:absolute;display:flex;left:0;width:100%;top:100%;align-items:center;justify-content:center;margin-top:1px}.calendar-day-event{width:var(--f7-calendar-event-dot-size);height:var(--f7-calendar-event-dot-size);border-radius:calc(var(--f7-calendar-event-dot-size)/ 2);background-color:var(--f7-calendar-event-bg-color)}.calendar-day-event+.calendar-day-event{margin-left:2px}.calendar-day-selected-left,.calendar-day-selected-range,.calendar-day-selected-right{position:relative}.calendar-day-selected-left:before,.calendar-day-selected-range:before,.calendar-day-selected-right:before{width:100%;height:var(--f7-calendar-day-size);content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:-1;background-color:var(--f7-calendar-selected-bg-color,var(--f7-theme-color));opacity:.2}.calendar-day-selected-left:before,.calendar-day-selected-range:first-child:before{left:auto;right:0;width:calc(50% + var(--f7-calendar-day-size)/ 2);border-radius:var(--f7-calendar-day-size) 0 0 var(--f7-calendar-day-size)}.calendar-day-selected-range:last-child:before,.calendar-day-selected-right:before{width:calc(50% + var(--f7-calendar-day-size)/ 2);border-radius:0 var(--f7-calendar-day-size) var(--f7-calendar-day-size) 0}.calendar-day-selected-left:last-child:before,.calendar-day-selected-right:first-child:before{display:none}.calendar-day-selected-range .calendar-day-number{background-color:transparent;color:inherit}.calendar-month-selector,.calendar-year-selector{display:flex;justify-content:space-between;align-items:center;width:50%;max-width:200px;flex-shrink:10;margin-left:auto;margin-right:auto}.calendar-month-selector .calendar-day-number,.calendar-year-selector .calendar-day-number{flex-shrink:1;position:relative;overflow:hidden;text-overflow:ellipsis}.calendar-month-selector a.icon-only,.calendar-year-selector a.icon-only{min-width:36px}.calendar-month-picker,.calendar-time-picker,.calendar-year-picker{position:relative;width:100%;height:100%;-webkit-user-select:none;user-select:none;background:0 0}.calendar-month-picker .picker-columns,.calendar-year-picker .picker-columns{text-align:center}.calendar-month-picker-item,.calendar-year-picker-item{display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden;cursor:pointer;transition-duration:.1s;box-sizing:border-box}.calendar-month-picker-item span,.calendar-year-picker-item span{white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;position:relative;overflow:hidden;pointer-events:none}.calendar-month-picker-item.active-state,.calendar-year-picker-item.active-state{background:var(--f7-calendar-picker-pressed-bg-color)}.calendar-month-picker-item{padding:5px}.sheet-modal .calendar-month-picker-item{width:25%;height:33.33333333%}.sheet-modal .calendar-month-picker-item:nth-child(4n+1):before{display:none!important}.sheet-modal .calendar-month-picker-item:nth-child(n+9):after{display:none!important}.calendar-modal .calendar-month-picker-item,.popover .calendar-month-picker-item{width:33.33333333%;height:25%}.calendar-modal .calendar-month-picker-item:nth-child(3n+1):before,.popover .calendar-month-picker-item:nth-child(3n+1):before{display:none!important}.calendar-modal .calendar-month-picker-item:nth-child(n+10):after,.popover .calendar-month-picker-item:nth-child(n+10):after{display:none!important}.calendar-month-picker-item-current,.calendar-year-picker-item-current{color:var(--f7-calendar-picker-selected-text-color,var(--f7-theme-color))}.calendar-year-picker{overflow:auto;--webkit-overflow-scrolling:touch}.calendar-year-picker-item{height:34px;line-height:34px;width:100%}.calendar-time-selector{flex-shrink:0;font-size:var(--f7-calendar-time-selector-font-size);position:relative;display:flex;justify-content:space-between;align-items:center;padding:12px 16px}.calendar-time-selector a{overflow:hidden;position:relative;justify-content:center;align-items:center;display:flex;box-sizing:border-box;height:var(--f7-calendar-time-selector-height);background-color:var(--f7-calendar-time-selector-bg-color);padding:0 16px;border-radius:8px}.calendar-time-selector>span{font-weight:500}.calendar-time-selector .segmented{margin-left:8px}.calendar-month-picker-popover,.calendar-time-picker-popover,.calendar-year-picker-popover{height:240px;width:240px}.calendar-month-picker-popover .popover-inner,.calendar-time-picker-popover .popover-inner,.calendar-year-picker-popover .popover-inner{height:100%;overflow:hidden}.calendar-time-picker{--f7-picker-popover-height:100%;--f7-picker-inline-height:100%}.calendar-time-picker .toolbar{flex-shrink:0;top:0!important}.calendar-time-picker .picker{height:100%;display:flex;flex-direction:column}
+:root{--f7-calendar-height:340px;--f7-calendar-sheet-landscape-height:220px;--f7-calendar-popover-width:320px;--f7-calendar-popover-height:320px;--f7-calendar-modal-height:420px;--f7-calendar-modal-max-width:380px;--f7-calendar-week-header-bg-color:transparent;--f7-calendar-footer-padding:0 8px;--f7-calendar-week-header-font-size:11px;--f7-calendar-disabled-text-color:#d4d4d4;--f7-calendar-event-dot-size:4px;--f7-calendar-time-selector-height:28px;--f7-calendar-picker-pressed-bg-color:rgba(0, 0, 0, 0.1);--f7-calendar-picker-hover-bg-color:rgba(0, 0, 0, 0.03);--f7-calendar-time-selector-bg-color:rgba(0, 0, 0, 0.05)}:root .dark,:root.dark{--f7-calendar-picker-pressed-bg-color:rgba(255, 255, 255, 0.08);--f7-calendar-picker-hover-bg-color:rgba(255, 255, 255, 0.03);--f7-calendar-time-selector-bg-color:rgba(255, 255, 255, 0.1)}.ios{--f7-calendar-selected-text-color:#fff;--f7-calendar-header-height:44px;--f7-calendar-header-font-size:17px;--f7-calendar-header-font-weight:600;--f7-calendar-header-padding:0 8px;--f7-calendar-footer-height:44px;--f7-calendar-footer-font-size:17px;--f7-calendar-week-header-height:18px;--f7-calendar-day-font-size:15px;--f7-calendar-day-size:30px;--f7-calendar-picker-font-size:17px;--f7-calendar-time-selector-font-size:17px;--f7-calendar-modal-border-radius:4px;--f7-calendar-modal-box-shadow:0px 11px 15px -7px rgba(0, 0, 0, 0.2),0px 24px 38px 3px rgba(0, 0, 0, 0.14),0px 9px 46px 8px rgba(0, 0, 0, 0.12);--f7-calendar-prev-next-text-color:#c8c8c8;--f7-calendar-sheet-border-color:#929499;--f7-calendar-sheet-bg-color:#fff;--f7-calendar-week-header-text-color:#5e5e5e;--f7-calendar-modal-bg-color:#fff;--f7-calendar-day-text-color:#000;--f7-calendar-today-text-color:#000;--f7-calendar-today-bg-color:#e3e3e3}.ios .dark,.ios.dark{--f7-calendar-prev-next-text-color:#5e5e5e;--f7-calendar-sheet-border-color:var(--f7-bars-border-color);--f7-calendar-sheet-bg-color:#121212;--f7-calendar-week-header-text-color:#aaa;--f7-calendar-modal-bg-color:#121212;--f7-calendar-day-text-color:#fff;--f7-calendar-today-text-color:#fff;--f7-calendar-today-bg-color:#333}.md{--f7-calendar-sheet-border-color:transparent;--f7-calendar-header-height:64px;--f7-calendar-header-font-size:24px;--f7-calendar-header-font-weight:400;--f7-calendar-header-padding:0 24px;--f7-calendar-footer-height:56px;--f7-calendar-footer-font-size:14px;--f7-calendar-week-header-height:24px;--f7-calendar-day-font-size:14px;--f7-calendar-today-bg-color:none;--f7-calendar-day-size:32px;--f7-calendar-picker-font-size:14px;--f7-calendar-time-selector-font-size:14px;--f7-calendar-modal-border-radius:28px;--f7-calendar-modal-box-shadow:none}.md,.md .dark,.md [class*=color-]{--f7-calendar-sheet-bg-color:var(--f7-md-surface-1);--f7-calendar-selected-text-color:var(--f7-md-on-primary);--f7-calendar-week-header-text-color:var(--f7-md-on-surface-variant);--f7-calendar-day-text-color:var(--f7-md-on-surface);--f7-calendar-prev-next-text-color:rgba(var(--f7-md-on-surface-variant-rgb), 0.55);--f7-calendar-today-text-color:var(--f7-theme-color);--f7-calendar-modal-bg-color:var(--f7-md-surface-1)}.calendar{overflow:hidden;height:var(--f7-calendar-height);width:100%;display:flex;flex-direction:column}.calendar.modal-in{display:flex}@media (orientation:landscape) and (max-height:415px){.calendar.calendar-sheet{height:var(--f7-calendar-sheet-landscape-height)}.calendar.calendar-modal{height:calc(100vh - var(--f7-navbar-height))}}.calendar.calendar-inline,.calendar.calendar-popover .calendar{position:relative}.calendar-sheet{--f7-sheet-border-color:var(--f7-calendar-sheet-border-color);background:var(--f7-calendar-sheet-bg-color);padding-bottom:var(--f7-safe-area-bottom);height:calc(var(--f7-calendar-height) + var(--f7-safe-area-bottom))}.calendar-sheet:before{z-index:600}.calendar-modal .toolbar:before,.calendar-popover .toolbar:before,.calendar-sheet .toolbar:before{display:none}.calendar-popover{width:var(--f7-calendar-popover-width)}.calendar-popover .calendar-header,.calendar-popover .toolbar-top{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0;overflow:hidden}.calendar-popover .calendar-header+.toolbar-top{border-radius:0}.calendar-popover .calendar-footer,.calendar-popover .toolbar-bottom{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.calendar-popover .calendar{height:var(--f7-calendar-popover-height);position:relative;z-index:1}.calendar-popover .calendar-month-picker,.calendar-popover .calendar-time-picker,.calendar-popover .calendar-year-picker{border-radius:var(--f7-popover-border-radius)}.calendar-popover .calendar-month-picker .picker,.calendar-popover .calendar-time-picker .picker,.calendar-popover .calendar-year-picker .picker{height:100%;display:flex;flex-direction:column}.calendar-header{width:100%;position:relative;overflow:hidden;flex-shrink:0;white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;padding:var(--f7-calendar-header-padding);background-color:var(--f7-calendar-header-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-header-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-header-height);line-height:var(--f7-calendar-header-height);font-size:var(--f7-calendar-header-font-size);font-weight:var(--f7-calendar-header-font-weight)}.calendar-header a{color:var(--f7-calendar-header-link-color,var(--f7-bars-link-color,var(--f7-theme-color)))}.calendar-footer{width:100%;flex-shrink:0;padding:var(--f7-calendar-footer-padding);background-color:var(--f7-calendar-footer-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-footer-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-footer-height);font-size:var(--f7-calendar-header-font-size);display:flex;justify-content:flex-end;box-sizing:border-box;align-items:center;position:relative}.calendar-footer a{color:var(--f7-calendar-footer-link-color,var(--f7-bars-link-color,var(--f7-theme-color)))}.calendar-footer:before{content:'';position:absolute;background-color:var(--f7-calendar-footer-border-color,var(--f7-bars-border-color));display:block;z-index:15;top:0;right:auto;bottom:auto;left:0;height:1px;width:100%;transform-origin:50% 0%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.calendar-modal{position:absolute;height:var(--f7-calendar-modal-height);overflow:hidden;top:50%;left:50%;min-width:300px;max-width:var(--f7-calendar-modal-max-width);transform:translate3d(-50%,100vh,0);transition-property:transform;display:flex;z-index:13500;background:var(--f7-calendar-modal-bg-color);width:90%;border-radius:var(--f7-calendar-modal-border-radius);box-shadow:var(--f7-calendar-modal-box-shadow);transition-timing-function:cubic-bezier(0,1,0.2,1)}.calendar-modal.modal-in,.calendar-modal.modal-out{transition-duration:.4s}.calendar-modal.modal-in{transform:translate3d(-50%,-50%,0)}.calendar-modal.modal-out{transform:translate3d(-50%,100vh,0)}.calendar-week-header{display:flex;box-sizing:border-box;position:relative;font-size:var(--f7-calendar-week-header-font-size);background-color:var(--f7-calendar-week-header-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-week-header-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-week-header-height);padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}.calendar-week-header .calendar-week-day{flex-shrink:1;width:calc(100% / 7);text-align:center;line-height:var(--f7-calendar-week-header-height)}.calendar-months{width:100%;height:100%;overflow:hidden;position:relative;flex-shrink:10}.calendar-months-wrapper{position:relative;width:100%;height:100%;transition:.3s}.calendar-month{display:flex;flex-direction:column;width:100%;height:100%;position:absolute;left:0;top:0}.calendar-row{height:16.66666667%;display:flex;flex-shrink:1;width:100%;position:relative;box-sizing:border-box;padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}.calendar-modal .calendar-months:first-child .calendar-row:first-child:before,.calendar-popover .calendar-months:first-child .calendar-row:first-child:before{display:none!important}.calendar-day{flex-shrink:1;display:flex;justify-content:center;align-items:center;box-sizing:border-box;width:14.28571429%;text-align:center;cursor:pointer;z-index:20;color:var(--f7-calendar-day-text-color);height:100%;font-size:var(--f7-calendar-day-font-size)}.calendar-day-today .calendar-day-number{color:var(--f7-calendar-today-text-color,var(--f7-theme-color));background-color:var(--f7-calendar-today-bg-color)}.calendar-day-next,.calendar-day-prev{color:var(--f7-calendar-prev-next-text-color)}.calendar-day-disabled{color:var(--f7-calendar-disabled-text-color);cursor:auto}.calendar-day-selected .calendar-day-number{color:var(--f7-calendar-selected-text-color);background-color:var(--f7-calendar-selected-bg-color,var(--f7-theme-color))}.calendar-day-number{display:inline-block;border-radius:50%;position:relative;width:var(--f7-calendar-day-size);height:var(--f7-calendar-day-size);line-height:var(--f7-calendar-day-size)}.calendar-day-events{position:absolute;display:flex;left:0;width:100%;top:100%;align-items:center;justify-content:center;margin-top:1px}.calendar-day-event{width:var(--f7-calendar-event-dot-size);height:var(--f7-calendar-event-dot-size);border-radius:calc(var(--f7-calendar-event-dot-size)/ 2);background-color:var(--f7-calendar-event-bg-color)}.calendar-day-event+.calendar-day-event{margin-left:2px}.calendar-day-selected-left,.calendar-day-selected-range,.calendar-day-selected-right{position:relative}.calendar-day-selected-left:before,.calendar-day-selected-range:before,.calendar-day-selected-right:before{width:100%;height:var(--f7-calendar-day-size);content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:-1;background-color:var(--f7-calendar-selected-bg-color,var(--f7-theme-color));opacity:.2}.calendar-day-selected-left:before,.calendar-day-selected-range:first-child:before{left:auto;right:0;width:calc(50% + var(--f7-calendar-day-size)/ 2);border-radius:var(--f7-calendar-day-size) 0 0 var(--f7-calendar-day-size)}.calendar-day-selected-range:last-child:before,.calendar-day-selected-right:before{width:calc(50% + var(--f7-calendar-day-size)/ 2);border-radius:0 var(--f7-calendar-day-size) var(--f7-calendar-day-size) 0}.calendar-day-selected-left:last-child:before,.calendar-day-selected-right:first-child:before{display:none}.calendar-day-selected-left.calendar-day-selected-right:before{content:none;display:none}.calendar-day-selected-range .calendar-day-number{background-color:transparent;color:inherit}.calendar-month-selector,.calendar-year-selector{display:flex;justify-content:space-between;align-items:center;width:50%;max-width:200px;flex-shrink:10;margin-left:auto;margin-right:auto}.calendar-month-selector .calendar-day-number,.calendar-year-selector .calendar-day-number{flex-shrink:1;position:relative;overflow:hidden;text-overflow:ellipsis}.calendar-month-selector a.icon-only,.calendar-year-selector a.icon-only{min-width:36px}.calendar-month-picker,.calendar-time-picker,.calendar-year-picker{position:relative;width:100%;height:100%;-webkit-user-select:none;user-select:none;background:0 0}.calendar-month-picker .picker-columns,.calendar-year-picker .picker-columns{text-align:center}.calendar-month-picker-item,.calendar-year-picker-item{display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden;cursor:pointer;transition-duration:.1s;box-sizing:border-box}.calendar-month-picker-item span,.calendar-year-picker-item span{white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;position:relative;overflow:hidden;pointer-events:none}.calendar-month-picker-item.active-state,.calendar-year-picker-item.active-state{background:var(--f7-calendar-picker-pressed-bg-color)}.calendar-month-picker-item{padding:5px}.sheet-modal .calendar-month-picker-item{width:25%;height:33.33333333%}.sheet-modal .calendar-month-picker-item:nth-child(4n+1):before{display:none!important}.sheet-modal .calendar-month-picker-item:nth-child(n+9):after{display:none!important}.calendar-modal .calendar-month-picker-item,.popover .calendar-month-picker-item{width:33.33333333%;height:25%}.calendar-modal .calendar-month-picker-item:nth-child(3n+1):before,.popover .calendar-month-picker-item:nth-child(3n+1):before{display:none!important}.calendar-modal .calendar-month-picker-item:nth-child(n+10):after,.popover .calendar-month-picker-item:nth-child(n+10):after{display:none!important}.calendar-month-picker-item-current,.calendar-year-picker-item-current{color:var(--f7-calendar-picker-selected-text-color,var(--f7-theme-color))}.calendar-year-picker{overflow:auto;--webkit-overflow-scrolling:touch}.calendar-year-picker-item{height:34px;line-height:34px;width:100%}.calendar-time-selector{flex-shrink:0;font-size:var(--f7-calendar-time-selector-font-size);position:relative;display:flex;justify-content:space-between;align-items:center;padding:12px 16px}.calendar-time-selector a{overflow:hidden;position:relative;justify-content:center;align-items:center;display:flex;box-sizing:border-box;height:var(--f7-calendar-time-selector-height);background-color:var(--f7-calendar-time-selector-bg-color);padding:0 16px;border-radius:8px}.calendar-time-selector>span{font-weight:500}.calendar-time-selector .segmented{margin-left:8px}.calendar-month-picker-popover,.calendar-time-picker-popover,.calendar-year-picker-popover{height:240px;width:240px}.calendar-month-picker-popover .popover-inner,.calendar-time-picker-popover .popover-inner,.calendar-year-picker-popover .popover-inner{height:100%;overflow:hidden}.calendar-time-picker{--f7-picker-popover-height:100%;--f7-picker-inline-height:100%}.calendar-time-picker .toolbar{flex-shrink:0;top:0!important}.calendar-time-picker .picker{height:100%;display:flex;flex-direction:column}

package/components/calendar/calendar.css

@@ -1 +1 @@
-:root{--f7-calendar-height:340px;--f7-calendar-sheet-landscape-height:220px;--f7-calendar-popover-width:320px;--f7-calendar-popover-height:320px;--f7-calendar-modal-height:420px;--f7-calendar-modal-max-width:380px;--f7-calendar-week-header-bg-color:transparent;--f7-calendar-footer-padding:0 8px;--f7-calendar-week-header-font-size:11px;--f7-calendar-disabled-text-color:#d4d4d4;--f7-calendar-event-dot-size:4px;--f7-calendar-time-selector-height:28px;--f7-calendar-picker-pressed-bg-color:rgba(0, 0, 0, 0.1);--f7-calendar-picker-hover-bg-color:rgba(0, 0, 0, 0.03);--f7-calendar-time-selector-bg-color:rgba(0, 0, 0, 0.05)}:root .dark,:root.dark{--f7-calendar-picker-pressed-bg-color:rgba(255, 255, 255, 0.08);--f7-calendar-picker-hover-bg-color:rgba(255, 255, 255, 0.03);--f7-calendar-time-selector-bg-color:rgba(255, 255, 255, 0.1)}.ios{--f7-calendar-selected-text-color:#fff;--f7-calendar-header-height:44px;--f7-calendar-header-font-size:17px;--f7-calendar-header-font-weight:600;--f7-calendar-header-padding:0 8px;--f7-calendar-footer-height:44px;--f7-calendar-footer-font-size:17px;--f7-calendar-week-header-height:18px;--f7-calendar-day-font-size:15px;--f7-calendar-day-size:30px;--f7-calendar-picker-font-size:17px;--f7-calendar-time-selector-font-size:17px;--f7-calendar-modal-border-radius:4px;--f7-calendar-modal-box-shadow:0px 11px 15px -7px rgba(0, 0, 0, 0.2),0px 24px 38px 3px rgba(0, 0, 0, 0.14),0px 9px 46px 8px rgba(0, 0, 0, 0.12);--f7-calendar-prev-next-text-color:#c8c8c8;--f7-calendar-sheet-border-color:#929499;--f7-calendar-sheet-bg-color:#fff;--f7-calendar-week-header-text-color:#5e5e5e;--f7-calendar-modal-bg-color:#fff;--f7-calendar-day-text-color:#000;--f7-calendar-today-text-color:#000;--f7-calendar-today-bg-color:#e3e3e3}.ios .dark,.ios.dark{--f7-calendar-prev-next-text-color:#5e5e5e;--f7-calendar-sheet-border-color:var(--f7-bars-border-color);--f7-calendar-sheet-bg-color:#121212;--f7-calendar-week-header-text-color:#aaa;--f7-calendar-modal-bg-color:#121212;--f7-calendar-day-text-color:#fff;--f7-calendar-today-text-color:#fff;--f7-calendar-today-bg-color:#333}.md{--f7-calendar-sheet-border-color:transparent;--f7-calendar-header-height:64px;--f7-calendar-header-font-size:24px;--f7-calendar-header-font-weight:400;--f7-calendar-header-padding:0 24px;--f7-calendar-footer-height:56px;--f7-calendar-footer-font-size:14px;--f7-calendar-week-header-height:24px;--f7-calendar-day-font-size:14px;--f7-calendar-today-bg-color:none;--f7-calendar-day-size:32px;--f7-calendar-picker-font-size:14px;--f7-calendar-time-selector-font-size:14px;--f7-calendar-modal-border-radius:28px;--f7-calendar-modal-box-shadow:none}.md,.md .dark,.md [class*=color-]{--f7-calendar-sheet-bg-color:var(--f7-md-surface-1);--f7-calendar-selected-text-color:var(--f7-md-on-primary);--f7-calendar-week-header-text-color:var(--f7-md-on-surface-variant);--f7-calendar-day-text-color:var(--f7-md-on-surface);--f7-calendar-prev-next-text-color:rgba(var(--f7-md-on-surface-variant-rgb), 0.55);--f7-calendar-today-text-color:var(--f7-theme-color);--f7-calendar-modal-bg-color:var(--f7-md-surface-1)}.calendar{overflow:hidden;height:var(--f7-calendar-height);width:100%;display:flex;flex-direction:column}.calendar.modal-in{display:flex}@media (orientation:landscape) and (max-height:415px){.calendar.calendar-sheet{height:var(--f7-calendar-sheet-landscape-height)}.calendar.calendar-modal{height:calc(100vh - var(--f7-navbar-height))}}.calendar.calendar-inline,.calendar.calendar-popover .calendar{position:relative}.calendar-sheet{--f7-sheet-border-color:var(--f7-calendar-sheet-border-color);background:var(--f7-calendar-sheet-bg-color);padding-bottom:var(--f7-safe-area-bottom);height:calc(var(--f7-calendar-height) + var(--f7-safe-area-bottom))}.calendar-sheet:before{z-index:600}.calendar-modal .toolbar:before,.calendar-popover .toolbar:before,.calendar-sheet .toolbar:before{display:none}.calendar-popover{width:var(--f7-calendar-popover-width)}.calendar-popover .calendar-header,.calendar-popover .toolbar-top{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0;overflow:hidden}.calendar-popover .calendar-header+.toolbar-top{border-radius:0}.calendar-popover .calendar-footer,.calendar-popover .toolbar-bottom{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.calendar-popover .calendar{height:var(--f7-calendar-popover-height);position:relative;z-index:1}.calendar-popover .calendar-month-picker,.calendar-popover .calendar-time-picker,.calendar-popover .calendar-year-picker{border-radius:var(--f7-popover-border-radius)}.calendar-popover .calendar-month-picker .picker,.calendar-popover .calendar-time-picker .picker,.calendar-popover .calendar-year-picker .picker{height:100%;display:flex;flex-direction:column}.calendar-header{width:100%;position:relative;overflow:hidden;flex-shrink:0;white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;padding:var(--f7-calendar-header-padding);background-color:var(--f7-calendar-header-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-header-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-header-height);line-height:var(--f7-calendar-header-height);font-size:var(--f7-calendar-header-font-size);font-weight:var(--f7-calendar-header-font-weight)}.calendar-header a{color:var(--f7-calendar-header-link-color,var(--f7-bars-link-color,var(--f7-theme-color)))}.calendar-footer{width:100%;flex-shrink:0;padding:var(--f7-calendar-footer-padding);background-color:var(--f7-calendar-footer-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-footer-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-footer-height);font-size:var(--f7-calendar-header-font-size);display:flex;justify-content:flex-end;box-sizing:border-box;align-items:center;position:relative}.calendar-footer a{color:var(--f7-calendar-footer-link-color,var(--f7-bars-link-color,var(--f7-theme-color)))}.calendar-footer:before{content:'';position:absolute;background-color:var(--f7-calendar-footer-border-color,var(--f7-bars-border-color));display:block;z-index:15;top:0;right:auto;bottom:auto;left:0;height:1px;width:100%;transform-origin:50% 0%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.calendar-modal{position:absolute;height:var(--f7-calendar-modal-height);overflow:hidden;top:50%;left:50%;min-width:300px;max-width:var(--f7-calendar-modal-max-width);transform:translate3d(-50%,100vh,0);transition-property:transform;display:flex;z-index:13500;background:var(--f7-calendar-modal-bg-color);width:90%;border-radius:var(--f7-calendar-modal-border-radius);box-shadow:var(--f7-calendar-modal-box-shadow);transition-timing-function:cubic-bezier(0,1,0.2,1)}.calendar-modal.modal-in,.calendar-modal.modal-out{transition-duration:.4s}.calendar-modal.modal-in{transform:translate3d(-50%,-50%,0)}.calendar-modal.modal-out{transform:translate3d(-50%,100vh,0)}.calendar-week-header{display:flex;box-sizing:border-box;position:relative;font-size:var(--f7-calendar-week-header-font-size);background-color:var(--f7-calendar-week-header-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-week-header-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-week-header-height);padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}.calendar-week-header .calendar-week-day{flex-shrink:1;width:calc(100% / 7);text-align:center;line-height:var(--f7-calendar-week-header-height)}.calendar-months{width:100%;height:100%;overflow:hidden;position:relative;flex-shrink:10}.calendar-months-wrapper{position:relative;width:100%;height:100%;transition:.3s}.calendar-month{display:flex;flex-direction:column;width:100%;height:100%;position:absolute;left:0;top:0}.calendar-row{height:16.66666667%;display:flex;flex-shrink:1;width:100%;position:relative;box-sizing:border-box;padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}.calendar-modal .calendar-months:first-child .calendar-row:first-child:before,.calendar-popover .calendar-months:first-child .calendar-row:first-child:before{display:none!important}.calendar-day{flex-shrink:1;display:flex;justify-content:center;align-items:center;box-sizing:border-box;width:14.28571429%;text-align:center;cursor:pointer;z-index:20;color:var(--f7-calendar-day-text-color);height:100%;font-size:var(--f7-calendar-day-font-size)}.calendar-day-today .calendar-day-number{color:var(--f7-calendar-today-text-color,var(--f7-theme-color));background-color:var(--f7-calendar-today-bg-color)}.calendar-day-next,.calendar-day-prev{color:var(--f7-calendar-prev-next-text-color)}.calendar-day-disabled{color:var(--f7-calendar-disabled-text-color);cursor:auto}.calendar-day-selected .calendar-day-number{color:var(--f7-calendar-selected-text-color);background-color:var(--f7-calendar-selected-bg-color,var(--f7-theme-color))}.calendar-day-number{display:inline-block;border-radius:50%;position:relative;width:var(--f7-calendar-day-size);height:var(--f7-calendar-day-size);line-height:var(--f7-calendar-day-size)}.calendar-day-events{position:absolute;display:flex;left:0;width:100%;top:100%;align-items:center;justify-content:center;margin-top:1px}.calendar-day-event{width:var(--f7-calendar-event-dot-size);height:var(--f7-calendar-event-dot-size);border-radius:calc(var(--f7-calendar-event-dot-size)/ 2);background-color:var(--f7-calendar-event-bg-color)}.calendar-day-event+.calendar-day-event{margin-left:2px}.calendar-day-selected-left,.calendar-day-selected-range,.calendar-day-selected-right{position:relative}.calendar-day-selected-left:before,.calendar-day-selected-range:before,.calendar-day-selected-right:before{width:100%;height:var(--f7-calendar-day-size);content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:-1;background-color:var(--f7-calendar-selected-bg-color,var(--f7-theme-color));opacity:.2}.calendar-day-selected-left:before,.calendar-day-selected-range:first-child:before{left:auto;right:0;width:calc(50% + var(--f7-calendar-day-size)/ 2);border-radius:var(--f7-calendar-day-size) 0 0 var(--f7-calendar-day-size)}.calendar-day-selected-range:last-child:before,.calendar-day-selected-right:before{width:calc(50% + var(--f7-calendar-day-size)/ 2);border-radius:0 var(--f7-calendar-day-size) var(--f7-calendar-day-size) 0}.calendar-day-selected-left:last-child:before,.calendar-day-selected-right:first-child:before{display:none}.calendar-day-selected-range .calendar-day-number{background-color:transparent;color:inherit}.calendar-month-selector,.calendar-year-selector{display:flex;justify-content:space-between;align-items:center;width:50%;max-width:200px;flex-shrink:10;margin-left:auto;margin-right:auto}.calendar-month-selector .calendar-day-number,.calendar-year-selector .calendar-day-number{flex-shrink:1;position:relative;overflow:hidden;text-overflow:ellipsis}.calendar-month-selector a.icon-only,.calendar-year-selector a.icon-only{min-width:36px}.calendar-month-picker,.calendar-time-picker,.calendar-year-picker{position:relative;width:100%;height:100%;-webkit-user-select:none;user-select:none;background:0 0}.calendar-month-picker .picker-columns,.calendar-year-picker .picker-columns{text-align:center}.calendar-month-picker-item,.calendar-year-picker-item{display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden;cursor:pointer;transition-duration:.1s;box-sizing:border-box}.calendar-month-picker-item span,.calendar-year-picker-item span{white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;position:relative;overflow:hidden;pointer-events:none}.calendar-month-picker-item.active-state,.calendar-year-picker-item.active-state{background:var(--f7-calendar-picker-pressed-bg-color)}.calendar-month-picker-item{padding:5px}.sheet-modal .calendar-month-picker-item{width:25%;height:33.33333333%}.sheet-modal .calendar-month-picker-item:nth-child(4n+1):before{display:none!important}.sheet-modal .calendar-month-picker-item:nth-child(n+9):after{display:none!important}.calendar-modal .calendar-month-picker-item,.popover .calendar-month-picker-item{width:33.33333333%;height:25%}.calendar-modal .calendar-month-picker-item:nth-child(3n+1):before,.popover .calendar-month-picker-item:nth-child(3n+1):before{display:none!important}.calendar-modal .calendar-month-picker-item:nth-child(n+10):after,.popover .calendar-month-picker-item:nth-child(n+10):after{display:none!important}.calendar-month-picker-item-current,.calendar-year-picker-item-current{color:var(--f7-calendar-picker-selected-text-color,var(--f7-theme-color))}.calendar-year-picker{overflow:auto;--webkit-overflow-scrolling:touch}.calendar-year-picker-item{height:34px;line-height:34px;width:100%}.calendar-time-selector{flex-shrink:0;font-size:var(--f7-calendar-time-selector-font-size);position:relative;display:flex;justify-content:space-between;align-items:center;padding:12px 16px}.calendar-time-selector a{overflow:hidden;position:relative;justify-content:center;align-items:center;display:flex;box-sizing:border-box;height:var(--f7-calendar-time-selector-height);background-color:var(--f7-calendar-time-selector-bg-color);padding:0 16px;border-radius:8px}.calendar-time-selector>span{font-weight:500}.calendar-time-selector .segmented{margin-left:8px}.calendar-month-picker-popover,.calendar-time-picker-popover,.calendar-year-picker-popover{height:240px;width:240px}.calendar-month-picker-popover .popover-inner,.calendar-time-picker-popover .popover-inner,.calendar-year-picker-popover .popover-inner{height:100%;overflow:hidden}.calendar-time-picker{--f7-picker-popover-height:100%;--f7-picker-inline-height:100%}.calendar-time-picker .toolbar{flex-shrink:0;top:0!important}.calendar-time-picker .picker{height:100%;display:flex;flex-direction:column}
+:root{--f7-calendar-height:340px;--f7-calendar-sheet-landscape-height:220px;--f7-calendar-popover-width:320px;--f7-calendar-popover-height:320px;--f7-calendar-modal-height:420px;--f7-calendar-modal-max-width:380px;--f7-calendar-week-header-bg-color:transparent;--f7-calendar-footer-padding:0 8px;--f7-calendar-week-header-font-size:11px;--f7-calendar-disabled-text-color:#d4d4d4;--f7-calendar-event-dot-size:4px;--f7-calendar-time-selector-height:28px;--f7-calendar-picker-pressed-bg-color:rgba(0, 0, 0, 0.1);--f7-calendar-picker-hover-bg-color:rgba(0, 0, 0, 0.03);--f7-calendar-time-selector-bg-color:rgba(0, 0, 0, 0.05)}:root .dark,:root.dark{--f7-calendar-picker-pressed-bg-color:rgba(255, 255, 255, 0.08);--f7-calendar-picker-hover-bg-color:rgba(255, 255, 255, 0.03);--f7-calendar-time-selector-bg-color:rgba(255, 255, 255, 0.1)}.ios{--f7-calendar-selected-text-color:#fff;--f7-calendar-header-height:44px;--f7-calendar-header-font-size:17px;--f7-calendar-header-font-weight:600;--f7-calendar-header-padding:0 8px;--f7-calendar-footer-height:44px;--f7-calendar-footer-font-size:17px;--f7-calendar-week-header-height:18px;--f7-calendar-day-font-size:15px;--f7-calendar-day-size:30px;--f7-calendar-picker-font-size:17px;--f7-calendar-time-selector-font-size:17px;--f7-calendar-modal-border-radius:4px;--f7-calendar-modal-box-shadow:0px 11px 15px -7px rgba(0, 0, 0, 0.2),0px 24px 38px 3px rgba(0, 0, 0, 0.14),0px 9px 46px 8px rgba(0, 0, 0, 0.12);--f7-calendar-prev-next-text-color:#c8c8c8;--f7-calendar-sheet-border-color:#929499;--f7-calendar-sheet-bg-color:#fff;--f7-calendar-week-header-text-color:#5e5e5e;--f7-calendar-modal-bg-color:#fff;--f7-calendar-day-text-color:#000;--f7-calendar-today-text-color:#000;--f7-calendar-today-bg-color:#e3e3e3}.ios .dark,.ios.dark{--f7-calendar-prev-next-text-color:#5e5e5e;--f7-calendar-sheet-border-color:var(--f7-bars-border-color);--f7-calendar-sheet-bg-color:#121212;--f7-calendar-week-header-text-color:#aaa;--f7-calendar-modal-bg-color:#121212;--f7-calendar-day-text-color:#fff;--f7-calendar-today-text-color:#fff;--f7-calendar-today-bg-color:#333}.md{--f7-calendar-sheet-border-color:transparent;--f7-calendar-header-height:64px;--f7-calendar-header-font-size:24px;--f7-calendar-header-font-weight:400;--f7-calendar-header-padding:0 24px;--f7-calendar-footer-height:56px;--f7-calendar-footer-font-size:14px;--f7-calendar-week-header-height:24px;--f7-calendar-day-font-size:14px;--f7-calendar-today-bg-color:none;--f7-calendar-day-size:32px;--f7-calendar-picker-font-size:14px;--f7-calendar-time-selector-font-size:14px;--f7-calendar-modal-border-radius:28px;--f7-calendar-modal-box-shadow:none}.md,.md .dark,.md [class*=color-]{--f7-calendar-sheet-bg-color:var(--f7-md-surface-1);--f7-calendar-selected-text-color:var(--f7-md-on-primary);--f7-calendar-week-header-text-color:var(--f7-md-on-surface-variant);--f7-calendar-day-text-color:var(--f7-md-on-surface);--f7-calendar-prev-next-text-color:rgba(var(--f7-md-on-surface-variant-rgb), 0.55);--f7-calendar-today-text-color:var(--f7-theme-color);--f7-calendar-modal-bg-color:var(--f7-md-surface-1)}.calendar{overflow:hidden;height:var(--f7-calendar-height);width:100%;display:flex;flex-direction:column}.calendar.modal-in{display:flex}@media (orientation:landscape) and (max-height:415px){.calendar.calendar-sheet{height:var(--f7-calendar-sheet-landscape-height)}.calendar.calendar-modal{height:calc(100vh - var(--f7-navbar-height))}}.calendar.calendar-inline,.calendar.calendar-popover .calendar{position:relative}.calendar-sheet{--f7-sheet-border-color:var(--f7-calendar-sheet-border-color);background:var(--f7-calendar-sheet-bg-color);padding-bottom:var(--f7-safe-area-bottom);height:calc(var(--f7-calendar-height) + var(--f7-safe-area-bottom))}.calendar-sheet:before{z-index:600}.calendar-modal .toolbar:before,.calendar-popover .toolbar:before,.calendar-sheet .toolbar:before{display:none}.calendar-popover{width:var(--f7-calendar-popover-width)}.calendar-popover .calendar-header,.calendar-popover .toolbar-top{border-radius:var(--f7-popover-border-radius) var(--f7-popover-border-radius) 0 0;overflow:hidden}.calendar-popover .calendar-header+.toolbar-top{border-radius:0}.calendar-popover .calendar-footer,.calendar-popover .toolbar-bottom{border-radius:0 0 var(--f7-popover-border-radius) var(--f7-popover-border-radius)}.calendar-popover .calendar{height:var(--f7-calendar-popover-height);position:relative;z-index:1}.calendar-popover .calendar-month-picker,.calendar-popover .calendar-time-picker,.calendar-popover .calendar-year-picker{border-radius:var(--f7-popover-border-radius)}.calendar-popover .calendar-month-picker .picker,.calendar-popover .calendar-time-picker .picker,.calendar-popover .calendar-year-picker .picker{height:100%;display:flex;flex-direction:column}.calendar-header{width:100%;position:relative;overflow:hidden;flex-shrink:0;white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;padding:var(--f7-calendar-header-padding);background-color:var(--f7-calendar-header-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-header-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-header-height);line-height:var(--f7-calendar-header-height);font-size:var(--f7-calendar-header-font-size);font-weight:var(--f7-calendar-header-font-weight)}.calendar-header a{color:var(--f7-calendar-header-link-color,var(--f7-bars-link-color,var(--f7-theme-color)))}.calendar-footer{width:100%;flex-shrink:0;padding:var(--f7-calendar-footer-padding);background-color:var(--f7-calendar-footer-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-footer-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-footer-height);font-size:var(--f7-calendar-header-font-size);display:flex;justify-content:flex-end;box-sizing:border-box;align-items:center;position:relative}.calendar-footer a{color:var(--f7-calendar-footer-link-color,var(--f7-bars-link-color,var(--f7-theme-color)))}.calendar-footer:before{content:'';position:absolute;background-color:var(--f7-calendar-footer-border-color,var(--f7-bars-border-color));display:block;z-index:15;top:0;right:auto;bottom:auto;left:0;height:1px;width:100%;transform-origin:50% 0%;transform:scaleY(calc(1 / var(--f7-device-pixel-ratio)))}.calendar-modal{position:absolute;height:var(--f7-calendar-modal-height);overflow:hidden;top:50%;left:50%;min-width:300px;max-width:var(--f7-calendar-modal-max-width);transform:translate3d(-50%,100vh,0);transition-property:transform;display:flex;z-index:13500;background:var(--f7-calendar-modal-bg-color);width:90%;border-radius:var(--f7-calendar-modal-border-radius);box-shadow:var(--f7-calendar-modal-box-shadow);transition-timing-function:cubic-bezier(0,1,0.2,1)}.calendar-modal.modal-in,.calendar-modal.modal-out{transition-duration:.4s}.calendar-modal.modal-in{transform:translate3d(-50%,-50%,0)}.calendar-modal.modal-out{transform:translate3d(-50%,100vh,0)}.calendar-week-header{display:flex;box-sizing:border-box;position:relative;font-size:var(--f7-calendar-week-header-font-size);background-color:var(--f7-calendar-week-header-bg-color,var(--f7-bars-bg-color));color:var(--f7-calendar-week-header-text-color,var(--f7-bars-text-color));height:var(--f7-calendar-week-header-height);padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}.calendar-week-header .calendar-week-day{flex-shrink:1;width:calc(100% / 7);text-align:center;line-height:var(--f7-calendar-week-header-height)}.calendar-months{width:100%;height:100%;overflow:hidden;position:relative;flex-shrink:10}.calendar-months-wrapper{position:relative;width:100%;height:100%;transition:.3s}.calendar-month{display:flex;flex-direction:column;width:100%;height:100%;position:absolute;left:0;top:0}.calendar-row{height:16.66666667%;display:flex;flex-shrink:1;width:100%;position:relative;box-sizing:border-box;padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}.calendar-modal .calendar-months:first-child .calendar-row:first-child:before,.calendar-popover .calendar-months:first-child .calendar-row:first-child:before{display:none!important}.calendar-day{flex-shrink:1;display:flex;justify-content:center;align-items:center;box-sizing:border-box;width:14.28571429%;text-align:center;cursor:pointer;z-index:20;color:var(--f7-calendar-day-text-color);height:100%;font-size:var(--f7-calendar-day-font-size)}.calendar-day-today .calendar-day-number{color:var(--f7-calendar-today-text-color,var(--f7-theme-color));background-color:var(--f7-calendar-today-bg-color)}.calendar-day-next,.calendar-day-prev{color:var(--f7-calendar-prev-next-text-color)}.calendar-day-disabled{color:var(--f7-calendar-disabled-text-color);cursor:auto}.calendar-day-selected .calendar-day-number{color:var(--f7-calendar-selected-text-color);background-color:var(--f7-calendar-selected-bg-color,var(--f7-theme-color))}.calendar-day-number{display:inline-block;border-radius:50%;position:relative;width:var(--f7-calendar-day-size);height:var(--f7-calendar-day-size);line-height:var(--f7-calendar-day-size)}.calendar-day-events{position:absolute;display:flex;left:0;width:100%;top:100%;align-items:center;justify-content:center;margin-top:1px}.calendar-day-event{width:var(--f7-calendar-event-dot-size);height:var(--f7-calendar-event-dot-size);border-radius:calc(var(--f7-calendar-event-dot-size)/ 2);background-color:var(--f7-calendar-event-bg-color)}.calendar-day-event+.calendar-day-event{margin-left:2px}.calendar-day-selected-left,.calendar-day-selected-range,.calendar-day-selected-right{position:relative}.calendar-day-selected-left:before,.calendar-day-selected-range:before,.calendar-day-selected-right:before{width:100%;height:var(--f7-calendar-day-size);content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:-1;background-color:var(--f7-calendar-selected-bg-color,var(--f7-theme-color));opacity:.2}.calendar-day-selected-left:before,.calendar-day-selected-range:first-child:before{left:auto;right:0;width:calc(50% + var(--f7-calendar-day-size)/ 2);border-radius:var(--f7-calendar-day-size) 0 0 var(--f7-calendar-day-size)}.calendar-day-selected-range:last-child:before,.calendar-day-selected-right:before{width:calc(50% + var(--f7-calendar-day-size)/ 2);border-radius:0 var(--f7-calendar-day-size) var(--f7-calendar-day-size) 0}.calendar-day-selected-left:last-child:before,.calendar-day-selected-right:first-child:before{display:none}.calendar-day-selected-left.calendar-day-selected-right:before{content:none;display:none}.calendar-day-selected-range .calendar-day-number{background-color:transparent;color:inherit}.calendar-month-selector,.calendar-year-selector{display:flex;justify-content:space-between;align-items:center;width:50%;max-width:200px;flex-shrink:10;margin-left:auto;margin-right:auto}.calendar-month-selector .calendar-day-number,.calendar-year-selector .calendar-day-number{flex-shrink:1;position:relative;overflow:hidden;text-overflow:ellipsis}.calendar-month-selector a.icon-only,.calendar-year-selector a.icon-only{min-width:36px}.calendar-month-picker,.calendar-time-picker,.calendar-year-picker{position:relative;width:100%;height:100%;-webkit-user-select:none;user-select:none;background:0 0}.calendar-month-picker .picker-columns,.calendar-year-picker .picker-columns{text-align:center}.calendar-month-picker-item,.calendar-year-picker-item{display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden;cursor:pointer;transition-duration:.1s;box-sizing:border-box}.calendar-month-picker-item span,.calendar-year-picker-item span{white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;position:relative;overflow:hidden;pointer-events:none}.calendar-month-picker-item.active-state,.calendar-year-picker-item.active-state{background:var(--f7-calendar-picker-pressed-bg-color)}.calendar-month-picker-item{padding:5px}.sheet-modal .calendar-month-picker-item{width:25%;height:33.33333333%}.sheet-modal .calendar-month-picker-item:nth-child(4n+1):before{display:none!important}.sheet-modal .calendar-month-picker-item:nth-child(n+9):after{display:none!important}.calendar-modal .calendar-month-picker-item,.popover .calendar-month-picker-item{width:33.33333333%;height:25%}.calendar-modal .calendar-month-picker-item:nth-child(3n+1):before,.popover .calendar-month-picker-item:nth-child(3n+1):before{display:none!important}.calendar-modal .calendar-month-picker-item:nth-child(n+10):after,.popover .calendar-month-picker-item:nth-child(n+10):after{display:none!important}.calendar-month-picker-item-current,.calendar-year-picker-item-current{color:var(--f7-calendar-picker-selected-text-color,var(--f7-theme-color))}.calendar-year-picker{overflow:auto;--webkit-overflow-scrolling:touch}.calendar-year-picker-item{height:34px;line-height:34px;width:100%}.calendar-time-selector{flex-shrink:0;font-size:var(--f7-calendar-time-selector-font-size);position:relative;display:flex;justify-content:space-between;align-items:center;padding:12px 16px}.calendar-time-selector a{overflow:hidden;position:relative;justify-content:center;align-items:center;display:flex;box-sizing:border-box;height:var(--f7-calendar-time-selector-height);background-color:var(--f7-calendar-time-selector-bg-color);padding:0 16px;border-radius:8px}.calendar-time-selector>span{font-weight:500}.calendar-time-selector .segmented{margin-left:8px}.calendar-month-picker-popover,.calendar-time-picker-popover,.calendar-year-picker-popover{height:240px;width:240px}.calendar-month-picker-popover .popover-inner,.calendar-time-picker-popover .popover-inner,.calendar-year-picker-popover .popover-inner{height:100%;overflow:hidden}.calendar-time-picker{--f7-picker-popover-height:100%;--f7-picker-inline-height:100%}.calendar-time-picker .toolbar{flex-shrink:0;top:0!important}.calendar-time-picker .picker{height:100%;display:flex;flex-direction:column}

package/components/calendar/calendar.d.ts

@@ -207,6 +207,8 @@ export namespace Calendar {
     renderToolbar?: () => string;
     /** Function to render whole calendar. Must return calendar full HTML string. */
     render?: () => string;
+    /** Enables Calendar backdrop (dark semi transparent layer behind). By default only it is enabled when Calendar opened in Popover. */
+    backdrop?: boolean | undefined;
 
     on?: {
       [event in keyof Events]?: Events[event];

package/components/calendar/calendar.less

@@ -280,6 +280,10 @@
 .calendar-day-selected-right:first-child:before {
   display: none;
 }
+.calendar-day-selected-left.calendar-day-selected-right:before {
+  content: none;
+  display: none;
+}
 
 .calendar-day-selected-range {
   .calendar-day-number {

package/components/list-index/list-index-rtl.css

@@ -1 +1 @@
-:root{--f7-list-index-width:16px;--f7-list-index-font-size:11px;--f7-list-index-font-weight:600;--f7-list-index-item-height:14px;--f7-list-index-label-text-color:#fff;--f7-list-index-label-font-weight:500}.ios{--f7-list-index-label-size:44px;--f7-list-index-label-font-size:17px;--f7-list-index-skip-dot-size:6px}.md{--f7-list-index-label-size:56px;--f7-list-index-label-font-size:20px;--f7-list-index-skip-dot-size:4px}.list-index{position:absolute;top:0;bottom:0;text-align:center;z-index:10;width:var(--f7-list-index-width);cursor:pointer;-webkit-user-select:none;user-select:none;left:var(--f7-safe-area-left)}.list-index:before{content:'';position:absolute;width:20px;top:0;right:100%;height:100%}.list-index ul{color:var(--f7-list-index-text-color,var(--f7-theme-color));font-size:var(--f7-list-index-font-size);font-weight:var(--f7-list-index-font-weight);list-style:none;margin:0;padding:0;display:flex;flex-direction:column;justify-content:center;align-items:center;flex-shrink:0;height:100%;width:100%;position:relative}.list-index li{margin:0;padding:0;list-style:none;position:relative;height:var(--f7-list-index-item-height);line-height:var(--f7-list-index-item-height);flex-shrink:0;display:block;width:100%}.list-index .list-index-skip-placeholder:after{content:'';position:absolute;left:50%;top:50%;border-radius:50%;width:var(--f7-list-index-skip-dot-size);height:var(--f7-list-index-skip-dot-size);margin-left:calc(-1 * var(--f7-list-index-skip-dot-size)/ 2);margin-top:calc(-1 * var(--f7-list-index-skip-dot-size)/ 2);background:var(--f7-list-index-text-color,var(--f7-theme-color))}.list-index .list-index-label{position:absolute;bottom:0;right:100%;text-align:center;background-color:var(--f7-list-index-label-bg-color,var(--f7-theme-color));color:var(--f7-list-index-label-text-color);width:var(--f7-list-index-label-size);height:var(--f7-list-index-label-size);line-height:var(--f7-list-index-label-size);font-size:var(--f7-list-index-label-font-size);font-weight:var(--f7-list-index-label-font-weight)}.navbars~.page>.list-index,.navbar~.list-index,.navbar~.page>.list-index{top:var(--f7-navbar-height)}.ios .navbars~.toolbar-top-ios .md .navbar~.toolbar-top-md~.list-index,.ios .navbar~.toolbar-top-ios~.list-index,.navbars~.toolbar-top~.list-index,.navbar~.toolbar-top~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-toolbar-height))}.ios .navbars~.toolbar-top-ios .md .navbar~.toolbar-top-md.tabbar-icons~.list-index,.ios .navbar~.toolbar-top-ios.tabbar-icons~.list-index,.navbars~.toolbar-top.tabbar-icons~.list-index,.navbar~.toolbar-top.tabbar-icons~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-tabbar-icons-height))}.navbars~.subnavbar~.list-index,.navbar~.subnavbar~.list-index,.page-with-subnavbar .navbar~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-subnavbar-height))}.ios .toolbar-bottom-ios~* .page>.list-index,.ios .toolbar-bottom-ios~.list-index,.ios .toolbar-bottom-ios~.page>.list-index,.md .toolbar-bottom-md~* .page>.list-index,.md .toolbar-bottom-md~.list-index,.md .toolbar-bottom-md~.page>.list-index,.toolbar-bottom~* .page>.list-index,.toolbar-bottom~.list-index,.toolbar-bottom~.page>.list-index{bottom:calc(var(--f7-toolbar-height) + var(--f7-safe-area-bottom))}.ios .toolbar-bottom-ios.tabbar-icons~* .page>.list-index,.ios .toolbar-bottom-ios.tabbar-icons~.list-index,.ios .toolbar-bottom-ios.tabbar-icons~.page>.list-index,.md .toolbar-bottom-md.tabbar-icons~* .page>.list-index,.md .toolbar-bottom-md.tabbar-icons~.list-index,.md .toolbar-bottom-md.tabbar-icons~.page>.list-index,.toolbar-bottom.tabbar-icons~* .page>.list-index,.toolbar-bottom.tabbar-icons~.list-index,.toolbar-bottom.tabbar-icons~.page>.list-index{bottom:calc(var(--f7-tabbar-icons-height) + var(--f7-safe-area-bottom))}.ios .list-index .list-index-label{margin-bottom:calc(-1 * var(--f7-list-index-label-size)/ 2);margin-right:calc(var(--f7-list-index-width) - 1px);border-radius:50%}.ios .list-index .list-index-label:before{position:absolute;width:100%;height:100%;border-radius:50% 0% 50% 50%;content:'';background-color:inherit;left:0;top:0;transform:rotate(45deg);z-index:-1}.md .list-index .list-index-label{border-radius:50% 50% 0 50%}
+:root{--f7-list-index-width:16px;--f7-list-index-font-size:11px;--f7-list-index-font-weight:600;--f7-list-index-item-height:14px;--f7-list-index-label-font-weight:500}.ios{--f7-list-index-label-text-color:#fff;--f7-list-index-label-size:44px;--f7-list-index-label-font-size:17px;--f7-list-index-skip-dot-size:6px}.md{--f7-list-index-label-size:56px;--f7-list-index-label-font-size:20px;--f7-list-index-skip-dot-size:4px}.md,.md .dark,.md [class*=color-]{--f7-list-index-label-bg-color:var(--f7-md-primary);--f7-list-index-label-text-color:var(--f7-md-on-primary)}.list-index{position:absolute;top:0;bottom:0;text-align:center;z-index:10;width:var(--f7-list-index-width);cursor:pointer;-webkit-user-select:none;user-select:none;left:var(--f7-safe-area-left)}.list-index:before{content:'';position:absolute;width:20px;top:0;right:100%;height:100%}.list-index ul{color:var(--f7-list-index-text-color,var(--f7-theme-color));font-size:var(--f7-list-index-font-size);font-weight:var(--f7-list-index-font-weight);list-style:none;margin:0;padding:0;display:flex;flex-direction:column;justify-content:center;align-items:center;flex-shrink:0;height:100%;width:100%;position:relative}.list-index li{margin:0;padding:0;list-style:none;position:relative;height:var(--f7-list-index-item-height);line-height:var(--f7-list-index-item-height);flex-shrink:0;display:block;width:100%}.list-index .list-index-skip-placeholder:after{content:'';position:absolute;left:50%;top:50%;border-radius:50%;width:var(--f7-list-index-skip-dot-size);height:var(--f7-list-index-skip-dot-size);margin-left:calc(-1 * var(--f7-list-index-skip-dot-size)/ 2);margin-top:calc(-1 * var(--f7-list-index-skip-dot-size)/ 2);background:var(--f7-list-index-text-color,var(--f7-theme-color))}.list-index .list-index-label{position:absolute;bottom:0;right:100%;text-align:center;background-color:var(--f7-list-index-label-bg-color,var(--f7-theme-color));color:var(--f7-list-index-label-text-color);width:var(--f7-list-index-label-size);height:var(--f7-list-index-label-size);line-height:var(--f7-list-index-label-size);font-size:var(--f7-list-index-label-font-size);font-weight:var(--f7-list-index-label-font-weight)}.navbars~.page>.list-index,.navbar~.list-index,.navbar~.page>.list-index{top:var(--f7-navbar-height)}.ios .navbars~.toolbar-top-ios .md .navbar~.toolbar-top-md~.list-index,.ios .navbar~.toolbar-top-ios~.list-index,.navbars~.toolbar-top~.list-index,.navbar~.toolbar-top~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-toolbar-height))}.ios .navbars~.toolbar-top-ios .md .navbar~.toolbar-top-md.tabbar-icons~.list-index,.ios .navbar~.toolbar-top-ios.tabbar-icons~.list-index,.navbars~.toolbar-top.tabbar-icons~.list-index,.navbar~.toolbar-top.tabbar-icons~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-tabbar-icons-height))}.navbars~.subnavbar~.list-index,.navbar~.subnavbar~.list-index,.page-with-subnavbar .navbar~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-subnavbar-height))}.ios .toolbar-bottom-ios~* .page>.list-index,.ios .toolbar-bottom-ios~.list-index,.ios .toolbar-bottom-ios~.page>.list-index,.md .toolbar-bottom-md~* .page>.list-index,.md .toolbar-bottom-md~.list-index,.md .toolbar-bottom-md~.page>.list-index,.toolbar-bottom~* .page>.list-index,.toolbar-bottom~.list-index,.toolbar-bottom~.page>.list-index{bottom:calc(var(--f7-toolbar-height) + var(--f7-safe-area-bottom))}.ios .toolbar-bottom-ios.tabbar-icons~* .page>.list-index,.ios .toolbar-bottom-ios.tabbar-icons~.list-index,.ios .toolbar-bottom-ios.tabbar-icons~.page>.list-index,.md .toolbar-bottom-md.tabbar-icons~* .page>.list-index,.md .toolbar-bottom-md.tabbar-icons~.list-index,.md .toolbar-bottom-md.tabbar-icons~.page>.list-index,.toolbar-bottom.tabbar-icons~* .page>.list-index,.toolbar-bottom.tabbar-icons~.list-index,.toolbar-bottom.tabbar-icons~.page>.list-index{bottom:calc(var(--f7-tabbar-icons-height) + var(--f7-safe-area-bottom))}.ios .list-index .list-index-label{margin-bottom:calc(-1 * var(--f7-list-index-label-size)/ 2);margin-right:calc(var(--f7-list-index-width) - 1px);border-radius:50%}.ios .list-index .list-index-label:before{position:absolute;width:100%;height:100%;border-radius:50% 0% 50% 50%;content:'';background-color:inherit;left:0;top:0;transform:rotate(45deg);z-index:-1}.md .list-index .list-index-label{border-radius:50% 50% 0 50%}

package/components/list-index/list-index-vars.less

@@ -4,11 +4,11 @@
   --f7-list-index-font-weight: 600;
   /* --f7-list-index-text-color: var(--f7-theme-color); */
   --f7-list-index-item-height: 14px;
-  --f7-list-index-label-text-color: #fff;
-  /* --f7-list-index-label-bg-color: var(--f7-theme-color); */
   --f7-list-index-label-font-weight: 500;
 }
 .ios-vars({
+  --f7-list-index-label-text-color: #fff;
+  /* --f7-list-index-label-bg-color: var(--f7-theme-color); */
   --f7-list-index-label-size: 44px;
   --f7-list-index-label-font-size: 17px;
   --f7-list-index-skip-dot-size: 6px;
@@ -18,3 +18,8 @@
   --f7-list-index-label-font-size: 20px;
   --f7-list-index-skip-dot-size: 4px;
 });
+
+.md-color-vars({
+  --f7-list-index-label-bg-color: var(--f7-md-primary);
+  --f7-list-index-label-text-color: var(--f7-md-on-primary);
+});

package/components/list-index/list-index.css

@@ -1 +1 @@
-:root{--f7-list-index-width:16px;--f7-list-index-font-size:11px;--f7-list-index-font-weight:600;--f7-list-index-item-height:14px;--f7-list-index-label-text-color:#fff;--f7-list-index-label-font-weight:500}.ios{--f7-list-index-label-size:44px;--f7-list-index-label-font-size:17px;--f7-list-index-skip-dot-size:6px}.md{--f7-list-index-label-size:56px;--f7-list-index-label-font-size:20px;--f7-list-index-skip-dot-size:4px}.list-index{position:absolute;top:0;bottom:0;text-align:center;z-index:10;width:var(--f7-list-index-width);cursor:pointer;-webkit-user-select:none;user-select:none;right:var(--f7-safe-area-right)}.list-index:before{content:'';position:absolute;width:20px;top:0;right:100%;height:100%}.list-index ul{color:var(--f7-list-index-text-color,var(--f7-theme-color));font-size:var(--f7-list-index-font-size);font-weight:var(--f7-list-index-font-weight);list-style:none;margin:0;padding:0;display:flex;flex-direction:column;justify-content:center;align-items:center;flex-shrink:0;height:100%;width:100%;position:relative}.list-index li{margin:0;padding:0;list-style:none;position:relative;height:var(--f7-list-index-item-height);line-height:var(--f7-list-index-item-height);flex-shrink:0;display:block;width:100%}.list-index .list-index-skip-placeholder:after{content:'';position:absolute;left:50%;top:50%;border-radius:50%;width:var(--f7-list-index-skip-dot-size);height:var(--f7-list-index-skip-dot-size);margin-left:calc(-1 * var(--f7-list-index-skip-dot-size)/ 2);margin-top:calc(-1 * var(--f7-list-index-skip-dot-size)/ 2);background:var(--f7-list-index-text-color,var(--f7-theme-color))}.list-index .list-index-label{position:absolute;bottom:0;right:100%;text-align:center;background-color:var(--f7-list-index-label-bg-color,var(--f7-theme-color));color:var(--f7-list-index-label-text-color);width:var(--f7-list-index-label-size);height:var(--f7-list-index-label-size);line-height:var(--f7-list-index-label-size);font-size:var(--f7-list-index-label-font-size);font-weight:var(--f7-list-index-label-font-weight)}.navbars~.page>.list-index,.navbar~.list-index,.navbar~.page>.list-index{top:var(--f7-navbar-height)}.ios .navbars~.toolbar-top-ios .md .navbar~.toolbar-top-md~.list-index,.ios .navbar~.toolbar-top-ios~.list-index,.navbars~.toolbar-top~.list-index,.navbar~.toolbar-top~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-toolbar-height))}.ios .navbars~.toolbar-top-ios .md .navbar~.toolbar-top-md.tabbar-icons~.list-index,.ios .navbar~.toolbar-top-ios.tabbar-icons~.list-index,.navbars~.toolbar-top.tabbar-icons~.list-index,.navbar~.toolbar-top.tabbar-icons~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-tabbar-icons-height))}.navbars~.subnavbar~.list-index,.navbar~.subnavbar~.list-index,.page-with-subnavbar .navbar~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-subnavbar-height))}.ios .toolbar-bottom-ios~* .page>.list-index,.ios .toolbar-bottom-ios~.list-index,.ios .toolbar-bottom-ios~.page>.list-index,.md .toolbar-bottom-md~* .page>.list-index,.md .toolbar-bottom-md~.list-index,.md .toolbar-bottom-md~.page>.list-index,.toolbar-bottom~* .page>.list-index,.toolbar-bottom~.list-index,.toolbar-bottom~.page>.list-index{bottom:calc(var(--f7-toolbar-height) + var(--f7-safe-area-bottom))}.ios .toolbar-bottom-ios.tabbar-icons~* .page>.list-index,.ios .toolbar-bottom-ios.tabbar-icons~.list-index,.ios .toolbar-bottom-ios.tabbar-icons~.page>.list-index,.md .toolbar-bottom-md.tabbar-icons~* .page>.list-index,.md .toolbar-bottom-md.tabbar-icons~.list-index,.md .toolbar-bottom-md.tabbar-icons~.page>.list-index,.toolbar-bottom.tabbar-icons~* .page>.list-index,.toolbar-bottom.tabbar-icons~.list-index,.toolbar-bottom.tabbar-icons~.page>.list-index{bottom:calc(var(--f7-tabbar-icons-height) + var(--f7-safe-area-bottom))}.ios .list-index .list-index-label{margin-bottom:calc(-1 * var(--f7-list-index-label-size)/ 2);margin-right:calc(var(--f7-list-index-width) - 1px);border-radius:50%}.ios .list-index .list-index-label:before{position:absolute;width:100%;height:100%;border-radius:50% 0% 50% 50%;content:'';background-color:inherit;left:0;top:0;transform:rotate(45deg);z-index:-1}.md .list-index .list-index-label{border-radius:50% 50% 0 50%}
+:root{--f7-list-index-width:16px;--f7-list-index-font-size:11px;--f7-list-index-font-weight:600;--f7-list-index-item-height:14px;--f7-list-index-label-font-weight:500}.ios{--f7-list-index-label-text-color:#fff;--f7-list-index-label-size:44px;--f7-list-index-label-font-size:17px;--f7-list-index-skip-dot-size:6px}.md{--f7-list-index-label-size:56px;--f7-list-index-label-font-size:20px;--f7-list-index-skip-dot-size:4px}.md,.md .dark,.md [class*=color-]{--f7-list-index-label-bg-color:var(--f7-md-primary);--f7-list-index-label-text-color:var(--f7-md-on-primary)}.list-index{position:absolute;top:0;bottom:0;text-align:center;z-index:10;width:var(--f7-list-index-width);cursor:pointer;-webkit-user-select:none;user-select:none;right:var(--f7-safe-area-right)}.list-index:before{content:'';position:absolute;width:20px;top:0;right:100%;height:100%}.list-index ul{color:var(--f7-list-index-text-color,var(--f7-theme-color));font-size:var(--f7-list-index-font-size);font-weight:var(--f7-list-index-font-weight);list-style:none;margin:0;padding:0;display:flex;flex-direction:column;justify-content:center;align-items:center;flex-shrink:0;height:100%;width:100%;position:relative}.list-index li{margin:0;padding:0;list-style:none;position:relative;height:var(--f7-list-index-item-height);line-height:var(--f7-list-index-item-height);flex-shrink:0;display:block;width:100%}.list-index .list-index-skip-placeholder:after{content:'';position:absolute;left:50%;top:50%;border-radius:50%;width:var(--f7-list-index-skip-dot-size);height:var(--f7-list-index-skip-dot-size);margin-left:calc(-1 * var(--f7-list-index-skip-dot-size)/ 2);margin-top:calc(-1 * var(--f7-list-index-skip-dot-size)/ 2);background:var(--f7-list-index-text-color,var(--f7-theme-color))}.list-index .list-index-label{position:absolute;bottom:0;right:100%;text-align:center;background-color:var(--f7-list-index-label-bg-color,var(--f7-theme-color));color:var(--f7-list-index-label-text-color);width:var(--f7-list-index-label-size);height:var(--f7-list-index-label-size);line-height:var(--f7-list-index-label-size);font-size:var(--f7-list-index-label-font-size);font-weight:var(--f7-list-index-label-font-weight)}.navbars~.page>.list-index,.navbar~.list-index,.navbar~.page>.list-index{top:var(--f7-navbar-height)}.ios .navbars~.toolbar-top-ios .md .navbar~.toolbar-top-md~.list-index,.ios .navbar~.toolbar-top-ios~.list-index,.navbars~.toolbar-top~.list-index,.navbar~.toolbar-top~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-toolbar-height))}.ios .navbars~.toolbar-top-ios .md .navbar~.toolbar-top-md.tabbar-icons~.list-index,.ios .navbar~.toolbar-top-ios.tabbar-icons~.list-index,.navbars~.toolbar-top.tabbar-icons~.list-index,.navbar~.toolbar-top.tabbar-icons~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-tabbar-icons-height))}.navbars~.subnavbar~.list-index,.navbar~.subnavbar~.list-index,.page-with-subnavbar .navbar~.list-index{top:calc(var(--f7-navbar-height) + var(--f7-subnavbar-height))}.ios .toolbar-bottom-ios~* .page>.list-index,.ios .toolbar-bottom-ios~.list-index,.ios .toolbar-bottom-ios~.page>.list-index,.md .toolbar-bottom-md~* .page>.list-index,.md .toolbar-bottom-md~.list-index,.md .toolbar-bottom-md~.page>.list-index,.toolbar-bottom~* .page>.list-index,.toolbar-bottom~.list-index,.toolbar-bottom~.page>.list-index{bottom:calc(var(--f7-toolbar-height) + var(--f7-safe-area-bottom))}.ios .toolbar-bottom-ios.tabbar-icons~* .page>.list-index,.ios .toolbar-bottom-ios.tabbar-icons~.list-index,.ios .toolbar-bottom-ios.tabbar-icons~.page>.list-index,.md .toolbar-bottom-md.tabbar-icons~* .page>.list-index,.md .toolbar-bottom-md.tabbar-icons~.list-index,.md .toolbar-bottom-md.tabbar-icons~.page>.list-index,.toolbar-bottom.tabbar-icons~* .page>.list-index,.toolbar-bottom.tabbar-icons~.list-index,.toolbar-bottom.tabbar-icons~.page>.list-index{bottom:calc(var(--f7-tabbar-icons-height) + var(--f7-safe-area-bottom))}.ios .list-index .list-index-label{margin-bottom:calc(-1 * var(--f7-list-index-label-size)/ 2);margin-right:calc(var(--f7-list-index-width) - 1px);border-radius:50%}.ios .list-index .list-index-label:before{position:absolute;width:100%;height:100%;border-radius:50% 0% 50% 50%;content:'';background-color:inherit;left:0;top:0;transform:rotate(45deg);z-index:-1}.md .list-index .list-index-label{border-radius:50% 50% 0 50%}

package/components/notification/notification-md.less

@@ -2,7 +2,7 @@
   .notification {
     transform: translate3d(0, -150%, 0);
     &.modal-in {
-      transition-duration: 200ms;
+      transition-duration: 500ms;
       transform: translate3d(0, 0%, 0);
       transition-timing-function: cubic-bezier(0, 0.8, 0.34, 1);
       &.notification-transitioning {
@@ -19,8 +19,8 @@
   .notification-with-icon {
     .notification-icon {
       position: absolute;
-      left: var(--f7-notification-padding);
-      top: var(--f7-notification-padding);
+      left: var(--f7-notification-padding-horizontal);
+      top: var(--f7-notification-padding-vertical);
     }
     .notification-content,
     .notification-header {
@@ -37,7 +37,7 @@
     }
   }
   .notification-header + .notification-content {
-    margin-top: 4px;
+    margin-top: 8px;
   }
   .notification-title-right-text {
     margin-left: 4px;

package/components/notification/notification-rtl.css

@@ -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)}}
+: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

@@ -7,7 +7,8 @@
 }
 .ios-vars({
   --f7-notification-margin: 8px;
-  --f7-notification-padding: 10px;
+  --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;
@@ -44,7 +45,8 @@
 });
 .md-vars({
   --f7-notification-margin: 16px;
-  --f7-notification-padding: 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;

package/components/notification/notification.css

@@ -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)}}
+: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

@@ -15,7 +15,7 @@
   transition-property: transform;
   direction: ltr;
   max-width: var(--f7-notification-max-width);
-  padding: var(--f7-notification-padding);
+  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);

package/components/panel/panel-class.js

@@ -442,6 +442,8 @@ class Panel extends Framework7Class {
       $el.removeClass('panel-out').addClass('panel-in not-animated');
       panel.onOpen();
       panel.onOpened();
+      // eslint-disable-next-line
+      panel._openTransitionStarted = true;
     }
     return true;
   }

package/components/picker/picker-rtl.css

@@ -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)}
+: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

@@ -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)}
+: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

@@ -78,6 +78,9 @@
   position: relative;
   max-height: 100%;
   z-index: 10;
+  &.picker-column-first.picker-column-last {
+    width: 100%;
+  }
 
   &.picker-column-left {
     text-align: left;
@@ -101,10 +104,7 @@
   height: 100%;
   box-sizing: border-box;
   padding: var(--f7-picker-scroll-padding, 0px) 0px;
-  &::-webkit-scrollbar {
-    display: none;
-    opacity: 0;
-  }
+  .no-scrollbar();
 }
 .picker-item {
   height: var(--f7-picker-item-height);

package/components/pull-to-refresh/pull-to-refresh-md.less

@@ -3,7 +3,8 @@
   .ptr-preloader {
     width: var(--f7-ptr-size);
     border-radius: 50%;
-    background: #fff;
+    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;

package/components/pull-to-refresh/pull-to-refresh-rtl.css

@@ -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}
+.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

@@ -8,3 +8,7 @@
   --f7-ptr-preloader-size: 22px;
   --f7-ptr-size: 40px;
 });
+.md-color-vars({
+  --f7-ptr-preloader-bg-color: var(--f7-md-surface-1);
+  --f7-ptr-preloader-color: var(--f7-md-primary);
+});