vgapp 0.1.4 → 0.1.6

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 (24) hide show
  1. package/CHANGELOG.md +19 -2
  2. package/README.md +2 -1
  3. package/app/modules/vgcollapse/js/vgcollapse.js +2 -1
  4. package/app/modules/vgdropdown/scss/vgdropdown.css +47 -47
  5. package/app/modules/vgformsender/scss/vgformsender.css +13 -13
  6. package/app/modules/vglawcookie/scss/vglawcookie.css +87 -87
  7. package/app/modules/vgmodal/js/vgmodal.js +6 -3
  8. package/app/modules/vgmodal/scss/vgmodal.css +3824 -3824
  9. package/app/modules/vgnav/scss/vgnav.css +309 -309
  10. package/app/modules/vgnotify/scss/vgnotify.css +3 -3
  11. package/app/modules/vgrollup/scss/vgrollup.css +41 -41
  12. package/app/modules/vgselect/js/vgselect.js +285 -168
  13. package/app/modules/vgselect/scss/_variables.scss +53 -47
  14. package/app/modules/vgselect/scss/vgselect.css +256 -243
  15. package/app/modules/vgselect/scss/vgselect.css.map +1 -1
  16. package/app/modules/vgselect/scss/vgselect.scss +19 -2
  17. package/app/modules/vgsidebar/js/vgsidebar.js +18 -14
  18. package/app/modules/vgsidebar/scss/vgsidebar.css +86 -86
  19. package/app/utils/scss/default.css +275 -275
  20. package/build/vgapp.css +10 -4929
  21. package/build/vgapp.css.map +1 -1
  22. package/build/vgapp.js +3 -4155
  23. package/build/vgapp.js.map +1 -1
  24. package/package.json +1 -1
package/app/modules/vgselect/scss/vgselect.scss CHANGED
@@ -27,6 +27,7 @@ select {
27
27
 
28
28
  .vg-select {
29
29
  @include mix-vars('select-current', $select-current-map);
30
+ @include mix-vars('select-current', $select-placeholder-map);
30
31
  @include mix-vars('select-dropdown', $select-dropdown-map);
31
32
  @include mix-vars('select-list', $select-list-map);
32
33
  @include mix-vars('select-optgroup', $select-optgroup-map);
@@ -39,6 +40,12 @@ select {
39
40
  --vg-select-list-scrollbar-thumb: #{$select-list-scrollbar-thumb};
40
41
  position: relative;
41
42
 
43
+ &:not(.show) {
44
+ .vg-select-dropdown {
45
+ display: none;
46
+ }
47
+ }
48
+
42
49
  &-current {
43
50
  @each $key, $value in $select-current-map {
44
51
  #{$key}: var(--vg-select-current-#{$key})
@@ -47,7 +54,6 @@ select {
47
54
  cursor: pointer;
48
55
  outline: none;
49
56
  position: relative;
50
- z-index: var(--vg-select-current-z-index);
51
57
  white-space: nowrap;
52
58
  overflow: hidden;
53
59
  text-overflow: ellipsis;
@@ -64,6 +70,11 @@ select {
64
70
  width: 16px;
65
71
  height: 16px;
66
72
  }
73
+
74
+ &--placeholder {
75
+ color: var(--vg-select-current-placehoder-color);
76
+ font-size: var(--vg-select-current-font-size);
77
+ }
67
78
  }
68
79
 
69
80
  &-dropdown {
@@ -182,6 +193,12 @@ select {
182
193
  }
183
194
  }
184
195
 
196
+ .vg-select-dropdown {
197
+ display: block;
198
+ }
199
+ }
200
+
201
+ &.active {
185
202
  .vg-select-dropdown {
186
203
  transform: scale(1) translateY(0);
187
204
  opacity: 1;
@@ -206,7 +223,7 @@ select {
206
223
  position: absolute;
207
224
  width: 100%;
208
225
  height: 100%;
209
- z-index: 500;
226
+ z-index: 12;
210
227
  }
211
228
 
212
229
  > .vg-select-current {
package/app/modules/vgsidebar/js/vgsidebar.js CHANGED
@@ -20,6 +20,7 @@ const EVENT_KEY_HIDE = `${NAME_KEY}.hide`;
20
20
  const EVENT_KEY_HIDDEN = `${NAME_KEY}.hidden`;
21
21
  const EVENT_KEY_SHOW = `${NAME_KEY}.show`;
22
22
  const EVENT_KEY_SHOWN = `${NAME_KEY}.shown`;
23
+ const EVENT_KEY_LOADED = `${NAME_KEY}.loaded`;
23
24
 
24
25
  const EVENT_KEY_KEYDOWN_DISMISS = `keydown.dismiss.${NAME_KEY}`;
25
26
  const EVENT_KEY_HIDE_PREVENTED = `hidePrevented.${NAME_KEY}`;
@@ -42,7 +43,8 @@ class VGSidebar extends BaseModule {
42
43
  ajax: {
43
44
  route: '',
44
45
  target: '',
45
- method: 'get'
46
+ method: 'get',
47
+ loader: false,
46
48
  }
47
49
  }, params));
48
50
 
@@ -70,7 +72,9 @@ class VGSidebar extends BaseModule {
70
72
  if (isDisabled(_this._element)) return;
71
73
 
72
74
  _this._params = _this._getParams(relatedTarget, _this._params);
73
- _this._route();
75
+ _this._route(function (status, data) {
76
+ EventHandler.trigger(_this._element, EVENT_KEY_LOADED, {stats: status, data: data});
77
+ });
74
78
 
75
79
  const showEvent = EventHandler.trigger(_this._element, EVENT_KEY_SHOW, { relatedTarget })
76
80
  if (showEvent.defaultPrevented) return;
@@ -103,23 +107,23 @@ class VGSidebar extends BaseModule {
103
107
  const hideEvent = EventHandler.trigger(this._element, EVENT_KEY_HIDE);
104
108
  if (hideEvent.defaultPrevented) return;
105
109
 
106
- if (_this._params.backdrop) {
107
- Backdrop.hide(function () {
108
- if (_this._params.overflow) {
109
- Overflow.destroy();
110
- }
111
- });
112
- }
113
-
114
- if (_this._params.overflow) {
115
- Overflow.destroy();
116
- }
117
-
118
110
  setTimeout(() => {
119
111
  _this._element.setAttribute('aria-expanded', false);
120
112
  _this._element.classList.remove(CLASS_NAME_SHOW);
121
113
 
122
114
  const completeCallback = () => {
115
+ if (_this._params.backdrop) {
116
+ Backdrop.hide(function () {
117
+ if (_this._params.overflow) {
118
+ Overflow.destroy();
119
+ }
120
+ });
121
+ }
122
+
123
+ if (_this._params.overflow) {
124
+ Overflow.destroy();
125
+ }
126
+
123
127
  document.body.classList.remove(CLASS_NAME_OPEN);
124
128
  EventHandler.trigger(this._element, EVENT_KEY_HIDDEN);
125
129
  }
package/app/modules/vgsidebar/scss/vgsidebar.css CHANGED
@@ -1,86 +1,86 @@
1
- @charset "UTF-8";
2
- /**
3
- *--------------------------------------------------------------------------
4
- * Модуль: VGSidebar
5
- * Автор: Vegas DEV
6
- * Лицензия: смотри LICENSE
7
- *--------------------------------------------------------------------------
8
- **/
9
- .vg-sidebar {
10
- --vg-sidebar-horizontal-width: 400px ;
11
- --vg-sidebar-horizontal-height: 100vh ;
12
- --vg-sidebar-vertical-width: 100vw ;
13
- --vg-sidebar-vertical-height: 30vh ;
14
- --vg-sidebar-bg-color: #fff ;
15
- --vg-sidebar-color: #000000 ;
16
- --vg-sidebar-box-shadow: 0 8px 14px 5px rgba(0, 0, 0, 0.2) ;
17
- --vg-sidebar-header-height: 60px ;
18
- --vg-sidebar-footer-height: 70px ;
19
- --vg-sidebar-padding: 1rem ;
20
- --vg-sidebar-border: 1px solid rgba(0, 0, 0, 0.2) ;
21
- --vg-sidebar-z-index: 1040 ;
22
- --vg-sidebar-transition: all 0.5s ease-in-out ;
23
- position: fixed;
24
- width: auto;
25
- height: auto;
26
- transition: var(--vg-sidebar-transition);
27
- z-index: var(--vg-sidebar-z-index);
28
- background: var(--vg-sidebar-bg-color);
29
- color: var(--vg-sidebar-color);
30
- box-shadow: var(--vg-sidebar-box-shadow);
31
- }
32
- .vg-sidebar.left, .vg-sidebar.right {
33
- width: var(--vg-sidebar-horizontal-width);
34
- height: var(--vg-sidebar-horizontal-height);
35
- top: 0;
36
- }
37
- .vg-sidebar.left {
38
- left: -105%;
39
- }
40
- .vg-sidebar.left.show {
41
- left: 0;
42
- }
43
- .vg-sidebar.right {
44
- right: -105%;
45
- }
46
- .vg-sidebar.right.show {
47
- right: 0;
48
- }
49
- .vg-sidebar.top, .vg-sidebar.bottom {
50
- height: var(--vg-sidebar-vertical-height);
51
- width: var(--vg-sidebar-vertical-width);
52
- left: 0;
53
- }
54
- .vg-sidebar.top {
55
- top: -105%;
56
- }
57
- .vg-sidebar.top.show {
58
- top: 0;
59
- }
60
- .vg-sidebar.bottom {
61
- bottom: -105%;
62
- }
63
- .vg-sidebar.bottom.show {
64
- bottom: 0;
65
- }
66
- .vg-sidebar-header {
67
- height: var(--vg-sidebar-header-height);
68
- z-index: 10;
69
- position: relative;
70
- display: flex;
71
- align-items: center;
72
- padding: var(--vg-sidebar-padding);
73
- border-bottom: var(--vg-sidebar-border);
74
- }
75
- .vg-sidebar-body {
76
- height: calc(100% - var(--vg-sidebar-header-height) - var(--vg-sidebar-footer-height));
77
- overflow-y: auto;
78
- padding: var(--vg-sidebar-padding);
79
- }
80
- .vg-sidebar-footer {
81
- height: var(--vg-sidebar-footer-height);
82
- padding: var(--vg-sidebar-padding);
83
- border-top: var(--vg-sidebar-border);
84
- }
85
-
86
- /*# sourceMappingURL=vgsidebar.css.map */
1
+ @charset "UTF-8";
2
+ /**
3
+ *--------------------------------------------------------------------------
4
+ * Модуль: VGSidebar
5
+ * Автор: Vegas DEV
6
+ * Лицензия: смотри LICENSE
7
+ *--------------------------------------------------------------------------
8
+ **/
9
+ .vg-sidebar {
10
+ --vg-sidebar-horizontal-width: 400px ;
11
+ --vg-sidebar-horizontal-height: 100vh ;
12
+ --vg-sidebar-vertical-width: 100vw ;
13
+ --vg-sidebar-vertical-height: 30vh ;
14
+ --vg-sidebar-bg-color: #fff ;
15
+ --vg-sidebar-color: #000000 ;
16
+ --vg-sidebar-box-shadow: 0 8px 14px 5px rgba(0, 0, 0, 0.2) ;
17
+ --vg-sidebar-header-height: 60px ;
18
+ --vg-sidebar-footer-height: 70px ;
19
+ --vg-sidebar-padding: 1rem ;
20
+ --vg-sidebar-border: 1px solid rgba(0, 0, 0, 0.2) ;
21
+ --vg-sidebar-z-index: 1040 ;
22
+ --vg-sidebar-transition: all 0.5s ease-in-out ;
23
+ position: fixed;
24
+ width: auto;
25
+ height: auto;
26
+ transition: var(--vg-sidebar-transition);
27
+ z-index: var(--vg-sidebar-z-index);
28
+ background: var(--vg-sidebar-bg-color);
29
+ color: var(--vg-sidebar-color);
30
+ box-shadow: var(--vg-sidebar-box-shadow);
31
+ }
32
+ .vg-sidebar.left, .vg-sidebar.right {
33
+ width: var(--vg-sidebar-horizontal-width);
34
+ height: var(--vg-sidebar-horizontal-height);
35
+ top: 0;
36
+ }
37
+ .vg-sidebar.left {
38
+ left: -105%;
39
+ }
40
+ .vg-sidebar.left.show {
41
+ left: 0;
42
+ }
43
+ .vg-sidebar.right {
44
+ right: -105%;
45
+ }
46
+ .vg-sidebar.right.show {
47
+ right: 0;
48
+ }
49
+ .vg-sidebar.top, .vg-sidebar.bottom {
50
+ height: var(--vg-sidebar-vertical-height);
51
+ width: var(--vg-sidebar-vertical-width);
52
+ left: 0;
53
+ }
54
+ .vg-sidebar.top {
55
+ top: -105%;
56
+ }
57
+ .vg-sidebar.top.show {
58
+ top: 0;
59
+ }
60
+ .vg-sidebar.bottom {
61
+ bottom: -105%;
62
+ }
63
+ .vg-sidebar.bottom.show {
64
+ bottom: 0;
65
+ }
66
+ .vg-sidebar-header {
67
+ height: var(--vg-sidebar-header-height);
68
+ z-index: 10;
69
+ position: relative;
70
+ display: flex;
71
+ align-items: center;
72
+ padding: var(--vg-sidebar-padding);
73
+ border-bottom: var(--vg-sidebar-border);
74
+ }
75
+ .vg-sidebar-body {
76
+ height: calc(100% - var(--vg-sidebar-header-height) - var(--vg-sidebar-footer-height));
77
+ overflow-y: auto;
78
+ padding: var(--vg-sidebar-padding);
79
+ }
80
+ .vg-sidebar-footer {
81
+ height: var(--vg-sidebar-footer-height);
82
+ padding: var(--vg-sidebar-padding);
83
+ border-top: var(--vg-sidebar-border);
84
+ }
85
+
86
+ /*# sourceMappingURL=vgsidebar.css.map */