nfg_ui 0.11.4 → 0.11.5
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_badge.scss +4 -5
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_buttons.scss +4 -5
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_custom.scss +1 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_reboot.scss +1 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/custom/_activity_feed.scss +7 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_custom.scss +1 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_activity_feed.scss +34 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_overlay_blocker.scss +1 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/_custom.scss +1 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_icon.scss +5 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_custom-forms.scss +4 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_custom.scss +2 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_avatar.scss +1 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_icon.scss +34 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_skeleton.scss +50 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_tile.scss +4 -4
- data/lib/nfg_ui/version.rb +1 -1
- metadata +7 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: f6873ae0b61984e697a1b6ee78a84296be11729d47c97a1b537e6fd57b45c7fd
|
|
4
|
+
data.tar.gz: 45feded1d9e2cd3313126dbe0b34975ae606edede1559bc04e21a45320ef734c
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 6729574a1e6a4a86db7a68bc7124bf2041ff5e6f78826f8685df2746dcd126c86db446bd56eb384f3d20027db57582eff768eca0cbd1e90f8a15e15c0df79f42
|
|
7
|
+
data.tar.gz: a7cdec8d0b423255b95080033361a5a4f7bdd8e4feaaf0f165d5f2d65b793caa7512c2e7aa5bfc00c1291c706ff066754943f2a2de7255d1534610a5657482c8
|
data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_badge.scss
CHANGED
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
@each $color, $value in $colors {
|
|
2
2
|
.#{$color} {
|
|
3
|
-
.badge-primary {
|
|
3
|
+
.badge-primary {
|
|
4
|
+
@include badge-variant($value);
|
|
5
|
+
color: $white !important;
|
|
6
|
+
}
|
|
4
7
|
}
|
|
5
8
|
}
|
|
6
|
-
|
|
7
|
-
// temporary color fix for consistency on a white text on orange bg
|
|
8
|
-
// overrides color contrast settings
|
|
9
|
-
.orange .badge-primary { color: $white !important; }
|
data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_buttons.scss
CHANGED
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
@each $color, $value in $colors {
|
|
2
2
|
.#{$color} {
|
|
3
|
-
.btn-primary {
|
|
3
|
+
.btn-primary {
|
|
4
|
+
@include button-variant($value, $value);
|
|
5
|
+
color: $white !important;
|
|
6
|
+
}
|
|
4
7
|
.show > .btn-primary.dropdown-toggle {
|
|
5
8
|
background-color: darken($value, 10%);
|
|
6
9
|
border-color: darken($value, 10%);
|
|
@@ -8,7 +11,3 @@
|
|
|
8
11
|
.btn-outline-secondary, .btn-link { color: $value; }
|
|
9
12
|
}
|
|
10
13
|
}
|
|
11
|
-
|
|
12
|
-
// temporary color fix for consistency on a white text on orange bg
|
|
13
|
-
// overrides color contrast settings
|
|
14
|
-
.orange .btn-primary { color: $white !important; }
|
data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_activity_feed.scss
ADDED
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
// Activity feed list items
|
|
2
|
+
.activity-feed-item {
|
|
3
|
+
position: relative;
|
|
4
|
+
padding: 0 0 $spacer ($spacer * 1.5);
|
|
5
|
+
border: none;
|
|
6
|
+
z-index: 0;
|
|
7
|
+
&::after {
|
|
8
|
+
position: absolute;
|
|
9
|
+
top: 0;
|
|
10
|
+
left: 12px;
|
|
11
|
+
bottom: 0;
|
|
12
|
+
z-index: 0;
|
|
13
|
+
border-left: $border-width solid $border-color;
|
|
14
|
+
content: "";
|
|
15
|
+
}
|
|
16
|
+
&:last-child {
|
|
17
|
+
padding-bottom: 0;
|
|
18
|
+
&::after { display: none; }
|
|
19
|
+
}
|
|
20
|
+
.activity-icon {
|
|
21
|
+
position: absolute;
|
|
22
|
+
top: 2px;
|
|
23
|
+
left: 0;
|
|
24
|
+
display: block;
|
|
25
|
+
width: $spacer;
|
|
26
|
+
height: $spacer;
|
|
27
|
+
font-size: $font-size-sm;
|
|
28
|
+
line-height: $spacer;
|
|
29
|
+
z-index: 1;
|
|
30
|
+
text-align: center;
|
|
31
|
+
@include border-radius(50%);
|
|
32
|
+
box-shadow: 0 0 0 2px rgba(255,255,255,1);
|
|
33
|
+
}
|
|
34
|
+
}
|
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
}
|
|
11
11
|
&:focus:not(:checked) ~ .custom-control-label::before { border-color: $input-border-color; }
|
|
12
12
|
}
|
|
13
|
+
+ .custom-control:not(.custom-control-inline) { margin-top: ($spacer * .25); }
|
|
13
14
|
}
|
|
14
15
|
|
|
15
16
|
// Custom control indicators
|
|
@@ -41,6 +42,9 @@
|
|
|
41
42
|
//
|
|
42
43
|
|
|
43
44
|
.custom-select {
|
|
45
|
+
display: block;
|
|
46
|
+
width: auto;
|
|
47
|
+
max-width: 100%;
|
|
44
48
|
font-weight: $btn-font-weight;
|
|
45
49
|
cursor: pointer;
|
|
46
50
|
box-shadow: none;
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
// Our custom styles
|
|
2
2
|
@import 'custom/avatar';
|
|
3
3
|
@import 'custom/device_preview';
|
|
4
|
+
@import 'custom/icon';
|
|
4
5
|
@import 'custom/illustration';
|
|
5
6
|
@import 'custom/mobile';
|
|
6
7
|
@import 'custom/nav_step';
|
|
7
8
|
@import 'custom/redactor';
|
|
8
9
|
@import 'custom/social_share';
|
|
10
|
+
@import 'custom/skeleton';
|
|
9
11
|
@import 'custom/slat';
|
|
10
12
|
@import 'custom/ticket';
|
|
11
13
|
@import 'custom/tile';
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
// Custom icon styles
|
|
2
|
+
// icons shouldn't be larger than the h1 font-size. use illustrations for larger visuals.
|
|
3
|
+
// don't use icon circles for icons smaller than icon-circle-sm size. use just an icon.
|
|
4
|
+
.icon-circle {
|
|
5
|
+
position: relative;
|
|
6
|
+
display: inline-flex;
|
|
7
|
+
align-items: center;
|
|
8
|
+
justify-content: center;
|
|
9
|
+
vertical-align: middle;
|
|
10
|
+
width: ($spacer * 1.5);
|
|
11
|
+
height: ($spacer * 1.5);
|
|
12
|
+
font-size: $font-size-base;
|
|
13
|
+
background-color: $border-color;
|
|
14
|
+
border-radius: 50%;
|
|
15
|
+
&.icon-circle-outline {
|
|
16
|
+
background-color: $white;
|
|
17
|
+
border: $border-width solid $border-color;
|
|
18
|
+
}
|
|
19
|
+
&.icon-circle-sm {
|
|
20
|
+
width: $spacer;
|
|
21
|
+
height: $spacer;
|
|
22
|
+
font-size: $font-size-sm;
|
|
23
|
+
}
|
|
24
|
+
&.icon-circle-lg {
|
|
25
|
+
width: ($spacer * 2);
|
|
26
|
+
height: ($spacer * 2);
|
|
27
|
+
font-size: $font-size-lg;
|
|
28
|
+
}
|
|
29
|
+
&.icon-circle-xl {
|
|
30
|
+
width: ($spacer * 3);
|
|
31
|
+
height: ($spacer * 3);
|
|
32
|
+
font-size: $h1-font-size;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
// Skeleton styles for placheholder content
|
|
2
|
+
.skeleton-avatar, .skeleton-heading, .skeleton-paragraph {
|
|
3
|
+
display: inline-block;
|
|
4
|
+
margin-bottom: ($spacer * .5);
|
|
5
|
+
background-color: $border-color;
|
|
6
|
+
overflow: hidden;
|
|
7
|
+
&::after {
|
|
8
|
+
position: absolute;
|
|
9
|
+
top: 0;
|
|
10
|
+
right: 0;
|
|
11
|
+
bottom: 0;
|
|
12
|
+
left: 0;
|
|
13
|
+
width: 100%;
|
|
14
|
+
height: 100%;
|
|
15
|
+
background-color: $body-bg;
|
|
16
|
+
animation: skeleton-sheen 1s linear infinite alternate;
|
|
17
|
+
content: '';
|
|
18
|
+
|
|
19
|
+
// any skeleton element inside a container with the the .loaded class removes the sheen animation.
|
|
20
|
+
.loaded & {
|
|
21
|
+
background-color: transparent;
|
|
22
|
+
animation: none;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
.skeleton-avatar {
|
|
27
|
+
width: ($spacer * 1.5);
|
|
28
|
+
height: ($spacer * 1.5);
|
|
29
|
+
border-radius: 50%;
|
|
30
|
+
}
|
|
31
|
+
.skeleton-heading {
|
|
32
|
+
width: 70%;
|
|
33
|
+
height: $spacer;
|
|
34
|
+
border-radius: ($spacer * .5);
|
|
35
|
+
&:nth-child(even) { width: 45%; }
|
|
36
|
+
}
|
|
37
|
+
.skeleton-paragraph {
|
|
38
|
+
width: 100%;
|
|
39
|
+
height: ($spacer * .5);
|
|
40
|
+
border-radius: ($spacer * .25);
|
|
41
|
+
&:nth-child(2n+1) { width: 90%; }
|
|
42
|
+
&:nth-child(3n+1) { width: 75%; }
|
|
43
|
+
&:nth-child(4n+1) { width: 80%; }
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
// Sheen animation used on skeleton elements
|
|
47
|
+
@keyframes skeleton-sheen {
|
|
48
|
+
0% { opacity: .45; }
|
|
49
|
+
to { opacity: .9; }
|
|
50
|
+
}
|
|
@@ -22,13 +22,13 @@
|
|
|
22
22
|
display: block;
|
|
23
23
|
margin-right: auto;
|
|
24
24
|
margin-left: auto;
|
|
25
|
-
@include media-breakpoint-down(sm) { padding-bottom: $grid-gutter-width; }
|
|
26
|
-
@include media-breakpoint-up(sm) { padding-bottom: ($grid-gutter-width *
|
|
25
|
+
@include media-breakpoint-down(sm) { padding-bottom: ($grid-gutter-width * 1.5); }
|
|
26
|
+
@include media-breakpoint-up(sm) { padding-bottom: ($grid-gutter-width * 2); }
|
|
27
27
|
&:last-child { padding-bottom: 0; }
|
|
28
28
|
+ .tile-section {
|
|
29
29
|
border-top: $border-width solid $border-color;
|
|
30
|
-
@include media-breakpoint-down(sm) { padding-top: $grid-gutter-width; }
|
|
31
|
-
@include media-breakpoint-up(sm) { padding-top: ($grid-gutter-width *
|
|
30
|
+
@include media-breakpoint-down(sm) { padding-top: ($grid-gutter-width * 1.5); }
|
|
31
|
+
@include media-breakpoint-up(sm) { padding-top: ($grid-gutter-width * 2); }
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
34
|
|
data/lib/nfg_ui/version.rb
CHANGED
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: nfg_ui
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.11.
|
|
4
|
+
version: 0.11.5
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Jonathan Roehm
|
|
@@ -9,7 +9,7 @@ authors:
|
|
|
9
9
|
autorequire:
|
|
10
10
|
bindir: bin
|
|
11
11
|
cert_chain: []
|
|
12
|
-
date: 2020-10-
|
|
12
|
+
date: 2020-10-29 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: bootstrap
|
|
@@ -407,6 +407,7 @@ files:
|
|
|
407
407
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_reboot.scss
|
|
408
408
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_type.scss
|
|
409
409
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_utilities.scss
|
|
410
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/custom/_activity_feed.scss
|
|
410
411
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/custom/_icons.scss
|
|
411
412
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/custom/_nav_step.scss
|
|
412
413
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/plugins/_datetimepicker.scss
|
|
@@ -419,6 +420,7 @@ files:
|
|
|
419
420
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_nav.scss
|
|
420
421
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_navbar.scss
|
|
421
422
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_tables.scss
|
|
423
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_activity_feed.scss
|
|
422
424
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_builder_layout.scss
|
|
423
425
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_campaign_card.scss
|
|
424
426
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_campaign_preview.scss
|
|
@@ -476,6 +478,7 @@ files:
|
|
|
476
478
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/_utilities.scss
|
|
477
479
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_avatar.scss
|
|
478
480
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_everyday_giving.scss
|
|
481
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_icon.scss
|
|
479
482
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_nav_step.scss
|
|
480
483
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_slat.scss
|
|
481
484
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_video_countdown.scss
|
|
@@ -502,10 +505,12 @@ files:
|
|
|
502
505
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_type.scss
|
|
503
506
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_avatar.scss
|
|
504
507
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_device_preview.scss
|
|
508
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_icon.scss
|
|
505
509
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_illustration.scss
|
|
506
510
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_mobile.scss
|
|
507
511
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_nav_step.scss
|
|
508
512
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_redactor.scss
|
|
513
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_skeleton.scss
|
|
509
514
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_slat.scss
|
|
510
515
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_social_share.scss
|
|
511
516
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_ticket.scss
|