nfg_ui 0.11.11 → 0.11.15
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 +1 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/_modal.scss +0 -16
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_campaign_card.scss +6 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/{_overlay_blocker.scss → _redacted_text.scss} +0 -17
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/_custom.scss +2 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_chat.scss +10 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_event_livestream.scss +24 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_custom.scss +3 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_forms.scss +0 -4
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_modal.scss +14 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_progress.scss +1 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_type.scss +9 -2
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_avatar.scss +2 -2
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_chat.scss +39 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_drawer.scss +87 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_overlay_blocker.scss +17 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/plugins/_select2.scss +1 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/_custom.scss +3 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/_navbar.scss +0 -11
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/_reboot.scss +2 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_background_variations.scss +1 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_donor_scroll.scss +6 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_event.scss +1 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_event_livestream.scss +94 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_everyday_default.scss +2 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_everyday_story.scss +4 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_page_header.scss +34 -0
- data/lib/nfg_ui/components/elements/button.rb +9 -3
- data/lib/nfg_ui/version.rb +1 -1
- metadata +13 -4
- data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_admin_bar.scss +0 -20
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 4840edaa5669a926a82c404e2490aa09b9f3c6d02079d0e730cd1af565c1165e
|
|
4
|
+
data.tar.gz: 8125cf47449dfd233312fd02aba2e6b45b3ba7d05133ce17a20f8c48959df060
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: a30ea91175532e9c3cf27ceaa7ba22a777df3340db57f2c300d56671887a515525e4ed7411d4314da703f5c23617f29e05419b8abb9470d7229e52fe5cdf3826
|
|
7
|
+
data.tar.gz: 5c43ba17caa40d78fd26e31369ffbd1a247181bee25220538e57add90fff2e03f3a0d7dbe33a8f768429e97f36eb09b55170c2df5871b7acaf43b6278afcdddc
|
|
@@ -12,9 +12,9 @@
|
|
|
12
12
|
@import 'custom/gallery';
|
|
13
13
|
@import 'custom/icomoon';
|
|
14
14
|
@import 'custom/interaction';
|
|
15
|
-
@import 'custom/overlay_blocker';
|
|
16
15
|
@import 'custom/page_header';
|
|
17
16
|
@import 'custom/readmore';
|
|
17
|
+
@import 'custom/redacted_text';
|
|
18
18
|
@import 'custom/share_dropdown';
|
|
19
19
|
@import 'custom/sortable';
|
|
20
20
|
@import 'custom/status_indicator';
|
|
@@ -4,19 +4,3 @@
|
|
|
4
4
|
+ #quick-add-modal { display: none !important; }
|
|
5
5
|
~ .modal-backdrop.show ~ .modal-backdrop.show { display: none !important; }
|
|
6
6
|
}
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
// Full page cover modal option
|
|
10
|
-
.modal-cover {
|
|
11
|
-
margin: 0;
|
|
12
|
-
width: 100%;
|
|
13
|
-
max-width: 100%;
|
|
14
|
-
height: 100%;
|
|
15
|
-
transform: none !important; // removes default 50px transform that occurs on modal showing (.fade and .show)
|
|
16
|
-
.modal-content {
|
|
17
|
-
display: block;
|
|
18
|
-
height: 100%;
|
|
19
|
-
border: none;
|
|
20
|
-
border-radius: 0;
|
|
21
|
-
}
|
|
22
|
-
}
|
|
@@ -30,20 +30,3 @@ $redacted-font-family: "BLOKK";
|
|
|
30
30
|
word-spacing: -3px;
|
|
31
31
|
.card-img-overlay { background: none; }
|
|
32
32
|
}
|
|
33
|
-
.overlay-white {
|
|
34
|
-
position: absolute;
|
|
35
|
-
top: 0;
|
|
36
|
-
right: 0;
|
|
37
|
-
bottom: 0;
|
|
38
|
-
left: 0;
|
|
39
|
-
z-index: 30;
|
|
40
|
-
font-family: $font-family-base;
|
|
41
|
-
letter-spacing: 0;
|
|
42
|
-
word-spacing: 0;
|
|
43
|
-
background-color: transparentize($white, 0.2);
|
|
44
|
-
}
|
|
45
|
-
.overlay-blur {
|
|
46
|
-
transition: $transition-base;
|
|
47
|
-
filter: blur(0);
|
|
48
|
-
&.in { filter: blur(4px); }
|
|
49
|
-
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
// Styles specific to the event livestream
|
|
2
|
+
.event-sidebar {
|
|
3
|
+
@include media-breakpoint-up(lg) {
|
|
4
|
+
display: -ms-flexbox;
|
|
5
|
+
-ms-flex-direction: column;
|
|
6
|
+
}
|
|
7
|
+
.event-sidebar-section {
|
|
8
|
+
&.event-sidebar-section-scroll {
|
|
9
|
+
-ms-flex-positive: 1;
|
|
10
|
+
}
|
|
11
|
+
&.event-sidebar-section-container {
|
|
12
|
+
display: -ms-flexbox;
|
|
13
|
+
-ms-flex-direction: column;
|
|
14
|
+
-ms-flex-positive: 1;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
// chat container and message specific styles
|
|
20
|
+
.event-sidebar-section-chat {
|
|
21
|
+
display: -ms-flexbox;
|
|
22
|
+
-ms-flex-align: end;
|
|
23
|
+
-ms-flex-positive: 1;
|
|
24
|
+
}
|
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
// Our custom styles
|
|
2
2
|
@import 'custom/avatar';
|
|
3
|
+
@import 'custom/chat';
|
|
3
4
|
@import 'custom/device_preview';
|
|
5
|
+
@import 'custom/drawer';
|
|
4
6
|
@import 'custom/icon';
|
|
5
7
|
@import 'custom/illustration';
|
|
6
8
|
@import 'custom/mobile';
|
|
7
9
|
@import 'custom/nav_step';
|
|
10
|
+
@import 'custom/overlay_blocker';
|
|
8
11
|
@import 'custom/redactor';
|
|
9
12
|
@import 'custom/social_share';
|
|
10
13
|
@import 'custom/skeleton';
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
// Full page cover modal option
|
|
2
|
+
.modal-cover {
|
|
3
|
+
margin: 0;
|
|
4
|
+
width: 100%;
|
|
5
|
+
max-width: 100%;
|
|
6
|
+
height: 100%;
|
|
7
|
+
transform: none !important; // removes default 50px transform that occurs on modal showing (.fade and .show)
|
|
8
|
+
.modal-content {
|
|
9
|
+
display: block;
|
|
10
|
+
height: 100%;
|
|
11
|
+
border: none;
|
|
12
|
+
border-radius: 0;
|
|
13
|
+
}
|
|
14
|
+
}
|
|
@@ -15,6 +15,13 @@ h6, .h6 { line-height: 1.5; }
|
|
|
15
15
|
text-transform: uppercase;
|
|
16
16
|
}
|
|
17
17
|
|
|
18
|
+
// Adjust heading sizes on smaller devices
|
|
19
|
+
@include media-breakpoint-down(md) {
|
|
20
|
+
h1, .h1, h2, .h2, h3, .h3 {
|
|
21
|
+
font-size: $h4-font-size;
|
|
22
|
+
line-height: 1;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
18
25
|
|
|
19
26
|
//
|
|
20
27
|
// Misc
|
|
@@ -59,8 +66,8 @@ a.no-link-color {
|
|
|
59
66
|
content: '';
|
|
60
67
|
z-index: 0;
|
|
61
68
|
}
|
|
62
|
-
|
|
63
|
-
|
|
69
|
+
[class*='text-'], .btn-center { z-index: 10; }
|
|
70
|
+
[class*='text-'] {
|
|
64
71
|
position: relative;
|
|
65
72
|
text-align: center;
|
|
66
73
|
line-height: 1;
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
vertical-align: middle;
|
|
7
7
|
width: ($spacer * 2);
|
|
8
8
|
height: ($spacer * 2);
|
|
9
|
-
color:
|
|
9
|
+
color: $body-color;
|
|
10
10
|
background-color: $border-color;
|
|
11
11
|
border-radius: 50%;
|
|
12
12
|
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
font-weight: $font-weight-bold;
|
|
23
23
|
font-size: $font-size-base;
|
|
24
24
|
line-height: 1.2;
|
|
25
|
-
color:
|
|
25
|
+
color: inherit;
|
|
26
26
|
text-align: center;
|
|
27
27
|
white-space: nowrap;
|
|
28
28
|
overflow: hidden;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
// Chat functionality within FP admin and public (livestream event template)
|
|
2
|
+
|
|
3
|
+
.chat-container {
|
|
4
|
+
display: flex;
|
|
5
|
+
align-items: flex-end;
|
|
6
|
+
width: 100%;
|
|
7
|
+
max-height: 100%;
|
|
8
|
+
height: 100%;
|
|
9
|
+
z-index: 0;
|
|
10
|
+
&:after {
|
|
11
|
+
position: absolute;
|
|
12
|
+
top: 0;
|
|
13
|
+
left: 0;
|
|
14
|
+
width: 100%;
|
|
15
|
+
height: $spacer;
|
|
16
|
+
@include gradient-y(transparentize($white, 0), transparentize($white, 1));
|
|
17
|
+
content: '';
|
|
18
|
+
z-index: 10;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
.chat-messages {
|
|
22
|
+
display: flex;
|
|
23
|
+
flex-direction: column;
|
|
24
|
+
align-items: flex-end;
|
|
25
|
+
padding-top: $spacer;
|
|
26
|
+
width: 100%;
|
|
27
|
+
max-height: 100%;
|
|
28
|
+
overflow-y: auto;
|
|
29
|
+
z-index: 0;
|
|
30
|
+
}
|
|
31
|
+
.chat-message {
|
|
32
|
+
// donation icon in chat message renders top left of avatar
|
|
33
|
+
.icon-circle {
|
|
34
|
+
position: absolute;
|
|
35
|
+
top: -($spacer * .5);
|
|
36
|
+
left: -($spacer * .5);
|
|
37
|
+
z-index: 20;
|
|
38
|
+
}
|
|
39
|
+
}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
.drawer {
|
|
2
|
+
position: fixed;
|
|
3
|
+
width: 100%;
|
|
4
|
+
z-index: $zindex-modal;
|
|
5
|
+
background-color: $white;
|
|
6
|
+
box-shadow: $box-shadow;
|
|
7
|
+
transition: transform 0.5s cubic-bezier(0.4, 0.0, 0.2, 1);
|
|
8
|
+
opacity: 1 !important;
|
|
9
|
+
|
|
10
|
+
// Positions for drawer to slide in from
|
|
11
|
+
&.drawer-top {
|
|
12
|
+
top: 0;
|
|
13
|
+
right: auto;
|
|
14
|
+
bottom: auto;
|
|
15
|
+
left: 0;
|
|
16
|
+
transform: translate(0, -100%);
|
|
17
|
+
}
|
|
18
|
+
&.drawer-right {
|
|
19
|
+
top: 0;
|
|
20
|
+
right: 0;
|
|
21
|
+
bottom: auto;
|
|
22
|
+
left: auto;
|
|
23
|
+
transform: translate(100%, 0);
|
|
24
|
+
}
|
|
25
|
+
&.drawer-bottom {
|
|
26
|
+
top: auto;
|
|
27
|
+
right: auto;
|
|
28
|
+
bottom: 0;
|
|
29
|
+
left: 0;
|
|
30
|
+
transform: translate(0, 100%);
|
|
31
|
+
}
|
|
32
|
+
&.drawer-left {
|
|
33
|
+
top: 0;
|
|
34
|
+
right: auto;
|
|
35
|
+
bottom: auto;
|
|
36
|
+
left: 0;
|
|
37
|
+
transform: translate(-100%, 0);
|
|
38
|
+
}
|
|
39
|
+
&.drawer-top, &.drawer-bottom {
|
|
40
|
+
height: 100%;
|
|
41
|
+
@include media-breakpoint-up(lg) { height: auto; }
|
|
42
|
+
}
|
|
43
|
+
&.drawer-right, &.drawer-left {
|
|
44
|
+
height: 100%;
|
|
45
|
+
@include media-breakpoint-up(lg) { width: 32%; }
|
|
46
|
+
}
|
|
47
|
+
&.drawer-top, &.drawer-right, &.drawer-bottom, &.drawer-left {
|
|
48
|
+
&.show { transform: translate(0, 0); } // uses modal's show for slide animation
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
// Modal overrides for drawer to use modal component
|
|
53
|
+
.drawer {
|
|
54
|
+
.modal-dialog {
|
|
55
|
+
margin: 0;
|
|
56
|
+
padding: 0;
|
|
57
|
+
width: 100%;
|
|
58
|
+
max-width: 100%;
|
|
59
|
+
height: 100%;
|
|
60
|
+
transition: none !important; // removes default fade in modal transition
|
|
61
|
+
transform: none !important; // removes default 50px transform that occurs on modal showing (.fade and .show)
|
|
62
|
+
.modal-content {
|
|
63
|
+
display: block;
|
|
64
|
+
width: 100%;
|
|
65
|
+
height: 100%;
|
|
66
|
+
border: none;
|
|
67
|
+
box-shadow: none;
|
|
68
|
+
border-radius: 0;
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
// Hides modal backdrop default and need to be siblings
|
|
74
|
+
.drawer ~ .modal-backdrop { display: none; }
|
|
75
|
+
|
|
76
|
+
// Main drawer container
|
|
77
|
+
.drawer-content {
|
|
78
|
+
height: 100%;
|
|
79
|
+
overflow-y: auto;
|
|
80
|
+
}
|
|
81
|
+
.drawer-section {
|
|
82
|
+
+ .drawer-section { border-top: $border-width solid $border-color; }
|
|
83
|
+
&.drawer-section-scroll { overflow-y: scroll; }
|
|
84
|
+
}
|
|
85
|
+
.drawer-header, .drawer-body, .drawer-footer {
|
|
86
|
+
padding: $spacer;
|
|
87
|
+
}
|
data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_overlay_blocker.scss
ADDED
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
.overlay-white {
|
|
2
|
+
position: absolute;
|
|
3
|
+
top: 0;
|
|
4
|
+
right: 0;
|
|
5
|
+
bottom: 0;
|
|
6
|
+
left: 0;
|
|
7
|
+
z-index: 30;
|
|
8
|
+
font-family: $font-family-base;
|
|
9
|
+
letter-spacing: 0;
|
|
10
|
+
word-spacing: 0;
|
|
11
|
+
background-color: transparentize($white, 0.1);
|
|
12
|
+
}
|
|
13
|
+
.overlay-blur {
|
|
14
|
+
transition: $transition-base;
|
|
15
|
+
filter: blur(0);
|
|
16
|
+
&.in { filter: blur(4px); }
|
|
17
|
+
}
|
|
@@ -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
|
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
// Our custom styles
|
|
2
|
-
@import 'custom/admin_bar';
|
|
3
2
|
@import 'custom/background_variations';
|
|
4
3
|
@import 'custom/donor_account';
|
|
4
|
+
@import 'custom/donor_scroll';
|
|
5
5
|
@import 'custom/event';
|
|
6
|
+
@import 'custom/event_livestream';
|
|
6
7
|
@import 'custom/everyday_default';
|
|
7
8
|
@import 'custom/everyday_story';
|
|
8
9
|
@import 'custom/footer_links';
|
|
10
|
+
@import 'custom/page_header';
|
|
@@ -20,14 +20,3 @@ $navbar-logo-height: (($spacer * 4.5) - $spacer);
|
|
|
20
20
|
padding-left: $navbar-padding-x;
|
|
21
21
|
border-left: $border-width solid $border-color;
|
|
22
22
|
}
|
|
23
|
-
.sticky-div {
|
|
24
|
-
box-shadow: $box-shadow-sm;
|
|
25
|
-
.btn-header-donate {
|
|
26
|
-
opacity: 0;
|
|
27
|
-
transition: $transition-base;
|
|
28
|
-
}
|
|
29
|
-
&.stuck {
|
|
30
|
-
box-shadow: $box-shadow;
|
|
31
|
-
.btn-header-donate { opacity: 1; }
|
|
32
|
-
}
|
|
33
|
-
}
|
data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_event_livestream.scss
ADDED
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
// Styles specific to the event livestream
|
|
2
|
+
.event {
|
|
3
|
+
@include media-breakpoint-up(lg) { height: 100%; }
|
|
4
|
+
.page-content {
|
|
5
|
+
@include media-breakpoint-up(lg) { height: 100%; }
|
|
6
|
+
}
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
// Block containers for side by side view
|
|
10
|
+
.event-body {
|
|
11
|
+
@include media-breakpoint-up(lg) {
|
|
12
|
+
width: 100%;
|
|
13
|
+
height: 100%;
|
|
14
|
+
overflow: hidden;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
.event-content {
|
|
18
|
+
padding: $spacer;
|
|
19
|
+
@include media-breakpoint-up(lg) {
|
|
20
|
+
float: left;
|
|
21
|
+
width: 67%;
|
|
22
|
+
height: 100%;
|
|
23
|
+
overflow-y: auto;
|
|
24
|
+
> :last-child { margin-bottom: ($spacer * 2); }
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
.event-sidebar {
|
|
28
|
+
@include media-breakpoint-down(md) { border-bottom: $border-width solid $border-color; }
|
|
29
|
+
@include media-breakpoint-up(lg) {
|
|
30
|
+
float: right;
|
|
31
|
+
display: flex;
|
|
32
|
+
flex-direction: column;
|
|
33
|
+
width: 33%;
|
|
34
|
+
height: 100%;
|
|
35
|
+
border-left: $border-width solid $border-color;
|
|
36
|
+
> :last-child { margin-bottom: $spacer; }
|
|
37
|
+
}
|
|
38
|
+
&.event-sidebar-scroll {
|
|
39
|
+
@include media-breakpoint-up(lg) { overflow-y: auto; }
|
|
40
|
+
}
|
|
41
|
+
.event-sidebar-section {
|
|
42
|
+
padding: $spacer;
|
|
43
|
+
+ .event-sidebar-section { border-top: $border-width solid $border-color; }
|
|
44
|
+
&.event-sidebar-section-scroll {
|
|
45
|
+
flex-grow: 1;
|
|
46
|
+
height: 100%;
|
|
47
|
+
min-height: ($spacer * 10); // sets min-height to ensure the scrollable area has room to be seen on restricted height devices (not mobile)
|
|
48
|
+
overflow-y: auto;
|
|
49
|
+
}
|
|
50
|
+
&.event-sidebar-section-container { // container for chat and donor scroll
|
|
51
|
+
display: flex;
|
|
52
|
+
flex-direction: column;
|
|
53
|
+
flex-grow: 1;
|
|
54
|
+
height: 100%;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
// styles specific to donor-scroll to remove default card styles when donor scroll is inside the event sidebar
|
|
60
|
+
.event-sidebar-section {
|
|
61
|
+
.card[data-describe='donor-scroll'] {
|
|
62
|
+
border: 0;
|
|
63
|
+
.card-body { padding: 0; }
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
// chat container and message specific styles
|
|
68
|
+
.event-sidebar-section-chat {
|
|
69
|
+
display: flex;
|
|
70
|
+
align-items: flex-end;
|
|
71
|
+
flex-grow: 1;
|
|
72
|
+
@include media-breakpoint-down(md) { // puts a border and height on mobile
|
|
73
|
+
height: ($spacer * 10);
|
|
74
|
+
border: $border-width solid $border-color;
|
|
75
|
+
border-radius: $border-radius;
|
|
76
|
+
}
|
|
77
|
+
@include media-breakpoint-up(lg) {
|
|
78
|
+
height: 100%;
|
|
79
|
+
min-height: ($spacer * 10);
|
|
80
|
+
}
|
|
81
|
+
// hides elements in public page chat only meant for admin view
|
|
82
|
+
// need this because .chat-message delete button doesn't know user type in partial
|
|
83
|
+
.hide-admin { display: none; }
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
// Allows for the login form to show in desktop and mobile.
|
|
87
|
+
.event-sidebar-section-no-access {
|
|
88
|
+
overflow: hidden;
|
|
89
|
+
@include media-breakpoint-down(md) { height: 720px; }
|
|
90
|
+
.log-in-form { overflow-y: auto; }
|
|
91
|
+
.event-sidebar-section-chat {
|
|
92
|
+
@include media-breakpoint-down(md) { height: 100%; }
|
|
93
|
+
}
|
|
94
|
+
}
|
data/app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_everyday_story.scss
CHANGED
|
@@ -6,7 +6,10 @@
|
|
|
6
6
|
background-size: cover;
|
|
7
7
|
@include media-breakpoint-down(md) {
|
|
8
8
|
background-image: none !important;
|
|
9
|
-
.card {
|
|
9
|
+
.card {
|
|
10
|
+
border: none;
|
|
11
|
+
box-shadow: none !important;
|
|
12
|
+
}
|
|
10
13
|
.card-body { padding: 0; }
|
|
11
14
|
}
|
|
12
15
|
@include media-breakpoint-up(lg) { min-height: 500px; }
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
$page-header-height: ($spacer * 4.5);
|
|
2
|
+
$page-header-height-admin: ($spacer * 6.5);
|
|
3
|
+
|
|
4
|
+
// Page header specific styles
|
|
5
|
+
.page-header {
|
|
6
|
+
width: 100%;
|
|
7
|
+
background-color: $white;
|
|
8
|
+
border-bottom: $border-width solid $border-color;
|
|
9
|
+
z-index: $zindex-fixed;
|
|
10
|
+
@include media-breakpoint-up(lg) {
|
|
11
|
+
position: fixed;
|
|
12
|
+
top: 0;
|
|
13
|
+
left: 0;
|
|
14
|
+
right: 0;
|
|
15
|
+
min-height: $page-header-height;
|
|
16
|
+
}
|
|
17
|
+
body.admin & { // this renders as body.admin .page-header specifying when the view is in admin status
|
|
18
|
+
@include media-breakpoint-up(lg) { min-height: $page-header-height-admin; }
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
// Moving .page-content container down with padding when page-header exists but ONLY on larger screens
|
|
23
|
+
.page-header {
|
|
24
|
+
+ .page-content {
|
|
25
|
+
@include media-breakpoint-up(lg) {
|
|
26
|
+
padding-top: $page-header-height;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
body.admin & + .page-content { // this renders as body.admin .page-header + .page-content specifying when the view is in admin status
|
|
30
|
+
@include media-breakpoint-up(lg) {
|
|
31
|
+
padding-top: $page-header-height-admin;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
}
|
|
@@ -43,12 +43,14 @@ module NfgUi
|
|
|
43
43
|
end
|
|
44
44
|
|
|
45
45
|
def render
|
|
46
|
+
@body = yield if block_given?
|
|
47
|
+
|
|
46
48
|
if tooltip && disabled
|
|
47
49
|
content_tag(:span, disabled_component_tooltip_wrapper_html_options) do
|
|
48
50
|
content_tag(as, html_options) do
|
|
49
51
|
capture do
|
|
50
52
|
concat(left_icon_component) if left_icon
|
|
51
|
-
concat(
|
|
53
|
+
concat(body)
|
|
52
54
|
concat(right_icon_component) if icon
|
|
53
55
|
end
|
|
54
56
|
end
|
|
@@ -58,7 +60,7 @@ module NfgUi
|
|
|
58
60
|
content_tag(as, html_options) do
|
|
59
61
|
capture do
|
|
60
62
|
concat(left_icon_component) if left_icon
|
|
61
|
-
concat(
|
|
63
|
+
concat(body)
|
|
62
64
|
concat(right_icon_component) if icon
|
|
63
65
|
end
|
|
64
66
|
end
|
|
@@ -76,10 +78,14 @@ module NfgUi
|
|
|
76
78
|
|
|
77
79
|
def right_icon_component
|
|
78
80
|
NfgUi::Components::Foundations::Icon.new({ traits: [icon, :right],
|
|
79
|
-
class:
|
|
81
|
+
class: right_icon_class },
|
|
80
82
|
view_context).render
|
|
81
83
|
end
|
|
82
84
|
|
|
85
|
+
def right_icon_class
|
|
86
|
+
NfgUi::Components::Foundations::Icon::RIGHT_ICON_SPACER_CSS_CLASS if body.present?
|
|
87
|
+
end
|
|
88
|
+
|
|
83
89
|
def base_element
|
|
84
90
|
as
|
|
85
91
|
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.15
|
|
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: 2021-01
|
|
12
|
+
date: 2021-04-01 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: bootstrap
|
|
@@ -433,9 +433,9 @@ files:
|
|
|
433
433
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_gallery.scss
|
|
434
434
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_icomoon.scss
|
|
435
435
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_interaction.scss
|
|
436
|
-
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_overlay_blocker.scss
|
|
437
436
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_page_header.scss
|
|
438
437
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_readmore.scss
|
|
438
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_redacted_text.scss
|
|
439
439
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_share_dropdown.scss
|
|
440
440
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_sortable.scss
|
|
441
441
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_status_indicator.scss
|
|
@@ -481,6 +481,8 @@ files:
|
|
|
481
481
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/_progress.scss
|
|
482
482
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/_utilities.scss
|
|
483
483
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_avatar.scss
|
|
484
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_chat.scss
|
|
485
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_event_livestream.scss
|
|
484
486
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_everyday_giving.scss
|
|
485
487
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_icon.scss
|
|
486
488
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/custom/_nav_step.scss
|
|
@@ -501,6 +503,7 @@ files:
|
|
|
501
503
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_custom.scss
|
|
502
504
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_dropdown.scss
|
|
503
505
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_forms.scss
|
|
506
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_modal.scss
|
|
504
507
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_nav.scss
|
|
505
508
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_progress.scss
|
|
506
509
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_reboot.scss
|
|
@@ -508,11 +511,14 @@ files:
|
|
|
508
511
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_tooltip.scss
|
|
509
512
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_type.scss
|
|
510
513
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_avatar.scss
|
|
514
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_chat.scss
|
|
511
515
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_device_preview.scss
|
|
516
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_drawer.scss
|
|
512
517
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_icon.scss
|
|
513
518
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_illustration.scss
|
|
514
519
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_mobile.scss
|
|
515
520
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_nav_step.scss
|
|
521
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_overlay_blocker.scss
|
|
516
522
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_redactor.scss
|
|
517
523
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_skeleton.scss
|
|
518
524
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_slat.scss
|
|
@@ -541,13 +547,16 @@ files:
|
|
|
541
547
|
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/_list-group.scss
|
|
542
548
|
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/_nav.scss
|
|
543
549
|
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/_navbar.scss
|
|
544
|
-
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/
|
|
550
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/_reboot.scss
|
|
545
551
|
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_background_variations.scss
|
|
546
552
|
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_donor_account.scss
|
|
553
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_donor_scroll.scss
|
|
547
554
|
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_event.scss
|
|
555
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_event_livestream.scss
|
|
548
556
|
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_everyday_default.scss
|
|
549
557
|
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_everyday_story.scss
|
|
550
558
|
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_footer_links.scss
|
|
559
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_page_header.scss
|
|
551
560
|
- app/controllers/nfg_ui/application_controller.rb
|
|
552
561
|
- app/helpers/nfg_ui/application_helper.rb
|
|
553
562
|
- app/helpers/nfg_ui/components/browser_helper.rb
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
// Remove styles and use bs4 structure and styles once update is final
|
|
2
|
-
|
|
3
|
-
.admin-bar {
|
|
4
|
-
position: relative;
|
|
5
|
-
z-index: 100;
|
|
6
|
-
font-weight: $font-weight-bold;
|
|
7
|
-
color: $text-muted;
|
|
8
|
-
text-transform: uppercase;
|
|
9
|
-
background-color: $black;
|
|
10
|
-
}
|
|
11
|
-
.admin-bar-descriptor {
|
|
12
|
-
display: inline-block;
|
|
13
|
-
padding: ($spacer * .5) 0;
|
|
14
|
-
}
|
|
15
|
-
.admin-bar-main-links a {
|
|
16
|
-
display: inline-block;
|
|
17
|
-
padding: ($spacer * .5);
|
|
18
|
-
color: $white;
|
|
19
|
-
&:hover, &:active { color: $text-muted; }
|
|
20
|
-
}
|