@awes-io/ui 2.95.0 → 2.97.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +39 -0
- package/assets/css/components/bottom-bar.css +7 -5
- package/assets/css/components/icon-menu-item.css +11 -14
- package/assets/css/components/mobile-menu-item.css +1 -1
- package/assets/css/components/mobile-menu-nav.css +2 -2
- package/assets/css/components/table.css +1 -1
- package/assets/css/main.css +1 -3
- package/assets/js/icons/mono.js +3 -1
- package/assets/js/styles.js +2 -6
- package/components/3_organisms/AwBottomBar.vue +13 -4
- package/components/4_pages/AwPage.vue +2 -2
- package/package.json +2 -2
- package/readme.md +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,45 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [2.97.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.96.1...@awes-io/ui@2.97.0) (2024-02-19)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* fix border style in table ([e548132](https://github.com/awes-io/client/commit/e548132e8ab938d5600df672174eb5f0878d1774))
|
|
12
|
+
* fix max-width in mobile menu items ([874d0e4](https://github.com/awes-io/client/commit/874d0e4ad84c8d501debd088262a2705dc4a4d54))
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
### Features
|
|
16
|
+
|
|
17
|
+
* change mono and surface colors ([79b060b](https://github.com/awes-io/client/commit/79b060b52f4999ef53458955e8561c6c87cf3e2c))
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
## [2.96.1](https://github.com/awes-io/client/compare/@awes-io/ui@2.96.0...@awes-io/ui@2.96.1) (2024-02-17)
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
### Bug Fixes
|
|
27
|
+
|
|
28
|
+
* updated versions ([72b7aef](https://github.com/awes-io/client/commit/72b7aeffccb6789009703d4008569d4b079be9c8))
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
# [2.96.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.95.0...@awes-io/ui@2.96.0) (2024-02-17)
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
### Features
|
|
38
|
+
|
|
39
|
+
* some changes in style and logic in mobile menu ([0153aed](https://github.com/awes-io/client/commit/0153aed8c1d68593210f965c532d48581f03a0f2))
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
|
|
43
|
+
|
|
44
|
+
|
|
6
45
|
# [2.95.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.94.1...@awes-io/ui@2.95.0) (2024-02-15)
|
|
7
46
|
|
|
8
47
|
|
|
@@ -3,28 +3,30 @@
|
|
|
3
3
|
--icon-color-active: var(--c-accent, currentColor);
|
|
4
4
|
@apply bg-surface;
|
|
5
5
|
display: flex;
|
|
6
|
-
padding-bottom: env(safe-area-inset-bottom, 0);
|
|
7
6
|
box-shadow: none;
|
|
8
7
|
border-top: 1px solid rgba(var(--c-on-surface-rgb), .1);
|
|
9
8
|
|
|
10
9
|
position: fixed;
|
|
11
10
|
bottom: 0;
|
|
12
|
-
min-height:
|
|
11
|
+
min-height: 3.5rem;
|
|
13
12
|
width: 100%;
|
|
14
13
|
z-index: 2;
|
|
15
14
|
|
|
16
15
|
& > * {
|
|
17
|
-
flex-basis:
|
|
16
|
+
flex-basis: 9rem;
|
|
18
17
|
flex-grow: 1;
|
|
19
18
|
flex-shrink: 1;
|
|
20
19
|
}
|
|
21
20
|
|
|
21
|
+
.aw-icon-menu-item {
|
|
22
|
+
max-width: var(--bottom-bar-item-max-width);
|
|
23
|
+
}
|
|
24
|
+
|
|
22
25
|
&:before,
|
|
23
26
|
&:after {
|
|
24
27
|
content: '';
|
|
25
28
|
display: block;
|
|
26
|
-
flex-
|
|
27
|
-
flex-grow: 20;
|
|
29
|
+
flex-grow: 1;
|
|
28
30
|
flex-shrink: 10;
|
|
29
31
|
}
|
|
30
32
|
}
|
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
align-items: center;
|
|
6
6
|
color: inherit;
|
|
7
7
|
width: 100%;
|
|
8
|
+
max-width: 144px;
|
|
8
9
|
|
|
9
10
|
position: relative;
|
|
10
11
|
|
|
@@ -24,18 +25,6 @@
|
|
|
24
25
|
color: var(--c-mono-100);
|
|
25
26
|
}
|
|
26
27
|
}
|
|
27
|
-
|
|
28
|
-
&:before {
|
|
29
|
-
border-radius: 0.625rem;
|
|
30
|
-
position: absolute;
|
|
31
|
-
top: 50%;
|
|
32
|
-
left: 50%;
|
|
33
|
-
transform: translate(-50%, -50%);
|
|
34
|
-
width: 3.5rem;
|
|
35
|
-
height: 3rem;
|
|
36
|
-
content: '';
|
|
37
|
-
background-color: var(--c-mono-800);
|
|
38
|
-
}
|
|
39
28
|
}
|
|
40
29
|
|
|
41
30
|
&__icon {
|
|
@@ -49,10 +38,10 @@
|
|
|
49
38
|
justify-content: center;
|
|
50
39
|
flex-direction: column;
|
|
51
40
|
|
|
52
|
-
padding: 0.
|
|
41
|
+
padding: 0.5rem 0.125rem;
|
|
53
42
|
|
|
54
|
-
width: 4.5rem;
|
|
55
43
|
position: relative;
|
|
44
|
+
max-width: 100%;
|
|
56
45
|
}
|
|
57
46
|
}
|
|
58
47
|
|
|
@@ -108,13 +97,21 @@
|
|
|
108
97
|
|
|
109
98
|
&--active {
|
|
110
99
|
&:before {
|
|
100
|
+
border-radius: 0.625rem;
|
|
101
|
+
position: absolute;
|
|
102
|
+
top: 50%;
|
|
103
|
+
left: 50%;
|
|
104
|
+
transform: translate(-50%, -50%);
|
|
111
105
|
width: 4rem;
|
|
112
106
|
height: 3.0625rem;
|
|
107
|
+
content: '';
|
|
108
|
+
background-color: var(--c-mono-800);
|
|
113
109
|
}
|
|
114
110
|
}
|
|
115
111
|
|
|
116
112
|
&__icon {
|
|
117
113
|
&-block {
|
|
114
|
+
padding: 0.515625rem 0.75rem;
|
|
118
115
|
width: 100%;
|
|
119
116
|
}
|
|
120
117
|
}
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
list-style: none;
|
|
16
16
|
padding: 0;
|
|
17
17
|
margin: 0;
|
|
18
|
-
border-radius:
|
|
18
|
+
border-radius: 0.9375rem;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
li + li .aw-mobile-menu-nav__item--divide {
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
|
|
38
38
|
li + li .aw-mobile-menu-item--island {
|
|
39
39
|
position: relative;
|
|
40
|
-
margin-top: 0.
|
|
40
|
+
margin-top: 0.25rem;
|
|
41
41
|
}
|
|
42
42
|
}
|
|
43
43
|
|
package/assets/css/main.css
CHANGED
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
|
|
48
48
|
@screen lg {
|
|
49
49
|
:root[data-dark='true'] {
|
|
50
|
-
--c-surface: #
|
|
50
|
+
--c-surface: #2e2f33;
|
|
51
51
|
|
|
52
52
|
--c-page-bg: #1e1e21;
|
|
53
53
|
|
|
@@ -62,7 +62,6 @@
|
|
|
62
62
|
--c-mono-700: #6d6d70;
|
|
63
63
|
--c-mono-800: #46474a;
|
|
64
64
|
--c-mono-900: #434447;
|
|
65
|
-
--c-mono-1000: #2e2f33;
|
|
66
65
|
|
|
67
66
|
--c-surface-rgb: 49,50,54;
|
|
68
67
|
|
|
@@ -79,7 +78,6 @@
|
|
|
79
78
|
--c-mono-700-rgb: 109,109,112;
|
|
80
79
|
--c-mono-800-rgb: 70,71,74;
|
|
81
80
|
--c-mono-900-rgb: 67,68,71;
|
|
82
|
-
--c-mono-1000-rgb: 46,47,51;
|
|
83
81
|
}
|
|
84
82
|
}
|
|
85
83
|
|
package/assets/js/icons/mono.js
CHANGED
|
@@ -58,7 +58,7 @@ export const ICONS = {
|
|
|
58
58
|
'M4.58 3h14.85A3.57 3.57 0 0 1 23 6.37v10.66a3.57 3.57 0 0 1-3.37 3.56l-.2.01H4.58a3.57 3.57 0 0 1-3.57-3.37V6.58A3.58 3.58 0 0 1 4.37 3l.2-.01Zm16.77 5.91-8.96 4.72a.82.82 0 0 1-.66.05l-.1-.05-8.98-4.72v8.12a1.92 1.92 0 0 0 1.77 1.91l.16.01h14.85a1.93 1.93 0 0 0 1.92-1.77V8.91Zm-1.92-4.26H4.58a1.93 1.93 0 0 0-1.92 1.77v.63L12 11.97l9.35-4.92v-.47a1.93 1.93 0 0 0-1.76-1.92l-.16-.01Z',
|
|
59
59
|
menu: 'M1 4h22v1.7H1zM1 18.3h22V20H1zM1 11.15h22v1.7H1z',
|
|
60
60
|
'menu-dots':
|
|
61
|
-
'
|
|
61
|
+
'M4.83 7.33a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm15.34 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM7.83 19.67a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm12.34 3a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z',
|
|
62
62
|
more:
|
|
63
63
|
'M4.5 14.25a2.25 2.25 0 1 0 0-4.5 2.25 2.25 0 0 0 0 4.5ZM12 14.25a2.25 2.25 0 1 0 0-4.5 2.25 2.25 0 0 0 0 4.5ZM19.5 14.25a2.25 2.25 0 1 0 0-4.5 2.25 2.25 0 0 0 0 4.5Z',
|
|
64
64
|
'more-v':
|
|
@@ -69,6 +69,8 @@ export const ICONS = {
|
|
|
69
69
|
'M12 3a1.35 1.35 0 0 1 1.35 1.35v6.3h6.3a1.35 1.35 0 1 1 0 2.7h-6.3v6.3a1.35 1.35 0 1 1-2.7 0v-6.3h-6.3a1.35 1.35 0 0 1 0-2.7h6.3v-6.3A1.35 1.35 0 0 1 12 3Z',
|
|
70
70
|
'plus-circle':
|
|
71
71
|
'M17.7 11.7v.6a.5.5 0 0 1-.6.5h-4.3v4.3a.5.5 0 0 1-.5.6h-.6a.5.5 0 0 1-.5-.6v-4.3H6.9a.5.5 0 0 1-.6-.5v-.6a.5.5 0 0 1 .6-.5h4.3V6.9a.5.5 0 0 1 .5-.6h.6a.5.5 0 0 1 .5.6v4.3h4.3a.5.5 0 0 1 .6.5Zm5.3.3a11 11 0 1 1-22 0 11 11 0 0 1 22 0Zm-1.4 0a9.6 9.6 0 1 0-19.2 0 9.6 9.6 0 0 0 19.2 0Z',
|
|
72
|
+
'plus-fill-square':
|
|
73
|
+
'M6 0a6 6 0 0 0-6 6v12a6 6 0 0 0 6 6h12a6 6 0 0 0 6-6V6a6 6 0 0 0-6-6H6Zm6.38 8.56a.54.54 0 0 0-.92.38v2.52H8.94a.54.54 0 0 0 0 1.08h2.52v2.52a.54.54 0 1 0 1.08 0v-2.52h2.52a.54.54 0 1 0 0-1.08h-2.52V8.94a.54.54 0 0 0-.16-.38Z',
|
|
72
74
|
save:
|
|
73
75
|
'M2 5.06A3.06 3.06 0 0 1 5.06 2h11.07a3.61 3.61 0 0 1 2.55 1.06l2.26 2.26C21.62 6 22 6.92 22 7.87v11.07A3.06 3.06 0 0 1 18.94 22H5.06A3.06 3.06 0 0 1 2 18.94V5.06Zm3.06-1.4c-.77 0-1.4.63-1.4 1.4v13.88c0 .77.63 1.4 1.4 1.4h.27V14.5a2.5 2.5 0 0 1 2.5-2.5h8.34a2.5 2.5 0 0 1 2.5 2.5v5.83h.27c.77 0 1.4-.62 1.4-1.39V7.87c0-.51-.21-1-.58-1.37L17.5 4.24a1.94 1.94 0 0 0-1.06-.55v3.03a2.5 2.5 0 0 1-2.5 2.5h-5a2.5 2.5 0 0 1-2.5-2.5V3.67H5.06ZM17 20.34V14.5a.83.83 0 0 0-.83-.83H7.83a.83.83 0 0 0-.83.83v5.83h10ZM8.11 3.67v3.05c0 .46.37.84.83.84h5a.83.83 0 0 0 .84-.84V3.67H8.1Z',
|
|
74
76
|
search:
|
package/assets/js/styles.js
CHANGED
|
@@ -71,7 +71,6 @@ export default {
|
|
|
71
71
|
'mono-700': '#d7dbde',
|
|
72
72
|
'mono-800': '#e7eaed',
|
|
73
73
|
'mono-900': '#f3f5f7',
|
|
74
|
-
'mono-1000': '#fff',
|
|
75
74
|
|
|
76
75
|
...CUSTOM_COLORS_BG_LIGHT
|
|
77
76
|
},
|
|
@@ -100,7 +99,6 @@ export default {
|
|
|
100
99
|
'mono-700': '#14171d',
|
|
101
100
|
'mono-800': '#14171d',
|
|
102
101
|
'mono-900': '#14171d',
|
|
103
|
-
'mono-1000': '#14171d',
|
|
104
102
|
|
|
105
103
|
...CUSTOM_COLORS
|
|
106
104
|
}
|
|
@@ -115,7 +113,7 @@ export default {
|
|
|
115
113
|
error: '#FF4931',
|
|
116
114
|
'error-hover': '#E6422C',
|
|
117
115
|
|
|
118
|
-
surface: '#
|
|
116
|
+
surface: '#292A2E',
|
|
119
117
|
'page-bg': '#010101',
|
|
120
118
|
overlay: 'rgba(0, 0, 0, 0.5)',
|
|
121
119
|
|
|
@@ -130,7 +128,6 @@ export default {
|
|
|
130
128
|
'mono-700': '#626265',
|
|
131
129
|
'mono-800': '#3C3D40',
|
|
132
130
|
'mono-900': '#434447',
|
|
133
|
-
'mono-1000': '#292A2E',
|
|
134
131
|
|
|
135
132
|
...CUSTOM_COLORS_BG_DARK
|
|
136
133
|
},
|
|
@@ -143,7 +140,7 @@ export default {
|
|
|
143
140
|
warning: '#333',
|
|
144
141
|
error: '#fff',
|
|
145
142
|
|
|
146
|
-
surface: '#
|
|
143
|
+
surface: '#D3D3D4',
|
|
147
144
|
'page-bg': '#e7eaed',
|
|
148
145
|
overlay: '#fff',
|
|
149
146
|
|
|
@@ -158,7 +155,6 @@ export default {
|
|
|
158
155
|
'mono-700': '#eaeaeb',
|
|
159
156
|
'mono-800': '#eaeaeb',
|
|
160
157
|
'mono-900': '#eaeaeb',
|
|
161
|
-
'mono-1000': '#eaeaeb',
|
|
162
158
|
|
|
163
159
|
...CUSTOM_COLORS
|
|
164
160
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div v-if="showMenu" class="aw-bottom-bar">
|
|
2
|
+
<div v-if="showMenu" class="aw-bottom-bar" :style="itemMaxWidthVar">
|
|
3
3
|
<slot name="bottom-bar-items">
|
|
4
4
|
<AwMenuItemIcon
|
|
5
5
|
v-for="(item, i) in items"
|
|
@@ -45,9 +45,9 @@ import AwMenuItemIcon from '@AwLayouts/_AwMenuItemIcon.vue'
|
|
|
45
45
|
|
|
46
46
|
export const VISIBLE_ITEMS_COUNT = 4
|
|
47
47
|
|
|
48
|
-
const ICON_SIZE =
|
|
48
|
+
const ICON_SIZE = 24
|
|
49
49
|
|
|
50
|
-
const ACTION_ICON_SIZE =
|
|
50
|
+
const ACTION_ICON_SIZE = 40
|
|
51
51
|
|
|
52
52
|
export default {
|
|
53
53
|
name: 'AwBottomBar',
|
|
@@ -65,6 +65,13 @@ export default {
|
|
|
65
65
|
},
|
|
66
66
|
|
|
67
67
|
computed: {
|
|
68
|
+
itemMaxWidthVar() {
|
|
69
|
+
const itemsNumber = this.items.length + 1
|
|
70
|
+
|
|
71
|
+
return `--bottom-bar-item-max-width: min(${100 /
|
|
72
|
+
itemsNumber}%, 144px)`
|
|
73
|
+
},
|
|
74
|
+
|
|
68
75
|
actionButton() {
|
|
69
76
|
const button = this.$store.state.awesIo.bottomBarAction
|
|
70
77
|
|
|
@@ -123,7 +130,9 @@ export default {
|
|
|
123
130
|
_pickItemProps(props) {
|
|
124
131
|
return {
|
|
125
132
|
...omit('children,listeners', props),
|
|
126
|
-
size: props.hideText ? ACTION_ICON_SIZE : ICON_SIZE
|
|
133
|
+
size: props.hideText ? ACTION_ICON_SIZE : ICON_SIZE,
|
|
134
|
+
icon: props.hideText ? 'awesio/plus-fill-square' : props.icon,
|
|
135
|
+
class: props.hideText ? 'aw-icon-menu-item--active' : ''
|
|
127
136
|
}
|
|
128
137
|
}
|
|
129
138
|
}
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
:style="{
|
|
12
12
|
'--page-buttons-bottom': _hideBottomBar
|
|
13
13
|
? null
|
|
14
|
-
: '
|
|
14
|
+
: '3.5rem'
|
|
15
15
|
}"
|
|
16
16
|
:title="_title"
|
|
17
17
|
:breadcrumb="breadcrumb"
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
'aw-page__content_fake-fullscreen': isFakeFullscreen
|
|
51
51
|
}"
|
|
52
52
|
:style="{
|
|
53
|
-
'--page-buttons-bottom': _hideBottomBar ? null : '
|
|
53
|
+
'--page-buttons-bottom': _hideBottomBar ? null : '3.5rem'
|
|
54
54
|
}"
|
|
55
55
|
>
|
|
56
56
|
<!-- eslint-disable prettier/prettier -->
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@awes-io/ui",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.97.0",
|
|
4
4
|
"description": "User Interface (UI) components",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"ui",
|
|
@@ -114,5 +114,5 @@
|
|
|
114
114
|
"rollup-plugin-visualizer": "^2.6.0",
|
|
115
115
|
"rollup-plugin-vue": "^5.0.1"
|
|
116
116
|
},
|
|
117
|
-
"gitHead": "
|
|
117
|
+
"gitHead": "c7e49109bedfdd34b969b7634eea0a0b8e1c5847"
|
|
118
118
|
}
|
package/readme.md
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Awes.io/Ui
|
|
1
|
+
Awes.io/Ui 321
|