nfg_ui 0.11.4 → 0.11.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 +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
|