welcome_css 0.1 → 0.5

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.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 1ded7197fcfc5e05557c8b497c1bf9a864460d02fe52cf8934a687b6c8b2e4fa
4
- data.tar.gz: 7159011a03379e18bab85f9e411fec0f813433a184e8c6cdad567d039c4eff89
3
+ metadata.gz: cc3ec94931552e1b9e3b2f288326a8b73077854a6e3b91ac7ee1d4090cd62720
4
+ data.tar.gz: 0751c3316ab8475525cfc21676ca88ab10cb80b510cf656ec1739b2a269fb8fe
5
5
  SHA512:
6
- metadata.gz: 628dcd1693558f1021f8f3a8b6479538e868781b33c57aecc1c70e2ea274fd31b6c70730a7dedac383d767d630008594e55fe40642a995cd9c6a95d40a6955a1
7
- data.tar.gz: f0f417084ea1ed1c312b519f07b71829a2c17af45828aa6aaf94a4256f92fd4c040525ecee71f39f07845f9d3e4928e65e1ddeb2c6e193bd4fb95f5aab623495
6
+ metadata.gz: 58a75322e8bbe7ea100d0db0cffdc0e2ea3feda68485fbee8d1c5d46e3bd79b2eb64ec4b22431d67b3cc05cbc84b90e929675d50c5aa48af724a52524a48d08d
7
+ data.tar.gz: f5745587e267dee02731e13fda95a24fad6990fc371c9a44c054dcd5880f27da8ba02c8db5bbf5f2159402ee16e486f8e4bfa61091738d4235ad80db5df21e63
data/README.md CHANGED
@@ -1,14 +1,11 @@
1
- # WelcomeCss
2
- Short description and motivation.
3
-
4
- ## Usage
5
- How to use my plugin.
1
+ # Welcome CSS
2
+ The gems serves as a wrapper for the basic styling of all the components that we use on our admin systems and internal applications.
6
3
 
7
4
  ## Installation
8
5
  Add this line to your application's Gemfile:
9
6
 
10
7
  ```ruby
11
- gem 'welcome_css'
8
+ gem 'welcome_css', '~> 0.1'
12
9
  ```
13
10
 
14
11
  And then execute:
@@ -16,13 +13,25 @@ And then execute:
16
13
  $ bundle
17
14
  ```
18
15
 
19
- Or install it yourself as:
20
- ```bash
21
- $ gem install welcome_css
16
+ ## Usage
17
+ This gem provides a `welcome.css` stylesheet with the basic styling and all the components for our admin stylesheets.
18
+
19
+ To use it just import the stylesheet into your layout:
20
+
21
+ ```ruby
22
+ # app/views/layouts/application.html.erb
23
+ <%= stylesheet_link_tag 'welcome', media: 'all', 'data-turbolinks-track': 'reload' %>
22
24
  ```
23
25
 
24
- ## Contributing
25
- Contribution directions go here.
26
+ or if you want you can include it into your custom stylesheet:
27
+
28
+ ```scss
29
+ // app/assets/stylesheets/application.scss
30
+
31
+ @import "welcome";
32
+
33
+ // The rest of your custom styles goes here.
34
+ ```
26
35
 
27
36
  ## License
28
37
  The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
@@ -96,3 +96,42 @@
96
96
  color: $ui_white;
97
97
  border-color: $ui_back;
98
98
  }
99
+ .main-app .main-content .was-validated .form-control:valid, .form-control.is-valid {
100
+ background-image: none;
101
+ }
102
+
103
+ /* ========================================= */
104
+
105
+ #ui-tabs .btn.btn-select {
106
+ border: 1px solid #D9D9D9;
107
+ background-color: $ui_white;
108
+ margin-top: 30px;
109
+ margin-left: 0px;
110
+ width: 420px;
111
+ text-align: left;
112
+ padding: 8px 15px !important;
113
+ background-image: image-url('icons/icn-submenu.svg');
114
+ background-repeat: no-repeat;
115
+ background-size: 8px;
116
+ background-position: right 10px top 18px;
117
+ }
118
+ #ui-tabs .dropdown.dropdown-select .dropdown-menu {
119
+ width: 420px;
120
+ }
121
+ .btn-dot {
122
+ top: 6px;
123
+ background-color: #fff;
124
+ display: block;
125
+ float: left;
126
+ position: relative;
127
+ width: 30px;
128
+ height: 30px;
129
+ text-align: center;
130
+ box-shadow: -1px 1px 5px -1px rgba(123,123,123,0.25);
131
+ -webkit-box-shadow: -1px 1px 5px -1px rgba(123,123,123,0.25);
132
+ -moz-box-shadow: -1px 1px 5px -1px rgba(123,123,123,0.25);
133
+ }
134
+ .btn-dot img {
135
+ width: 4px;
136
+ margin-top: -12px;
137
+ }
@@ -16,8 +16,8 @@
16
16
  border-left: 2px solid $ui_blue;
17
17
  }
18
18
  .land-app .menu-app .list-group-item:first-child {
19
- border-top-left-radius: 0;
20
- border-top-right-radius: 0;
19
+ border-top-left-radius: 0 !important;
20
+ border-top-right-radius: 0 !important;
21
21
  }
22
22
  .land-app .menu-app .list-group-item:last-child {
23
23
  border-bottom-right-radius: 0;
@@ -0,0 +1,591 @@
1
+
2
+
3
+ .dropup,
4
+ .dropright,
5
+ .dropdown,
6
+ .dropleft {
7
+ position: relative;
8
+ }
9
+
10
+ .dropdown-toggle:empty::after {
11
+ margin-left: 0;
12
+ }
13
+
14
+ .dropdown-menu {
15
+ position: absolute;
16
+ top: 100%;
17
+ left: 0;
18
+ z-index: 1000;
19
+ display: none;
20
+ float: left;
21
+ min-width: 12.31rem;
22
+ padding: 0.3846rem 0;
23
+ margin: 0.1538rem 0 0;
24
+ font-size: 1rem;
25
+ color: #555555;
26
+ text-align: left;
27
+ list-style: none;
28
+ background-color: #FFFFFF;
29
+ background-clip: padding-box;
30
+ border: 1px solid rgba(0, 0, 0, 0.1);
31
+ border-radius: 0;
32
+ }
33
+
34
+ .dropdown-menu-right {
35
+ right: 0;
36
+ left: auto;
37
+ }
38
+
39
+ .dropup .dropdown-menu {
40
+ top: auto;
41
+ bottom: 100%;
42
+ margin-top: 0;
43
+ margin-bottom: 0.1538rem;
44
+ }
45
+
46
+ .dropup .dropdown-toggle::after {
47
+ display: inline-block;
48
+ width: 0;
49
+ height: 0;
50
+ margin-left: 0.26146em;
51
+ vertical-align: 0.26146em;
52
+ content: "";
53
+ border-top: 0;
54
+ border-right: 0.3076em solid transparent;
55
+ border-bottom: 0.3076em solid;
56
+ border-left: 0.3076em solid transparent;
57
+ }
58
+
59
+ .dropup .dropdown-toggle:empty::after {
60
+ margin-left: 0;
61
+ }
62
+
63
+ .dropright .dropdown-menu {
64
+ top: 0;
65
+ right: auto;
66
+ left: 100%;
67
+ margin-top: 0;
68
+ margin-left: 0.1538rem;
69
+ }
70
+
71
+ .dropright .dropdown-toggle::after {
72
+ display: inline-block;
73
+ width: 0;
74
+ height: 0;
75
+ margin-left: 0.26146em;
76
+ vertical-align: 0.26146em;
77
+ content: "";
78
+ border-top: 0.3076em solid transparent;
79
+ border-right: 0;
80
+ border-bottom: 0.3076em solid transparent;
81
+ border-left: 0.3076em solid;
82
+ }
83
+
84
+ .dropright .dropdown-toggle:empty::after {
85
+ margin-left: 0;
86
+ }
87
+
88
+ .dropright .dropdown-toggle::after {
89
+ vertical-align: 0;
90
+ }
91
+
92
+ .dropleft .dropdown-menu {
93
+ top: 0;
94
+ right: 100%;
95
+ left: auto;
96
+ margin-top: 0;
97
+ margin-right: 0.1538rem;
98
+ }
99
+
100
+ .dropleft .dropdown-toggle::after {
101
+ display: inline-block;
102
+ width: 0;
103
+ height: 0;
104
+ margin-left: 0.26146em;
105
+ vertical-align: 0.26146em;
106
+ content: "";
107
+ }
108
+
109
+ .dropleft .dropdown-toggle::after {
110
+ display: none;
111
+ }
112
+
113
+ .dropleft .dropdown-toggle::before {
114
+ display: inline-block;
115
+ width: 0;
116
+ height: 0;
117
+ margin-right: 0.26146em;
118
+ vertical-align: 0.26146em;
119
+ content: "";
120
+ border-top: 0.3076em solid transparent;
121
+ border-right: 0.3076em solid;
122
+ border-bottom: 0.3076em solid transparent;
123
+ }
124
+
125
+ .dropleft .dropdown-toggle:empty::after {
126
+ margin-left: 0;
127
+ }
128
+
129
+ .dropleft .dropdown-toggle::before {
130
+ vertical-align: 0;
131
+ }
132
+
133
+ .dropdown-menu[x-placement^="top"], .dropdown-menu[x-placement^="right"], .dropdown-menu[x-placement^="bottom"], .dropdown-menu[x-placement^="left"] {
134
+ right: auto;
135
+ bottom: auto;
136
+ }
137
+
138
+ .dropdown-divider {
139
+ height: 0;
140
+ margin: 0.5rem 0;
141
+ overflow: hidden;
142
+ border-top: 1px solid #eceeef;
143
+ }
144
+
145
+ .dropdown-item {
146
+ display: block;
147
+ width: 100%;
148
+ padding: 0.25rem 1.5rem;
149
+ clear: both;
150
+ font-weight: 400;
151
+ color: #212529;
152
+ text-align: inherit;
153
+ white-space: nowrap;
154
+ background-color: transparent;
155
+ border: 0;
156
+ }
157
+
158
+ .dropdown-item:hover, .dropdown-item:focus {
159
+ color: #16181b;
160
+ text-decoration: none;
161
+ background-color: #f8f9fa;
162
+ }
163
+
164
+ .dropdown-item.active, .dropdown-item:active {
165
+ color: #ef6262;
166
+ text-decoration: none;
167
+ background-color: transparent;
168
+ }
169
+
170
+ .dropdown-item.disabled, .dropdown-item:disabled {
171
+ color: #777777;
172
+ background-color: transparent;
173
+ }
174
+
175
+ .dropdown-menu.show {
176
+ display: block;
177
+ }
178
+
179
+ .dropdown-header {
180
+ display: block;
181
+ padding: 0.3846rem 1.5rem;
182
+ margin-bottom: 0;
183
+ font-size: 0.9231rem;
184
+ color: #777777;
185
+ white-space: nowrap;
186
+ }
187
+
188
+ .dropdown-item-text {
189
+ display: block;
190
+ padding: 0.25rem 1.5rem;
191
+ color: #212529;
192
+ }
193
+
194
+
195
+
196
+
197
+
198
+
199
+
200
+
201
+ .position-static {
202
+ position: static !important;
203
+ }
204
+
205
+ .position-relative {
206
+ position: relative !important;
207
+ }
208
+
209
+ .position-absolute {
210
+ position: absolute !important;
211
+ }
212
+
213
+ .position-fixed {
214
+ position: fixed !important;
215
+ }
216
+
217
+ .position-sticky {
218
+ position: sticky !important;
219
+ }
220
+
221
+ .fixed-top {
222
+ position: fixed;
223
+ top: 0;
224
+ right: 0;
225
+ left: 0;
226
+ z-index: 1030;
227
+ }
228
+
229
+ .fixed-bottom {
230
+ position: fixed;
231
+ right: 0;
232
+ bottom: 0;
233
+ left: 0;
234
+ z-index: 1030;
235
+ }
236
+
237
+ @supports (position: sticky) {
238
+ .sticky-top {
239
+ position: sticky;
240
+ top: 0;
241
+ z-index: 1020;
242
+ }
243
+ }
244
+
245
+
246
+
247
+
248
+
249
+
250
+ /*------------------------------------------------------------------
251
+ [Left sidebar]
252
+ */
253
+ .am-left-sidebar {
254
+ background-color: #fff;
255
+ width: 16%;
256
+ height: 100%;
257
+ left: 0;
258
+ position: absolute;
259
+ }
260
+
261
+ .am-left-sidebar .am-scroller-fixed-left-sidebar {
262
+ position: relative;
263
+ width: 100%;
264
+ height: 100%;
265
+ }
266
+
267
+ .rtl .am-left-sidebar {
268
+ left: auto;
269
+ right: 0;
270
+ }
271
+
272
+ .am-left-sidebar .sidebar-elements {
273
+ margin: 0;
274
+ padding: 0;
275
+ }
276
+
277
+ .am-left-sidebar .sidebar-elements > li {
278
+ border-bottom: 1px solid #474646;
279
+ list-style: none;
280
+ }
281
+
282
+ .am-left-sidebar .sidebar-elements > li > a {
283
+ display: block;
284
+ padding: .50rem 1.25rem;
285
+ color: #000;
286
+ text-align: left;
287
+ }
288
+
289
+ .am-left-sidebar .sidebar-elements > li > a .icon {
290
+ display: block;
291
+ font-size: 33px;
292
+ }
293
+
294
+ .am-left-sidebar .sidebar-elements > li > a span {
295
+ display: block;
296
+ margin-top: 5px;
297
+ }
298
+
299
+ @media (min-width: 768px) {
300
+ .am-left-sidebar .sidebar-elements > li:hover, .am-left-sidebar .sidebar-elements > li.open {
301
+ background-color: #424141;
302
+ }
303
+ }
304
+
305
+ .am-left-sidebar .sidebar-elements > li.active > a {
306
+ border-left: 2px solid #ef6262;
307
+ padding-left: 13px;
308
+ }
309
+
310
+ .rtl .am-left-sidebar .sidebar-elements > li.active > a {
311
+ padding-left: 15px;
312
+ padding-right: 13px;
313
+ border-left-width: 0;
314
+ border-right: 2px solid #ef6262;
315
+ }
316
+
317
+ .am-left-sidebar .sidebar-elements > li > ul {
318
+ display: none;
319
+ position: fixed;
320
+ left: 200px;
321
+ top: 0;
322
+ height: 100%;
323
+ background-color: #fff;
324
+ z-index: 1031;
325
+ padding: 0;
326
+ table-layout: fixed;
327
+ list-style: none;
328
+ width: 280px;
329
+ box-shadow: 3px 0 10px -5px rgba(0, 0, 0, 0.4);
330
+ }
331
+
332
+ .rtl .am-left-sidebar .sidebar-elements > li > ul {
333
+ left: auto;
334
+ right: 100px;
335
+ }
336
+
337
+ @media (max-width: 767px) {
338
+ .rtl .am-left-sidebar .sidebar-elements > li > ul {
339
+ right: 0;
340
+ }
341
+ }
342
+
343
+ @media (min-width: 768px) {
344
+ .am-left-sidebar .sidebar-elements > li > ul.visible {
345
+ display: table;
346
+ }
347
+ .am-left-sidebar .sidebar-elements > li > ul.hide {
348
+ display: none;
349
+ }
350
+ }
351
+
352
+ .am-left-sidebar .sidebar-elements > li > ul > li.title {
353
+ border-bottom: 1px solid #6d6b6b;
354
+ font-size: 18px;
355
+ font-weight: 600;
356
+ margin: 0 15px 0;
357
+ padding-bottom: 18px;
358
+ padding-top: 15px;
359
+ }
360
+
361
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items {
362
+ display: table-row;
363
+ height: 100%;
364
+ }
365
+
366
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller {
367
+ position: relative;
368
+ width: 100%;
369
+ height: 100%;
370
+ }
371
+
372
+ @media (max-width: 767px) {
373
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller {
374
+ display: block;
375
+ }
376
+ }
377
+
378
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller .content {
379
+ height: 100%;
380
+ width: 100%;
381
+ position: absolute;
382
+ padding-top: 15px;
383
+ margin-right: 0 !important;
384
+ }
385
+
386
+ @media screen and (min-width: 0�) {
387
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller .content {
388
+ position: static;
389
+ overflow: hidden;
390
+ }
391
+ }
392
+
393
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller .content > ul {
394
+ list-style: none;
395
+ padding: 0;
396
+ margin: 0;
397
+ }
398
+
399
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller .content > ul > li > a {
400
+ padding: 12px;
401
+ display: block;
402
+ font-weight: 600;
403
+ font-size: 14px;
404
+ color: #000;
405
+ }
406
+
407
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller .content > ul > li > a .badge {
408
+ float: right;
409
+ border-radius: 2px;
410
+ font-weight: 400;
411
+ line-height: 10px;
412
+ padding: 5px 10px;
413
+ }
414
+
415
+ .rtl .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller .content > ul > li > a .badge {
416
+ float: left;
417
+ }
418
+
419
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller .content > ul > li > a:hover, .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller .content > ul > li > a:focus {
420
+ background-color: #F8FAFA;
421
+ color: #000;
422
+ }
423
+
424
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller .content > ul li.active > a {
425
+ color: #f17979;
426
+ }
427
+
428
+ .am-left-sidebar .am-logo {
429
+ display: none;
430
+ }
431
+
432
+ .am-left-sidebar:before {
433
+ content: "";
434
+ position: fixed;
435
+ z-index: -1;
436
+ width: inherit;
437
+ top: 0;
438
+ left: 0;
439
+ bottom: 0;
440
+ background-color: inherit;
441
+ }
442
+
443
+ .rtl .am-left-sidebar:before {
444
+ left: auto;
445
+ right: 0;
446
+ }
447
+
448
+ .am-animate .am-left-sidebar:before {
449
+ transition: all 0.35s ease;
450
+ }
451
+
452
+ @media (max-width: 767px) {
453
+ .am-left-sidebar:before {
454
+ display: none;
455
+ }
456
+ }
457
+
458
+ @media (max-width: 767px) {
459
+ .am-left-sidebar {
460
+ width: 85%;
461
+ height: 100%;
462
+ overflow: auto;
463
+ -webkit-overflow-scrolling: touch;
464
+ position: fixed;
465
+ top: 0;
466
+ transform: translate3d(-100%, 0, 0);
467
+ z-index: 1031;
468
+ }
469
+ .rtl .am-left-sidebar {
470
+ transform: translate3d(100%, 0, 0);
471
+ }
472
+ .am-left-sidebar .sidebar-elements > li > a {
473
+ text-align: left;
474
+ position: relative;
475
+ }
476
+ .rtl .am-left-sidebar .sidebar-elements > li > a {
477
+ text-align: right;
478
+ }
479
+ .am-left-sidebar .sidebar-elements > li > a .icon {
480
+ display: inline-block;
481
+ font-size: 25px;
482
+ margin-right: 10px;
483
+ vertical-align: middle;
484
+ }
485
+ .rtl .am-left-sidebar .sidebar-elements > li > a .icon {
486
+ margin-right: 0;
487
+ margin-left: 10px;
488
+ }
489
+ .am-left-sidebar .sidebar-elements > li > a span {
490
+ display: inline-block;
491
+ }
492
+ .am-left-sidebar .sidebar-elements > li.parent > a:after {
493
+ content: '\e688';
494
+ float: right;
495
+ font-family: "Stroke 7";
496
+ font-size: 26px;
497
+ line-height: 28px;
498
+ color: #a1a1a1;
499
+ }
500
+ .rtl .am-left-sidebar .sidebar-elements > li.parent > a:after {
501
+ float: left;
502
+ }
503
+ .am-left-sidebar .sidebar-elements > li > ul {
504
+ position: relative;
505
+ height: auto;
506
+ width: 100%;
507
+ left: 0;
508
+ }
509
+ .am-left-sidebar .sidebar-elements > li > ul > li.title {
510
+ display: none;
511
+ }
512
+ .am-left-sidebar .sidebar-elements > li > ul > li.nav-items {
513
+ display: block;
514
+ height: auto;
515
+ }
516
+ .am-left-sidebar .sidebar-elements > li > ul > li.nav-items > .am-scroller {
517
+ height: auto;
518
+ overflow: visible;
519
+ }
520
+ .am-left-sidebar .sidebar-elements > li > ul > li.nav-items > .am-scroller > .content {
521
+ padding-top: 0;
522
+ overflow: visible;
523
+ position: relative;
524
+ }
525
+ .am-left-sidebar .sidebar-elements > li:hover {
526
+ background-color: inherit;
527
+ }
528
+ .am-left-sidebar .sidebar-elements > li:hover > ul {
529
+ display: none;
530
+ }
531
+ .am-left-sidebar .sidebar-elements li.open > ul {
532
+ display: block;
533
+ }
534
+ .am-left-sidebar .am-logo {
535
+ background: url("../img/logo-full.png") no-repeat 15px center;
536
+ height: 70px;
537
+ background-color: #393838;
538
+ border-bottom: 1px solid #353434;
539
+ display: block;
540
+ }
541
+ }
542
+
543
+ @media -webkit-min-device-pixel-ratio and (max-width: 767px) {
544
+ .am-left-sidebar .am-logo {
545
+ background-image: url("../img/logo-full-retina.png");
546
+ background-size: 150px 39px;
547
+ }
548
+ }
549
+
550
+ .am-animate .am-left-sidebar {
551
+ transition: all 0.35s ease;
552
+ }
553
+
554
+ .am-fixed-sidebar .am-left-sidebar {
555
+ margin-top: 80px;
556
+ padding-bottom: 80px;
557
+ position: fixed;
558
+ top: 0;
559
+ bottom: 0;
560
+ z-index: 1031;
561
+ }
562
+
563
+ @media (max-width: 767px) {
564
+ .am-fixed-sidebar .am-left-sidebar {
565
+ margin-top: 0;
566
+ padding-bottom: 0;
567
+ }
568
+ }
569
+
570
+ .am-fixed-sidebar .am-left-sidebar:before {
571
+ top: 80px;
572
+ }
573
+
574
+ .am-fixed-sidebar .am-left-sidebar .nano-pane {
575
+ width: 4px;
576
+ }
577
+
578
+ .am-fixed-sidebar .am-left-sidebar .nano-pane > .nano-slider {
579
+ background-color: rgba(0, 0, 0, 0.15);
580
+ }
581
+
582
+
583
+ .main-app .ui-app-area .ui-menu-dots .btn:hover {
584
+ background-color: transparent;
585
+ color: #000 !important;
586
+ }
587
+
588
+
589
+
590
+
591
+
@@ -7,6 +7,13 @@
7
7
  width: 100%;
8
8
  padding: 15px 0;
9
9
  }
10
+ .land-app .view-header {
11
+ border-bottom: 1px solid $ui_lightgray;
12
+ /*background-color: $ui_middlegray;*/
13
+ margin-bottom: 15px;
14
+ width: 100%;
15
+ padding: 15px 0 15px 10px;
16
+ }
10
17
  .view-header .btn.btn-group {
11
18
  display: contents;
12
19
  }
@@ -17,6 +24,37 @@
17
24
  padding: 0;
18
25
  }
19
26
 
27
+ .land-app .header-fixed {
28
+ display: block;
29
+ /*position: fixed;*/
30
+ height: 130px;
31
+ margin-top: -22px;
32
+ /*background-color: #f2f2f2;*/
33
+ /*margin-left: -15px;*/
34
+ width: 100%;
35
+ max-width: 100%;
36
+ z-index: 2;
37
+ border-bottom: none !important;
38
+ margin-left: -14px;
39
+ }
40
+ .header-fixed .row-title {
41
+ margin-bottom: 5px;
42
+ margin-left: -14px;
43
+ }
44
+ .land-app .header-fixed hr {
45
+ margin-top: 0px;
46
+ }
47
+ .land-app .header-fixed-box {
48
+ position: fixed;
49
+ background-color: #f2f2f2;
50
+ top: 20px;
51
+ padding-right: 18%;
52
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
53
+ }
54
+ .land-app .form-padding {
55
+ margin-top: 140px !important;
56
+ }
57
+
20
58
  /* Table Header */
21
59
 
22
60
  table .ui-table-row {
@@ -25,7 +63,7 @@ table .ui-table-row {
25
63
  }
26
64
  .ui-toptable {
27
65
  background-color: $ui_middlegray;
28
- padding: 12px 20px;
66
+ padding: 8px 15px;
29
67
  border: 1px solid $ui_middlegray;
30
68
  -webkit-border-top-left-radius: $ui-radius;
31
69
  -webkit-border-top-right-radius: $ui-radius;
@@ -40,10 +78,13 @@ table .ui-table-row {
40
78
 
41
79
  /* Table Cells */
42
80
  .ui-table thead {
43
- background-color: $ui_middlegray;
44
- border: 1px solid $ui_middlegray;
81
+ background-color: #edeff4;
82
+ border: 1px solid #edeff4;
45
83
  font-family: 'hk-grotesk-semibold';
46
84
  }
85
+ .ui-table table {
86
+ background-color: $ui_white;
87
+ }
47
88
  .ui-table thead th {
48
89
  vertical-align: top;
49
90
  font-size: 16px;
@@ -66,7 +107,7 @@ table .ui-table-row {
66
107
 
67
108
  /* Tr */
68
109
  .ui-table table tbody tr:hover {
69
- background-color: $ui_fill;
110
+ /*background-color: $ui_fill;*/
70
111
  }
71
112
 
72
113
  .ui-toptable .col-lg-6:first-child {
@@ -106,7 +147,7 @@ table .ui-table-row {
106
147
  }
107
148
  .ui-app-area table .ui-menu-dots {
108
149
  width: 20px;
109
- height: 100px;
150
+ height: 70px;
110
151
  text-align: right;
111
152
  }
112
153
  .ui-app-area table .dropdown-menu {
@@ -121,6 +162,23 @@ table .ui-table-row {
121
162
  .site-plan .card-body {
122
163
  padding: 0;
123
164
  }
165
+ .ui-app-area .list-group-item {
166
+ min-height: 90px;
167
+ }
168
+ #ui-tabs .list-group-item {
169
+ padding-left: 15px;
170
+ }
171
+
172
+ /* =========================== */
173
+
174
+ .land-app .parcel-information-block {
175
+ display: block;
176
+ width: 100%;
177
+ border-bottom: 1px solid #D9D9D9;
178
+ padding: 15px;
179
+ margin-left: 15px;
180
+ margin-right: 15px;
181
+ }
124
182
 
125
183
  /* =========================== */
126
184
 
@@ -129,6 +187,7 @@ table .ui-table-row {
129
187
  float: left;
130
188
  position: relative;
131
189
  margin-bottom: $sm-marginbottom;
190
+ margin-left: 15px;
132
191
  }
133
192
  .ui-app-area .width-drop {
134
193
  padding-right: 50px;
@@ -155,7 +214,7 @@ table .ui-table-row {
155
214
  padding: 1.50rem 1.25rem;
156
215
  }
157
216
  .ui-app-area .list-group-item:hover {
158
- background-color: $ui_fill;
217
+ /*background-color: $ui_fill;*/
159
218
  }
160
219
  .ui-app-area .parcel-main-info .list-group-item {
161
220
  padding: 0.50rem 1.25rem;
@@ -164,6 +223,9 @@ table .ui-table-row {
164
223
  /* =========================== */
165
224
 
166
225
  .parcel-main-info {
226
+ display: block;
227
+ float: left;
228
+ position: relative;
167
229
  margin-bottom: $md-marginbottom;
168
230
  }
169
231
  .parcel-main-info .card {
@@ -392,3 +454,256 @@ table .ui-table-row {
392
454
  color: $ui_back;
393
455
  text-decoration: underline;
394
456
  }
457
+
458
+ /* =========================== */
459
+
460
+ #parcel_form {
461
+ /*background-color: $ui_white;*/
462
+ padding: 30px 0px;
463
+ /*margin-top: 80px;*/
464
+ }
465
+
466
+ /* =========================== */
467
+
468
+ .am-left-sidebar.col-12.col-lg-2.p-0.menu-app {
469
+ display: block;
470
+ float: left;
471
+ position: relative;
472
+ }
473
+ .am-content.col-12.col-lg-10.mx-auto.ui-app-area {
474
+ display: block;
475
+ float: right;
476
+ position: relative;
477
+ }
478
+ .table-striped tbody tr:nth-of-type(odd), .table-striped tbody tr {
479
+ background-color:#fff;
480
+ }
481
+ .table-striped tbody tr:hover {
482
+ background-color:#fff!important;
483
+ }
484
+ .am-wrapper.am-login {
485
+ max-width: 660px;
486
+ margin: 120px auto;
487
+ }
488
+
489
+ .ui-app-area .tab-pane .widget.widget-small {
490
+ margin-bottom: 60px;
491
+ }
492
+ .ui-app-area .widget-head {
493
+ background-color: #edeff4 !important;
494
+ padding: 12px 20px;
495
+ border: 1px solid #edeff4 !important;
496
+ -webkit-border-top-left-radius: .25rem!important;
497
+ -webkit-border-top-right-radius: .25rem!important;
498
+ -moz-border-radius-topleft: .25rem!important;
499
+ -moz-border-radius-topright: .25rem!important;
500
+ border-top-left-radius: .25rem!important;
501
+ border-top-right-radius: .25rem!important;
502
+ }
503
+ .ui-app-area .widget-head.no-margin {
504
+ margin-left: 0;
505
+ margin-right: 0;
506
+ }
507
+ .ui-app-area .widget-head.no-margin .col-sm-8,
508
+ .ui-app-area .widget-head.no-margin .col-sm-12 {
509
+ margin-bottom: 0;
510
+ padding-left: 0;
511
+ }
512
+ .ui-app-area .widget-head .title {
513
+ font-size: 20px;
514
+ font-weight: 500;
515
+ font-family: gt-eesti-regular;
516
+ }
517
+ .ui-app-area .card-body .nav.nav-tabs {
518
+ margin-bottom: 30px;
519
+ border-bottom: transparent;
520
+ }
521
+ .ui-app-area .card-body .nav-tabs .nav-link.active, .ui-app-area .card-body .nav-tabs .nav-item.show .nav-link,
522
+ .ui-app-area .card-body .nav-tabs .nav-link:hover {
523
+ color: #000;
524
+ background-color: transparent;
525
+ border-color: transparent transparent #4A8FE7;
526
+ font-family: gt-eesti-regular;
527
+ }
528
+ .ui-app-area .card-body .nav-tabs .nav-link {
529
+ color: #000;
530
+ font-family: gt-eesti-regular;
531
+ }
532
+ .table th, .table td {
533
+ padding: 1rem;
534
+ }
535
+ .ui-app-area .drop-side {
536
+ left: 220px !important;
537
+ top: 4px !important;
538
+ }
539
+ .main-app .ui-app-area .ui-menu-dots .btn {
540
+ text-align: left;
541
+ }
542
+ .main-app .ui-app-area .ui-menu-dots .btn:hover {
543
+ background-color: transparent;
544
+ color: $ui_back !important;
545
+ }
546
+ .main-app .ui-app-area .dots-horizontal {
547
+ float: right;
548
+ position: relative;
549
+ margin-left: 14px;
550
+ margin-top: -2px;
551
+ }
552
+ .main-app .ui-app-area .title-section {
553
+ display: block;
554
+ float: left;
555
+ }
556
+
557
+ .ui-app-area #nav-p_information .row {
558
+ margin-bottom: 30px;
559
+ }
560
+ .ui-app-area #nav-p_information .row .ui-toptable .row {
561
+ margin-bottom: 0px;
562
+ }
563
+
564
+ /* =========================== */
565
+
566
+ .main-content table {
567
+ box-shadow: 1px -1px 13px 0px rgba(174,174,174,0.68);
568
+ -webkit-box-shadow: 1px -1px 13px 0px rgba(174,174,174,0.68);
569
+ -moz-box-shadow: 1px -1px 13px 0px rgba(174,174,174,0.68);
570
+ }
571
+
572
+ /* =========================== */
573
+
574
+ .main-app .tab-table {
575
+ background-color: $ui_white;
576
+ }
577
+ .main-app .tab-table .card {
578
+ width: 48%;
579
+ display: block;
580
+ float: left;
581
+ margin: 0 1% 30px 1%;
582
+ min-height: 140px;
583
+ }
584
+ .main-app .tab-table .card .h4 {
585
+ font-size: 16px;
586
+ font-weight: 500;
587
+ font-family: 'gt-eesti-regular';
588
+ }
589
+ .main-app .tab-table .card p {
590
+ margin-bottom: 10px;
591
+ }
592
+ .main-app .tab-table .card .h4 p {
593
+ margin-bottom: -8px;
594
+ }
595
+ .main-app .tab-table .row-head {
596
+ background-color: #edeff4;
597
+ margin-left: 0;
598
+ margin-right: 0;
599
+ margin-bottom: 30px;
600
+ padding: 12px 20px;
601
+ border: 1px solid #edeff4!important;
602
+ }
603
+ .main-app .card .card-header {
604
+ background-color: #edeff4;
605
+ font-weight: 600;
606
+ }
607
+ .main-app .ui-app-area .page-head h2 a {
608
+ color: $ui_back;
609
+ }
610
+ .main-app .ui-app-area .page-head h2 a.btn-primary {
611
+ color: $ui_white;
612
+ }
613
+ .main-app .ui-app-area .page-head {
614
+ border-bottom: 1px solid #d9d9d9;
615
+ margin-left: 20px;
616
+ margin-right: 20px;
617
+ padding: 20px 0 !important;
618
+ }
619
+ .main-app .ui-app-area .nav-tabs .nav-link {
620
+ padding: 0.5rem 0;
621
+ margin-right: 20px;
622
+ }
623
+ .main-app .ui-app-area .tab-content .tab-pane {
624
+ margin-top: 40px;
625
+ }
626
+ .main-app .ui-app-area .tab-content .tab-pane .h3 {
627
+ font-size: 20px;
628
+ }
629
+ .main-app .ui-app-area table thead {
630
+ background-color: #edeff4;
631
+ }
632
+ .ui-app-area .page-head .dropdown.droppright {
633
+ top: 6px;
634
+ left: 12px;
635
+ }
636
+ .ui-app-area .row-white {
637
+ background-color: #fff;
638
+ padding: 12px;
639
+ margin-left: 0px;
640
+ margin-right: 0;
641
+ border-bottom: 1px solid rgba(0,0,0,0.1);
642
+ }
643
+
644
+ /* =========================== */
645
+
646
+ .main-app .page-aside {
647
+ border-bottom: 1px solid #dee2e6;
648
+ padding: 0 15px 20px 16px;
649
+ }
650
+ .main-app .page-aside ul li {
651
+ margin-right: 12px;
652
+ }
653
+
654
+ /* =========================== */
655
+
656
+ .main-app .am-datatable-footer {
657
+ text-align: center;
658
+ margin: 0 auto !important;
659
+ display: block;
660
+ }
661
+ .main-app .am-datatable-footer .btn-outline-primary {
662
+ border-color: transparent;
663
+ }
664
+
665
+ /* =========================== */
666
+
667
+ .edit-form-group {
668
+ display: block;
669
+ margin-bottom: 30px;
670
+ }
671
+ .edit-form-group .form-row {
672
+ background: #FFFFFF;
673
+ border: 1px solid #FFFFFF;
674
+ box-shadow: 0 0 6px 0 rgba(207,207,207,0.50);
675
+ border-radius: 4px;
676
+ padding: 20px;
677
+ }
678
+ .edit-form-group.form-group-complete .form-row {
679
+ background: #FFFFFF;
680
+ border: 1px solid #91CF97;
681
+ box-shadow: 0 0 6px 0 rgba(207,207,207,0.50);
682
+ }
683
+ .edit-form-group .form-group {
684
+ margin-bottom: 0;
685
+ }
686
+ .edit-form-group .col-lg-12,
687
+ .edit-form-group .col-lg-6,
688
+ .edit-form-group .col-lg-4 {
689
+ margin-bottom: 15px;
690
+ }
691
+ .form-pill {
692
+ background-color:$ui_white;
693
+ padding: 6px 10px;
694
+ border: 1px solid #D9D9D9;
695
+ border-radius: 4px;
696
+ color: $ui_back;
697
+ font-size: 14px;
698
+ }
699
+ .form-pill:hover {
700
+ text-decoration: none;
701
+ }
702
+ .pill-complete {
703
+ border: 1px solid #7EB984;
704
+ padding-right: 33px;
705
+ background-image: image-url('icons/icn-check.svg');
706
+ background-repeat: no-repeat;
707
+ background-size: 13px;
708
+ background-position: right 10px top 8px;
709
+ }
@@ -8,7 +8,7 @@
8
8
  }
9
9
  #ui-tabs .nav-item {
10
10
  font-family: 'gt-eesti-regular';
11
- font-weight: 600;
11
+ font-weight: 400;
12
12
  color: $ui_back;
13
13
  }
14
14
  #ui-tabs .nav-tabs {
@@ -3,6 +3,11 @@
3
3
  /* ====================================== */
4
4
  // Welcome UI Fonts
5
5
 
6
+ body {
7
+ -webkit-font-smoothing: antialiased;
8
+ -moz-osx-font-smoothing: grayscale;
9
+ }
10
+
6
11
  $ui_font_small: 14px;
7
12
  $ui_font_normal: 16px;
8
13
 
@@ -73,7 +78,7 @@ $lg-paddingbottom: 60px;
73
78
  font-size: 20px;
74
79
  }
75
80
 
76
- .land-app {
81
+ .land-app, .main-app {
77
82
  background-color: $ui_lightergray;
78
83
  }
79
84
  .land-app .main-btns .ui-menu-dots {
@@ -83,7 +88,196 @@ $lg-paddingbottom: 60px;
83
88
  .ui-app-area {
84
89
  padding: 22px 20px;
85
90
  }
91
+ .am-left-sidebar .sidebar-elements > li > ul {
92
+ left: 16% !important;
93
+ }
86
94
 
95
+ /* ====================================== */
87
96
 
97
+ .am-wrapper.main-app .menu-app {
98
+ width: 16%;
99
+ }
100
+ .am-wrapper.main-app .navbar {
101
+ background-color: $ui_white;
102
+ height: 58px;
103
+ box-shadow: 0 0 50px rgba(0, 0, 0, 0.05%);
104
+ }
105
+ .am-wrapper.main-app .ui-app-area {
106
+ padding: 15px;
107
+ width: 84%;
108
+ float: right;
109
+ background-color: #fafafa !important;
110
+ }
111
+ .am-wrapper.main-app .ui-app-area .main-content,
112
+ .am-wrapper.main-app .ui-app-area .page-head {
113
+ padding: 20px;
114
+ }
115
+ .am-navbar-header .page-title img {
116
+ width: 84px;
117
+ margin-left: -26px;
118
+ margin-top: -10px;
119
+ }
120
+ .admin-options .collapse,
121
+ .admin-options .nav {
122
+ display: block !important;
123
+ float: right;
124
+ margin-left: 6px;
125
+ }
126
+ .admin-options .dropdown-toggle::after {
127
+ display: none;
128
+ }
129
+ .admin-options .dropdown-menu {
130
+ position: absolute;
131
+ top: 100%;
132
+ left: -80px;
133
+ z-index: 1000;
134
+ display: none;
135
+ float: left;
136
+ min-width: 100px;
137
+ padding: 6px;
138
+ margin: 0.1538rem 0 0;
139
+ font-size: 13px;
140
+ color: #555555;
141
+ text-align: right;
142
+ list-style: none;
143
+ background-color: #FFFFFF;
144
+ background-clip: padding-box;
145
+ border: 1px solid rgba(0, 0, 0, 0.1);
146
+ border-radius: 0;
147
+ }
148
+ .admin-options .dropdown-menu a {
149
+ color: $ui_back;
150
+ }
151
+
152
+ /* ====================================== */
153
+
154
+ .am-login img {
155
+ width: 128px;
156
+ display: block;
157
+ margin-bottom: 12px;
158
+ }
159
+ .login-container .card-header {
160
+ background-color: $ui_back;
161
+ color: $ui_white;
162
+ }
163
+ .login-container .card-body {
164
+ padding: 35px 35px 20px;
165
+ }
166
+ .login-container .btn-block {
167
+ display: block;
168
+ width: auto;
169
+ margin: 0 auto;
170
+ border: none;
171
+ font-family: gt-eesti-medium;
172
+ color: #fff;
173
+ padding: 8px 40px;
174
+ border-radius: 100px;
175
+ font-size: 18px !important;
176
+ font-family: gt-eesti-medium !important;
177
+ }
178
+ .login-container .input-group-text {
179
+ display: none;
180
+ }
181
+ .login-container .form-group.footer.row {
182
+ margin-top: 30px;
183
+ border-top: 1px solid #d9d9d9;
184
+ padding-top: 20px;
185
+ margin-bottom: 0;
186
+ }
187
+ .login-container .form-control {
188
+ height: 42px;
189
+ border: 1px solid #b2b2b2;
190
+ }
191
+ .main-app .dashboard-box {
192
+ padding: 20px;
193
+ background-color: #fff;
194
+ margin-bottom: 20px;
195
+ }
196
+ .main-app .dashboard-area {
197
+ padding: 30px;
198
+ }
199
+ .main-app .dashboard-area .data-info .value {
200
+ font-weight: 600;
201
+ font-size: 22px;
202
+ }
88
203
 
204
+ .am-left-sidebar .sub-menu {
205
+ position: relative !important;
206
+ height: auto;
207
+ width: auto;
208
+ left: 0 !important;
209
+ table-layout: auto;
210
+ top: auto;
211
+ display: block;
212
+ }
213
+ .am-left-sidebar .sub-menu .title {
214
+ display: none;
215
+ }
216
+ .am-left-sidebar .sub-menu .nav-items {
217
+ display: block;
218
+ float: left;
219
+ position: relative;
220
+ height: auto;
221
+ width: 100%;
222
+ padding: 0 0 0 30px;
223
+ }
224
+ .am-left-sidebar .sidebar-elements > li > ul >
225
+ .nav-items .am-scroller .content {
226
+ position: relative !important;
227
+ padding-top: 0 !important;
228
+ }
229
+ .am-left-sidebar .sidebar-elements > li > ul {
230
+ left: 0% !important;
231
+ box-shadow: none !important;
232
+ width: 100% !important;
233
+ }
234
+ .am-left-sidebar .sidebar-elements > li:hover,
235
+ .am-left-sidebar .sidebar-elements > li.open {
236
+ background-color: #fff !important;
237
+ }
238
+ .am-left-sidebar .sidebar-elements > li {
239
+ border-bottom: none !important;
240
+ list-style: none;
241
+ }
242
+ .main-app .navbar .title .badge {
243
+ font-size: 13px !important;
244
+ }
89
245
 
246
+ .am-left-sidebar .parent .list-group-item:before {
247
+ background-image: url("https://land.welcomehomes.com/assets/icons/icn-submenu-cf0fa33c4c7e45be386bde2e5d9cf8b5297cf24558243549ff5b308a988f8af1.svg");
248
+ background-repeat: no-repeat;
249
+ background-position: right 10px top 18px;
250
+ content: ' ';
251
+ display: block;
252
+ position: absolute;
253
+ right: 0;
254
+ top: 0;
255
+ width: 100%;
256
+ height: 100%;
257
+ z-index: 1;
258
+ opacity: 0.2;
259
+ }
260
+ .am-left-sidebar .parent .list-group-item:hover:before {
261
+ opacity: 1;
262
+ }
263
+ .am-left-sidebar .parent.open .list-group-item:before {
264
+ background-image: url("https://land.welcomehomes.com/assets/icons/icn-submenu-close-c4f6ca0fdef472f702d123f11b746478f1820ccb4051671984fea27e64f51d0a.svg");
265
+ background-repeat: no-repeat;
266
+ background-position: right 10px top 18px;
267
+ content: ' ';
268
+ display: block;
269
+ position: absolute;
270
+ right: 0;
271
+ top: 0;
272
+ width: 100%;
273
+ height: 100%;
274
+ z-index: 1;
275
+ opacity: 1;
276
+ }
277
+ .list-group-item:first-child {
278
+ border-top-left-radius: 0 !important;
279
+ border-top-right-radius: 0 !important;
280
+ }
281
+ .am-left-sidebar .sidebar-elements > li > ul > .nav-items .am-scroller .content > ul > li > a:hover {
282
+ background-color: transparent !important;
283
+ }
@@ -8,3 +8,4 @@
8
8
  @import "welcome-ui-menu-app";
9
9
  @import "welcome-ui-buttons";
10
10
  @import "welcome-ui-tabs";
11
+ @import "welcome-ui-sidebar";
@@ -0,0 +1,13 @@
1
+ {
2
+ "folders": [
3
+ {
4
+ "path": "../../../../welcome_properties"
5
+ },
6
+ {
7
+ "path": "../../../../welcome"
8
+ },
9
+ {
10
+ "path": "../../.."
11
+ }
12
+ ]
13
+ }
@@ -1,3 +1,3 @@
1
1
  module WelcomeCss
2
- VERSION = "0.1"
2
+ VERSION = "0.5"
3
3
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: welcome_css
3
3
  version: !ruby/object:Gem::Version
4
- version: '0.1'
4
+ version: '0.5'
5
5
  platform: ruby
6
6
  authors:
7
7
  - Jose Camacho
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2021-05-12 00:00:00.000000000 Z
11
+ date: 2021-07-29 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: rails
@@ -234,12 +234,14 @@ files:
234
234
  - app/assets/stylesheets/_welcome-ui-buttons.scss
235
235
  - app/assets/stylesheets/_welcome-ui-menu-app.scss
236
236
  - app/assets/stylesheets/_welcome-ui-navbar.scss
237
+ - app/assets/stylesheets/_welcome-ui-sidebar.scss
237
238
  - app/assets/stylesheets/_welcome-ui-tables.scss
238
239
  - app/assets/stylesheets/_welcome-ui-tabs.scss
239
240
  - app/assets/stylesheets/_welcome-ui-typography.scss
240
241
  - app/assets/stylesheets/_welcome-ui.scss
241
242
  - app/assets/stylesheets/_welcome_bootstrap_variables.scss
242
243
  - app/assets/stylesheets/welcome.css.scss
244
+ - app/assets/stylesheets/workspace.code-workspace
243
245
  - lib/tasks/welcome_css_tasks.rake
244
246
  - lib/welcome_css.rb
245
247
  - lib/welcome_css/engine.rb