nfg_ui 0.11.7 → 0.11.11.1
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/nfg_theme/_custom.scss +3 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_bee.scss +15 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_readmore.scss +24 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_sys_only_functionality.scss +51 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_buttons.scss +1 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_custom-forms.scss +1 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_slat.scss +4 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/plugins/_select2.scss +1 -1
- data/lib/nfg_ui/components/elements/slat_item.rb +32 -8
- data/lib/nfg_ui/components/traits/typeface.rb +0 -1
- data/lib/nfg_ui/version.rb +1 -1
- metadata +5 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 3cbb1c4c7004b0eda035d6cc0ea7fdf77a24d7b98888fab889694a0d9dfabff3
|
|
4
|
+
data.tar.gz: '09567d917aed809c99b945066fafc6bfc3f22c9c9c9095a40b8d68103da365ab'
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 641321a0f684bb7bd71f95aede967475e7cf884012bd483f2c97567b7cc8fb57e75b3363a20b657cffe5d2e521c7ad115391420aa8ce82ffacad62b0c67d4e0c
|
|
7
|
+
data.tar.gz: ac31e80bfe96dbabf35d15396f7d2b16264db5c342a98993973dccdbf161ef31935b2626ea0fe383ca59510a72b1e1f506c8437e99f59ec3f6e02bb86395faab
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
// Our custom styles
|
|
2
2
|
@import 'custom/activity_feed';
|
|
3
|
+
@import 'custom/bee';
|
|
3
4
|
@import 'custom/builder_layout';
|
|
4
5
|
@import 'custom/campaign_card';
|
|
5
6
|
@import 'custom/campaign_preview';
|
|
@@ -13,8 +14,10 @@
|
|
|
13
14
|
@import 'custom/interaction';
|
|
14
15
|
@import 'custom/overlay_blocker';
|
|
15
16
|
@import 'custom/page_header';
|
|
17
|
+
@import 'custom/readmore';
|
|
16
18
|
@import 'custom/share_dropdown';
|
|
17
19
|
@import 'custom/sortable';
|
|
18
20
|
@import 'custom/status_indicator';
|
|
21
|
+
@import 'custom/sys_only_functionality';
|
|
19
22
|
@import 'custom/tile';
|
|
20
23
|
@import 'custom/video_countdown';
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
#bee_plugin_container {
|
|
2
|
+
height: 600px; // fallback value if calc() isn't supported
|
|
3
|
+
border-top: 1px solid $border-color;
|
|
4
|
+
border-bottom: 1px solid $border-color;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
// Height if just the builder-header is present
|
|
8
|
+
.builder-header + .builder-container {
|
|
9
|
+
#bee_plugin_container { height: calc(100vh - 72px); }
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
// Height if both builder-header and builder-nav are present (typical in onboarder)
|
|
13
|
+
.builder-header + .builder-nav + .builder-container {
|
|
14
|
+
#bee_plugin_container { height: calc(100vh - 180px); }
|
|
15
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
// Powers the readmore.js plugin
|
|
2
|
+
.expandable,
|
|
3
|
+
.readmore-js-section {
|
|
4
|
+
position: relative;
|
|
5
|
+
z-index: 10;
|
|
6
|
+
transition: $transition-collapse;
|
|
7
|
+
&.readmore-js-collapsed { overflow: hidden; }
|
|
8
|
+
&.readmore-js-expanded { overflow: visible; }
|
|
9
|
+
}
|
|
10
|
+
.readmore-js-collapsed:after {
|
|
11
|
+
position: absolute;
|
|
12
|
+
bottom: 0;
|
|
13
|
+
left: 0;
|
|
14
|
+
width: 100%;
|
|
15
|
+
height: ($spacer * 1.5);
|
|
16
|
+
@include gradient-y(transparentize($white, 1), transparentize($white, 0));
|
|
17
|
+
content: '';
|
|
18
|
+
z-index: 20;
|
|
19
|
+
}
|
|
20
|
+
.readmore-js-toggle {
|
|
21
|
+
padding-top: ($spacer * .5);
|
|
22
|
+
padding-bottom: ($spacer * .5);
|
|
23
|
+
z-index: 30;
|
|
24
|
+
}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
// Heartbeat "beacon" styles for sysuser functionality
|
|
2
|
+
.notify {
|
|
3
|
+
position: absolute;
|
|
4
|
+
top: 0;
|
|
5
|
+
right: 0;
|
|
6
|
+
z-index: 50;
|
|
7
|
+
.heartbit {
|
|
8
|
+
position: absolute;
|
|
9
|
+
top: -($spacer * .75);
|
|
10
|
+
right: -($spacer * .75);
|
|
11
|
+
height: ($spacer * 1.5);
|
|
12
|
+
width: ($spacer * 1.5);
|
|
13
|
+
z-index: 10;
|
|
14
|
+
border: 6px solid $warning;
|
|
15
|
+
border-radius: ($spacer * .75);
|
|
16
|
+
animation: heartbit 1s ease-out infinite;
|
|
17
|
+
}
|
|
18
|
+
.point {
|
|
19
|
+
position: absolute;
|
|
20
|
+
right: -($spacer * .25);
|
|
21
|
+
top: -($spacer * .25);
|
|
22
|
+
width: ($spacer * .5);
|
|
23
|
+
height: ($spacer * .5);
|
|
24
|
+
border-radius: $spacer;
|
|
25
|
+
background-color: $warning;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
// Heartbeat animation used on beacon for sysusers
|
|
30
|
+
@keyframes heartbit {
|
|
31
|
+
0% {
|
|
32
|
+
transform: scale(0);
|
|
33
|
+
opacity: 0;
|
|
34
|
+
}
|
|
35
|
+
25% {
|
|
36
|
+
transform: scale(0.1);
|
|
37
|
+
opacity: .1;
|
|
38
|
+
}
|
|
39
|
+
50% {
|
|
40
|
+
transform: scale(0.5);
|
|
41
|
+
opacity: .3;
|
|
42
|
+
}
|
|
43
|
+
75% {
|
|
44
|
+
transform: scale(0.8);
|
|
45
|
+
opacity: .5;
|
|
46
|
+
}
|
|
47
|
+
100% {
|
|
48
|
+
transform: scale(1);
|
|
49
|
+
opacity: 0;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
@@ -13,6 +13,7 @@
|
|
|
13
13
|
}
|
|
14
14
|
+ .custom-control:not(.custom-control-inline) { margin-top: ($spacer * .25); }
|
|
15
15
|
}
|
|
16
|
+
.custom-checkbox, .custom-radio { min-width: $custom-control-gutter + $custom-control-indicator-size; } // sets minimum width to have space even if custom-control-label isn't there
|
|
16
17
|
|
|
17
18
|
// Custom control indicators
|
|
18
19
|
//
|
|
@@ -8,7 +8,7 @@ $slat-actions-lg-width: 108px;
|
|
|
8
8
|
flex-flow: column nowrap;
|
|
9
9
|
|
|
10
10
|
// Nowrap version -- used when the goal is to have all slat-item columns on the same line in smaller screens
|
|
11
|
-
|
|
11
|
+
&:not(.slats-nowrap) { // noting the :not() psuedo-class meaning all slats that don't have this class get these styles
|
|
12
12
|
.slat-body {
|
|
13
13
|
@include media-breakpoint-down(sm) { flex-direction: column; }
|
|
14
14
|
}
|
|
@@ -36,6 +36,9 @@ $slat-actions-lg-width: 108px;
|
|
|
36
36
|
padding-top: ($spacer * 1.5);
|
|
37
37
|
padding-bottom: ($spacer * 1.5);
|
|
38
38
|
}
|
|
39
|
+
|
|
40
|
+
// Status
|
|
41
|
+
&.pending { background-color: #fff5e0; }
|
|
39
42
|
}
|
|
40
43
|
|
|
41
44
|
|
|
@@ -13,7 +13,7 @@ body:not(.modal-open) {
|
|
|
13
13
|
.select2-container--default { z-index: $zindex-dropdown; }
|
|
14
14
|
}
|
|
15
15
|
body.modal-open {
|
|
16
|
-
.select2-container { z-index: $zindex-modal + 2 !important; } // makes select2 dropdown higher than redactor toolbar in modals
|
|
16
|
+
.modal .select2-container { z-index: $zindex-modal + 2 !important; } // makes select2 dropdown higher than redactor toolbar in modals
|
|
17
17
|
}
|
|
18
18
|
|
|
19
19
|
|
|
@@ -11,6 +11,10 @@ module NfgUi
|
|
|
11
11
|
include NfgUi::Components::Traits::Size
|
|
12
12
|
include NfgUi::Components::Traits::SlatItem
|
|
13
13
|
|
|
14
|
+
def caption
|
|
15
|
+
options.fetch(:caption, nil)
|
|
16
|
+
end
|
|
17
|
+
|
|
14
18
|
def component_family
|
|
15
19
|
:slats
|
|
16
20
|
end
|
|
@@ -19,36 +23,56 @@ module NfgUi
|
|
|
19
23
|
options.fetch(:slat_header, nil)
|
|
20
24
|
end
|
|
21
25
|
|
|
22
|
-
|
|
23
|
-
|
|
26
|
+
# Leverage custom tooltip implementation
|
|
27
|
+
# so that tooltips are connected to slat item text
|
|
28
|
+
# and not the slat item containing div (resulting in better UI)
|
|
29
|
+
def tooltip
|
|
30
|
+
options.fetch(:tooltip, nil)
|
|
24
31
|
end
|
|
25
32
|
|
|
26
33
|
def render
|
|
27
34
|
content_tag(base_element, slat_item_html_options) do
|
|
28
35
|
if slat_header
|
|
29
|
-
concat(content_tag(:h6, slat_header, class: 'display-4 slat-column-header'))
|
|
36
|
+
concat(content_tag(:h6, slat_header, class: 'display-4 slat-column-header', **tooltip_html_options))
|
|
30
37
|
end
|
|
31
38
|
if heading
|
|
32
39
|
if href
|
|
33
40
|
concat(content_tag(:a, href: view_context.url_for(href)) {
|
|
34
|
-
NfgUi::Components::Foundations::Typeface.new({ subheading: heading }, view_context).render
|
|
41
|
+
NfgUi::Components::Foundations::Typeface.new({ subheading: heading, tooltip: tooltip }, view_context).render
|
|
35
42
|
})
|
|
36
43
|
else
|
|
37
|
-
concat(NfgUi::Components::Foundations::Typeface.new({ subheading: heading }, view_context).render)
|
|
44
|
+
concat(NfgUi::Components::Foundations::Typeface.new({ subheading: heading, tooltip: tooltip }, view_context).render)
|
|
38
45
|
end
|
|
39
46
|
end
|
|
40
47
|
concat(block_given? ? yield : body)
|
|
41
48
|
if caption
|
|
42
|
-
concat(NfgUi::Components::Foundations::Typeface.new({ caption: caption, class: 'mb-0' }, view_context).render)
|
|
49
|
+
concat(NfgUi::Components::Foundations::Typeface.new({ caption: caption, class: 'mb-0', tooltip: (tooltip unless heading) }, view_context).render)
|
|
43
50
|
end
|
|
44
51
|
end
|
|
45
52
|
end
|
|
46
53
|
|
|
47
54
|
private
|
|
48
55
|
|
|
56
|
+
def tooltip_html_options
|
|
57
|
+
return {} unless tooltip
|
|
58
|
+
{ title: tooltip, data: options[:data].merge(tooltip_data_attributes) }
|
|
59
|
+
end
|
|
60
|
+
|
|
61
|
+
def tooltip_data_attributes
|
|
62
|
+
{ toggle: 'tooltip',
|
|
63
|
+
placement: :top,
|
|
64
|
+
html: 'true' }
|
|
65
|
+
end
|
|
66
|
+
|
|
49
67
|
# Strip the href from html_options and pass it to the header
|
|
50
68
|
def slat_item_html_options
|
|
51
|
-
html_options.except(:href)
|
|
69
|
+
options = html_options.except(:href)
|
|
70
|
+
|
|
71
|
+
# merge in tooltip only if leveraging block body content
|
|
72
|
+
# tooltip_html_options will return {} if no tooltip so this is a safe merge
|
|
73
|
+
options.merge!(tooltip_html_options) unless (heading || caption || slat_header)
|
|
74
|
+
|
|
75
|
+
options
|
|
52
76
|
end
|
|
53
77
|
|
|
54
78
|
# :sm is the default size, and is not given
|
|
@@ -59,7 +83,7 @@ module NfgUi
|
|
|
59
83
|
end
|
|
60
84
|
|
|
61
85
|
def non_html_attribute_options
|
|
62
|
-
super.push(:slat_header, :caption)
|
|
86
|
+
super.push(:slat_header, :caption, :tooltip)
|
|
63
87
|
end
|
|
64
88
|
end
|
|
65
89
|
end
|
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.11.1
|
|
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:
|
|
12
|
+
date: 2021-01-05 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: bootstrap
|
|
@@ -421,6 +421,7 @@ files:
|
|
|
421
421
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_navbar.scss
|
|
422
422
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_tables.scss
|
|
423
423
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_activity_feed.scss
|
|
424
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_bee.scss
|
|
424
425
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_builder_layout.scss
|
|
425
426
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_campaign_card.scss
|
|
426
427
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_campaign_preview.scss
|
|
@@ -434,9 +435,11 @@ files:
|
|
|
434
435
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_interaction.scss
|
|
435
436
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_overlay_blocker.scss
|
|
436
437
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_page_header.scss
|
|
438
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_readmore.scss
|
|
437
439
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_share_dropdown.scss
|
|
438
440
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_sortable.scss
|
|
439
441
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_status_indicator.scss
|
|
442
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_sys_only_functionality.scss
|
|
440
443
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_tile.scss
|
|
441
444
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_video_countdown.scss
|
|
442
445
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/_variables.scss
|