@varlet/ui 2.9.4-alpha.1680196009841 → 2.9.4-alpha.1680198474264

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.
@@ -10,7 +10,7 @@ import { renderSlot as _renderSlot, toDisplayString as _toDisplayString, createT
10
10
 
11
11
  function __render__(_ctx, _cache) {
12
12
  return _openBlock(), _createElementBlock("div", {
13
- class: _normalizeClass(_ctx.classes(_ctx.n(), [_ctx.round, _ctx.n('--round')], _ctx.formatElevation(_ctx.elevation, 3))),
13
+ class: _normalizeClass(_ctx.classes(_ctx.n(), _ctx.n('$--box'), [_ctx.safeAreaTop, _ctx.n('--safe-area-top')], [_ctx.round, _ctx.n('--round')], _ctx.formatElevation(_ctx.elevation, 3))),
14
14
  style: _normalizeStyle(_ctx.rootStyles)
15
15
  }, [_createElementVNode("div", {
16
16
  class: _normalizeClass(_ctx.n('toolbar'))
@@ -1 +1 @@
1
- :root { --app-bar-color: var(--color-primary); --app-bar-title-padding: 0 12px; --app-bar-title-font-size: var(--font-size-lg); --app-bar-text-color: #fff; --app-bar-height: 54px; --app-bar-left-gap: 6px; --app-bar-right-gap: 6px; --app-bar-border-radius: 4px; --app-bar-font-size: var(--font-size-lg);}.var-app-bar { position: relative; z-index: 0; width: 100%; font-size: var(--app-bar-font-size); background: var(--app-bar-color); color: var(--app-bar-text-color); transition: background-color 0.25s;}.var-app-bar__toolbar { position: relative; display: flex; justify-content: center; align-items: center; height: var(--app-bar-height);}.var-app-bar__title { font-size: var(--app-bar-title-font-size); flex: 1; display: flex; justify-content: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: var(--app-bar-title-padding);}.var-app-bar__left,.var-app-bar__right { display: flex; align-items: center; height: 100%; z-index: 2;}.var-app-bar__left { position: absolute; top: 0; left: var(--app-bar-left-gap);}.var-app-bar__right { position: absolute; top: 0; right: var(--app-bar-right-gap);}.var-app-bar--round { border-radius: var(--app-bar-border-radius);}
1
+ :root { --app-bar-color: var(--color-primary); --app-bar-title-padding: 0 12px; --app-bar-title-font-size: var(--font-size-lg); --app-bar-text-color: #fff; --app-bar-height: 54px; --app-bar-left-gap: 6px; --app-bar-right-gap: 6px; --app-bar-border-radius: 4px; --app-bar-font-size: var(--font-size-lg);}.var-app-bar { position: relative; z-index: 0; width: 100%; font-size: var(--app-bar-font-size); background: var(--app-bar-color); color: var(--app-bar-text-color); transition: background-color 0.25s;}.var-app-bar__toolbar { position: relative; display: flex; justify-content: center; align-items: center; height: var(--app-bar-height);}.var-app-bar__title { font-size: var(--app-bar-title-font-size); flex: 1; display: flex; justify-content: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: var(--app-bar-title-padding);}.var-app-bar__left,.var-app-bar__right { display: flex; align-items: center; height: 100%; z-index: 2;}.var-app-bar__left { position: absolute; top: 0; left: var(--app-bar-left-gap);}.var-app-bar__right { position: absolute; top: 0; right: var(--app-bar-right-gap);}.var-app-bar--round { border-radius: var(--app-bar-border-radius);}.var-app-bar--safe-area-top { padding-top: constant(safe-area-inset-top); padding-top: env(safe-area-inset-top); box-sizing: content-box !important;}
@@ -30,5 +30,9 @@ export var props = {
30
30
  },
31
31
  imageLinearGradient: {
32
32
  type: String
33
+ },
34
+ safeAreaTop: {
35
+ type: Boolean,
36
+ default: false
33
37
  }
34
38
  };
@@ -1 +1 @@
1
- :root { --bottom-navigation-height: 50px; --bottom-navigation-z-index: 1; --bottom-navigation-background-color: #fff; --bottom-navigation-border-color: #e3e3e3; --bottom-navigation-fab-offset: 4px;}.var-bottom-navigation { width: 100%; height: var(--bottom-navigation-height); display: flex; position: relative; background-color: var(--bottom-navigation-background-color); transition: background-color 250ms, border-color 250ms; -webkit-tap-highlight-color: transparent;}.var-bottom-navigation--safe-area { margin-bottom: constant(safe-area-inset-bottom); margin-bottom: env(safe-area-inset-bottom);}.var-bottom-navigation--fixed { position: fixed; left: 0; bottom: 0;}.var-bottom-navigation--border { border-top: 1px solid var(--bottom-navigation-border-color);}.var-bottom-navigation__fab[var-bottom-navigation__fab] { width: var(--bottom-navigation-height); height: var(--bottom-navigation-height); position: absolute; z-index: 2; transform: translateY(-50%); overflow: hidden; transition: right 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}.var-bottom-navigation--fab-center { right: calc(50% - var(--bottom-navigation-height) / 2);}.var-bottom-navigation--fab-right { right: var(--bottom-navigation-fab-offset);}
1
+ :root { --bottom-navigation-height: 50px; --bottom-navigation-z-index: 1; --bottom-navigation-background-color: #fff; --bottom-navigation-border-color: #e3e3e3; --bottom-navigation-fab-offset: 4px;}.var-bottom-navigation { width: 100%; height: var(--bottom-navigation-height); display: flex; position: relative; background-color: var(--bottom-navigation-background-color); transition: background-color 250ms, border-color 250ms; -webkit-tap-highlight-color: transparent;}.var-bottom-navigation--safe-area { padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); box-sizing: content-box !important;}.var-bottom-navigation--fixed { position: fixed; left: 0; bottom: 0;}.var-bottom-navigation--border { border-top: 1px solid var(--bottom-navigation-border-color);}.var-bottom-navigation__fab[var-bottom-navigation__fab] { width: var(--bottom-navigation-height); height: var(--bottom-navigation-height); position: absolute; z-index: 2; transform: translateY(-50%); overflow: hidden; transition: right 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}.var-bottom-navigation--fab-center { right: calc(50% - var(--bottom-navigation-height) / 2);}.var-bottom-navigation--fab-right { right: var(--bottom-navigation-fab-offset);}
@@ -241,7 +241,7 @@ import './time-picker/style/index.mjs'
241
241
  import './tooltip/style/index.mjs'
242
242
  import './uploader/style/index.mjs'
243
243
 
244
- const version = '2.9.4-alpha.1680196009841'
244
+ const version = '2.9.4-alpha.1680198474264'
245
245
 
246
246
  function install(app) {
247
247
  ActionSheet.install && app.use(ActionSheet)
package/es/index.mjs CHANGED
@@ -160,7 +160,7 @@ export * from './time-picker/index.mjs'
160
160
  export * from './tooltip/index.mjs'
161
161
  export * from './uploader/index.mjs'
162
162
 
163
- const version = '2.9.4-alpha.1680196009841'
163
+ const version = '2.9.4-alpha.1680198474264'
164
164
 
165
165
  function install(app) {
166
166
  ActionSheet.install && app.use(ActionSheet)
@@ -1,8 +1,8 @@
1
1
  import '../../styles/common.css'
2
- import '../SnackbarSfc.css'
3
2
  import '../../styles/elevation.css'
4
3
  import '../../loading/loading.css'
5
4
  import '../../button/button.css'
6
5
  import '../../icon/icon.css'
7
6
  import '../snackbar.css'
8
7
  import '../coreSfc.css'
8
+ import '../SnackbarSfc.css'