ros.grant.common 2.0.1051 → 2.0.1055

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 (7) hide show
  1. package/Shared/Styles/Layout/Card/Card.less +14 -5
  2. package/Shared/Styles/Layout/DashboardLayout/Content.less +334 -318
  3. package/Shared/Styles/Layout/DashboardLayout/Sidebar.less +4 -5
  4. package/Shared/Styles/Modules/Input/Checkbox.less +1 -0
  5. package/Shared/Styles/Modules/Modals/Modal.less +1 -1
  6. package/Shared/Styles/Modules/Table/custom-table.less +0 -2
  7. package/package.json +1 -1
package/Shared/Styles/Layout/Card/Card.less CHANGED
@@ -4,8 +4,8 @@
4
4
  box-shadow: var(--main_shadow);
5
5
  border-radius: 4px;
6
6
  padding: 24px;
7
- max-width: 1575px;
8
- margin: 0 auto;
7
+ max-width: 1096px;
8
+ // margin: 0 auto;
9
9
  margin-bottom: 20px;
10
10
  height: calc(~'100% - 20px');
11
11
  display: block;
@@ -339,7 +339,7 @@
339
339
  padding-bottom: 0;
340
340
  margin: 0 -24px;
341
341
  margin-top: -30px;
342
- margin-bottom: 12px;
342
+ margin-bottom: 24px;
343
343
  border-radius: 0px;
344
344
  min-height: 64px;
345
345
  max-width: initial;
@@ -347,13 +347,13 @@
347
347
  @media (max-width: 991px) {
348
348
  margin: 0 -20px;
349
349
  margin-top: -24px;
350
- margin-bottom: 12px;
350
+ margin-bottom: 24px;
351
351
  }
352
352
 
353
353
  @media (max-width: 768px) {
354
354
  margin: 0 -16px;
355
355
  margin-top: -24px;
356
- margin-bottom: 12px;
356
+ margin-bottom: 24px;
357
357
  }
358
358
 
359
359
  p {
@@ -366,6 +366,15 @@
366
366
  .btn {
367
367
  margin-bottom: 10px;
368
368
  }
369
+
370
+ .container {
371
+ max-width: 1096px;
372
+ display: flex;
373
+ align-items: center;
374
+ justify-content: space-between;
375
+ margin: initial;
376
+ padding: 0;
377
+ }
369
378
  }
370
379
 
371
380
  &.open {
package/Shared/Styles/Layout/DashboardLayout/Content.less CHANGED
@@ -1,320 +1,336 @@
1
1
  .page-container {
2
- display: flex;
3
- min-height: 100vh;
4
-
5
- .page-content {
6
- min-height: 60px;
7
- vertical-align: bottom;
8
- width: calc(~"100% - 280px");
9
- margin-left: auto;
10
-
11
- @media (max-width:991px) {
12
- width: 100%;
13
- }
14
-
15
- .page-header {
16
- background: #fff;
17
- box-shadow: 0px 4px 10px rgba(57, 52, 66, 0.15);
18
- border-bottom: 1px solid var(--Stroke);
19
- height: 60px;
20
- position: fixed;
21
- width: 100%;
22
- top: 0;
23
- left: 0;
24
- z-index: 10;
25
- display: flex;
26
- justify-content: space-between;
27
- align-items: center;
28
-
29
- .navbar {
30
- padding: 12px 30px;
31
-
32
- .user {
33
- display: flex;
34
- align-items: center;
35
- position: relative;
36
-
37
- .auth-nav-menu {
38
- position: absolute;
39
- right: 0;
40
- top: 40px;
41
- z-index: 100;
42
- background: #fff;
43
- box-shadow: 0px 4px 10px rgba(57, 52, 66, 0.15);
44
- border-radius: 4px;
45
- display: block !important;
46
- width: 215px;
47
- visibility: hidden;
48
- opacity: 0;
49
- transition: visibility 0.1s linear, opacity 0.1s linear;
50
-
51
- &__item {
52
-
53
- .nav-menu-text-link {
54
- padding: 15px 17px;
55
- display: flex;
56
- align-items: center;
57
- color: var(--Main1);
58
- font-size: 14px;
59
- line-height: 20px;
60
- transition: 0.2s;
61
- border-bottom: 1px solid var(--Stroke);
62
-
63
- &:hover {
64
- background: var(--Bg2);
65
- color: var(--Subsidiary);
66
- text-decoration: none;
67
- }
68
- }
69
-
70
- &:last-child {
71
- .nav-menu-text-link {
72
- border-bottom: none;
73
- }
74
- }
75
- }
76
- }
77
-
78
- &:hover {
79
- .auth-nav-menu {
80
- visibility: visible;
81
- opacity: 1;
82
- }
83
- }
84
-
85
- .info {
86
- display: flex;
87
- flex-direction: column;
88
- margin-right: 20px;
89
-
90
- span {
91
- text-align: right;
92
- }
93
-
94
- .name {
95
- font-size: 12px;
96
- line-height: 16px;
97
- color: #8F859F;
98
- }
99
-
100
- .select-profile {
101
- line-height: 19px;
102
- }
103
-
104
- @media (max-width:991px) {
105
- display: none;
106
- }
107
- }
108
-
109
- img {
110
- width: 37px;
111
- height: 37px;
112
- object-fit: cover;
113
- border-radius: 100%;
114
- border: 1px solid var(--Stroke);
115
- }
116
- }
117
- }
118
-
119
- .logo {
120
- display: flex;
121
- align-items: center;
122
- height: 60px;
123
- padding-left: 40px;
124
- width: 280px;
125
- box-shadow: 4px 0px 10px rgba(57, 52, 66, 0.15);
126
-
127
- .logo-img {
128
- height: 100%;
129
- display: flex;
130
- align-items: center;
131
- }
132
-
133
- .desktop-logo {
134
- width: 155px;
135
- height: 80%;
136
- }
137
-
138
- img {
139
- display: block;
140
- }
141
-
142
- @media (max-width:991px) {
143
- box-shadow: none;
144
- padding-left: 0;
145
- width: auto;
146
- }
147
- }
148
-
149
- .burger {
150
- width: 24px;
151
- height: 24px;
152
- position: relative;
153
- overflow: hidden;
154
- margin-left: 24px;
155
- margin-right: 24px;
156
-
157
- input {
158
- display: none;
159
- }
160
-
161
- input:checked~label {
162
- transform: rotate(90deg);
163
-
164
- .bar-1 {
165
- top: 10px;
166
- transform: rotate(45deg);
167
- }
168
-
169
- .bar-2 {
170
- left: 100%;
171
- }
172
-
173
- .bar-3 {
174
- top: 10px;
175
- transform: rotate(-45deg);
176
- }
177
- }
178
-
179
- label {
180
- width: 24px;
181
- height: 24px;
182
- display: block;
183
- transition: all .35s;
184
- cursor: pointer;
185
-
186
- &:before {
187
- display: none !important;
188
- }
189
- }
190
-
191
- .bar {
192
- width: 100%;
193
- height: 2px;
194
- display: block;
195
- position: absolute;
196
- left: 0;
197
- background: #393442;
198
- border-radius: 10px;
199
- transition: all .35s;
200
- pointer-events: none;
201
-
202
- &-1 {
203
- top: 6px;
204
- }
205
-
206
- &-2 {
207
- top: 12px;
208
- }
209
-
210
- &-3 {
211
- top: 18px;
212
- }
213
- }
214
- }
215
-
216
- #sidebar-toggle-button {
217
- display: none;
218
-
219
- @media (max-width:991px) {
220
- display: block;
221
- }
222
- }
223
- }
224
-
225
- .page-inner {
226
- background: var(--Bg1);
227
- width: 100%;
228
- min-height: 100%;
229
- position: relative;
230
- padding: 30px 24px;
231
- margin-top: 60px;
232
-
233
- @media (max-width: 991px) {
234
- padding: 24px 20px;
235
- }
236
-
237
- @media (max-width: 768px) {
238
- padding: 24px 10px;
239
- }
240
-
241
- &__header {
242
- display: flex;
243
- align-items: center;
244
- justify-content: space-between;
245
- flex-wrap: wrap;
246
- max-width: 1575px;
247
- margin: 0 auto;
248
- margin-bottom: 8px;
249
-
250
- h1 {
251
- font-weight: bold;
252
- font-size: 24px;
253
- line-height: 32px;
254
- margin-bottom: 8px;
255
- margin-top: 0;
256
- padding: 0;
257
- line-height: 1;
258
- }
259
-
260
- .breadcrumbs {
261
- padding: 0;
262
- }
263
- }
264
-
265
- .toggle-component {
266
- background: #fff;
267
- box-shadow: 0px 2px 6px rgba(57, 52, 66, 0.05);
268
- border-radius: 4px;
269
- height: 48px;
270
- display: flex;
271
- align-items: center;
272
- color: #8F859F;
273
- font-size: 16px;
274
-
275
- &__item {
276
- display: flex;
277
- align-items: center;
278
- justify-content: center;
279
- text-align: center;
280
- padding: 0 20px;
281
- height: 38px;
282
-
283
- svg {
284
- margin-right: 12px;
285
- }
286
-
287
- &:first-child {
288
- border-right: 1px solid var(--Stroke);
289
- }
290
- }
291
-
292
- &.tabs {
293
- color: inherit;
294
-
295
- .toggle-component__item {
296
- height: 100%;
297
- border: none;
298
- font-weight: 600;
299
- border: 1px solid transparent;
300
- transition: 0.5s;
301
- cursor: pointer;
302
-
303
- &.active {
304
- border: 1px solid var(--Main2);
305
- color: var(--Main2);
306
- }
307
-
308
- &:first-child {
309
- border-radius: 4px 0px 0px 4px;
310
- }
311
-
312
- &:last-child {
313
- border-radius: 0px 4px 4px 0px;
314
- }
315
- }
316
- }
317
- }
318
- }
319
- }
2
+ display: flex;
3
+ min-height: 100vh;
4
+
5
+ .page-content {
6
+ min-height: 72px;
7
+ vertical-align: bottom;
8
+ width: calc(~"100% - 280px");
9
+ margin-left: auto;
10
+
11
+ @media (max-width:991px) {
12
+ width: 100%;
13
+ }
14
+
15
+ .page-header {
16
+ background: #fff;
17
+ border-bottom: 1px solid var(--Bg1);
18
+ height: 72px;
19
+ position: fixed;
20
+ width: 100%;
21
+ top: 0;
22
+ left: 0;
23
+ z-index: 10;
24
+ display: flex;
25
+ justify-content: space-between;
26
+ align-items: center;
27
+
28
+ .navbar {
29
+ padding: 12px 30px;
30
+
31
+ .user {
32
+ display: flex;
33
+ align-items: center;
34
+ position: relative;
35
+
36
+ .auth-nav-menu {
37
+ position: absolute;
38
+ right: 0;
39
+ top: 40px;
40
+ z-index: 100;
41
+ background: #fff;
42
+ box-shadow: 0px 4px 10px rgba(57, 52, 66, 0.15);
43
+ border-radius: 4px;
44
+ display: block !important;
45
+ width: 215px;
46
+ visibility: hidden;
47
+ opacity: 0;
48
+ transition: visibility 0.1s linear, opacity 0.1s linear;
49
+
50
+ &__item {
51
+
52
+ .nav-menu-text-link {
53
+ padding: 15px 17px;
54
+ display: flex;
55
+ align-items: center;
56
+ color: var(--Main1);
57
+ font-size: 14px;
58
+ line-height: 20px;
59
+ transition: 0.2s;
60
+ border-bottom: 1px solid var(--Stroke);
61
+
62
+ &:hover {
63
+ background: var(--Bg2);
64
+ color: var(--Subsidiary);
65
+ text-decoration: none;
66
+ }
67
+ }
68
+
69
+ &:last-child {
70
+ .nav-menu-text-link {
71
+ border-bottom: none;
72
+ }
73
+ }
74
+ }
75
+ }
76
+
77
+ &:hover {
78
+ .auth-nav-menu {
79
+ visibility: visible;
80
+ opacity: 1;
81
+ }
82
+ }
83
+
84
+ .info {
85
+ display: flex;
86
+ flex-direction: column;
87
+ margin-right: 20px;
88
+
89
+ span {
90
+ text-align: right;
91
+ }
92
+
93
+ .name {
94
+ font-size: 12px;
95
+ line-height: 16px;
96
+ color: #8F859F;
97
+ }
98
+
99
+ .select-profile {
100
+ line-height: 19px;
101
+ }
102
+
103
+ @media (max-width:991px) {
104
+ display: none;
105
+ }
106
+ }
107
+
108
+ img {
109
+ width: 37px;
110
+ height: 37px;
111
+ object-fit: cover;
112
+ border-radius: 100%;
113
+ border: 1px solid var(--Stroke);
114
+ }
115
+ }
116
+ }
117
+
118
+ .logo {
119
+ display: flex;
120
+ align-items: center;
121
+ height: 72px;
122
+ padding-left: 24px;
123
+
124
+ .logo-img {
125
+ height: 100%;
126
+ display: flex;
127
+ align-items: center;
128
+ padding: 4px 0;
129
+ }
130
+
131
+ .desktop-logo {
132
+ max-height: 64px;
133
+ }
134
+
135
+ img {
136
+ display: block;
137
+ }
138
+
139
+ @media (max-width:991px) {
140
+ box-shadow: none;
141
+ padding-left: 0;
142
+ width: auto;
143
+ }
144
+ }
145
+
146
+ .burger {
147
+ width: 24px;
148
+ height: 24px;
149
+ position: relative;
150
+ overflow: hidden;
151
+ margin-left: 24px;
152
+ margin-right: 24px;
153
+
154
+ input {
155
+ display: none;
156
+ }
157
+
158
+ input:checked~label {
159
+ transform: rotate(90deg);
160
+
161
+ .bar-1 {
162
+ top: 10px;
163
+ transform: rotate(45deg);
164
+ }
165
+
166
+ .bar-2 {
167
+ left: 100%;
168
+ }
169
+
170
+ .bar-3 {
171
+ top: 10px;
172
+ transform: rotate(-45deg);
173
+ }
174
+ }
175
+
176
+ label {
177
+ width: 24px;
178
+ height: 24px;
179
+ display: block;
180
+ transition: all .35s;
181
+ cursor: pointer;
182
+
183
+ &:before {
184
+ display: none !important;
185
+ }
186
+ }
187
+
188
+ .bar {
189
+ width: 100%;
190
+ height: 2px;
191
+ display: block;
192
+ position: absolute;
193
+ left: 0;
194
+ background: #393442;
195
+ border-radius: 10px;
196
+ transition: all .35s;
197
+ pointer-events: none;
198
+
199
+ &-1 {
200
+ top: 6px;
201
+ }
202
+
203
+ &-2 {
204
+ top: 12px;
205
+ }
206
+
207
+ &-3 {
208
+ top: 18px;
209
+ }
210
+ }
211
+ }
212
+
213
+ #sidebar-toggle-button {
214
+ display: none;
215
+
216
+ @media (max-width:991px) {
217
+ display: block;
218
+ }
219
+ }
220
+ }
221
+
222
+ .page-inner {
223
+ background: var(--Bg1);
224
+ width: 100%;
225
+ min-height: 100%;
226
+ position: relative;
227
+ padding: 30px 24px;
228
+ margin-top: 72px;
229
+
230
+ @media (max-width: 991px) {
231
+ padding: 24px 20px;
232
+ }
233
+
234
+ @media (max-width: 768px) {
235
+ padding: 24px 10px;
236
+ }
237
+
238
+ &__header {
239
+ display: flex;
240
+ align-items: center;
241
+ justify-content: space-between;
242
+ flex-wrap: wrap;
243
+ max-width: 1096px;
244
+ // margin: 0 auto;
245
+ margin-bottom: 8px;
246
+
247
+ h1 {
248
+ font-weight: bold;
249
+ font-size: 24px;
250
+ line-height: 32px;
251
+ margin-bottom: 8px;
252
+ margin-top: 0;
253
+ padding: 0;
254
+ line-height: 1;
255
+ }
256
+
257
+ .breadcrumbs {
258
+ padding: 0;
259
+ }
260
+ }
261
+
262
+ .toggle-component {
263
+ background: #fff;
264
+ box-shadow: 0px 2px 6px rgba(57, 52, 66, 0.05);
265
+ border-radius: 4px;
266
+ height: 48px;
267
+ display: flex;
268
+ align-items: center;
269
+ color: #8F859F;
270
+ font-size: 16px;
271
+
272
+ &__item {
273
+ display: flex;
274
+ align-items: center;
275
+ justify-content: center;
276
+ text-align: center;
277
+ padding: 0 20px;
278
+ height: 38px;
279
+
280
+ svg {
281
+ margin-right: 12px;
282
+ }
283
+
284
+ &:first-child {
285
+ border-right: 1px solid var(--Stroke);
286
+ }
287
+ }
288
+
289
+ &.tabs {
290
+ color: inherit;
291
+
292
+ .toggle-component__item {
293
+ height: 100%;
294
+ border: none;
295
+ font-weight: 600;
296
+ border: 1px solid transparent;
297
+ transition: 0.5s;
298
+ cursor: pointer;
299
+
300
+ &.active {
301
+ border: 1px solid var(--Main2);
302
+ color: var(--Main2);
303
+ }
304
+
305
+ &:first-child {
306
+ border-radius: 4px 0px 0px 4px;
307
+ }
308
+
309
+ &:last-child {
310
+ border-radius: 0px 4px 4px 0px;
311
+ }
312
+ }
313
+ }
314
+ }
315
+ }
316
+ }
317
+ }
318
+
319
+ @media (min-width: 1704px) {
320
+ .page-container .page-content {
321
+ width: 100%;
322
+ }
323
+
324
+ .page-container .page-content .page-inner__header,
325
+ .page-container .card {
326
+ margin-left: auto;
327
+ margin-right: auto;
328
+ }
329
+
330
+ .page-container .card.info-baner {
331
+ padding-left: 0;
332
+ padding-right: 0;
333
+ justify-content: center;
334
+ margin-left: auto;
335
+ }
320
336
  }
package/Shared/Styles/Layout/DashboardLayout/Sidebar.less CHANGED
@@ -2,12 +2,12 @@
2
2
  width: 280px;
3
3
  position: fixed;
4
4
  background: #fff;
5
- top: 60px;
5
+ top: 72px;
6
6
  bottom: 0;
7
7
  z-index: 100;
8
8
  height: 100% !important;
9
9
  transition: all 0.2s ease-in-out;
10
- z-index: 4;
10
+ z-index: 11;
11
11
 
12
12
  @media (max-width: 991px) {
13
13
  left: -100%;
@@ -23,7 +23,7 @@
23
23
  width: 250px !important;
24
24
  left: -264px;
25
25
  transition: all 0.2s ease-in-out;
26
- top: 61px;
26
+ top: 73px;
27
27
  bottom: 60px;
28
28
  z-index: 2;
29
29
  background: #fff;
@@ -71,7 +71,6 @@
71
71
  position: relative;
72
72
  cursor: pointer;
73
73
  border-left: 4px solid transparent;
74
- border-bottom: 1px solid var(--Bg2);
75
74
  transition: 0.2s;
76
75
 
77
76
  *{
@@ -205,7 +204,7 @@
205
204
 
206
205
  .sidebar-footer {
207
206
  background: #fff;
208
- border-top: 1px solid var(--Stroke);
207
+ border-top: 1px solid var(--Bg1);
209
208
  clear: both;
210
209
  bottom: 0;
211
210
  display: flex;
package/Shared/Styles/Modules/Input/Checkbox.less CHANGED
@@ -6,6 +6,7 @@
6
6
  min-height: auto !important;
7
7
  cursor: pointer;
8
8
  box-sizing: border-box;
9
+ position: relative;
9
10
 
10
11
  .checkbox-container {
11
12
  width: auto;
package/Shared/Styles/Modules/Modals/Modal.less CHANGED
@@ -542,7 +542,7 @@
542
542
  //Дубль стилей для Angular
543
543
  &-content {
544
544
  width: calc(100vw - 20px);
545
-
545
+
546
546
  &.sm {
547
547
  max-width: 440px;
548
548
  /* Ширина модального окна */
package/Shared/Styles/Modules/Table/custom-table.less CHANGED
@@ -92,8 +92,6 @@
92
92
  table {
93
93
  width: 100%;
94
94
  text-align: left;
95
- min-width: 1000px;
96
- margin-bottom: 1rem;
97
95
  background-color: transparent;
98
96
  border-spacing: 0;
99
97
 
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "2.0.1051",
2
+ "version": "2.0.1055",
3
3
  "name": "ros.grant.common",
4
4
  "private": false,
5
5
  "description": "Collection of static files used by RosGrant awesome team",