@varlet/ui 3.1.3 → 3.2.0-alpha.1710928822670

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.
@@ -14,7 +14,8 @@ function __render__(_ctx, _cache) {
14
14
  _createElementVNode(
15
15
  "div",
16
16
  {
17
- class: _normalizeClass(_ctx.n("main"))
17
+ class: _normalizeClass(_ctx.n("main")),
18
+ style: _normalizeStyle({ height: _ctx.toSizeUnit(_ctx.scrollerHeight) })
18
19
  },
19
20
  [
20
21
  _createElementVNode(
@@ -30,8 +31,8 @@ function __render__(_ctx, _cache) {
30
31
  /* CLASS, STYLE */
31
32
  )
32
33
  ],
33
- 2
34
- /* CLASS */
34
+ 6
35
+ /* CLASS, STYLE */
35
36
  ),
36
37
  _ctx.$slots.footer ? (_openBlock(), _createElementBlock(
37
38
  "div",
@@ -3,6 +3,9 @@ const props = {
3
3
  type: [Number, String],
4
4
  default: "100%"
5
5
  },
6
+ scrollerHeight: {
7
+ type: [Number, String]
8
+ },
6
9
  elevation: {
7
10
  type: [Boolean, Number, String],
8
11
  default: true
@@ -1 +1 @@
1
- :root { --table-background: #fff; --table-border-radius: 2px; --table-thead-border-bottom: thin solid var(--color-outline); --table-thead-th-text-color: rgba(0, 0, 0, 0.6); --table-thead-th-font-size: 14px; --table-thead-tr-border-bottom: thin solid var(--color-outline); --table-tbody-tr-hover-background: #eee; --table-tbody-tr-border-bottom: thin solid var(--color-outline); --table-tbody-td-text-color: #555; --table-tbody-td-font-size: 16px; --table-row-height: 46px; --table-row-padding: 0 16px; --table-footer-border-top: thin solid var(--color-outline);}.var-table { width: 100%; background: var(--table-background); border-radius: var(--table-border-radius); transition: 0.25s background-color;}.var-table * { box-sizing: border-box;}.var-table__main { width: 100%; overflow-x: auto;}.var-table__main > table { min-width: 100%; display: table; border-spacing: 0; border-collapse: collapse; line-height: normal;}.var-table__main > table thead { display: table-header-group; border-bottom: var(--table-thead-border-bottom);}.var-table__main > table thead tr th { color: var(--table-thead-th-text-color); font-size: var(--table-thead-th-font-size);}.var-table__main > table thead tr:not(:last-child) { border-bottom: var(--table-thead-tr-border-bottom);}.var-table__main > table tbody { display: table-row-group;}.var-table__main > table tbody tr { display: table-row; outline: 0; vertical-align: middle;}.var-table__main > table tbody tr:hover { background: var(--table-tbody-tr-hover-background); transition: background-color 0.25s;}.var-table__main > table tbody tr:not(:last-child) { border-bottom: var(--table-tbody-tr-border-bottom);}.var-table__main > table tbody td { color: var(--table-tbody-td-text-color); font-size: var(--table-tbody-td-font-size);}.var-table__main > table th { display: table-cell; height: var(--table-row-height); padding: var(--table-row-padding); font-weight: 500; text-align: left;}.var-table__main > table td { display: table-cell; padding: var(--table-row-padding); height: var(--table-row-height); text-align: left;}.var-table__footer { width: 100%; min-height: var(--table-row-height); border-top: var(--table-footer-border-top);}
1
+ :root { --table-background: #fff; --table-border-radius: 2px; --table-thead-border-bottom: thin solid var(--color-outline); --table-thead-th-text-color: rgba(0, 0, 0, 0.6); --table-thead-th-text-align: left; --table-thead-th-font-size: 14px; --table-thead-tr-border-bottom: thin solid var(--color-outline); --table-tbody-tr-hover-background: #eee; --table-tbody-tr-border-bottom: thin solid var(--color-outline); --table-tbody-td-text-color: #555; --table-tbody-td-font-size: 16px; --table-tbody-td-text-align: left; --table-row-height: 46px; --table-row-padding: 0 16px; --table-footer-border-top: thin solid var(--color-outline);}.var-table { width: 100%; border-radius: var(--table-border-radius);}.var-table * { box-sizing: border-box;}.var-table__main { width: 100%; overflow: auto;}.var-table__main > table { min-width: 100%; display: table; border-spacing: 0; border-collapse: collapse; line-height: normal;}.var-table__main > table thead { display: table-header-group; border-bottom: var(--table-thead-border-bottom);}.var-table__main > table thead tr th { color: var(--table-thead-th-text-color); font-size: var(--table-thead-th-font-size); text-align: var(--table-thead-th-text-align); background: var(--table-background);}.var-table__main > table thead tr:not(:last-child) { border-bottom: var(--table-thead-tr-border-bottom);}.var-table__main > table tbody { display: table-row-group;}.var-table__main > table tbody tr { display: table-row; outline: 0; vertical-align: middle; background: var(--table-background);}.var-table__main > table tbody tr:hover { background: var(--table-tbody-tr-hover-background); transition: background-color 0.25s;}.var-table__main > table tbody tr:not(:last-child) { border-bottom: var(--table-tbody-tr-border-bottom);}.var-table__main > table tbody td { color: var(--table-tbody-td-text-color); font-size: var(--table-tbody-td-font-size);}.var-table__main > table th { display: table-cell; height: var(--table-row-height); padding: var(--table-row-padding); font-weight: 500; text-align: left;}.var-table__main > table td { display: table-cell; padding: var(--table-row-padding); height: var(--table-row-height); text-align: var(--table-tbody-td-text-align);}.var-table__footer { width: 100%; min-height: var(--table-row-height); border-top: var(--table-footer-border-top); background: var(--table-background);}
@@ -1,5 +1,6 @@
1
1
  var stdin_default = {
2
2
  "--bottom-navigation-height": "50px",
3
+ "--bottom-navigation-variant-height": "66px",
3
4
  "--bottom-navigation-z-index": "1",
4
5
  "--bottom-navigation-background-color": "var(--color-surface-container-high)",
5
6
  "--bottom-navigation-border-color": "var(--color-outline)",
@@ -3,9 +3,15 @@ var stdin_default = {
3
3
  "--bottom-navigation-item-font-size": "var(--font-size-sm)",
4
4
  "--bottom-navigation-item-active-color": "var(--color-primary)",
5
5
  "--bottom-navigation-item-active-background-color": "var(--color-surface-container-high)",
6
+ "--bottom-navigation-item-variant-active-background-color": "var(--color-primary-container)",
7
+ "--bottom-navigation-item-variant-active-color": "var(--color-on-primary-container)",
8
+ "--bottom-navigation-fab-border-radius": "50%",
6
9
  "--bottom-navigation-item-line-height": "1",
7
10
  "--bottom-navigation-item-icon-size": "22px",
8
- "--bottom-navigation-item-icon-margin-bottom": "5px"
11
+ "--bottom-navigation-item-icon-margin-bottom": "5px",
12
+ "--bottom-navigation-item-variant-icon-container-height": "30px",
13
+ "--bottom-navigation-item-variant-icon-container-border-radius": "100px",
14
+ "--bottom-navigation-item-variant-icon-container-max-width": "58px"
9
15
  };
10
16
  export {
11
17
  stdin_default as default
@@ -1,6 +1,7 @@
1
1
  var stdin_default = {
2
2
  "--table-background": "#303030",
3
3
  "--table-thead-th-text-color": "rgba(255, 255, 255, 0.6)",
4
+ "--table-thead-th-text-align": "left",
4
5
  "--table-tbody-td-text-color": "#fff",
5
6
  "--table-tbody-tr-hover-background": "#4c4b4b",
6
7
  "--table-border-radius": "2px",
@@ -9,6 +10,7 @@ var stdin_default = {
9
10
  "--table-thead-tr-border-bottom": "thin solid var(--color-outline)",
10
11
  "--table-tbody-tr-border-bottom": "thin solid var(--color-outline)",
11
12
  "--table-tbody-td-font-size": "16px",
13
+ "--table-tbody-td-text-align": "left",
12
14
  "--table-row-height": "46px",
13
15
  "--table-row-padding": "0 16px",
14
16
  "--table-footer-border-top": "thin solid var(--color-outline)"
@@ -1,6 +1,7 @@
1
1
  var stdin_default = {
2
2
  "--bottom-navigation-background-color": "var(--color-surface-container)",
3
3
  "--bottom-navigation-height": "50px",
4
+ "--bottom-navigation-variant-height": "66px",
4
5
  "--bottom-navigation-z-index": "1",
5
6
  "--bottom-navigation-border-color": "var(--color-outline)",
6
7
  "--bottom-navigation-fab-offset": "4px",
@@ -1,12 +1,17 @@
1
1
  var stdin_default = {
2
2
  "--bottom-navigation-item-active-background-color": "#4A4458",
3
3
  "--bottom-navigation-item-inactive-color": "var(--color-on-surface-variant)",
4
+ "--bottom-navigation-item-variant-active-background-color": "var(--color-info-container)",
5
+ "--bottom-navigation-item-variant-active-color": "var(--color-on-info-container)",
4
6
  "--bottom-navigation-fab-border-radius": "12px",
5
7
  "--bottom-navigation-item-font-size": "var(--font-size-sm)",
6
8
  "--bottom-navigation-item-active-color": "var(--color-primary)",
7
9
  "--bottom-navigation-item-line-height": "1",
8
10
  "--bottom-navigation-item-icon-size": "22px",
9
- "--bottom-navigation-item-icon-margin-bottom": "5px"
11
+ "--bottom-navigation-item-icon-margin-bottom": "5px",
12
+ "--bottom-navigation-item-variant-icon-container-height": "30px",
13
+ "--bottom-navigation-item-variant-icon-container-border-radius": "100px",
14
+ "--bottom-navigation-item-variant-icon-container-max-width": "58px"
10
15
  };
11
16
  export {
12
17
  stdin_default as default
@@ -1,6 +1,7 @@
1
1
  var stdin_default = {
2
2
  "--table-background": "var(--color-surface-container-highest)",
3
3
  "--table-thead-th-text-color": "rgba(255, 255, 255, 0.6)",
4
+ "--table-thead-th-text-align": "left",
4
5
  "--table-tbody-td-text-color": "#fff",
5
6
  "--table-tbody-tr-hover-background": "var(--color-surface-container-highest)",
6
7
  "--table-border-radius": "2px",
@@ -9,6 +10,7 @@ var stdin_default = {
9
10
  "--table-thead-tr-border-bottom": "thin solid var(--color-outline)",
10
11
  "--table-tbody-tr-border-bottom": "thin solid var(--color-outline)",
11
12
  "--table-tbody-td-font-size": "16px",
13
+ "--table-tbody-td-text-align": "left",
12
14
  "--table-row-height": "46px",
13
15
  "--table-row-padding": "0 16px",
14
16
  "--table-footer-border-top": "thin solid var(--color-outline)"
@@ -2,6 +2,7 @@ var stdin_default = {
2
2
  "--bottom-navigation-background-color": "var(--color-surface-container)",
3
3
  "--bottom-navigation-fab-border-radius": "12px",
4
4
  "--bottom-navigation-height": "50px",
5
+ "--bottom-navigation-variant-height": "66px",
5
6
  "--bottom-navigation-z-index": "1",
6
7
  "--bottom-navigation-border-color": "var(--color-outline)",
7
8
  "--bottom-navigation-fab-offset": "4px"
@@ -1,11 +1,17 @@
1
1
  var stdin_default = {
2
2
  "--bottom-navigation-item-active-background-color": "var(--color-info-container)",
3
3
  "--bottom-navigation-item-inactive-color": "var(--color-on-surface-variant)",
4
+ "--bottom-navigation-item-variant-active-background-color": "var(--color-info-container)",
5
+ "--bottom-navigation-item-variant-active-color": "var(--color-on-info-container)",
6
+ "--bottom-navigation-fab-border-radius": "12px",
4
7
  "--bottom-navigation-item-font-size": "var(--font-size-sm)",
5
8
  "--bottom-navigation-item-active-color": "var(--color-primary)",
6
9
  "--bottom-navigation-item-line-height": "1",
7
10
  "--bottom-navigation-item-icon-size": "22px",
8
- "--bottom-navigation-item-icon-margin-bottom": "5px"
11
+ "--bottom-navigation-item-icon-margin-bottom": "5px",
12
+ "--bottom-navigation-item-variant-icon-container-height": "30px",
13
+ "--bottom-navigation-item-variant-icon-container-border-radius": "100px",
14
+ "--bottom-navigation-item-variant-icon-container-max-width": "58px"
9
15
  };
10
16
  export {
11
17
  stdin_default as default
@@ -4,11 +4,13 @@ var stdin_default = {
4
4
  "--table-border-radius": "2px",
5
5
  "--table-thead-border-bottom": "thin solid var(--color-outline)",
6
6
  "--table-thead-th-text-color": "rgba(0, 0, 0, 0.6)",
7
+ "--table-thead-th-text-align": "left",
7
8
  "--table-thead-th-font-size": "14px",
8
9
  "--table-thead-tr-border-bottom": "thin solid var(--color-outline)",
9
10
  "--table-tbody-tr-border-bottom": "thin solid var(--color-outline)",
10
11
  "--table-tbody-td-text-color": "#555",
11
12
  "--table-tbody-td-font-size": "16px",
13
+ "--table-tbody-td-text-align": "left",
12
14
  "--table-row-height": "46px",
13
15
  "--table-row-padding": "0 16px",
14
16
  "--table-footer-border-top": "thin solid var(--color-outline)"