@xenknight/framework7 0.0.6 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/components/app/app.less +1 -1
  2. package/components/icon/icon-ios.less +9 -0
  3. package/components/icon/icon-md.less +9 -0
  4. package/components/icon/icon.less +2 -1
  5. package/components/list/list-vars.less +1 -1
  6. package/components/messagebar/messagebar-rtl.css +1 -1
  7. package/components/messagebar/messagebar-vars.less +1 -1
  8. package/components/messagebar/messagebar.css +1 -1
  9. package/components/messages/messages-rtl.css +1 -1
  10. package/components/messages/messages-vars.less +7 -7
  11. package/components/messages/messages.css +1 -1
  12. package/components/navbar-new/navbar-ios.less +135 -0
  13. package/components/navbar-new/navbar-md.less +105 -0
  14. package/components/navbar-new/navbar-vars.less +78 -0
  15. package/components/navbar-new/navbar.d.ts +77 -0
  16. package/components/navbar-new/navbar.js +568 -0
  17. package/components/navbar-new/navbar.less +268 -0
  18. package/components/searchbar-new/remove-diacritics.js +271 -0
  19. package/components/searchbar-new/searchbar-ios.less +131 -0
  20. package/components/searchbar-new/searchbar-md.less +153 -0
  21. package/components/searchbar-new/searchbar-new-class.js +592 -0
  22. package/components/searchbar-new/searchbar-vars.less +75 -0
  23. package/components/searchbar-new/searchbar.js +122 -0
  24. package/components/searchbar-new/searchbar.less +331 -0
  25. package/components/swipeout/swipeout.js +8 -9
  26. package/components/tabs/tabs.js +5 -0
  27. package/components/toolbar-new/tabbar-highlight.js +134 -0
  28. package/components/toolbar-new/toolbar-ios.less +193 -0
  29. package/components/toolbar-new/toolbar-md.less +152 -0
  30. package/components/toolbar-new/toolbar-vars.less +77 -0
  31. package/components/toolbar-new/toolbar.js +223 -0
  32. package/components/toolbar-new/toolbar.less +261 -0
  33. package/framework7-bundle-rtl.css +2198 -387
  34. package/framework7-bundle-rtl.min.css +12 -6
  35. package/framework7-bundle.css +2194 -383
  36. package/framework7-bundle.esm.js +11 -4
  37. package/framework7-bundle.js +2368 -467
  38. package/framework7-bundle.js.map +1 -1
  39. package/framework7-bundle.less +6 -3
  40. package/framework7-bundle.min.css +12 -6
  41. package/framework7-bundle.min.js +4 -4
  42. package/framework7-bundle.min.js.map +1 -1
  43. package/framework7-lite-bundle.esm.js +11 -4
  44. package/framework7-lite.esm.js +11 -4
  45. package/framework7-lite.js +8 -1
  46. package/framework7-rtl.css +2191 -380
  47. package/framework7-rtl.min.css +11 -5
  48. package/framework7.css +2189 -378
  49. package/framework7.esm.js +11 -4
  50. package/framework7.js +8 -1
  51. package/framework7.less +6 -3
  52. package/framework7.min.css +11 -5
  53. package/package.json +1 -1
package/components/app/app.less CHANGED
@@ -1,7 +1,7 @@
1
1
  @import './app-vars.less';
2
2
  // Core Icons
3
3
  @font-face {
4
- @fontBase64: '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';
4
+ @fontBase64: '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';
5
5
  font-family: 'framework7-core-icons';
6
6
  src: url('data:application/font-woff;charset=utf-8;base64, @{fontBase64}') format('woff');
7
7
  font-weight: 400;
package/components/icon/icon-ios.less CHANGED
@@ -16,6 +16,15 @@
16
16
  font-size: 16px;
17
17
  }
18
18
  }
19
+ .icon-close {
20
+ width: 20px;
21
+ height: 20px;
22
+ line-height: 20px;
23
+ font-size: 20px;
24
+ &:after {
25
+ content: 'close_ios';
26
+ }
27
+ }
19
28
 
20
29
  .ltr({
21
30
  .icon-back, .icon-prev {
package/components/icon/icon-md.less CHANGED
@@ -9,6 +9,15 @@
9
9
  line-height: 1.2;
10
10
  }
11
11
  }
12
+ .icon-close {
13
+ width: 24px;
14
+ height: 24px;
15
+ line-height: 24px;
16
+ font-size: 24px;
17
+ &:after {
18
+ content: 'close_md';
19
+ }
20
+ }
12
21
  .ltr({
13
22
  .icon-back {
14
23
  &:after {
package/components/icon/icon.less CHANGED
@@ -16,7 +16,8 @@ i.icon {
16
16
  .icon-back,
17
17
  .icon-prev,
18
18
  .icon-forward,
19
- .icon-next {
19
+ .icon-next,
20
+ .icon-close {
20
21
  &:after {
21
22
  .core-icons-font();
22
23
  }
package/components/list/list-vars.less CHANGED
@@ -80,7 +80,7 @@
80
80
  --f7-list-item-min-height: 52px;
81
81
  --f7-list-item-media-icons-margin: 5px;
82
82
  --f7-list-media-item-padding-vertical: 10px;
83
- --f7-list-media-item-title-font-weight: 600;
83
+ --f7-list-media-item-title-font-weight: 500;
84
84
  --f7-list-button-border-color: rgba(0,0,0,0.22);
85
85
  /*
86
86
  --f7-list-button-pressed-bg-color: rgba(var(--f7-theme-color-rgb), .15);
package/components/messagebar/messagebar-rtl.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-messagebar-attachments-height:155px;--f7-messagebar-sheet-height:252px;--f7-messagebar-sheet-landscape-height:192px}.ios{--f7-messagebar-height:44px;--f7-messagebar-font-size:17px;--f7-messagebar-textarea-bg-color:transparent;--f7-messagebar-border-color:transparent;--f7-messagebar-textarea-border-radius:17px;--f7-messagebar-textarea-padding:6px 16px;--f7-messagebar-textarea-height:34px;--f7-messagebar-textarea-font-size:17px;--f7-messagebar-textarea-line-height:20px;--f7-messagebar-sheet-bg-color:#d1d5da;--f7-messagebar-sheet-border-color:transparent;--f7-messagebar-attachment-border-radius:12px;--f7-messagebar-attachment-height:155px;--f7-messagebar-attachment-landscape-height:120px;--f7-messagebar-textarea-placeholder-color:rgba(0, 0, 0, 0.4);--f7-messagebar-textarea-text-color:#000;--f7-messagebar-textarea-border:1px solid #c8c8cd;--f7-messagebar-attachments-border-color:#c8c8cd;--f7-messagebar-bg-color:#fff;--f7-messagebar-bg-color-rgb:255,255,255}.ios .dark,.ios.dark{--f7-messagebar-textarea-placeholder-color:rgba(255, 255, 255, 0.4);--f7-messagebar-textarea-text-color:#fff;--f7-messagebar-textarea-border:1px solid var(--f7-bars-border-color);--f7-messagebar-attachments-border-color:var(--f7-bars-border-color);--f7-messagebar-bg-color:var(--f7-bars-bg-color);--f7-messagebar-bg-color-rgb:var(--f7-bars-bg-color-rgb)}.md{--f7-messagebar-height:64px;--f7-messagebar-font-size:16px;--f7-messagebar-textarea-border-radius:24px;--f7-messagebar-textarea-padding:12px 16px;--f7-messagebar-textarea-height:48px;--f7-messagebar-textarea-font-size:16px;--f7-messagebar-textarea-line-height:22px;--f7-messagebar-textarea-border:1px solid transparent;--f7-messagebar-attachment-border-radius:12px;--f7-messagebar-attachment-height:72px;--f7-messagebar-attachment-landscape-height:72px;--f7-messagebar-border-color:transparent;--f7-messagebar-attachments-border-color:transparent}.md,.md .dark,.md [class*=color-]{--f7-messagebar-textarea-placeholder-color:var(--f7-md-on-surface-variant);--f7-messagebar-textarea-bg-color:var(--f7-md-surface-variant);--f7-messagebar-bg-color:var(--f7-md-surface);--f7-messagebar-textarea-text-color:var(--f7-md-on-surface);--f7-messagebar-sheet-bg-color:var(--f7-md-surface);--f7-messagebar-sheet-border-color:var(--f7-md-outline-variant);--f7-messagebar-link-color:var(--f7-md-on-surface)}.messagebar{transform:translate3d(0,0,0);background:var(--f7-messagebar-bg-color);height:auto;min-height:var(--f7-messagebar-height);font-size:var(--f7-messagebar-font-size);padding-bottom:var(--f7-safe-area-bottom);bottom:0}.messagebar:before{content:'';position:absolute;background-color:var(--f7-messagebar-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)))}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-bars .messagebar{background-color:rgba(var(--f7-messagebar-bg-color-rgb),var(--f7-bars-translucent-opacity));-webkit-backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur));backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur))}}.messagebar.no-outline:before{display:none!important}.messagebar.toolbar-hidden:after{display:none!important}.messagebar .toolbar-inner{top:auto;position:relative;height:auto;bottom:auto;padding-left:calc(var(--f7-messagebar-inner-padding-left,var(--f7-toolbar-inner-padding-left)) + var(--f7-safe-area-left));padding-right:calc(var(--f7-messagebar-inner-padding-right,var(--f7-toolbar-inner-padding-right)) + var(--f7-safe-area-right));flex-direction:row-reverse}.messagebar.messagebar-sheet-visible>.toolbar-inner{bottom:0}.messagebar .messagebar-area{width:100%;flex-shrink:1;overflow:hidden;position:relative}.messagebar textarea{width:100%;flex-shrink:1;background-color:var(--f7-messagebar-textarea-bg-color);border-radius:var(--f7-messagebar-textarea-border-radius);padding:var(--f7-messagebar-textarea-padding);height:var(--f7-messagebar-textarea-height);color:var(--f7-messagebar-textarea-text-color);font-size:var(--f7-messagebar-textarea-font-size);line-height:var(--f7-messagebar-textarea-line-height);border:var(--f7-messagebar-textarea-border)}.messagebar textarea::placeholder{color:var(--f7-messagebar-textarea-placeholder-color)}.messagebar a.link{align-self:flex-end;flex-shrink:0;color:var(--f7-messagebar-link-color,var(--f7-theme-color))}.messagebar-attachments{width:100%;overflow:auto;-webkit-overflow-scrolling:touch;font-size:0;white-space:nowrap;box-sizing:border-box;position:relative}.messagebar:not(.messagebar-attachments-visible) .messagebar-attachments{display:none}.messagebar-attachment{background-size:cover;background-position:center;background-repeat:no-repeat;display:inline-block;vertical-align:middle;white-space:normal;height:var(--f7-messagebar-attachment-height);position:relative;border-radius:var(--f7-messagebar-attachment-border-radius)}@media (orientation:landscape){.messagebar-attachment{height:var(--f7-messagebar-attachment-landscape-height)}}.messagebar-attachment img{display:block;width:auto;height:100%;border-radius:var(--f7-messagebar-attachment-border-radius)}.messagebar-sheet{overflow:auto;-webkit-overflow-scrolling:touch;display:flex;flex-wrap:wrap;flex-direction:column;align-content:flex-start;height:var(--f7-messagebar-sheet-height);background-color:var(--f7-messagebar-sheet-bg-color);border-top:1px solid var(--f7-messagebar-sheet-border-color);padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}@media (orientation:landscape){.messagebar-sheet{height:var(--f7-messagebar-sheet-landscape-height)}}.messagebar-sheet-image{background-size:cover;background-position:center;background-repeat:no-repeat}.messagebar-sheet-image>img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:inherit;transition-duration:.2s}.messagebar-attachment-delete{display:block;position:absolute;border-radius:50%;box-sizing:border-box;cursor:pointer}.messagebar-attachment-delete:after,.messagebar-attachment-delete:before{position:absolute;content:'';left:50%;top:50%}.messagebar-attachment-delete:after{transform:rotate(45deg)}.messagebar-attachment-delete:before{transform:rotate(-45deg)}.messagebar:not(.messagebar-sheet-visible) .messagebar-sheet{display:none}.messagebar~*{--f7-page-toolbar-bottom-offset:var(--f7-messagebar-height)}.ios .messagebar a.link.icon-only:first-child{margin-left:-8px}.ios .messagebar a.link.icon-only:last-child{margin-right:-8px}.ios .messagebar a.link:not(.icon-only)+.messagebar-area{margin-left:8px}.ios .messagebar .messagebar-area+a.link:not(.icon-only){margin-left:8px}.ios .messagebar-area{margin-top:5px;margin-bottom:5px}.ios .messagebar-attachments{padding:5px;border-radius:var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius) 0 0;border:1px solid var(--f7-messagebar-attachments-border-color);border-bottom:none}.ios .messagebar-attachments-visible .messagebar-attachments+textarea{border-radius:0 0 var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius)}.ios .messagebar-attachment{font-size:14px}.ios .messagebar-attachment+.messagebar-attachment{margin-right:8px}.ios .messagebar-attachment-delete{right:5px;top:5px;width:20px;height:20px;background:#7d7e80;border:2px solid #fff;box-shadow:0px 0px 2px rgba(0,0,0,.2)}.ios .messagebar-attachment-delete:after,.ios .messagebar-attachment-delete:before{width:10px;height:2px;background:#fff;margin-left:-5px;margin-top:-1px}.ios .messagebar-sheet-image,.ios .messagebar-sheet-item{box-sizing:border-box;flex-shrink:0;margin-top:1px;position:relative;overflow:hidden;height:calc((var(--f7-messagebar-sheet-height) - 2px)/ 2);width:calc((var(--f7-messagebar-sheet-height) - 2px)/ 2);margin-right:1px}@media (orientation:landscape){.ios .messagebar-sheet-image,.ios .messagebar-sheet-item{width:calc((var(--f7-messagebar-sheet-landscape-height) - 2px)/ 2);height:calc((var(--f7-messagebar-sheet-landscape-height) - 2px)/ 2)}}.ios .messagebar-sheet-image .icon-checkbox,.ios .messagebar-sheet-image .icon-radio,.ios .messagebar-sheet-item .icon-checkbox,.ios .messagebar-sheet-item .icon-radio{position:absolute;right:8px;bottom:8px;z-index:1}.md .messagebar{--f7-toolbar-link-height:var(--f7-messagebar-height)}.md .messagebar-attachments{padding:16px 16px 0;border-bottom:1px solid var(--f7-messagebar-attachments-border-color)}.md .messagebar-attachment img{width:var(--f7-messagebar-attachment-height);height:var(--f7-messagebar-attachment-height);object-fit:cover;object-position:center}.md .messagebar-attachment+.messagebar-attachment{margin-right:16px}.md .messagebar-attachments-visible .messagebar-attachments{background:var(--f7-messagebar-textarea-bg-color);border-radius:var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius) 0 0}.md .messagebar-attachments-visible textarea{border-top-left-radius:0;border-top-right-radius:0}.md .messagebar-area{margin-top:8px;margin-bottom:8px}.md .messagebar-attachment-delete{right:-6px;top:-6px;width:24px;height:24px;background-color:var(--f7-md-inverse-surface);border-radius:24px;border:2px solid var(--f7-messagebar-textarea-bg-color)}.md .messagebar-attachment-delete:after,.md .messagebar-attachment-delete:before{width:12px;height:2px;background:var(--f7-messagebar-textarea-bg-color);margin-left:-6px;margin-top:-1px}.md .messagebar-sheet-image,.md .messagebar-sheet-item{--f7-touch-ripple-color:transparent;box-sizing:border-box;flex-shrink:0;margin-top:8px;position:relative;overflow:hidden;height:calc((var(--f7-messagebar-sheet-height) - 24px)/ 2);width:calc((var(--f7-messagebar-sheet-height) - 24px)/ 2);border-radius:4px;margin-right:8px}@media (orientation:landscape){.md .messagebar-sheet-image,.md .messagebar-sheet-item{width:calc((var(--f7-messagebar-sheet-landscape-height) - 8px)/ 2);height:calc((var(--f7-messagebar-sheet-landscape-height) - 24px)/ 2)}}.md .messagebar-sheet-image input:checked~img,.md .messagebar-sheet-item input:checked~img{transform:scale(.85)}.md .messagebar-sheet-image input:checked~.icon-checkbox,.md .messagebar-sheet-image input:checked~.icon-radio,.md .messagebar-sheet-item input:checked~.icon-checkbox,.md .messagebar-sheet-item input:checked~.icon-radio{transform:translate(-50%,-50%) scale(1)}.md .messagebar-sheet-image .icon-checkbox,.md .messagebar-sheet-image .icon-radio,.md .messagebar-sheet-item .icon-checkbox,.md .messagebar-sheet-item .icon-radio{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.85);border:none;z-index:1;--f7-checkbox-inactive-color:var(--f7-md-surface);--f7-checkbox-active-color:var(--f7-md-surface)}.md .messagebar-sheet-image .icon-checkbox::after,.md .messagebar-sheet-image .icon-radio::after,.md .messagebar-sheet-item .icon-checkbox::after,.md .messagebar-sheet-item .icon-radio::after{color:var(--f7-md-on-surface);font-size:18px;width:auto;height:100%;line-height:32px;left:0;position:static}
1
+ :root{--f7-messagebar-attachments-height:155px;--f7-messagebar-sheet-height:252px;--f7-messagebar-sheet-landscape-height:192px}.ios{--f7-messagebar-height:44px;--f7-messagebar-font-size:17px;--f7-messagebar-textarea-bg-color:transparent;--f7-messagebar-border-color:transparent;--f7-messagebar-textarea-border-radius:17px;--f7-messagebar-textarea-padding:6px 16px;--f7-messagebar-textarea-height:34px;--f7-messagebar-textarea-font-size:17px;--f7-messagebar-textarea-line-height:20px;--f7-messagebar-sheet-bg-color:#d1d5da;--f7-messagebar-sheet-border-color:transparent;--f7-messagebar-attachment-border-radius:12px;--f7-messagebar-attachment-height:155px;--f7-messagebar-attachment-landscape-height:120px;--f7-messagebar-textarea-placeholder-color:rgba(0, 0, 0, 0.4);--f7-messagebar-textarea-text-color:#000;--f7-messagebar-textarea-border:1px solid #c8c8cd;--f7-messagebar-attachments-border-color:#c8c8cd;--f7-messagebar-bg-color:#fff;--f7-messagebar-bg-color-rgb:255,255,255}.ios .dark,.ios.dark{--f7-messagebar-textarea-placeholder-color:rgba(255, 255, 255, 0.4);--f7-messagebar-textarea-text-color:#fff;--f7-messagebar-textarea-border:1px solid var(--f7-bars-border-color);--f7-messagebar-attachments-border-color:var(--f7-bars-border-color);--f7-messagebar-bg-color:var(--f7-bars-bg-color);--f7-messagebar-bg-color-rgb:var(--f7-bars-bg-color-rgb)}.md{--f7-messagebar-height:64px;--f7-messagebar-font-size:16px;--f7-messagebar-textarea-border-radius:24px;--f7-messagebar-textarea-padding:12px 16px;--f7-messagebar-textarea-height:48px;--f7-messagebar-textarea-font-size:16px;--f7-messagebar-textarea-line-height:22px;--f7-messagebar-textarea-border:1px solid transparent;--f7-messagebar-attachment-border-radius:12px;--f7-messagebar-attachment-height:72px;--f7-messagebar-attachment-landscape-height:72px;--f7-messagebar-border-color:transparent;--f7-messagebar-attachments-border-color:transparent}.md,.md .dark,.md [class*=color-]{--f7-messagebar-textarea-placeholder-color:var(--f7-md-on-surface-variant);--f7-messagebar-textarea-bg-color:var(--f7-md-surface-variant);--f7-messagebar-bg-color:var(--f7-md-surface-2);--f7-messagebar-textarea-text-color:var(--f7-md-on-surface);--f7-messagebar-sheet-bg-color:var(--f7-md-surface);--f7-messagebar-sheet-border-color:var(--f7-md-outline-variant);--f7-messagebar-link-color:var(--f7-md-on-surface)}.messagebar{transform:translate3d(0,0,0);background:var(--f7-messagebar-bg-color);height:auto;min-height:var(--f7-messagebar-height);font-size:var(--f7-messagebar-font-size);padding-bottom:var(--f7-safe-area-bottom);bottom:0}.messagebar:before{content:'';position:absolute;background-color:var(--f7-messagebar-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)))}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-bars .messagebar{background-color:rgba(var(--f7-messagebar-bg-color-rgb),var(--f7-bars-translucent-opacity));-webkit-backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur));backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur))}}.messagebar.no-outline:before{display:none!important}.messagebar.toolbar-hidden:after{display:none!important}.messagebar .toolbar-inner{top:auto;position:relative;height:auto;bottom:auto;padding-left:calc(var(--f7-messagebar-inner-padding-left,var(--f7-toolbar-inner-padding-left)) + var(--f7-safe-area-left));padding-right:calc(var(--f7-messagebar-inner-padding-right,var(--f7-toolbar-inner-padding-right)) + var(--f7-safe-area-right));flex-direction:row-reverse}.messagebar.messagebar-sheet-visible>.toolbar-inner{bottom:0}.messagebar .messagebar-area{width:100%;flex-shrink:1;overflow:hidden;position:relative}.messagebar textarea{width:100%;flex-shrink:1;background-color:var(--f7-messagebar-textarea-bg-color);border-radius:var(--f7-messagebar-textarea-border-radius);padding:var(--f7-messagebar-textarea-padding);height:var(--f7-messagebar-textarea-height);color:var(--f7-messagebar-textarea-text-color);font-size:var(--f7-messagebar-textarea-font-size);line-height:var(--f7-messagebar-textarea-line-height);border:var(--f7-messagebar-textarea-border)}.messagebar textarea::placeholder{color:var(--f7-messagebar-textarea-placeholder-color)}.messagebar a.link{align-self:flex-end;flex-shrink:0;color:var(--f7-messagebar-link-color,var(--f7-theme-color))}.messagebar-attachments{width:100%;overflow:auto;-webkit-overflow-scrolling:touch;font-size:0;white-space:nowrap;box-sizing:border-box;position:relative}.messagebar:not(.messagebar-attachments-visible) .messagebar-attachments{display:none}.messagebar-attachment{background-size:cover;background-position:center;background-repeat:no-repeat;display:inline-block;vertical-align:middle;white-space:normal;height:var(--f7-messagebar-attachment-height);position:relative;border-radius:var(--f7-messagebar-attachment-border-radius)}@media (orientation:landscape){.messagebar-attachment{height:var(--f7-messagebar-attachment-landscape-height)}}.messagebar-attachment img{display:block;width:auto;height:100%;border-radius:var(--f7-messagebar-attachment-border-radius)}.messagebar-sheet{overflow:auto;-webkit-overflow-scrolling:touch;display:flex;flex-wrap:wrap;flex-direction:column;align-content:flex-start;height:var(--f7-messagebar-sheet-height);background-color:var(--f7-messagebar-sheet-bg-color);border-top:1px solid var(--f7-messagebar-sheet-border-color);padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}@media (orientation:landscape){.messagebar-sheet{height:var(--f7-messagebar-sheet-landscape-height)}}.messagebar-sheet-image{background-size:cover;background-position:center;background-repeat:no-repeat}.messagebar-sheet-image>img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:inherit;transition-duration:.2s}.messagebar-attachment-delete{display:block;position:absolute;border-radius:50%;box-sizing:border-box;cursor:pointer}.messagebar-attachment-delete:after,.messagebar-attachment-delete:before{position:absolute;content:'';left:50%;top:50%}.messagebar-attachment-delete:after{transform:rotate(45deg)}.messagebar-attachment-delete:before{transform:rotate(-45deg)}.messagebar:not(.messagebar-sheet-visible) .messagebar-sheet{display:none}.messagebar~*{--f7-page-toolbar-bottom-offset:var(--f7-messagebar-height)}.ios .messagebar a.link.icon-only:first-child{margin-left:-8px}.ios .messagebar a.link.icon-only:last-child{margin-right:-8px}.ios .messagebar a.link:not(.icon-only)+.messagebar-area{margin-left:8px}.ios .messagebar .messagebar-area+a.link:not(.icon-only){margin-left:8px}.ios .messagebar-area{margin-top:5px;margin-bottom:5px}.ios .messagebar-attachments{padding:5px;border-radius:var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius) 0 0;border:1px solid var(--f7-messagebar-attachments-border-color);border-bottom:none}.ios .messagebar-attachments-visible .messagebar-attachments+textarea{border-radius:0 0 var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius)}.ios .messagebar-attachment{font-size:14px}.ios .messagebar-attachment+.messagebar-attachment{margin-right:8px}.ios .messagebar-attachment-delete{right:5px;top:5px;width:20px;height:20px;background:#7d7e80;border:2px solid #fff;box-shadow:0px 0px 2px rgba(0,0,0,.2)}.ios .messagebar-attachment-delete:after,.ios .messagebar-attachment-delete:before{width:10px;height:2px;background:#fff;margin-left:-5px;margin-top:-1px}.ios .messagebar-sheet-image,.ios .messagebar-sheet-item{box-sizing:border-box;flex-shrink:0;margin-top:1px;position:relative;overflow:hidden;height:calc((var(--f7-messagebar-sheet-height) - 2px)/ 2);width:calc((var(--f7-messagebar-sheet-height) - 2px)/ 2);margin-right:1px}@media (orientation:landscape){.ios .messagebar-sheet-image,.ios .messagebar-sheet-item{width:calc((var(--f7-messagebar-sheet-landscape-height) - 2px)/ 2);height:calc((var(--f7-messagebar-sheet-landscape-height) - 2px)/ 2)}}.ios .messagebar-sheet-image .icon-checkbox,.ios .messagebar-sheet-image .icon-radio,.ios .messagebar-sheet-item .icon-checkbox,.ios .messagebar-sheet-item .icon-radio{position:absolute;right:8px;bottom:8px;z-index:1}.md .messagebar{--f7-toolbar-link-height:var(--f7-messagebar-height)}.md .messagebar-attachments{padding:16px 16px 0;border-bottom:1px solid var(--f7-messagebar-attachments-border-color)}.md .messagebar-attachment img{width:var(--f7-messagebar-attachment-height);height:var(--f7-messagebar-attachment-height);object-fit:cover;object-position:center}.md .messagebar-attachment+.messagebar-attachment{margin-right:16px}.md .messagebar-attachments-visible .messagebar-attachments{background:var(--f7-messagebar-textarea-bg-color);border-radius:var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius) 0 0}.md .messagebar-attachments-visible textarea{border-top-left-radius:0;border-top-right-radius:0}.md .messagebar-area{margin-top:8px;margin-bottom:8px}.md .messagebar-attachment-delete{right:-6px;top:-6px;width:24px;height:24px;background-color:var(--f7-md-inverse-surface);border-radius:24px;border:2px solid var(--f7-messagebar-textarea-bg-color)}.md .messagebar-attachment-delete:after,.md .messagebar-attachment-delete:before{width:12px;height:2px;background:var(--f7-messagebar-textarea-bg-color);margin-left:-6px;margin-top:-1px}.md .messagebar-sheet-image,.md .messagebar-sheet-item{--f7-touch-ripple-color:transparent;box-sizing:border-box;flex-shrink:0;margin-top:8px;position:relative;overflow:hidden;height:calc((var(--f7-messagebar-sheet-height) - 24px)/ 2);width:calc((var(--f7-messagebar-sheet-height) - 24px)/ 2);border-radius:4px;margin-right:8px}@media (orientation:landscape){.md .messagebar-sheet-image,.md .messagebar-sheet-item{width:calc((var(--f7-messagebar-sheet-landscape-height) - 8px)/ 2);height:calc((var(--f7-messagebar-sheet-landscape-height) - 24px)/ 2)}}.md .messagebar-sheet-image input:checked~img,.md .messagebar-sheet-item input:checked~img{transform:scale(.85)}.md .messagebar-sheet-image input:checked~.icon-checkbox,.md .messagebar-sheet-image input:checked~.icon-radio,.md .messagebar-sheet-item input:checked~.icon-checkbox,.md .messagebar-sheet-item input:checked~.icon-radio{transform:translate(-50%,-50%) scale(1)}.md .messagebar-sheet-image .icon-checkbox,.md .messagebar-sheet-image .icon-radio,.md .messagebar-sheet-item .icon-checkbox,.md .messagebar-sheet-item .icon-radio{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.85);border:none;z-index:1;--f7-checkbox-inactive-color:var(--f7-md-surface);--f7-checkbox-active-color:var(--f7-md-surface)}.md .messagebar-sheet-image .icon-checkbox::after,.md .messagebar-sheet-image .icon-radio::after,.md .messagebar-sheet-item .icon-checkbox::after,.md .messagebar-sheet-item .icon-radio::after{color:var(--f7-md-on-surface);font-size:18px;width:auto;height:100%;line-height:32px;left:0;position:static}
package/components/messagebar/messagebar-vars.less CHANGED
@@ -67,7 +67,7 @@
67
67
  .md-color-vars({
68
68
  --f7-messagebar-textarea-placeholder-color: var(--f7-md-on-surface-variant);
69
69
  --f7-messagebar-textarea-bg-color: var(--f7-md-surface-variant);
70
- --f7-messagebar-bg-color: var(--f7-md-surface);
70
+ --f7-messagebar-bg-color: var(--f7-md-surface-2);
71
71
  --f7-messagebar-textarea-text-color: var(--f7-md-on-surface);
72
72
  --f7-messagebar-sheet-bg-color: var(--f7-md-surface);
73
73
  --f7-messagebar-sheet-border-color: var(--f7-md-outline-variant);
package/components/messagebar/messagebar.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-messagebar-attachments-height:155px;--f7-messagebar-sheet-height:252px;--f7-messagebar-sheet-landscape-height:192px}.ios{--f7-messagebar-height:44px;--f7-messagebar-font-size:17px;--f7-messagebar-textarea-bg-color:transparent;--f7-messagebar-border-color:transparent;--f7-messagebar-textarea-border-radius:17px;--f7-messagebar-textarea-padding:6px 16px;--f7-messagebar-textarea-height:34px;--f7-messagebar-textarea-font-size:17px;--f7-messagebar-textarea-line-height:20px;--f7-messagebar-sheet-bg-color:#d1d5da;--f7-messagebar-sheet-border-color:transparent;--f7-messagebar-attachment-border-radius:12px;--f7-messagebar-attachment-height:155px;--f7-messagebar-attachment-landscape-height:120px;--f7-messagebar-textarea-placeholder-color:rgba(0, 0, 0, 0.4);--f7-messagebar-textarea-text-color:#000;--f7-messagebar-textarea-border:1px solid #c8c8cd;--f7-messagebar-attachments-border-color:#c8c8cd;--f7-messagebar-bg-color:#fff;--f7-messagebar-bg-color-rgb:255,255,255}.ios .dark,.ios.dark{--f7-messagebar-textarea-placeholder-color:rgba(255, 255, 255, 0.4);--f7-messagebar-textarea-text-color:#fff;--f7-messagebar-textarea-border:1px solid var(--f7-bars-border-color);--f7-messagebar-attachments-border-color:var(--f7-bars-border-color);--f7-messagebar-bg-color:var(--f7-bars-bg-color);--f7-messagebar-bg-color-rgb:var(--f7-bars-bg-color-rgb)}.md{--f7-messagebar-height:64px;--f7-messagebar-font-size:16px;--f7-messagebar-textarea-border-radius:24px;--f7-messagebar-textarea-padding:12px 16px;--f7-messagebar-textarea-height:48px;--f7-messagebar-textarea-font-size:16px;--f7-messagebar-textarea-line-height:22px;--f7-messagebar-textarea-border:1px solid transparent;--f7-messagebar-attachment-border-radius:12px;--f7-messagebar-attachment-height:72px;--f7-messagebar-attachment-landscape-height:72px;--f7-messagebar-border-color:transparent;--f7-messagebar-attachments-border-color:transparent}.md,.md .dark,.md [class*=color-]{--f7-messagebar-textarea-placeholder-color:var(--f7-md-on-surface-variant);--f7-messagebar-textarea-bg-color:var(--f7-md-surface-variant);--f7-messagebar-bg-color:var(--f7-md-surface);--f7-messagebar-textarea-text-color:var(--f7-md-on-surface);--f7-messagebar-sheet-bg-color:var(--f7-md-surface);--f7-messagebar-sheet-border-color:var(--f7-md-outline-variant);--f7-messagebar-link-color:var(--f7-md-on-surface)}.messagebar{transform:translate3d(0,0,0);background:var(--f7-messagebar-bg-color);height:auto;min-height:var(--f7-messagebar-height);font-size:var(--f7-messagebar-font-size);padding-bottom:var(--f7-safe-area-bottom);bottom:0}.messagebar:before{content:'';position:absolute;background-color:var(--f7-messagebar-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)))}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-bars .messagebar{background-color:rgba(var(--f7-messagebar-bg-color-rgb),var(--f7-bars-translucent-opacity));-webkit-backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur));backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur))}}.messagebar.no-outline:before{display:none!important}.messagebar.toolbar-hidden:after{display:none!important}.messagebar .toolbar-inner{top:auto;position:relative;height:auto;bottom:auto;padding-left:calc(var(--f7-messagebar-inner-padding-left,var(--f7-toolbar-inner-padding-left)) + var(--f7-safe-area-left));padding-right:calc(var(--f7-messagebar-inner-padding-right,var(--f7-toolbar-inner-padding-right)) + var(--f7-safe-area-right))}.messagebar.messagebar-sheet-visible>.toolbar-inner{bottom:0}.messagebar .messagebar-area{width:100%;flex-shrink:1;overflow:hidden;position:relative}.messagebar textarea{width:100%;flex-shrink:1;background-color:var(--f7-messagebar-textarea-bg-color);border-radius:var(--f7-messagebar-textarea-border-radius);padding:var(--f7-messagebar-textarea-padding);height:var(--f7-messagebar-textarea-height);color:var(--f7-messagebar-textarea-text-color);font-size:var(--f7-messagebar-textarea-font-size);line-height:var(--f7-messagebar-textarea-line-height);border:var(--f7-messagebar-textarea-border)}.messagebar textarea::placeholder{color:var(--f7-messagebar-textarea-placeholder-color)}.messagebar a.link{align-self:flex-end;flex-shrink:0;color:var(--f7-messagebar-link-color,var(--f7-theme-color))}.messagebar-attachments{width:100%;overflow:auto;-webkit-overflow-scrolling:touch;font-size:0;white-space:nowrap;box-sizing:border-box;position:relative}.messagebar:not(.messagebar-attachments-visible) .messagebar-attachments{display:none}.messagebar-attachment{background-size:cover;background-position:center;background-repeat:no-repeat;display:inline-block;vertical-align:middle;white-space:normal;height:var(--f7-messagebar-attachment-height);position:relative;border-radius:var(--f7-messagebar-attachment-border-radius)}@media (orientation:landscape){.messagebar-attachment{height:var(--f7-messagebar-attachment-landscape-height)}}.messagebar-attachment img{display:block;width:auto;height:100%;border-radius:var(--f7-messagebar-attachment-border-radius)}.messagebar-sheet{overflow:auto;-webkit-overflow-scrolling:touch;display:flex;flex-wrap:wrap;flex-direction:column;align-content:flex-start;height:var(--f7-messagebar-sheet-height);background-color:var(--f7-messagebar-sheet-bg-color);border-top:1px solid var(--f7-messagebar-sheet-border-color);padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}@media (orientation:landscape){.messagebar-sheet{height:var(--f7-messagebar-sheet-landscape-height)}}.messagebar-sheet-image{background-size:cover;background-position:center;background-repeat:no-repeat}.messagebar-sheet-image>img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:inherit;transition-duration:.2s}.messagebar-attachment-delete{display:block;position:absolute;border-radius:50%;box-sizing:border-box;cursor:pointer}.messagebar-attachment-delete:after,.messagebar-attachment-delete:before{position:absolute;content:'';left:50%;top:50%}.messagebar-attachment-delete:after{transform:rotate(45deg)}.messagebar-attachment-delete:before{transform:rotate(-45deg)}.messagebar:not(.messagebar-sheet-visible) .messagebar-sheet{display:none}.messagebar~*{--f7-page-toolbar-bottom-offset:var(--f7-messagebar-height)}.ios .messagebar a.link.icon-only:first-child{margin-left:-8px}.ios .messagebar a.link.icon-only:last-child{margin-right:-8px}.ios .messagebar a.link:not(.icon-only)+.messagebar-area{margin-left:8px}.ios .messagebar .messagebar-area+a.link:not(.icon-only){margin-left:8px}.ios .messagebar-area{margin-top:5px;margin-bottom:5px}.ios .messagebar-attachments{padding:5px;border-radius:var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius) 0 0;border:1px solid var(--f7-messagebar-attachments-border-color);border-bottom:none}.ios .messagebar-attachments-visible .messagebar-attachments+textarea{border-radius:0 0 var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius)}.ios .messagebar-attachment{font-size:14px}.ios .messagebar-attachment+.messagebar-attachment{margin-left:8px}.ios .messagebar-attachment-delete{right:5px;top:5px;width:20px;height:20px;background:#7d7e80;border:2px solid #fff;box-shadow:0px 0px 2px rgba(0,0,0,.2)}.ios .messagebar-attachment-delete:after,.ios .messagebar-attachment-delete:before{width:10px;height:2px;background:#fff;margin-left:-5px;margin-top:-1px}.ios .messagebar-sheet-image,.ios .messagebar-sheet-item{box-sizing:border-box;flex-shrink:0;margin-top:1px;position:relative;overflow:hidden;height:calc((var(--f7-messagebar-sheet-height) - 2px)/ 2);width:calc((var(--f7-messagebar-sheet-height) - 2px)/ 2);margin-left:1px}@media (orientation:landscape){.ios .messagebar-sheet-image,.ios .messagebar-sheet-item{width:calc((var(--f7-messagebar-sheet-landscape-height) - 2px)/ 2);height:calc((var(--f7-messagebar-sheet-landscape-height) - 2px)/ 2)}}.ios .messagebar-sheet-image .icon-checkbox,.ios .messagebar-sheet-image .icon-radio,.ios .messagebar-sheet-item .icon-checkbox,.ios .messagebar-sheet-item .icon-radio{position:absolute;right:8px;bottom:8px;z-index:1}.md .messagebar{--f7-toolbar-link-height:var(--f7-messagebar-height)}.md .messagebar-attachments{padding:16px 16px 0;border-bottom:1px solid var(--f7-messagebar-attachments-border-color)}.md .messagebar-attachment img{width:var(--f7-messagebar-attachment-height);height:var(--f7-messagebar-attachment-height);object-fit:cover;object-position:center}.md .messagebar-attachment+.messagebar-attachment{margin-left:16px}.md .messagebar-attachments-visible .messagebar-attachments{background:var(--f7-messagebar-textarea-bg-color);border-radius:var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius) 0 0}.md .messagebar-attachments-visible textarea{border-top-left-radius:0;border-top-right-radius:0}.md .messagebar-area{margin-top:8px;margin-bottom:8px}.md .messagebar-attachment-delete{right:-6px;top:-6px;width:24px;height:24px;background-color:var(--f7-md-inverse-surface);border-radius:24px;border:2px solid var(--f7-messagebar-textarea-bg-color)}.md .messagebar-attachment-delete:after,.md .messagebar-attachment-delete:before{width:12px;height:2px;background:var(--f7-messagebar-textarea-bg-color);margin-left:-6px;margin-top:-1px}.md .messagebar-sheet-image,.md .messagebar-sheet-item{--f7-touch-ripple-color:transparent;box-sizing:border-box;flex-shrink:0;margin-top:8px;position:relative;overflow:hidden;height:calc((var(--f7-messagebar-sheet-height) - 24px)/ 2);width:calc((var(--f7-messagebar-sheet-height) - 24px)/ 2);border-radius:4px;margin-left:8px}@media (orientation:landscape){.md .messagebar-sheet-image,.md .messagebar-sheet-item{width:calc((var(--f7-messagebar-sheet-landscape-height) - 8px)/ 2);height:calc((var(--f7-messagebar-sheet-landscape-height) - 24px)/ 2)}}.md .messagebar-sheet-image input:checked~img,.md .messagebar-sheet-item input:checked~img{transform:scale(.85)}.md .messagebar-sheet-image input:checked~.icon-checkbox,.md .messagebar-sheet-image input:checked~.icon-radio,.md .messagebar-sheet-item input:checked~.icon-checkbox,.md .messagebar-sheet-item input:checked~.icon-radio{transform:translate(-50%,-50%) scale(1)}.md .messagebar-sheet-image .icon-checkbox,.md .messagebar-sheet-image .icon-radio,.md .messagebar-sheet-item .icon-checkbox,.md .messagebar-sheet-item .icon-radio{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.85);border:none;z-index:1;--f7-checkbox-inactive-color:var(--f7-md-surface);--f7-checkbox-active-color:var(--f7-md-surface)}.md .messagebar-sheet-image .icon-checkbox::after,.md .messagebar-sheet-image .icon-radio::after,.md .messagebar-sheet-item .icon-checkbox::after,.md .messagebar-sheet-item .icon-radio::after{color:var(--f7-md-on-surface);font-size:18px;width:auto;height:100%;line-height:32px;left:0;position:static}
1
+ :root{--f7-messagebar-attachments-height:155px;--f7-messagebar-sheet-height:252px;--f7-messagebar-sheet-landscape-height:192px}.ios{--f7-messagebar-height:44px;--f7-messagebar-font-size:17px;--f7-messagebar-textarea-bg-color:transparent;--f7-messagebar-border-color:transparent;--f7-messagebar-textarea-border-radius:17px;--f7-messagebar-textarea-padding:6px 16px;--f7-messagebar-textarea-height:34px;--f7-messagebar-textarea-font-size:17px;--f7-messagebar-textarea-line-height:20px;--f7-messagebar-sheet-bg-color:#d1d5da;--f7-messagebar-sheet-border-color:transparent;--f7-messagebar-attachment-border-radius:12px;--f7-messagebar-attachment-height:155px;--f7-messagebar-attachment-landscape-height:120px;--f7-messagebar-textarea-placeholder-color:rgba(0, 0, 0, 0.4);--f7-messagebar-textarea-text-color:#000;--f7-messagebar-textarea-border:1px solid #c8c8cd;--f7-messagebar-attachments-border-color:#c8c8cd;--f7-messagebar-bg-color:#fff;--f7-messagebar-bg-color-rgb:255,255,255}.ios .dark,.ios.dark{--f7-messagebar-textarea-placeholder-color:rgba(255, 255, 255, 0.4);--f7-messagebar-textarea-text-color:#fff;--f7-messagebar-textarea-border:1px solid var(--f7-bars-border-color);--f7-messagebar-attachments-border-color:var(--f7-bars-border-color);--f7-messagebar-bg-color:var(--f7-bars-bg-color);--f7-messagebar-bg-color-rgb:var(--f7-bars-bg-color-rgb)}.md{--f7-messagebar-height:64px;--f7-messagebar-font-size:16px;--f7-messagebar-textarea-border-radius:24px;--f7-messagebar-textarea-padding:12px 16px;--f7-messagebar-textarea-height:48px;--f7-messagebar-textarea-font-size:16px;--f7-messagebar-textarea-line-height:22px;--f7-messagebar-textarea-border:1px solid transparent;--f7-messagebar-attachment-border-radius:12px;--f7-messagebar-attachment-height:72px;--f7-messagebar-attachment-landscape-height:72px;--f7-messagebar-border-color:transparent;--f7-messagebar-attachments-border-color:transparent}.md,.md .dark,.md [class*=color-]{--f7-messagebar-textarea-placeholder-color:var(--f7-md-on-surface-variant);--f7-messagebar-textarea-bg-color:var(--f7-md-surface-variant);--f7-messagebar-bg-color:var(--f7-md-surface-2);--f7-messagebar-textarea-text-color:var(--f7-md-on-surface);--f7-messagebar-sheet-bg-color:var(--f7-md-surface);--f7-messagebar-sheet-border-color:var(--f7-md-outline-variant);--f7-messagebar-link-color:var(--f7-md-on-surface)}.messagebar{transform:translate3d(0,0,0);background:var(--f7-messagebar-bg-color);height:auto;min-height:var(--f7-messagebar-height);font-size:var(--f7-messagebar-font-size);padding-bottom:var(--f7-safe-area-bottom);bottom:0}.messagebar:before{content:'';position:absolute;background-color:var(--f7-messagebar-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)))}@supports ((-webkit-backdrop-filter:blur(20px)) or (backdrop-filter:blur(20px))){.ios-translucent-bars .messagebar{background-color:rgba(var(--f7-messagebar-bg-color-rgb),var(--f7-bars-translucent-opacity));-webkit-backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur));backdrop-filter:saturate(180%) blur(var(--f7-bars-translucent-blur))}}.messagebar.no-outline:before{display:none!important}.messagebar.toolbar-hidden:after{display:none!important}.messagebar .toolbar-inner{top:auto;position:relative;height:auto;bottom:auto;padding-left:calc(var(--f7-messagebar-inner-padding-left,var(--f7-toolbar-inner-padding-left)) + var(--f7-safe-area-left));padding-right:calc(var(--f7-messagebar-inner-padding-right,var(--f7-toolbar-inner-padding-right)) + var(--f7-safe-area-right))}.messagebar.messagebar-sheet-visible>.toolbar-inner{bottom:0}.messagebar .messagebar-area{width:100%;flex-shrink:1;overflow:hidden;position:relative}.messagebar textarea{width:100%;flex-shrink:1;background-color:var(--f7-messagebar-textarea-bg-color);border-radius:var(--f7-messagebar-textarea-border-radius);padding:var(--f7-messagebar-textarea-padding);height:var(--f7-messagebar-textarea-height);color:var(--f7-messagebar-textarea-text-color);font-size:var(--f7-messagebar-textarea-font-size);line-height:var(--f7-messagebar-textarea-line-height);border:var(--f7-messagebar-textarea-border)}.messagebar textarea::placeholder{color:var(--f7-messagebar-textarea-placeholder-color)}.messagebar a.link{align-self:flex-end;flex-shrink:0;color:var(--f7-messagebar-link-color,var(--f7-theme-color))}.messagebar-attachments{width:100%;overflow:auto;-webkit-overflow-scrolling:touch;font-size:0;white-space:nowrap;box-sizing:border-box;position:relative}.messagebar:not(.messagebar-attachments-visible) .messagebar-attachments{display:none}.messagebar-attachment{background-size:cover;background-position:center;background-repeat:no-repeat;display:inline-block;vertical-align:middle;white-space:normal;height:var(--f7-messagebar-attachment-height);position:relative;border-radius:var(--f7-messagebar-attachment-border-radius)}@media (orientation:landscape){.messagebar-attachment{height:var(--f7-messagebar-attachment-landscape-height)}}.messagebar-attachment img{display:block;width:auto;height:100%;border-radius:var(--f7-messagebar-attachment-border-radius)}.messagebar-sheet{overflow:auto;-webkit-overflow-scrolling:touch;display:flex;flex-wrap:wrap;flex-direction:column;align-content:flex-start;height:var(--f7-messagebar-sheet-height);background-color:var(--f7-messagebar-sheet-bg-color);border-top:1px solid var(--f7-messagebar-sheet-border-color);padding-left:var(--f7-safe-area-left);padding-right:var(--f7-safe-area-right)}@media (orientation:landscape){.messagebar-sheet{height:var(--f7-messagebar-sheet-landscape-height)}}.messagebar-sheet-image{background-size:cover;background-position:center;background-repeat:no-repeat}.messagebar-sheet-image>img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:inherit;transition-duration:.2s}.messagebar-attachment-delete{display:block;position:absolute;border-radius:50%;box-sizing:border-box;cursor:pointer}.messagebar-attachment-delete:after,.messagebar-attachment-delete:before{position:absolute;content:'';left:50%;top:50%}.messagebar-attachment-delete:after{transform:rotate(45deg)}.messagebar-attachment-delete:before{transform:rotate(-45deg)}.messagebar:not(.messagebar-sheet-visible) .messagebar-sheet{display:none}.messagebar~*{--f7-page-toolbar-bottom-offset:var(--f7-messagebar-height)}.ios .messagebar a.link.icon-only:first-child{margin-left:-8px}.ios .messagebar a.link.icon-only:last-child{margin-right:-8px}.ios .messagebar a.link:not(.icon-only)+.messagebar-area{margin-left:8px}.ios .messagebar .messagebar-area+a.link:not(.icon-only){margin-left:8px}.ios .messagebar-area{margin-top:5px;margin-bottom:5px}.ios .messagebar-attachments{padding:5px;border-radius:var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius) 0 0;border:1px solid var(--f7-messagebar-attachments-border-color);border-bottom:none}.ios .messagebar-attachments-visible .messagebar-attachments+textarea{border-radius:0 0 var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius)}.ios .messagebar-attachment{font-size:14px}.ios .messagebar-attachment+.messagebar-attachment{margin-left:8px}.ios .messagebar-attachment-delete{right:5px;top:5px;width:20px;height:20px;background:#7d7e80;border:2px solid #fff;box-shadow:0px 0px 2px rgba(0,0,0,.2)}.ios .messagebar-attachment-delete:after,.ios .messagebar-attachment-delete:before{width:10px;height:2px;background:#fff;margin-left:-5px;margin-top:-1px}.ios .messagebar-sheet-image,.ios .messagebar-sheet-item{box-sizing:border-box;flex-shrink:0;margin-top:1px;position:relative;overflow:hidden;height:calc((var(--f7-messagebar-sheet-height) - 2px)/ 2);width:calc((var(--f7-messagebar-sheet-height) - 2px)/ 2);margin-left:1px}@media (orientation:landscape){.ios .messagebar-sheet-image,.ios .messagebar-sheet-item{width:calc((var(--f7-messagebar-sheet-landscape-height) - 2px)/ 2);height:calc((var(--f7-messagebar-sheet-landscape-height) - 2px)/ 2)}}.ios .messagebar-sheet-image .icon-checkbox,.ios .messagebar-sheet-image .icon-radio,.ios .messagebar-sheet-item .icon-checkbox,.ios .messagebar-sheet-item .icon-radio{position:absolute;right:8px;bottom:8px;z-index:1}.md .messagebar{--f7-toolbar-link-height:var(--f7-messagebar-height)}.md .messagebar-attachments{padding:16px 16px 0;border-bottom:1px solid var(--f7-messagebar-attachments-border-color)}.md .messagebar-attachment img{width:var(--f7-messagebar-attachment-height);height:var(--f7-messagebar-attachment-height);object-fit:cover;object-position:center}.md .messagebar-attachment+.messagebar-attachment{margin-left:16px}.md .messagebar-attachments-visible .messagebar-attachments{background:var(--f7-messagebar-textarea-bg-color);border-radius:var(--f7-messagebar-textarea-border-radius) var(--f7-messagebar-textarea-border-radius) 0 0}.md .messagebar-attachments-visible textarea{border-top-left-radius:0;border-top-right-radius:0}.md .messagebar-area{margin-top:8px;margin-bottom:8px}.md .messagebar-attachment-delete{right:-6px;top:-6px;width:24px;height:24px;background-color:var(--f7-md-inverse-surface);border-radius:24px;border:2px solid var(--f7-messagebar-textarea-bg-color)}.md .messagebar-attachment-delete:after,.md .messagebar-attachment-delete:before{width:12px;height:2px;background:var(--f7-messagebar-textarea-bg-color);margin-left:-6px;margin-top:-1px}.md .messagebar-sheet-image,.md .messagebar-sheet-item{--f7-touch-ripple-color:transparent;box-sizing:border-box;flex-shrink:0;margin-top:8px;position:relative;overflow:hidden;height:calc((var(--f7-messagebar-sheet-height) - 24px)/ 2);width:calc((var(--f7-messagebar-sheet-height) - 24px)/ 2);border-radius:4px;margin-left:8px}@media (orientation:landscape){.md .messagebar-sheet-image,.md .messagebar-sheet-item{width:calc((var(--f7-messagebar-sheet-landscape-height) - 8px)/ 2);height:calc((var(--f7-messagebar-sheet-landscape-height) - 24px)/ 2)}}.md .messagebar-sheet-image input:checked~img,.md .messagebar-sheet-item input:checked~img{transform:scale(.85)}.md .messagebar-sheet-image input:checked~.icon-checkbox,.md .messagebar-sheet-image input:checked~.icon-radio,.md .messagebar-sheet-item input:checked~.icon-checkbox,.md .messagebar-sheet-item input:checked~.icon-radio{transform:translate(-50%,-50%) scale(1)}.md .messagebar-sheet-image .icon-checkbox,.md .messagebar-sheet-image .icon-radio,.md .messagebar-sheet-item .icon-checkbox,.md .messagebar-sheet-item .icon-radio{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.85);border:none;z-index:1;--f7-checkbox-inactive-color:var(--f7-md-surface);--f7-checkbox-active-color:var(--f7-md-surface)}.md .messagebar-sheet-image .icon-checkbox::after,.md .messagebar-sheet-image .icon-radio::after,.md .messagebar-sheet-item .icon-checkbox::after,.md .messagebar-sheet-item .icon-radio::after{color:var(--f7-md-on-surface);font-size:18px;width:auto;height:100%;line-height:32px;left:0;position:static}
package/components/messages/messages-rtl.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-message-text-header-opacity:0.65;--f7-message-text-header-font-size:12px;--f7-message-text-footer-opacity:0.65;--f7-message-text-footer-font-size:12px;--f7-message-bubble-line-height:1.2;--f7-message-header-font-size:12px;--f7-message-footer-font-size:11px;--f7-message-name-font-size:12px;--f7-message-name-font-weight:inherit;--f7-message-avatar-border-radius:50%;--f7-messages-title-font-weight:inherit;--f7-message-typing-indicator-bg-color:#000}:root .dark,:root.dark{--f7-message-typing-indicator-bg-color:#fff}.ios{--f7-message-text-header-text-color:inherit;--f7-message-text-footer-text-color:inherit;--f7-messages-title-font-size:11px;--f7-message-avatar-size:29px;--f7-message-margin:10px;--f7-message-bubble-min-height:32px;--f7-message-bubble-font-size:17px;--f7-message-bubble-border-radius:16px;--f7-message-bubble-padding-vertical:6px;--f7-message-bubble-padding-horizontal:16px;--f7-message-typing-indicator-opacity:0.35;--f7-message-sent-text-color:#fff;--f7-messages-content-bg-color:#fff;--f7-message-received-text-color:#000;--f7-message-received-bg-color:#e5e5ea;--f7-messages-title-text-color:rgba(0, 0, 0, 0.45);--f7-message-header-text-color:rgba(0, 0, 0, 0.45);--f7-message-footer-text-color:rgba(0, 0, 0, 0.45);--f7-message-name-text-color:rgba(0, 0, 0, 0.45)}.ios .dark,.ios.dark{--f7-message-received-bg-color:#252525;--f7-message-received-text-color:#fff;--f7-messages-content-bg-color:transparent;--f7-messages-title-text-color:rgba(255, 255, 255, 0.54);--f7-message-header-text-color:rgba(255, 255, 255, 0.54);--f7-message-name-text-color:rgba(255, 255, 255, 0.54);--f7-message-footer-text-color:rgba(255, 255, 255, 0.54)}.md{--f7-messages-content-bg-color:transparent;--f7-messages-title-font-size:12px;--f7-message-avatar-size:32px;--f7-message-margin:16px;--f7-message-bubble-min-height:40px;--f7-message-bubble-font-size:16px;--f7-message-bubble-border-radius:20px;--f7-message-bubble-padding-vertical:10px;--f7-message-bubble-padding-horizontal:16px;--f7-message-typing-indicator-opacity:0.6}.md,.md .dark,.md [class*=color-]{--f7-message-sent-bg-color:var(--f7-md-primary);--f7-message-sent-text-color:var(--f7-md-on-primary);--f7-message-received-bg-color:var(--f7-md-surface-variant);--f7-message-received-text-color:var(--f7-md-on-surface);--f7-message-text-header-text-color:var(--f7-md-on-surface-variant);--f7-message-text-footer-text-color:var(--f7-md-on-surface-variant);--f7-messages-title-text-color:var(--f7-md-on-surface-variant);--f7-message-header-text-color:var(--f7-md-on-surface-variant);--f7-message-footer-text-color:var(--f7-md-on-surface-variant);--f7-message-name-text-color:var(--f7-md-on-surface-variant)}.messages,.messages-content{background:var(--f7-messages-content-bg-color)}.messages{display:flex;flex-direction:column;min-height:100%;position:relative;z-index:1}.message,.messages-title{margin-top:var(--f7-message-margin)}.message:last-child,.messages-title:last-child{margin-bottom:var(--f7-message-margin)}.messages-title{text-align:center;width:100%;line-height:1;color:var(--f7-messages-title-text-color);font-size:var(--f7-messages-title-font-size);font-weight:var(--f7-messages-title-font-weight)}.message{max-width:70%;box-sizing:border-box;display:flex;align-items:flex-end;position:relative;z-index:1;transform:translate3d(0,0,0)}.message-avatar{border-radius:var(--f7-message-avatar-border-radius);position:relative;background-size:cover;align-self:flex-end;flex-shrink:0;width:var(--f7-message-avatar-size);height:var(--f7-message-avatar-size)}.message-content{position:relative;display:flex;flex-direction:column}.message-footer,.message-header,.message-name{line-height:1}.message-header{color:var(--f7-message-header-text-color);font-size:var(--f7-message-header-font-size)}.message-footer{color:var(--f7-message-footer-text-color);font-size:var(--f7-message-footer-font-size);margin-bottom:-1em}.message-name{color:var(--f7-message-name-text-color);font-size:var(--f7-message-name-font-size);font-weight:var(--f7-message-name-font-weight)}.message-bubble{box-sizing:border-box;word-break:break-word;display:flex;flex-direction:column;position:relative;line-height:var(--f7-message-bubble-line-height);font-size:var(--f7-message-bubble-font-size);border-radius:var(--f7-message-bubble-border-radius);padding:var(--f7-message-bubble-padding-vertical) var(--f7-message-bubble-padding-horizontal);min-height:var(--f7-message-bubble-min-height)}.message-image img{display:block;max-width:100%;height:auto;width:auto}.message-text-footer,.message-text-header{line-height:1}.message-text-header{color:var(--f7-message-text-header-text-color);opacity:var(--f7-message-text-header-opacity);font-size:var(--f7-message-text-header-font-size)}.message-text-footer{color:var(--f7-message-text-footer-text-color);opacity:var(--f7-message-text-footer-opacity);font-size:var(--f7-message-text-footer-font-size)}.message-text{text-align:left}.message-sent{text-align:right;flex-direction:row;align-self:flex-start}.message-sent .message-bubble{color:var(--f7-message-sent-text-color);background:var(--f7-message-sent-bg-color,var(--f7-theme-color))}.message-sent .message-content{align-items:flex-start}.message-received{flex-direction:row-reverse;align-self:flex-end}.message-received .message-bubble{color:var(--f7-message-received-text-color);background:var(--f7-message-received-bg-color)}.message-received .message-content{align-items:flex-end}.message:not(.message-last) .message-avatar{opacity:0}.message:not(.message-first) .message-name{display:none}.message.message-same-name .message-name{display:none}.message.message-same-header .message-header{display:none}.message.message-same-footer .message-footer{display:none}.message-appear-from-bottom{animation:message-appear-from-bottom .3s}.message-appear-from-top{animation:message-appear-from-top .3s}.message-typing-indicator{display:inline-block;font-size:0;vertical-align:middle}.message-typing-indicator>div{display:inline-block;position:relative;background:var(--f7-message-typing-indicator-bg-color);opacity:var(--f7-message-typing-indicator-opacity);vertical-align:middle;border-radius:50%}@keyframes message-appear-from-bottom{from{transform:translate3d(0,100%,0)}to{transform:translate3d(0,0,0)}}@keyframes message-appear-from-top{from{transform:translate3d(0,-100%,0)}to{transform:translate3d(0,0,0)}}.ios .message-footer b,.ios .message-header b,.ios .message-name b,.ios .messages-title b{font-weight:600}.ios .message-header,.ios .message-name{margin-bottom:3px}.ios .message-footer{margin-top:3px}.ios .message-bubble{min-width:48px}.ios .message-image{margin:var(--f7-message-bubble-padding-vertical) calc(-1 * var(--f7-message-bubble-padding-horizontal))}.ios .message-image:first-child{margin-top:calc(-1 * var(--f7-message-bubble-padding-vertical))}.ios .message-image:first-child img{border-top-left-radius:var(--f7-message-bubble-border-radius);border-top-right-radius:var(--f7-message-bubble-border-radius)}.ios .message-image:last-child{margin-bottom:calc(-1 * var(--f7-message-bubble-padding-vertical))}.ios .message-image:last-child img{border-bottom-left-radius:var(--f7-message-bubble-border-radius);border-bottom-right-radius:var(--f7-message-bubble-border-radius)}.ios .message-text-header{margin-bottom:3px}.ios .message-text-footer{margin-top:3px}.ios .message-received{margin-left:calc(10px + var(--f7-safe-area-left))}.ios .message-received .message-footer,.ios .message-received .message-header,.ios .message-received .message-name{margin-left:var(--f7-message-bubble-padding-horizontal)}.ios .message-received .message-bubble{padding-left:calc(var(--f7-message-bubble-padding-horizontal) + 6px);-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m96 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/></svg>") 50% 42% 46% 56%}.ios .message-received .message-image{margin-left:calc(-1 * (var(--f7-message-bubble-padding-horizontal) + 6px))}.ios .message-received.message-tail .message-bubble{border-radius:var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) 0}.ios .message-received.message-tail:not(.message-typing) .message-bubble{-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m96 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/><path d='m0 70c6-2 12-10 12-19v-16l14 27s-8 8-26 8z'/></svg>") 50% 42% 46% 56%}.ios .message-received.message-tail:not(.message-typing) .message-bubble .message-image:last-child img{border-bottom-left-radius:0px}.ios .message-sent{margin-right:calc(10px + var(--f7-safe-area-right))}.ios .message-sent .message-footer,.ios .message-sent .message-header,.ios .message-sent .message-name{margin-right:var(--f7-message-bubble-padding-horizontal)}.ios .message-sent .message-bubble{padding-right:calc(var(--f7-message-bubble-padding-horizontal) + 6px);-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m84 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/></svg>") 50% 56% 46% 42%}.ios .message-sent .message-image{margin-right:calc(-1 * (var(--f7-message-bubble-padding-horizontal) + 6px))}.ios .message-sent.message-tail .message-bubble{border-radius:var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) 0 var(--f7-message-bubble-border-radius)}.ios .message-sent.message-tail .message-bubble{-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m84 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/><path d='m96 70c-6-2-12-10-12-19v-16l-14 27s8 8 26 8z'/></svg>") 50% 56% 46% 42%}.ios .message-sent.message-tail .message-bubble .message-image:last-child img{border-bottom-right-radius:0px}.ios .message+.message:not(.message-first){margin-top:1px}.ios .message-received.message-typing .message-content:after,.ios .message-received.message-typing .message-content:before{content:'';position:absolute;background:var(--f7-message-received-bg-color);border-radius:50%}.ios .message-received.message-typing .message-content:after{width:11px;height:11px;left:4px;bottom:0px}.ios .message-received.message-typing .message-content:before{width:6px;height:6px;left:-1px;bottom:-4px}.ios .message-typing-indicator>div{width:9px;height:9px}.ios .message-typing-indicator>div+div{margin-right:4px}.ios .message-typing-indicator>div:first-child{animation:ios-message-typing-indicator .9s infinite}.ios .message-typing-indicator>div:nth-child(2){animation:ios-message-typing-indicator .9s 150ms infinite}.ios .message-typing-indicator>div:nth-child(3){animation:ios-message-typing-indicator .9s .3s infinite}@keyframes ios-message-typing-indicator{0%{opacity:.35}25%{opacity:.2}50%{opacity:.2}}.md .message-footer b,.md .message-header b,.md .message-name b,.md .messages-title b{font-weight:500}.md .message-header,.md .message-name{margin-bottom:2px}.md .message-footer{margin-top:2px}.md .message-text-header{margin-bottom:4px}.md .message-text-footer{margin-top:4px}.md .message-image{margin:calc(-1 * var(--f7-message-bubble-padding-vertical)) calc(-1 * var(--f7-message-bubble-padding-horizontal))}.md .message-image,.md .message-image img{border-radius:var(--f7-message-bubble-border-radius)}.md .message-received{margin-left:calc(8px + var(--f7-safe-area-left))}.md .message-received .message-footer,.md .message-received .message-header,.md .message-received .message-name{margin-left:16px}.md .message-received.message-first:not(.message-last) .message-bubble,.md .message-received.message-first:not(.message-last) .message-image,.md .message-received.message-first:not(.message-last) .message-image img{border-bottom-left-radius:4px}.md .message-received.message-last:not(.message-first) .message-bubble,.md .message-received.message-last:not(.message-first) .message-image,.md .message-received.message-last:not(.message-first) .message-image img{border-top-left-radius:4px}.md .message-received:not(.message-last):not(.message-first) .message-bubble,.md .message-received:not(.message-last):not(.message-first) .message-image,.md .message-received:not(.message-last):not(.message-first) .message-image img{border-bottom-left-radius:4px;border-top-left-radius:4px}.md .message-received .message-avatar+.message-content{margin-left:8px}.md .message-sent{margin-right:calc(8px + var(--f7-safe-area-right))}.md .message-sent .message-footer,.md .message-sent .message-header,.md .message-sent .message-name{margin-right:16px}.md .message-sent.message-first:not(.message-last) .message-bubble,.md .message-sent.message-first:not(.message-last) .message-image,.md .message-sent.message-first:not(.message-last) .message-image img{border-bottom-right-radius:4px}.md .message-sent.message-last:not(.message-first) .message-bubble,.md .message-sent.message-last:not(.message-first) .message-image,.md .message-sent.message-last:not(.message-first) .message-image img{border-top-right-radius:4px}.md .message-sent:not(.message-last):not(.message-first) .message-bubble,.md .message-sent:not(.message-last):not(.message-first) .message-image,.md .message-sent:not(.message-last):not(.message-first) .message-image img{border-bottom-right-radius:4px;border-top-right-radius:4px}.md .message-sent .message-avatar+.message-content{margin-right:var(--f7-message-bubble-padding-horizontal)}.md .message+.message:not(.message-first){margin-top:2px}.md .message-typing-indicator>div{width:6px;height:6px}.md .message-typing-indicator>div+div{margin-right:6px}.md .message-typing-indicator>div:first-child{animation:md-message-typing-indicator .9s infinite}.md .message-typing-indicator>div:nth-child(2){animation:md-message-typing-indicator .9s 150ms infinite}.md .message-typing-indicator>div:nth-child(3){animation:md-message-typing-indicator .9s .3s infinite}@keyframes md-message-typing-indicator{0%{transform:translateY(0%)}25%{transform:translateY(-5px)}50%{transform:translateY(0%)}}
1
+ :root{--f7-message-text-header-opacity:0.65;--f7-message-text-header-font-size:12px;--f7-message-text-footer-opacity:0.65;--f7-message-text-footer-font-size:12px;--f7-message-bubble-line-height:1.2;--f7-message-header-font-size:12px;--f7-message-footer-font-size:11px;--f7-message-name-font-size:12px;--f7-message-name-font-weight:inherit;--f7-message-avatar-border-radius:50%;--f7-messages-title-font-weight:inherit;--f7-message-typing-indicator-bg-color:#000}:root .dark,:root.dark{--f7-message-typing-indicator-bg-color:#fff}.ios{--f7-message-text-header-text-color:inherit;--f7-message-text-footer-text-color:inherit;--f7-messages-title-font-size:11px;--f7-message-avatar-size:29px;--f7-message-margin:10px;--f7-message-bubble-min-height:32px;--f7-message-bubble-font-size:17px;--f7-message-bubble-border-radius:16px;--f7-message-bubble-padding-vertical:6px;--f7-message-bubble-padding-horizontal:16px;--f7-message-typing-indicator-opacity:0.35;--f7-message-sent-text-color:#fff;--f7-messages-content-bg-color:#fff;--f7-message-received-text-color:#000;--f7-message-received-bg-color:#e5e5ea;--f7-messages-title-text-color:rgba(0, 0, 0, 0.45);--f7-message-header-text-color:rgba(0, 0, 0, 0.45);--f7-message-footer-text-color:rgba(0, 0, 0, 0.45);--f7-message-name-text-color:rgba(0, 0, 0, 0.45)}.ios .dark,.ios.dark{--f7-message-received-bg-color:#252525;--f7-message-received-text-color:#fff;--f7-messages-content-bg-color:transparent;--f7-messages-title-text-color:rgba(255, 255, 255, 0.54);--f7-message-header-text-color:rgba(255, 255, 255, 0.54);--f7-message-name-text-color:rgba(255, 255, 255, 0.54);--f7-message-footer-text-color:rgba(255, 255, 255, 0.54)}.md{--f7-messages-content-bg-color:transparent;--f7-messages-title-font-size:12px;--f7-message-avatar-size:32px;--f7-message-margin:16px;--f7-message-bubble-min-height:40px;--f7-message-bubble-font-size:16px;--f7-message-bubble-border-radius:20px;--f7-message-bubble-padding-vertical:10px;--f7-message-bubble-padding-horizontal:16px;--f7-message-typing-indicator-opacity:0.6}.md,.md .dark,.md [class*=color-]{--f7-message-sent-bg-color:var(--f7-md-primary);--f7-message-sent-text-color:var(--f7-md-on-primary);--f7-message-received-bg-color:var(--f7-md-surface-2);--f7-message-received-text-color:var(--f7-md-on-surface);--f7-message-text-header-text-color:var(--f7-md-on-surface-2);--f7-message-text-footer-text-color:var(--f7-md-on-surface-2);--f7-messages-title-text-color:var(--f7-md-on-surface-2);--f7-message-header-text-color:var(--f7-md-on-surface-2);--f7-message-footer-text-color:var(--f7-md-on-surface-2);--f7-message-name-text-color:var(--f7-md-on-surface-2)}.messages,.messages-content{background:var(--f7-messages-content-bg-color)}.messages{display:flex;flex-direction:column;min-height:100%;position:relative;z-index:1}.message,.messages-title{margin-top:var(--f7-message-margin)}.message:last-child,.messages-title:last-child{margin-bottom:var(--f7-message-margin)}.messages-title{text-align:center;width:100%;line-height:1;color:var(--f7-messages-title-text-color);font-size:var(--f7-messages-title-font-size);font-weight:var(--f7-messages-title-font-weight)}.message{max-width:70%;box-sizing:border-box;display:flex;align-items:flex-end;position:relative;z-index:1;transform:translate3d(0,0,0)}.message-avatar{border-radius:var(--f7-message-avatar-border-radius);position:relative;background-size:cover;align-self:flex-end;flex-shrink:0;width:var(--f7-message-avatar-size);height:var(--f7-message-avatar-size)}.message-content{position:relative;display:flex;flex-direction:column}.message-footer,.message-header,.message-name{line-height:1}.message-header{color:var(--f7-message-header-text-color);font-size:var(--f7-message-header-font-size)}.message-footer{color:var(--f7-message-footer-text-color);font-size:var(--f7-message-footer-font-size);margin-bottom:-1em}.message-name{color:var(--f7-message-name-text-color);font-size:var(--f7-message-name-font-size);font-weight:var(--f7-message-name-font-weight)}.message-bubble{box-sizing:border-box;word-break:break-word;display:flex;flex-direction:column;position:relative;line-height:var(--f7-message-bubble-line-height);font-size:var(--f7-message-bubble-font-size);border-radius:var(--f7-message-bubble-border-radius);padding:var(--f7-message-bubble-padding-vertical) var(--f7-message-bubble-padding-horizontal);min-height:var(--f7-message-bubble-min-height)}.message-image img{display:block;max-width:100%;height:auto;width:auto}.message-text-footer,.message-text-header{line-height:1}.message-text-header{color:var(--f7-message-text-header-text-color);opacity:var(--f7-message-text-header-opacity);font-size:var(--f7-message-text-header-font-size)}.message-text-footer{color:var(--f7-message-text-footer-text-color);opacity:var(--f7-message-text-footer-opacity);font-size:var(--f7-message-text-footer-font-size)}.message-text{text-align:left}.message-sent{text-align:right;flex-direction:row;align-self:flex-start}.message-sent .message-bubble{color:var(--f7-message-sent-text-color);background:var(--f7-message-sent-bg-color,var(--f7-theme-color))}.message-sent .message-content{align-items:flex-start}.message-received{flex-direction:row-reverse;align-self:flex-end}.message-received .message-bubble{color:var(--f7-message-received-text-color);background:var(--f7-message-received-bg-color)}.message-received .message-content{align-items:flex-end}.message:not(.message-last) .message-avatar{opacity:0}.message:not(.message-first) .message-name{display:none}.message.message-same-name .message-name{display:none}.message.message-same-header .message-header{display:none}.message.message-same-footer .message-footer{display:none}.message-appear-from-bottom{animation:message-appear-from-bottom .3s}.message-appear-from-top{animation:message-appear-from-top .3s}.message-typing-indicator{display:inline-block;font-size:0;vertical-align:middle}.message-typing-indicator>div{display:inline-block;position:relative;background:var(--f7-message-typing-indicator-bg-color);opacity:var(--f7-message-typing-indicator-opacity);vertical-align:middle;border-radius:50%}@keyframes message-appear-from-bottom{from{transform:translate3d(0,100%,0)}to{transform:translate3d(0,0,0)}}@keyframes message-appear-from-top{from{transform:translate3d(0,-100%,0)}to{transform:translate3d(0,0,0)}}.ios .message-footer b,.ios .message-header b,.ios .message-name b,.ios .messages-title b{font-weight:600}.ios .message-header,.ios .message-name{margin-bottom:3px}.ios .message-footer{margin-top:3px}.ios .message-bubble{min-width:48px}.ios .message-image{margin:var(--f7-message-bubble-padding-vertical) calc(-1 * var(--f7-message-bubble-padding-horizontal))}.ios .message-image:first-child{margin-top:calc(-1 * var(--f7-message-bubble-padding-vertical))}.ios .message-image:first-child img{border-top-left-radius:var(--f7-message-bubble-border-radius);border-top-right-radius:var(--f7-message-bubble-border-radius)}.ios .message-image:last-child{margin-bottom:calc(-1 * var(--f7-message-bubble-padding-vertical))}.ios .message-image:last-child img{border-bottom-left-radius:var(--f7-message-bubble-border-radius);border-bottom-right-radius:var(--f7-message-bubble-border-radius)}.ios .message-text-header{margin-bottom:3px}.ios .message-text-footer{margin-top:3px}.ios .message-received{margin-left:calc(10px + var(--f7-safe-area-left))}.ios .message-received .message-footer,.ios .message-received .message-header,.ios .message-received .message-name{margin-left:var(--f7-message-bubble-padding-horizontal)}.ios .message-received .message-bubble{padding-left:calc(var(--f7-message-bubble-padding-horizontal) + 6px);-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m96 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/></svg>") 50% 42% 46% 56%}.ios .message-received .message-image{margin-left:calc(-1 * (var(--f7-message-bubble-padding-horizontal) + 6px))}.ios .message-received.message-tail .message-bubble{border-radius:var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) 0}.ios .message-received.message-tail:not(.message-typing) .message-bubble{-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m96 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/><path d='m0 70c6-2 12-10 12-19v-16l14 27s-8 8-26 8z'/></svg>") 50% 42% 46% 56%}.ios .message-received.message-tail:not(.message-typing) .message-bubble .message-image:last-child img{border-bottom-left-radius:0px}.ios .message-sent{margin-right:calc(10px + var(--f7-safe-area-right))}.ios .message-sent .message-footer,.ios .message-sent .message-header,.ios .message-sent .message-name{margin-right:var(--f7-message-bubble-padding-horizontal)}.ios .message-sent .message-bubble{padding-right:calc(var(--f7-message-bubble-padding-horizontal) + 6px);-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m84 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/></svg>") 50% 56% 46% 42%}.ios .message-sent .message-image{margin-right:calc(-1 * (var(--f7-message-bubble-padding-horizontal) + 6px))}.ios .message-sent.message-tail .message-bubble{border-radius:var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) 0 var(--f7-message-bubble-border-radius)}.ios .message-sent.message-tail .message-bubble{-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m84 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/><path d='m96 70c-6-2-12-10-12-19v-16l-14 27s8 8 26 8z'/></svg>") 50% 56% 46% 42%}.ios .message-sent.message-tail .message-bubble .message-image:last-child img{border-bottom-right-radius:0px}.ios .message+.message:not(.message-first){margin-top:1px}.ios .message-received.message-typing .message-content:after,.ios .message-received.message-typing .message-content:before{content:'';position:absolute;background:var(--f7-message-received-bg-color);border-radius:50%}.ios .message-received.message-typing .message-content:after{width:11px;height:11px;left:4px;bottom:0px}.ios .message-received.message-typing .message-content:before{width:6px;height:6px;left:-1px;bottom:-4px}.ios .message-typing-indicator>div{width:9px;height:9px}.ios .message-typing-indicator>div+div{margin-right:4px}.ios .message-typing-indicator>div:first-child{animation:ios-message-typing-indicator .9s infinite}.ios .message-typing-indicator>div:nth-child(2){animation:ios-message-typing-indicator .9s 150ms infinite}.ios .message-typing-indicator>div:nth-child(3){animation:ios-message-typing-indicator .9s .3s infinite}@keyframes ios-message-typing-indicator{0%{opacity:.35}25%{opacity:.2}50%{opacity:.2}}.md .message-footer b,.md .message-header b,.md .message-name b,.md .messages-title b{font-weight:500}.md .message-header,.md .message-name{margin-bottom:2px}.md .message-footer{margin-top:2px}.md .message-text-header{margin-bottom:4px}.md .message-text-footer{margin-top:4px}.md .message-image{margin:calc(-1 * var(--f7-message-bubble-padding-vertical)) calc(-1 * var(--f7-message-bubble-padding-horizontal))}.md .message-image,.md .message-image img{border-radius:var(--f7-message-bubble-border-radius)}.md .message-received{margin-left:calc(8px + var(--f7-safe-area-left))}.md .message-received .message-footer,.md .message-received .message-header,.md .message-received .message-name{margin-left:16px}.md .message-received.message-first:not(.message-last) .message-bubble,.md .message-received.message-first:not(.message-last) .message-image,.md .message-received.message-first:not(.message-last) .message-image img{border-bottom-left-radius:4px}.md .message-received.message-last:not(.message-first) .message-bubble,.md .message-received.message-last:not(.message-first) .message-image,.md .message-received.message-last:not(.message-first) .message-image img{border-top-left-radius:4px}.md .message-received:not(.message-last):not(.message-first) .message-bubble,.md .message-received:not(.message-last):not(.message-first) .message-image,.md .message-received:not(.message-last):not(.message-first) .message-image img{border-bottom-left-radius:4px;border-top-left-radius:4px}.md .message-received .message-avatar+.message-content{margin-left:8px}.md .message-sent{margin-right:calc(8px + var(--f7-safe-area-right))}.md .message-sent .message-footer,.md .message-sent .message-header,.md .message-sent .message-name{margin-right:16px}.md .message-sent.message-first:not(.message-last) .message-bubble,.md .message-sent.message-first:not(.message-last) .message-image,.md .message-sent.message-first:not(.message-last) .message-image img{border-bottom-right-radius:4px}.md .message-sent.message-last:not(.message-first) .message-bubble,.md .message-sent.message-last:not(.message-first) .message-image,.md .message-sent.message-last:not(.message-first) .message-image img{border-top-right-radius:4px}.md .message-sent:not(.message-last):not(.message-first) .message-bubble,.md .message-sent:not(.message-last):not(.message-first) .message-image,.md .message-sent:not(.message-last):not(.message-first) .message-image img{border-bottom-right-radius:4px;border-top-right-radius:4px}.md .message-sent .message-avatar+.message-content{margin-right:var(--f7-message-bubble-padding-horizontal)}.md .message+.message:not(.message-first){margin-top:2px}.md .message-typing-indicator>div{width:6px;height:6px}.md .message-typing-indicator>div+div{margin-right:6px}.md .message-typing-indicator>div:first-child{animation:md-message-typing-indicator .9s infinite}.md .message-typing-indicator>div:nth-child(2){animation:md-message-typing-indicator .9s 150ms infinite}.md .message-typing-indicator>div:nth-child(3){animation:md-message-typing-indicator .9s .3s infinite}@keyframes md-message-typing-indicator{0%{transform:translateY(0%)}25%{transform:translateY(-5px)}50%{transform:translateY(0%)}}
package/components/messages/messages-vars.less CHANGED
@@ -71,12 +71,12 @@
71
71
  .md-color-vars({
72
72
  --f7-message-sent-bg-color: var(--f7-md-primary);
73
73
  --f7-message-sent-text-color: var(--f7-md-on-primary);
74
- --f7-message-received-bg-color: var(--f7-md-surface-variant);
74
+ --f7-message-received-bg-color: var(--f7-md-surface-2);
75
75
  --f7-message-received-text-color: var(--f7-md-on-surface);
76
- --f7-message-text-header-text-color: var(--f7-md-on-surface-variant);
77
- --f7-message-text-footer-text-color: var(--f7-md-on-surface-variant);
78
- --f7-messages-title-text-color: var(--f7-md-on-surface-variant);
79
- --f7-message-header-text-color: var(--f7-md-on-surface-variant);
80
- --f7-message-footer-text-color: var(--f7-md-on-surface-variant);
81
- --f7-message-name-text-color: var(--f7-md-on-surface-variant);
76
+ --f7-message-text-header-text-color: var(--f7-md-on-surface-2);
77
+ --f7-message-text-footer-text-color: var(--f7-md-on-surface-2);
78
+ --f7-messages-title-text-color: var(--f7-md-on-surface-2);
79
+ --f7-message-header-text-color: var(--f7-md-on-surface-2);
80
+ --f7-message-footer-text-color: var(--f7-md-on-surface-2);
81
+ --f7-message-name-text-color: var(--f7-md-on-surface-2);
82
82
  });
package/components/messages/messages.css CHANGED
@@ -1 +1 @@
1
- :root{--f7-message-text-header-opacity:0.65;--f7-message-text-header-font-size:12px;--f7-message-text-footer-opacity:0.65;--f7-message-text-footer-font-size:12px;--f7-message-bubble-line-height:1.2;--f7-message-header-font-size:12px;--f7-message-footer-font-size:11px;--f7-message-name-font-size:12px;--f7-message-name-font-weight:inherit;--f7-message-avatar-border-radius:50%;--f7-messages-title-font-weight:inherit;--f7-message-typing-indicator-bg-color:#000}:root .dark,:root.dark{--f7-message-typing-indicator-bg-color:#fff}.ios{--f7-message-text-header-text-color:inherit;--f7-message-text-footer-text-color:inherit;--f7-messages-title-font-size:11px;--f7-message-avatar-size:29px;--f7-message-margin:10px;--f7-message-bubble-min-height:32px;--f7-message-bubble-font-size:17px;--f7-message-bubble-border-radius:16px;--f7-message-bubble-padding-vertical:6px;--f7-message-bubble-padding-horizontal:16px;--f7-message-typing-indicator-opacity:0.35;--f7-message-sent-text-color:#fff;--f7-messages-content-bg-color:#fff;--f7-message-received-text-color:#000;--f7-message-received-bg-color:#e5e5ea;--f7-messages-title-text-color:rgba(0, 0, 0, 0.45);--f7-message-header-text-color:rgba(0, 0, 0, 0.45);--f7-message-footer-text-color:rgba(0, 0, 0, 0.45);--f7-message-name-text-color:rgba(0, 0, 0, 0.45)}.ios .dark,.ios.dark{--f7-message-received-bg-color:#252525;--f7-message-received-text-color:#fff;--f7-messages-content-bg-color:transparent;--f7-messages-title-text-color:rgba(255, 255, 255, 0.54);--f7-message-header-text-color:rgba(255, 255, 255, 0.54);--f7-message-name-text-color:rgba(255, 255, 255, 0.54);--f7-message-footer-text-color:rgba(255, 255, 255, 0.54)}.md{--f7-messages-content-bg-color:transparent;--f7-messages-title-font-size:12px;--f7-message-avatar-size:32px;--f7-message-margin:16px;--f7-message-bubble-min-height:40px;--f7-message-bubble-font-size:16px;--f7-message-bubble-border-radius:20px;--f7-message-bubble-padding-vertical:10px;--f7-message-bubble-padding-horizontal:16px;--f7-message-typing-indicator-opacity:0.6}.md,.md .dark,.md [class*=color-]{--f7-message-sent-bg-color:var(--f7-md-primary);--f7-message-sent-text-color:var(--f7-md-on-primary);--f7-message-received-bg-color:var(--f7-md-surface-variant);--f7-message-received-text-color:var(--f7-md-on-surface);--f7-message-text-header-text-color:var(--f7-md-on-surface-variant);--f7-message-text-footer-text-color:var(--f7-md-on-surface-variant);--f7-messages-title-text-color:var(--f7-md-on-surface-variant);--f7-message-header-text-color:var(--f7-md-on-surface-variant);--f7-message-footer-text-color:var(--f7-md-on-surface-variant);--f7-message-name-text-color:var(--f7-md-on-surface-variant)}.messages,.messages-content{background:var(--f7-messages-content-bg-color)}.messages{display:flex;flex-direction:column;min-height:100%;position:relative;z-index:1}.message,.messages-title{margin-top:var(--f7-message-margin)}.message:last-child,.messages-title:last-child{margin-bottom:var(--f7-message-margin)}.messages-title{text-align:center;width:100%;line-height:1;color:var(--f7-messages-title-text-color);font-size:var(--f7-messages-title-font-size);font-weight:var(--f7-messages-title-font-weight)}.message{max-width:70%;box-sizing:border-box;display:flex;align-items:flex-end;position:relative;z-index:1;transform:translate3d(0,0,0)}.message-avatar{border-radius:var(--f7-message-avatar-border-radius);position:relative;background-size:cover;align-self:flex-end;flex-shrink:0;width:var(--f7-message-avatar-size);height:var(--f7-message-avatar-size)}.message-content{position:relative;display:flex;flex-direction:column}.message-footer,.message-header,.message-name{line-height:1}.message-header{color:var(--f7-message-header-text-color);font-size:var(--f7-message-header-font-size)}.message-footer{color:var(--f7-message-footer-text-color);font-size:var(--f7-message-footer-font-size);margin-bottom:-1em}.message-name{color:var(--f7-message-name-text-color);font-size:var(--f7-message-name-font-size);font-weight:var(--f7-message-name-font-weight)}.message-bubble{box-sizing:border-box;word-break:break-word;display:flex;flex-direction:column;position:relative;line-height:var(--f7-message-bubble-line-height);font-size:var(--f7-message-bubble-font-size);border-radius:var(--f7-message-bubble-border-radius);padding:var(--f7-message-bubble-padding-vertical) var(--f7-message-bubble-padding-horizontal);min-height:var(--f7-message-bubble-min-height)}.message-image img{display:block;max-width:100%;height:auto;width:auto}.message-text-footer,.message-text-header{line-height:1}.message-text-header{color:var(--f7-message-text-header-text-color);opacity:var(--f7-message-text-header-opacity);font-size:var(--f7-message-text-header-font-size)}.message-text-footer{color:var(--f7-message-text-footer-text-color);opacity:var(--f7-message-text-footer-opacity);font-size:var(--f7-message-text-footer-font-size)}.message-text{text-align:left}.message-sent{text-align:right;flex-direction:row-reverse;align-self:flex-end}.message-sent .message-bubble{color:var(--f7-message-sent-text-color);background:var(--f7-message-sent-bg-color,var(--f7-theme-color))}.message-sent .message-content{align-items:flex-end}.message-received{flex-direction:row}.message-received .message-bubble{color:var(--f7-message-received-text-color);background:var(--f7-message-received-bg-color)}.message-received .message-content{align-items:flex-start}.message:not(.message-last) .message-avatar{opacity:0}.message:not(.message-first) .message-name{display:none}.message.message-same-name .message-name{display:none}.message.message-same-header .message-header{display:none}.message.message-same-footer .message-footer{display:none}.message-appear-from-bottom{animation:message-appear-from-bottom .3s}.message-appear-from-top{animation:message-appear-from-top .3s}.message-typing-indicator{display:inline-block;font-size:0;vertical-align:middle}.message-typing-indicator>div{display:inline-block;position:relative;background:var(--f7-message-typing-indicator-bg-color);opacity:var(--f7-message-typing-indicator-opacity);vertical-align:middle;border-radius:50%}@keyframes message-appear-from-bottom{from{transform:translate3d(0,100%,0)}to{transform:translate3d(0,0,0)}}@keyframes message-appear-from-top{from{transform:translate3d(0,-100%,0)}to{transform:translate3d(0,0,0)}}.ios .message-footer b,.ios .message-header b,.ios .message-name b,.ios .messages-title b{font-weight:600}.ios .message-header,.ios .message-name{margin-bottom:3px}.ios .message-footer{margin-top:3px}.ios .message-bubble{min-width:48px}.ios .message-image{margin:var(--f7-message-bubble-padding-vertical) calc(-1 * var(--f7-message-bubble-padding-horizontal))}.ios .message-image:first-child{margin-top:calc(-1 * var(--f7-message-bubble-padding-vertical))}.ios .message-image:first-child img{border-top-left-radius:var(--f7-message-bubble-border-radius);border-top-right-radius:var(--f7-message-bubble-border-radius)}.ios .message-image:last-child{margin-bottom:calc(-1 * var(--f7-message-bubble-padding-vertical))}.ios .message-image:last-child img{border-bottom-left-radius:var(--f7-message-bubble-border-radius);border-bottom-right-radius:var(--f7-message-bubble-border-radius)}.ios .message-text-header{margin-bottom:3px}.ios .message-text-footer{margin-top:3px}.ios .message-received{margin-left:calc(10px + var(--f7-safe-area-left))}.ios .message-received .message-footer,.ios .message-received .message-header,.ios .message-received .message-name{margin-left:var(--f7-message-bubble-padding-horizontal)}.ios .message-received .message-bubble{padding-left:calc(var(--f7-message-bubble-padding-horizontal) + 6px);-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m96 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/></svg>") 50% 42% 46% 56%}.ios .message-received .message-image{margin-left:calc(-1 * (var(--f7-message-bubble-padding-horizontal) + 6px))}.ios .message-received.message-tail .message-bubble{border-radius:var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) 0}.ios .message-received.message-tail:not(.message-typing) .message-bubble{-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m96 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/><path d='m0 70c6-2 12-10 12-19v-16l14 27s-8 8-26 8z'/></svg>") 50% 42% 46% 56%}.ios .message-received.message-tail:not(.message-typing) .message-bubble .message-image:last-child img{border-bottom-left-radius:0px}.ios .message-sent{margin-right:calc(10px + var(--f7-safe-area-right))}.ios .message-sent .message-footer,.ios .message-sent .message-header,.ios .message-sent .message-name{margin-right:var(--f7-message-bubble-padding-horizontal)}.ios .message-sent .message-bubble{padding-right:calc(var(--f7-message-bubble-padding-horizontal) + 6px);-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m84 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/></svg>") 50% 56% 46% 42%}.ios .message-sent .message-image{margin-right:calc(-1 * (var(--f7-message-bubble-padding-horizontal) + 6px))}.ios .message-sent.message-tail .message-bubble{border-radius:var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) 0 var(--f7-message-bubble-border-radius)}.ios .message-sent.message-tail .message-bubble{-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m84 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/><path d='m96 70c-6-2-12-10-12-19v-16l-14 27s8 8 26 8z'/></svg>") 50% 56% 46% 42%}.ios .message-sent.message-tail .message-bubble .message-image:last-child img{border-bottom-right-radius:0px}.ios .message+.message:not(.message-first){margin-top:1px}.ios .message-received.message-typing .message-content:after,.ios .message-received.message-typing .message-content:before{content:'';position:absolute;background:var(--f7-message-received-bg-color);border-radius:50%}.ios .message-received.message-typing .message-content:after{width:11px;height:11px;left:4px;bottom:0px}.ios .message-received.message-typing .message-content:before{width:6px;height:6px;left:-1px;bottom:-4px}.ios .message-typing-indicator>div{width:9px;height:9px}.ios .message-typing-indicator>div+div{margin-left:4px}.ios .message-typing-indicator>div:first-child{animation:ios-message-typing-indicator .9s infinite}.ios .message-typing-indicator>div:nth-child(2){animation:ios-message-typing-indicator .9s 150ms infinite}.ios .message-typing-indicator>div:nth-child(3){animation:ios-message-typing-indicator .9s .3s infinite}@keyframes ios-message-typing-indicator{0%{opacity:.35}25%{opacity:.2}50%{opacity:.2}}.md .message-footer b,.md .message-header b,.md .message-name b,.md .messages-title b{font-weight:500}.md .message-header,.md .message-name{margin-bottom:2px}.md .message-footer{margin-top:2px}.md .message-text-header{margin-bottom:4px}.md .message-text-footer{margin-top:4px}.md .message-image{margin:calc(-1 * var(--f7-message-bubble-padding-vertical)) calc(-1 * var(--f7-message-bubble-padding-horizontal))}.md .message-image,.md .message-image img{border-radius:var(--f7-message-bubble-border-radius)}.md .message-received{margin-left:calc(8px + var(--f7-safe-area-left))}.md .message-received .message-footer,.md .message-received .message-header,.md .message-received .message-name{margin-left:16px}.md .message-received.message-first:not(.message-last) .message-bubble,.md .message-received.message-first:not(.message-last) .message-image,.md .message-received.message-first:not(.message-last) .message-image img{border-bottom-left-radius:4px}.md .message-received.message-last:not(.message-first) .message-bubble,.md .message-received.message-last:not(.message-first) .message-image,.md .message-received.message-last:not(.message-first) .message-image img{border-top-left-radius:4px}.md .message-received:not(.message-last):not(.message-first) .message-bubble,.md .message-received:not(.message-last):not(.message-first) .message-image,.md .message-received:not(.message-last):not(.message-first) .message-image img{border-bottom-left-radius:4px;border-top-left-radius:4px}.md .message-received .message-avatar+.message-content{margin-left:8px}.md .message-sent{margin-right:calc(8px + var(--f7-safe-area-right))}.md .message-sent .message-footer,.md .message-sent .message-header,.md .message-sent .message-name{margin-right:16px}.md .message-sent.message-first:not(.message-last) .message-bubble,.md .message-sent.message-first:not(.message-last) .message-image,.md .message-sent.message-first:not(.message-last) .message-image img{border-bottom-right-radius:4px}.md .message-sent.message-last:not(.message-first) .message-bubble,.md .message-sent.message-last:not(.message-first) .message-image,.md .message-sent.message-last:not(.message-first) .message-image img{border-top-right-radius:4px}.md .message-sent:not(.message-last):not(.message-first) .message-bubble,.md .message-sent:not(.message-last):not(.message-first) .message-image,.md .message-sent:not(.message-last):not(.message-first) .message-image img{border-bottom-right-radius:4px;border-top-right-radius:4px}.md .message-sent .message-avatar+.message-content{margin-right:var(--f7-message-bubble-padding-horizontal)}.md .message+.message:not(.message-first){margin-top:2px}.md .message-typing-indicator>div{width:6px;height:6px}.md .message-typing-indicator>div+div{margin-left:6px}.md .message-typing-indicator>div:first-child{animation:md-message-typing-indicator .9s infinite}.md .message-typing-indicator>div:nth-child(2){animation:md-message-typing-indicator .9s 150ms infinite}.md .message-typing-indicator>div:nth-child(3){animation:md-message-typing-indicator .9s .3s infinite}@keyframes md-message-typing-indicator{0%{transform:translateY(0%)}25%{transform:translateY(-5px)}50%{transform:translateY(0%)}}
1
+ :root{--f7-message-text-header-opacity:0.65;--f7-message-text-header-font-size:12px;--f7-message-text-footer-opacity:0.65;--f7-message-text-footer-font-size:12px;--f7-message-bubble-line-height:1.2;--f7-message-header-font-size:12px;--f7-message-footer-font-size:11px;--f7-message-name-font-size:12px;--f7-message-name-font-weight:inherit;--f7-message-avatar-border-radius:50%;--f7-messages-title-font-weight:inherit;--f7-message-typing-indicator-bg-color:#000}:root .dark,:root.dark{--f7-message-typing-indicator-bg-color:#fff}.ios{--f7-message-text-header-text-color:inherit;--f7-message-text-footer-text-color:inherit;--f7-messages-title-font-size:11px;--f7-message-avatar-size:29px;--f7-message-margin:10px;--f7-message-bubble-min-height:32px;--f7-message-bubble-font-size:17px;--f7-message-bubble-border-radius:16px;--f7-message-bubble-padding-vertical:6px;--f7-message-bubble-padding-horizontal:16px;--f7-message-typing-indicator-opacity:0.35;--f7-message-sent-text-color:#fff;--f7-messages-content-bg-color:#fff;--f7-message-received-text-color:#000;--f7-message-received-bg-color:#e5e5ea;--f7-messages-title-text-color:rgba(0, 0, 0, 0.45);--f7-message-header-text-color:rgba(0, 0, 0, 0.45);--f7-message-footer-text-color:rgba(0, 0, 0, 0.45);--f7-message-name-text-color:rgba(0, 0, 0, 0.45)}.ios .dark,.ios.dark{--f7-message-received-bg-color:#252525;--f7-message-received-text-color:#fff;--f7-messages-content-bg-color:transparent;--f7-messages-title-text-color:rgba(255, 255, 255, 0.54);--f7-message-header-text-color:rgba(255, 255, 255, 0.54);--f7-message-name-text-color:rgba(255, 255, 255, 0.54);--f7-message-footer-text-color:rgba(255, 255, 255, 0.54)}.md{--f7-messages-content-bg-color:transparent;--f7-messages-title-font-size:12px;--f7-message-avatar-size:32px;--f7-message-margin:16px;--f7-message-bubble-min-height:40px;--f7-message-bubble-font-size:16px;--f7-message-bubble-border-radius:20px;--f7-message-bubble-padding-vertical:10px;--f7-message-bubble-padding-horizontal:16px;--f7-message-typing-indicator-opacity:0.6}.md,.md .dark,.md [class*=color-]{--f7-message-sent-bg-color:var(--f7-md-primary);--f7-message-sent-text-color:var(--f7-md-on-primary);--f7-message-received-bg-color:var(--f7-md-surface-2);--f7-message-received-text-color:var(--f7-md-on-surface);--f7-message-text-header-text-color:var(--f7-md-on-surface-2);--f7-message-text-footer-text-color:var(--f7-md-on-surface-2);--f7-messages-title-text-color:var(--f7-md-on-surface-2);--f7-message-header-text-color:var(--f7-md-on-surface-2);--f7-message-footer-text-color:var(--f7-md-on-surface-2);--f7-message-name-text-color:var(--f7-md-on-surface-2)}.messages,.messages-content{background:var(--f7-messages-content-bg-color)}.messages{display:flex;flex-direction:column;min-height:100%;position:relative;z-index:1}.message,.messages-title{margin-top:var(--f7-message-margin)}.message:last-child,.messages-title:last-child{margin-bottom:var(--f7-message-margin)}.messages-title{text-align:center;width:100%;line-height:1;color:var(--f7-messages-title-text-color);font-size:var(--f7-messages-title-font-size);font-weight:var(--f7-messages-title-font-weight)}.message{max-width:70%;box-sizing:border-box;display:flex;align-items:flex-end;position:relative;z-index:1;transform:translate3d(0,0,0)}.message-avatar{border-radius:var(--f7-message-avatar-border-radius);position:relative;background-size:cover;align-self:flex-end;flex-shrink:0;width:var(--f7-message-avatar-size);height:var(--f7-message-avatar-size)}.message-content{position:relative;display:flex;flex-direction:column}.message-footer,.message-header,.message-name{line-height:1}.message-header{color:var(--f7-message-header-text-color);font-size:var(--f7-message-header-font-size)}.message-footer{color:var(--f7-message-footer-text-color);font-size:var(--f7-message-footer-font-size);margin-bottom:-1em}.message-name{color:var(--f7-message-name-text-color);font-size:var(--f7-message-name-font-size);font-weight:var(--f7-message-name-font-weight)}.message-bubble{box-sizing:border-box;word-break:break-word;display:flex;flex-direction:column;position:relative;line-height:var(--f7-message-bubble-line-height);font-size:var(--f7-message-bubble-font-size);border-radius:var(--f7-message-bubble-border-radius);padding:var(--f7-message-bubble-padding-vertical) var(--f7-message-bubble-padding-horizontal);min-height:var(--f7-message-bubble-min-height)}.message-image img{display:block;max-width:100%;height:auto;width:auto}.message-text-footer,.message-text-header{line-height:1}.message-text-header{color:var(--f7-message-text-header-text-color);opacity:var(--f7-message-text-header-opacity);font-size:var(--f7-message-text-header-font-size)}.message-text-footer{color:var(--f7-message-text-footer-text-color);opacity:var(--f7-message-text-footer-opacity);font-size:var(--f7-message-text-footer-font-size)}.message-text{text-align:left}.message-sent{text-align:right;flex-direction:row-reverse;align-self:flex-end}.message-sent .message-bubble{color:var(--f7-message-sent-text-color);background:var(--f7-message-sent-bg-color,var(--f7-theme-color))}.message-sent .message-content{align-items:flex-end}.message-received{flex-direction:row}.message-received .message-bubble{color:var(--f7-message-received-text-color);background:var(--f7-message-received-bg-color)}.message-received .message-content{align-items:flex-start}.message:not(.message-last) .message-avatar{opacity:0}.message:not(.message-first) .message-name{display:none}.message.message-same-name .message-name{display:none}.message.message-same-header .message-header{display:none}.message.message-same-footer .message-footer{display:none}.message-appear-from-bottom{animation:message-appear-from-bottom .3s}.message-appear-from-top{animation:message-appear-from-top .3s}.message-typing-indicator{display:inline-block;font-size:0;vertical-align:middle}.message-typing-indicator>div{display:inline-block;position:relative;background:var(--f7-message-typing-indicator-bg-color);opacity:var(--f7-message-typing-indicator-opacity);vertical-align:middle;border-radius:50%}@keyframes message-appear-from-bottom{from{transform:translate3d(0,100%,0)}to{transform:translate3d(0,0,0)}}@keyframes message-appear-from-top{from{transform:translate3d(0,-100%,0)}to{transform:translate3d(0,0,0)}}.ios .message-footer b,.ios .message-header b,.ios .message-name b,.ios .messages-title b{font-weight:600}.ios .message-header,.ios .message-name{margin-bottom:3px}.ios .message-footer{margin-top:3px}.ios .message-bubble{min-width:48px}.ios .message-image{margin:var(--f7-message-bubble-padding-vertical) calc(-1 * var(--f7-message-bubble-padding-horizontal))}.ios .message-image:first-child{margin-top:calc(-1 * var(--f7-message-bubble-padding-vertical))}.ios .message-image:first-child img{border-top-left-radius:var(--f7-message-bubble-border-radius);border-top-right-radius:var(--f7-message-bubble-border-radius)}.ios .message-image:last-child{margin-bottom:calc(-1 * var(--f7-message-bubble-padding-vertical))}.ios .message-image:last-child img{border-bottom-left-radius:var(--f7-message-bubble-border-radius);border-bottom-right-radius:var(--f7-message-bubble-border-radius)}.ios .message-text-header{margin-bottom:3px}.ios .message-text-footer{margin-top:3px}.ios .message-received{margin-left:calc(10px + var(--f7-safe-area-left))}.ios .message-received .message-footer,.ios .message-received .message-header,.ios .message-received .message-name{margin-left:var(--f7-message-bubble-padding-horizontal)}.ios .message-received .message-bubble{padding-left:calc(var(--f7-message-bubble-padding-horizontal) + 6px);-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m96 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/></svg>") 50% 42% 46% 56%}.ios .message-received .message-image{margin-left:calc(-1 * (var(--f7-message-bubble-padding-horizontal) + 6px))}.ios .message-received.message-tail .message-bubble{border-radius:var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) 0}.ios .message-received.message-tail:not(.message-typing) .message-bubble{-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m96 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/><path d='m0 70c6-2 12-10 12-19v-16l14 27s-8 8-26 8z'/></svg>") 50% 42% 46% 56%}.ios .message-received.message-tail:not(.message-typing) .message-bubble .message-image:last-child img{border-bottom-left-radius:0px}.ios .message-sent{margin-right:calc(10px + var(--f7-safe-area-right))}.ios .message-sent .message-footer,.ios .message-sent .message-header,.ios .message-sent .message-name{margin-right:var(--f7-message-bubble-padding-horizontal)}.ios .message-sent .message-bubble{padding-right:calc(var(--f7-message-bubble-padding-horizontal) + 6px);-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m84 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/></svg>") 50% 56% 46% 42%}.ios .message-sent .message-image{margin-right:calc(-1 * (var(--f7-message-bubble-padding-horizontal) + 6px))}.ios .message-sent.message-tail .message-bubble{border-radius:var(--f7-message-bubble-border-radius) var(--f7-message-bubble-border-radius) 0 var(--f7-message-bubble-border-radius)}.ios .message-sent.message-tail .message-bubble{-webkit-mask-box-image:url("data:image/svg+xml;charset=utf-8,<svg height='35' viewBox='0 0 96 70' width='48' xmlns='http://www.w3.org/2000/svg'><path d='m84 35c1 7-5 37-42 35-37 2-43-28-42-35-1-7 5-37 42-35 37-2 43 28 42 35z'/><path d='m96 70c-6-2-12-10-12-19v-16l-14 27s8 8 26 8z'/></svg>") 50% 56% 46% 42%}.ios .message-sent.message-tail .message-bubble .message-image:last-child img{border-bottom-right-radius:0px}.ios .message+.message:not(.message-first){margin-top:1px}.ios .message-received.message-typing .message-content:after,.ios .message-received.message-typing .message-content:before{content:'';position:absolute;background:var(--f7-message-received-bg-color);border-radius:50%}.ios .message-received.message-typing .message-content:after{width:11px;height:11px;left:4px;bottom:0px}.ios .message-received.message-typing .message-content:before{width:6px;height:6px;left:-1px;bottom:-4px}.ios .message-typing-indicator>div{width:9px;height:9px}.ios .message-typing-indicator>div+div{margin-left:4px}.ios .message-typing-indicator>div:first-child{animation:ios-message-typing-indicator .9s infinite}.ios .message-typing-indicator>div:nth-child(2){animation:ios-message-typing-indicator .9s 150ms infinite}.ios .message-typing-indicator>div:nth-child(3){animation:ios-message-typing-indicator .9s .3s infinite}@keyframes ios-message-typing-indicator{0%{opacity:.35}25%{opacity:.2}50%{opacity:.2}}.md .message-footer b,.md .message-header b,.md .message-name b,.md .messages-title b{font-weight:500}.md .message-header,.md .message-name{margin-bottom:2px}.md .message-footer{margin-top:2px}.md .message-text-header{margin-bottom:4px}.md .message-text-footer{margin-top:4px}.md .message-image{margin:calc(-1 * var(--f7-message-bubble-padding-vertical)) calc(-1 * var(--f7-message-bubble-padding-horizontal))}.md .message-image,.md .message-image img{border-radius:var(--f7-message-bubble-border-radius)}.md .message-received{margin-left:calc(8px + var(--f7-safe-area-left))}.md .message-received .message-footer,.md .message-received .message-header,.md .message-received .message-name{margin-left:16px}.md .message-received.message-first:not(.message-last) .message-bubble,.md .message-received.message-first:not(.message-last) .message-image,.md .message-received.message-first:not(.message-last) .message-image img{border-bottom-left-radius:4px}.md .message-received.message-last:not(.message-first) .message-bubble,.md .message-received.message-last:not(.message-first) .message-image,.md .message-received.message-last:not(.message-first) .message-image img{border-top-left-radius:4px}.md .message-received:not(.message-last):not(.message-first) .message-bubble,.md .message-received:not(.message-last):not(.message-first) .message-image,.md .message-received:not(.message-last):not(.message-first) .message-image img{border-bottom-left-radius:4px;border-top-left-radius:4px}.md .message-received .message-avatar+.message-content{margin-left:8px}.md .message-sent{margin-right:calc(8px + var(--f7-safe-area-right))}.md .message-sent .message-footer,.md .message-sent .message-header,.md .message-sent .message-name{margin-right:16px}.md .message-sent.message-first:not(.message-last) .message-bubble,.md .message-sent.message-first:not(.message-last) .message-image,.md .message-sent.message-first:not(.message-last) .message-image img{border-bottom-right-radius:4px}.md .message-sent.message-last:not(.message-first) .message-bubble,.md .message-sent.message-last:not(.message-first) .message-image,.md .message-sent.message-last:not(.message-first) .message-image img{border-top-right-radius:4px}.md .message-sent:not(.message-last):not(.message-first) .message-bubble,.md .message-sent:not(.message-last):not(.message-first) .message-image,.md .message-sent:not(.message-last):not(.message-first) .message-image img{border-bottom-right-radius:4px;border-top-right-radius:4px}.md .message-sent .message-avatar+.message-content{margin-right:var(--f7-message-bubble-padding-horizontal)}.md .message+.message:not(.message-first){margin-top:2px}.md .message-typing-indicator>div{width:6px;height:6px}.md .message-typing-indicator>div+div{margin-left:6px}.md .message-typing-indicator>div:first-child{animation:md-message-typing-indicator .9s infinite}.md .message-typing-indicator>div:nth-child(2){animation:md-message-typing-indicator .9s 150ms infinite}.md .message-typing-indicator>div:nth-child(3){animation:md-message-typing-indicator .9s .3s infinite}@keyframes md-message-typing-indicator{0%{transform:translateY(0%)}25%{transform:translateY(-5px)}50%{transform:translateY(0%)}}
package/components/navbar-new/navbar-ios.less ADDED
@@ -0,0 +1,135 @@
1
+ .ios {
2
+ --f7-navbarLeftTextOffset: calc(4px + 12px + var(--f7-navbar-new-inner-padding-left));
3
+ --f7-navbarTitleLargeOffset: var(--f7-navbar-new-large-title-padding-left);
4
+ .navbar-new {
5
+ .title-large {
6
+ align-items: flex-end;
7
+ }
8
+
9
+ a.link {
10
+ height: 100%;
11
+ padding: 0 12px;
12
+ }
13
+ a.icon-only {
14
+ width: 44px;
15
+ margin: 0;
16
+ justify-content: center;
17
+ }
18
+ .left,
19
+ .right {
20
+ a + a {
21
+ .ltr({
22
+ margin-left: 16px;
23
+ });
24
+ .rtl({
25
+ margin-right: 16px;
26
+ });
27
+ }
28
+ }
29
+ b {
30
+ font-weight: 600;
31
+ }
32
+ .left {
33
+ .ltr({
34
+ margin-right: 10px;
35
+ });
36
+ .rtl({
37
+ margin-left: 10px;
38
+ });
39
+ }
40
+ .right {
41
+ .ltr({
42
+ margin-left: 10px;
43
+ });
44
+ .rtl({
45
+ margin-right: 10px;
46
+ });
47
+ }
48
+ .right:first-child {
49
+ .ltr({
50
+ right: calc(8px + var(--f7-safe-area-right));
51
+ });
52
+ .rtl({
53
+ left: calc(8px + var(--f7-safe-area-left));
54
+ });
55
+ }
56
+ }
57
+ .navbar-new-bg {
58
+ height: 100%;
59
+ &::before {
60
+ content: '';
61
+ position: absolute;
62
+ inset: 0;
63
+ backdrop-filter: blur(2px);
64
+ mask-image: linear-gradient(
65
+ to bottom,
66
+ black calc(50% + var(--f7-safe-area-top, 0px)),
67
+ transparent 100%
68
+ );
69
+ }
70
+ &::after {
71
+ content: '';
72
+ position: absolute;
73
+ inset: 0;
74
+ background-image: linear-gradient(
75
+ to bottom,
76
+ var(--f7-navbar-new-bars-bg-color) var(--f7-safe-area-top, 0px),
77
+ transparent 100%
78
+ );
79
+ }
80
+ }
81
+ .navbar-new .navbar-new-inner {
82
+ justify-content: space-between;
83
+ padding-top: calc(16px + var(--f7-safe-area-top));
84
+ padding-bottom: 16px;
85
+ }
86
+ .navbar-new {
87
+ .left,
88
+ .right,
89
+ .navbar-pane {
90
+ height: 100%;
91
+ .ios-glass();
92
+ border-radius: 64px;
93
+ min-width: 44px;
94
+ }
95
+ }
96
+ .navbar-pane {
97
+ display: flex;
98
+ align-items: center;
99
+ justify-content: center;
100
+ }
101
+ .navbar-new .navbar-new-inner-left-title {
102
+ justify-content: flex-start;
103
+ .right {
104
+ .ltr({
105
+ margin-left: auto;
106
+ });
107
+ .rtl({
108
+ margin-right: auto;
109
+ });
110
+ }
111
+ .title {
112
+ text-align: left;
113
+ .ltr({
114
+ margin-right: 10px;
115
+ });
116
+ .rtl({
117
+ margin-left: 10px;
118
+ });
119
+ }
120
+ }
121
+ // Transparent navbar
122
+ .navbar-new-transparent:not(.navbar-new-large):not(.navbar-new-transparent-visible):not(
123
+ .with-searchbar-expandable-enabled
124
+ ) {
125
+ .title {
126
+ opacity: 0;
127
+ }
128
+ }
129
+ }
130
+
131
+ .view-master-detail {
132
+ .page-master {
133
+ z-index: 525;
134
+ }
135
+ }
package/components/navbar-new/navbar-md.less ADDED
@@ -0,0 +1,105 @@
1
+ .md {
2
+ .navbar-new {
3
+ .title-large {
4
+ align-items: center;
5
+ overflow: hidden;
6
+ }
7
+ .left {
8
+ margin-left: 4px;
9
+ margin-right: 4px;
10
+ }
11
+ a.link {
12
+ padding: 0 12px;
13
+ min-width: 48px;
14
+ height: var(--f7-navbar-new-link-height, var(--f7-navbar-new-height));
15
+ }
16
+ a.icon-only {
17
+ min-width: 0;
18
+ flex-shrink: 0;
19
+ width: 48px;
20
+ }
21
+ .right {
22
+ .ltr({
23
+ margin-left: auto;
24
+ margin-right: 4px;
25
+ });
26
+ .rtl({
27
+ margin-left: 4px;
28
+ margin-right: auto;
29
+ });
30
+ }
31
+ .right:first-child {
32
+ .ltr({
33
+ right: var(--f7-safe-area-right)
34
+ });
35
+ .rtl({
36
+ left: var(--f7-safe-area-left)
37
+ });
38
+ }
39
+ }
40
+ .navbar-pane {
41
+ display: contents;
42
+ }
43
+ .navbar-new-bg {
44
+ background: var(--f7-navbar-new-bg-color);
45
+ background-color: var(--f7-navbar-new-bg-color, var(--f7-bars-bg-color));
46
+ &:after,
47
+ &:before {
48
+ backface-visibility: hidden;
49
+ }
50
+ .hairline(bottom, var(--f7-navbar-new-border-color, var(--f7-bars-border-color)));
51
+ &:after {
52
+ z-index: 1;
53
+ }
54
+ }
55
+ .navbar-new-inner {
56
+ justify-content: flex-start;
57
+ overflow: hidden;
58
+ }
59
+ .navbar-new-large:not(.navbar-new-large-collapsed) .navbar-new-inner {
60
+ overflow: visible;
61
+ }
62
+ .page.page-with-subnavbar .navbar-new-inner {
63
+ overflow: visible;
64
+ }
65
+ .navbar-new-inner:not(.navbar-new-inner-centered-title) .title:first-child {
66
+ margin-left: 16px;
67
+ }
68
+ .navbar-new-inner-centered-title {
69
+ justify-content: space-between;
70
+ .right {
71
+ .ltr({
72
+ margin-left: 0;
73
+ });
74
+ .rtl({
75
+ margin-right: 0;
76
+ });
77
+ }
78
+ .title {
79
+ text-align: center;
80
+ }
81
+ }
82
+ // Transparent navbar
83
+ .navbar-new-transparent:not(.navbar-new-large):not(.navbar-new-transparent-visible):not(
84
+ .with-searchbar-expandable-enabled
85
+ ) {
86
+ .navbar-new-bg,
87
+ .title {
88
+ opacity: 0;
89
+ }
90
+ }
91
+
92
+ // Large Title Navbar
93
+ .navbar-new-large .navbar-new-bg {
94
+ height: calc(100% + var(--f7-navbar-new-large-title-height));
95
+ transform: translate3d(
96
+ 0px,
97
+ calc(-1 * var(--f7-navbar-new-large-collapse-progress) * var(--f7-navbar-new-large-title-height)),
98
+ 0
99
+ );
100
+ }
101
+ .navbar-new-large-transparent .navbar-new-bg,
102
+ .navbar-new-large.navbar-new-transparent .navbar-new-bg {
103
+ opacity: var(--f7-navbar-new-large-collapse-progress);
104
+ }
105
+ }