vgapp 1.5.7 → 1.5.9

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 (111) hide show
  1. package/app/langs/en/buttons.json +17 -17
  2. package/app/langs/en/messages.json +36 -36
  3. package/app/langs/ru/buttons.json +17 -17
  4. package/app/langs/ru/messages.json +1 -1
  5. package/app/modules/vgalert/js/vgalert.js +15 -12
  6. package/app/modules/vgalert/scss/_variables.scss +16 -16
  7. package/app/modules/vgalert/scss/vgalert.scss +13 -6
  8. package/app/modules/vgcollapse/scss/_variables.scss +7 -7
  9. package/app/modules/vgcollapse/scss/vgcollapse.scss +5 -5
  10. package/app/modules/vgdropdown/scss/_variables.scss +14 -14
  11. package/app/modules/vgdropdown/scss/vgdropdown.scss +5 -5
  12. package/app/modules/vgfilepreview/js/i18n.js +56 -56
  13. package/app/modules/vgfilepreview/js/renderers/image-modal.js +145 -145
  14. package/app/modules/vgfilepreview/js/renderers/image.js +92 -92
  15. package/app/modules/vgfilepreview/js/renderers/index.js +19 -19
  16. package/app/modules/vgfilepreview/js/renderers/office-modal.js +168 -168
  17. package/app/modules/vgfilepreview/js/renderers/office.js +79 -79
  18. package/app/modules/vgfilepreview/js/renderers/pdf-modal.js +260 -260
  19. package/app/modules/vgfilepreview/js/renderers/pdf.js +76 -76
  20. package/app/modules/vgfilepreview/js/renderers/playlist.js +71 -71
  21. package/app/modules/vgfilepreview/js/renderers/text-modal.js +343 -343
  22. package/app/modules/vgfilepreview/js/renderers/text.js +83 -83
  23. package/app/modules/vgfilepreview/js/renderers/zip-modal.js +522 -522
  24. package/app/modules/vgfilepreview/js/renderers/zip.js +89 -89
  25. package/app/modules/vgfilepreview/readme.md +68 -68
  26. package/app/modules/vgfiles/js/base.js +198 -198
  27. package/app/modules/vgfiles/js/droppable.js +17 -17
  28. package/app/modules/vgfiles/js/render.js +153 -153
  29. package/app/modules/vgfiles/js/sortable.js +52 -52
  30. package/app/modules/vgfiles/js/vgfiles.js +43 -43
  31. package/app/modules/vgfiles/readme.md +123 -123
  32. package/app/modules/vgfiles/scss/_mixins.scss +13 -13
  33. package/app/modules/vgfiles/scss/_variables.scss +10 -10
  34. package/app/modules/vgfiles/scss/vgfiles.scss +28 -28
  35. package/app/modules/vgformsender/js/hideshowpass.js +22 -22
  36. package/app/modules/vgformsender/readme.md +1 -1
  37. package/app/modules/vgformsender/scss/_variables.scss +5 -5
  38. package/app/modules/vgformsender/scss/vgformsender.scss +42 -42
  39. package/app/modules/vglawcookie/js/vglawcookie.js +19 -19
  40. package/app/modules/vglawcookie/scss/_variables.scss +13 -13
  41. package/app/modules/vglawcookie/scss/vglawcookie.scss +5 -5
  42. package/app/modules/vgmodal/js/vgmodal.interaction.js +216 -216
  43. package/app/modules/vgmodal/js/vgmodal.js +9 -9
  44. package/app/modules/vgmodal/js/vgmodal.minimized.js +227 -227
  45. package/app/modules/vgmodal/scss/_variables.scss +17 -17
  46. package/app/modules/vgmodal/scss/vgmodal.scss +77 -77
  47. package/app/modules/vgnav/js/vgnav.js +137 -84
  48. package/app/modules/vgnav/scss/_breakpoints.scss +36 -36
  49. package/app/modules/vgnav/scss/_hamburger.scss +5 -5
  50. package/app/modules/vgnav/scss/_placement.scss +5 -5
  51. package/app/modules/vgnav/scss/_toggle.scss +5 -5
  52. package/app/modules/vgnav/scss/_variables.scss +26 -26
  53. package/app/modules/vgnav/scss/vgnav.scss +41 -41
  54. package/app/modules/vgnestable/README.md +39 -39
  55. package/app/modules/vgrangeslider/js/skins.js +8 -8
  56. package/app/modules/vgrangeslider/js/vgrangeslider.js +29 -29
  57. package/app/modules/vgrangeslider/scss/_variables.scss +55 -55
  58. package/app/modules/vgrangeslider/scss/vgrangeslider.scss +239 -239
  59. package/app/modules/vgrollup/js/vgrollup.js +15 -15
  60. package/app/modules/vgrollup/scss/_variables.scss +15 -15
  61. package/app/modules/vgrollup/scss/vgrollup.scss +6 -6
  62. package/app/modules/vgselect/js/handlers.js +6 -6
  63. package/app/modules/vgselect/js/vgselect.js +167 -123
  64. package/app/modules/vgselect/readme.md +11 -11
  65. package/app/modules/vgselect/scss/_variables.scss +51 -51
  66. package/app/modules/vgselect/scss/vgselect.scss +1 -1
  67. package/app/modules/vgsidebar/js/vgsidebar.js +21 -21
  68. package/app/modules/vgsidebar/scss/_variables.scss +10 -10
  69. package/app/modules/vgsidebar/scss/vgsidebar.scss +5 -5
  70. package/app/modules/vgspy/js/vgspy.js +43 -43
  71. package/app/modules/vgtable/js/_filters.js +10 -6
  72. package/app/modules/vgtable/js/_options.js +16 -16
  73. package/app/modules/vgtable/js/_pagination.js +118 -118
  74. package/app/modules/vgtable/js/_responsive.js +79 -79
  75. package/app/modules/vgtable/js/_sticky-header.js +349 -280
  76. package/app/modules/vgtable/js/vgtable.js +98 -98
  77. package/app/modules/vgtable/scss/_fixed-columns.scss +23 -25
  78. package/app/modules/vgtable/scss/_sorting.scss +6 -6
  79. package/app/modules/vgtable/scss/_sticky-header.scss +31 -31
  80. package/app/modules/vgtable/scss/_variables.scss +6 -4
  81. package/app/modules/vgtable/scss/vgtable.scss +8 -4
  82. package/app/modules/vgtabs/js/vgtabs.js +91 -91
  83. package/app/modules/vgtabs/scss/_variables.scss +23 -23
  84. package/app/modules/vgtabs/scss/vgtabs.scss +5 -5
  85. package/app/modules/vgtoast/js/vgtoast.js +4 -4
  86. package/app/modules/vgtoast/scss/_variables.scss +13 -13
  87. package/app/modules/vgtoast/scss/vgtoast.scss +5 -5
  88. package/app/modules/vgtooltip/js/vgtooltip.js +127 -127
  89. package/app/modules/vgtooltip/scss/_variables.scss +10 -10
  90. package/app/modules/vgtooltip/scss/vgtooltip.scss +5 -5
  91. package/app/utils/js/components/audio-metadata.js +240 -240
  92. package/app/utils/js/components/backdrop.js +116 -116
  93. package/app/utils/js/components/file-icon.js +7 -7
  94. package/app/utils/js/components/file-preview.js +304 -304
  95. package/app/utils/js/components/responsive.js +165 -165
  96. package/app/utils/js/components/sanitize.js +150 -150
  97. package/app/utils/js/components/video-metadata.js +140 -140
  98. package/app/utils/scss/_backdrop.scss +5 -5
  99. package/app/utils/scss/_theme-default.scss +12 -12
  100. package/app/utils/scss/_theme.scss +7 -7
  101. package/app/utils/scss/default.scss +9 -9
  102. package/app/utils/scss/functions.scss +21 -21
  103. package/app/utils/scss/index.scss +4 -4
  104. package/app/utils/scss/mixin.scss +16 -16
  105. package/app/utils/scss/variables.scss +147 -147
  106. package/build/vgapp.css +1 -1
  107. package/build/vgapp.css.map +1 -1
  108. package/build/vgapp.js +1 -1
  109. package/build/vgapp.js.map +1 -1
  110. package/index.js +7 -7
  111. package/package.json +1 -1
package/app/utils/scss/variables.scss CHANGED
@@ -1,147 +1,147 @@
1
- @use "sass:map";
2
- @use "functions" as fn;
3
- @use "tokens";
4
-
5
- // Semantic base values for Sass consumers. Runtime theme-aware components
6
- // should use the matching --vg-* custom properties.
7
- $body-bg: tokens.theme-token(tokens.$theme-light, body-bg) !default;
8
- $surface-bg: tokens.theme-token(tokens.$theme-light, surface-bg) !default;
9
- $surface-raised-bg: tokens.theme-token(tokens.$theme-light, surface-raised-bg) !default;
10
- $surface-muted-bg: tokens.theme-token(tokens.$theme-light, surface-muted-bg) !default;
11
- $surface-hover-bg: tokens.theme-token(tokens.$theme-light, surface-hover-bg) !default;
12
- $surface-active-bg: tokens.theme-token(tokens.$theme-light, surface-active-bg) !default;
13
-
14
- // Legacy aliases. Keep these until every component has moved to semantic tokens.
15
- $bg-color: $surface-bg !default;
16
- $bg-color-active: $surface-active-bg !default;
17
-
18
- // -- Colors
19
- $color: tokens.theme-token(tokens.$theme-light, text-color) !default;
20
- $color-emphasis: tokens.theme-token(tokens.$theme-light, text-emphasis-color) !default;
21
- $color-muted: tokens.theme-token(tokens.$theme-light, text-muted-color) !default;
22
- $color-active: tokens.theme-token(tokens.$theme-light, primary-color) !default;
23
- $color-disabled: tokens.theme-token(tokens.$theme-light, text-disabled-color) !default;
24
- $color-inverse: tokens.theme-token(tokens.$theme-light, text-inverse-color) !default;
25
-
26
- // -- Shadows
27
- $box-shadow: tokens.theme-token(tokens.$theme-light, box-shadow) !default;
28
-
29
- // -- Borders
30
- $border-color: tokens.theme-token(tokens.$theme-light, border-color) !default;
31
- $border-color-strong: tokens.theme-token(tokens.$theme-light, border-strong-color) !default;
32
- $border-color-active: tokens.theme-token(tokens.$theme-light, primary-color) !default;
33
- $border-color-disabled: tokens.theme-token(tokens.$theme-light, border-disabled-color) !default;
34
- $border-radius: .375rem !default;
35
- $border-width: 1px !default;
36
- $border-style: solid !default;
37
-
38
- // -- Transitions
39
- $transition-base: all .5s ease-in-out !default;
40
-
41
- // -- Backdrop
42
- $backdrop-bg: tokens.theme-token(tokens.$theme-light, backdrop-color) !default;
43
- $backdrop-opacity: .4 !default;
44
-
45
- // Z-indexes
46
- $sidebar-index: 1040;
47
- $dropdown-index: 1010;
48
- $modal-index: 1040;
49
- $backdrop-index: 999;
50
- $lawcookie-index: 2000;
51
- $toast-index: 1050;
52
-
53
- // Backdrop map
54
- $backdrop-map: (
55
- bg: $backdrop-bg,
56
- opacity: $backdrop-opacity,
57
- z-index: $backdrop-index,
58
- transition: $transition-base,
59
- );
60
-
61
- $loader-map: (
62
- border-width: .75em,
63
- border-style: solid,
64
- border-color: rgba(0, 0, 0, 0.2),
65
- color: rgb(33, 37, 41),
66
- font-size: 10px,
67
- margin: 30px auto,
68
- animation: vgLoader 1.1s infinite linear,
69
- transform: translateZ(0)
70
- );
71
-
72
- // Colors Status
73
- $danger: tokens.theme-token(tokens.$theme-light, danger-color) !default;
74
- $danger-border: tokens.theme-token(tokens.$theme-light, danger-border-color) !default;
75
- $danger-text: tokens.theme-token(tokens.$theme-light, danger-text-color) !default;
76
- $danger-bg: tokens.theme-token(tokens.$theme-light, danger-bg) !default;
77
-
78
- $success: tokens.theme-token(tokens.$theme-light, success-color) !default;
79
- $success-border: tokens.theme-token(tokens.$theme-light, success-border-color) !default;
80
- $success-text: tokens.theme-token(tokens.$theme-light, success-text-color) !default;
81
- $success-bg: tokens.theme-token(tokens.$theme-light, success-bg) !default;
82
-
83
- $warning: tokens.theme-token(tokens.$theme-light, warning-color) !default;
84
- $warning-border: tokens.theme-token(tokens.$theme-light, warning-border-color) !default;
85
- $warning-text: tokens.theme-token(tokens.$theme-light, warning-text-color) !default;
86
- $warning-bg: tokens.theme-token(tokens.$theme-light, warning-bg) !default;
87
-
88
- $info: tokens.theme-token(tokens.$theme-light, info-color) !default;
89
- $info-border: tokens.theme-token(tokens.$theme-light, info-border-color) !default;
90
- $info-text: tokens.theme-token(tokens.$theme-light, info-text-color) !default;
91
- $info-bg: tokens.theme-token(tokens.$theme-light, info-bg) !default;
92
-
93
- $dark: #232323;
94
- $dark-border: fn.shade-color($dark, 60%) !default;
95
- $dark-text: fn.tint-color($dark, 60%) !default;
96
- $dark-bg: fn.shade-color($dark, 80%) !default;
97
-
98
- $success-map: (
99
- icon: var(--vg-success-color, #{$success}),
100
- color: var(--vg-success-text-color, #{$success-text}),
101
- border-color: var(--vg-success-border-color, #{$success-border}),
102
- background-color: var(--vg-success-bg, #{$success-bg}),
103
- close: var(--vg-success-close-color, #{fn.shade-color($success-text, 80%)})
104
- );
105
-
106
- $danger-map: (
107
- icon: var(--vg-danger-color, #{$danger}),
108
- color: var(--vg-danger-text-color, #{$danger-text}),
109
- border-color: var(--vg-danger-border-color, #{$danger-border}),
110
- background-color: var(--vg-danger-bg, #{$danger-bg}),
111
- close: var(--vg-danger-close-color, #{fn.shade-color($danger-text, 80%)})
112
- );
113
-
114
- $warning-map: (
115
- icon: var(--vg-warning-color, #{$warning}),
116
- color: var(--vg-warning-text-color, #{$warning-text}),
117
- border-color: var(--vg-warning-border-color, #{$warning-border}),
118
- background-color: var(--vg-warning-bg, #{$warning-bg}),
119
- close: var(--vg-warning-close-color, #{fn.shade-color($warning-text, 80%)})
120
- );
121
-
122
- $info-map: (
123
- icon: var(--vg-info-color, #{$info}),
124
- color: var(--vg-info-text-color, #{$info-text}),
125
- border-color: var(--vg-info-border-color, #{$info-border}),
126
- background-color: var(--vg-info-bg, #{$info-bg}),
127
- close: var(--vg-info-close-color, #{fn.shade-color($info-text, 80%)})
128
- );
129
-
130
- $dark-map: (
131
- color: $dark-text,
132
- border-color: $dark-border,
133
- background-color: $dark-bg,
134
- close: fn.shade-color($dark-text, 80%)
135
- );
136
-
137
- $alert-colors: (
138
- success: $success-map,
139
- info: $info-map,
140
- warning: $warning-map,
141
- danger: $danger-map,
142
- dark: $dark-map,
143
- ) !default;
144
-
145
- @function get-alert-color($type) {
146
- @return map.get($alert-colors, $type);
147
- }
1
+ @use "sass:map";
2
+ @use "functions" as fn;
3
+ @use "tokens";
4
+
5
+ // Semantic base values for Sass consumers. Runtime theme-aware components
6
+ // should use the matching --vg-* custom properties.
7
+ $body-bg: tokens.theme-token(tokens.$theme-light, body-bg) !default;
8
+ $surface-bg: tokens.theme-token(tokens.$theme-light, surface-bg) !default;
9
+ $surface-raised-bg: tokens.theme-token(tokens.$theme-light, surface-raised-bg) !default;
10
+ $surface-muted-bg: tokens.theme-token(tokens.$theme-light, surface-muted-bg) !default;
11
+ $surface-hover-bg: tokens.theme-token(tokens.$theme-light, surface-hover-bg) !default;
12
+ $surface-active-bg: tokens.theme-token(tokens.$theme-light, surface-active-bg) !default;
13
+
14
+ // Legacy aliases. Keep these until every component has moved to semantic tokens.
15
+ $bg-color: $surface-bg !default;
16
+ $bg-color-active: $surface-active-bg !default;
17
+
18
+ // -- Colors
19
+ $color: tokens.theme-token(tokens.$theme-light, text-color) !default;
20
+ $color-emphasis: tokens.theme-token(tokens.$theme-light, text-emphasis-color) !default;
21
+ $color-muted: tokens.theme-token(tokens.$theme-light, text-muted-color) !default;
22
+ $color-active: tokens.theme-token(tokens.$theme-light, primary-color) !default;
23
+ $color-disabled: tokens.theme-token(tokens.$theme-light, text-disabled-color) !default;
24
+ $color-inverse: tokens.theme-token(tokens.$theme-light, text-inverse-color) !default;
25
+
26
+ // -- Shadows
27
+ $box-shadow: tokens.theme-token(tokens.$theme-light, box-shadow) !default;
28
+
29
+ // -- Borders
30
+ $border-color: tokens.theme-token(tokens.$theme-light, border-color) !default;
31
+ $border-color-strong: tokens.theme-token(tokens.$theme-light, border-strong-color) !default;
32
+ $border-color-active: tokens.theme-token(tokens.$theme-light, primary-color) !default;
33
+ $border-color-disabled: tokens.theme-token(tokens.$theme-light, border-disabled-color) !default;
34
+ $border-radius: .375rem !default;
35
+ $border-width: 1px !default;
36
+ $border-style: solid !default;
37
+
38
+ // -- Transitions
39
+ $transition-base: all .5s ease-in-out !default;
40
+
41
+ // -- Backdrop
42
+ $backdrop-bg: tokens.theme-token(tokens.$theme-light, backdrop-color) !default;
43
+ $backdrop-opacity: .4 !default;
44
+
45
+ // Z-indexes
46
+ $sidebar-index: 1040;
47
+ $dropdown-index: 1010;
48
+ $modal-index: 1040;
49
+ $backdrop-index: 999;
50
+ $lawcookie-index: 2000;
51
+ $toast-index: 1050;
52
+
53
+ // Backdrop map
54
+ $backdrop-map: (
55
+ bg: $backdrop-bg,
56
+ opacity: $backdrop-opacity,
57
+ z-index: $backdrop-index,
58
+ transition: $transition-base,
59
+ );
60
+
61
+ $loader-map: (
62
+ border-width: .75em,
63
+ border-style: solid,
64
+ border-color: rgba(0, 0, 0, 0.2),
65
+ color: rgb(33, 37, 41),
66
+ font-size: 10px,
67
+ margin: 30px auto,
68
+ animation: vgLoader 1.1s infinite linear,
69
+ transform: translateZ(0)
70
+ );
71
+
72
+ // Colors Status
73
+ $danger: tokens.theme-token(tokens.$theme-light, danger-color) !default;
74
+ $danger-border: tokens.theme-token(tokens.$theme-light, danger-border-color) !default;
75
+ $danger-text: tokens.theme-token(tokens.$theme-light, danger-text-color) !default;
76
+ $danger-bg: tokens.theme-token(tokens.$theme-light, danger-bg) !default;
77
+
78
+ $success: tokens.theme-token(tokens.$theme-light, success-color) !default;
79
+ $success-border: tokens.theme-token(tokens.$theme-light, success-border-color) !default;
80
+ $success-text: tokens.theme-token(tokens.$theme-light, success-text-color) !default;
81
+ $success-bg: tokens.theme-token(tokens.$theme-light, success-bg) !default;
82
+
83
+ $warning: tokens.theme-token(tokens.$theme-light, warning-color) !default;
84
+ $warning-border: tokens.theme-token(tokens.$theme-light, warning-border-color) !default;
85
+ $warning-text: tokens.theme-token(tokens.$theme-light, warning-text-color) !default;
86
+ $warning-bg: tokens.theme-token(tokens.$theme-light, warning-bg) !default;
87
+
88
+ $info: tokens.theme-token(tokens.$theme-light, info-color) !default;
89
+ $info-border: tokens.theme-token(tokens.$theme-light, info-border-color) !default;
90
+ $info-text: tokens.theme-token(tokens.$theme-light, info-text-color) !default;
91
+ $info-bg: tokens.theme-token(tokens.$theme-light, info-bg) !default;
92
+
93
+ $dark: #232323;
94
+ $dark-border: fn.shade-color($dark, 60%) !default;
95
+ $dark-text: fn.tint-color($dark, 60%) !default;
96
+ $dark-bg: fn.shade-color($dark, 80%) !default;
97
+
98
+ $success-map: (
99
+ icon: var(--vg-success-color, #{$success}),
100
+ color: var(--vg-success-text-color, #{$success-text}),
101
+ border-color: var(--vg-success-border-color, #{$success-border}),
102
+ background-color: var(--vg-success-bg, #{$success-bg}),
103
+ close: var(--vg-success-close-color, #{fn.shade-color($success-text, 80%)})
104
+ );
105
+
106
+ $danger-map: (
107
+ icon: var(--vg-danger-color, #{$danger}),
108
+ color: var(--vg-danger-text-color, #{$danger-text}),
109
+ border-color: var(--vg-danger-border-color, #{$danger-border}),
110
+ background-color: var(--vg-danger-bg, #{$danger-bg}),
111
+ close: var(--vg-danger-close-color, #{fn.shade-color($danger-text, 80%)})
112
+ );
113
+
114
+ $warning-map: (
115
+ icon: var(--vg-warning-color, #{$warning}),
116
+ color: var(--vg-warning-text-color, #{$warning-text}),
117
+ border-color: var(--vg-warning-border-color, #{$warning-border}),
118
+ background-color: var(--vg-warning-bg, #{$warning-bg}),
119
+ close: var(--vg-warning-close-color, #{fn.shade-color($warning-text, 80%)})
120
+ );
121
+
122
+ $info-map: (
123
+ icon: var(--vg-info-color, #{$info}),
124
+ color: var(--vg-info-text-color, #{$info-text}),
125
+ border-color: var(--vg-info-border-color, #{$info-border}),
126
+ background-color: var(--vg-info-bg, #{$info-bg}),
127
+ close: var(--vg-info-close-color, #{fn.shade-color($info-text, 80%)})
128
+ );
129
+
130
+ $dark-map: (
131
+ color: $dark-text,
132
+ border-color: $dark-border,
133
+ background-color: $dark-bg,
134
+ close: fn.shade-color($dark-text, 80%)
135
+ );
136
+
137
+ $alert-colors: (
138
+ success: $success-map,
139
+ info: $info-map,
140
+ warning: $warning-map,
141
+ danger: $danger-map,
142
+ dark: $dark-map,
143
+ ) !default;
144
+
145
+ @function get-alert-color($type) {
146
+ @return map.get($alert-colors, $type);
147
+ }