nfg_ui 0.13.1 → 0.13.2

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: f0bd492e17572b1dbf2aa2b293f740edf9bee79301881c105a56258d140e4c1b
4
- data.tar.gz: 50d72c8fd06cea25747b23e5c546bd90893312082eecc3ab2bc4e0dceff38021
3
+ metadata.gz: 52eb169f5803dc4a89489c7383a04d727873f4a0d3722a9d36f555493a66a87d
4
+ data.tar.gz: 167b00bd9265fb9f0e3b16bf3e36a44166e0fc5d64cf5c604580b4efa9083278
5
5
  SHA512:
6
- metadata.gz: f01c58aeed6b1dbd6a6b135c551962f55fc5416657cffd2c395a3dd0f0d57420c96fba36e96650c5bbde0cd812b4a4ed8ade2f9d7f7965ca6d61e2d9ea683bbf
7
- data.tar.gz: 7bed6a6c4b21a190d27b089e4c103644b7291b52a92f8378f4730dac2b9cccb819917d233eb78556c69d9b74054072e03d26c8e412b2593151baa5279fb6f185
6
+ metadata.gz: be1ab2d77aa8b9a1b1cf5be109425e553320a1a21d887847f35494bd1ebc17b32d809d97aac64edca2209d8617755e96bcc2f34899c043cbc6dfb63cc13227fc
7
+ data.tar.gz: 23efe9e2f2ef15fddc6ed928682d411bcdfe6e76ab94f9eac2545311f0ce5e782ea9af57ad730cb27e137e2c1c26c3fa4b50a19509bcc3ad12fd138ff9c2d309
@@ -3,7 +3,6 @@
3
3
  @import 'custom/bee';
4
4
  @import 'custom/builder_layout';
5
5
  @import 'custom/campaign_card';
6
- @import 'custom/campaign_preview';
7
6
  @import 'custom/content_section';
8
7
  @import 'custom/custom_questions_questionnaire';
9
8
  @import 'custom/custom_receipt_language';
@@ -1,106 +1,11 @@
1
- // Setting a common height for the builder header and nav
2
- $builder-header-height: ($spacer * 2.25);
3
- $builder-header-padding: ($spacer * .25) ($spacer * .5);
4
- $builder-nav-height: ($spacer * 3.25);
5
- $builder-nav-padding: ($spacer * .75) ($spacer * .5);
6
- $builder-options-padding: $spacer;
7
- $builder-preview-padding: ($spacer * 1.5);
8
-
9
- // Put on the <body> to help with correct scrolling within builder-wrap and builder-options
10
- .builder-layout {
11
- background-color: $white;
12
- @include media-breakpoint-up(lg) {
13
- height: 100%;
14
- > form { height: 100%; } // targets form directly inside <body> and needed for correct scrolling
15
- }
16
- }
1
+ // Specific styles needed for admin onboarding pages
17
2
 
18
3
  // Header and nav styles for builder layout
19
- .builder-header, .builder-header-fixed-bottom {
20
- padding: $builder-header-padding;
21
- width: 100%;
22
- min-height: $builder-header-height;
23
- background-color: $blue-700;
24
- z-index: $zindex-fixed + 1;
25
- @include media-breakpoint-up(lg) {
26
- position: fixed;
27
- top: 0;
28
- left: 0;
29
- right: 0;
30
- }
31
- .text-muted { color: $blue-200 !important; }
32
- }
33
- .builder-header-fixed-bottom {
34
- position: fixed;
35
- @include media-breakpoint-down(md) { bottom: 0; }
36
- }
37
- .builder-nav, .builder-nav-sm {
38
- width: 100%;
39
- z-index: $zindex-fixed;
40
- }
41
- .builder-nav {
42
- padding: $builder-nav-padding;
43
- background-color: $white;
44
- border-bottom: $border-width solid $border-color;
45
- @include media-breakpoint-up(lg) {
46
- position: fixed;
47
- top: $builder-header-height;
48
- left: 0;
49
- right: 0;
50
- min-height: $builder-nav-height;
51
- }
52
- }
53
- .builder-nav-sm {
54
- position: fixed;
55
- bottom: 0;
56
- padding: $builder-header-padding;
57
- min-height: $builder-header-height;
58
- background-color: $blue-700;
59
- @include media-breakpoint-up(lg) { display: none; }
60
- }
61
-
62
- // Container that provides padding to the top of the page to move content below header and nav
63
- .builder-container {
64
- @include media-breakpoint-down(md) { padding-bottom: $builder-header-height; }
65
- @include media-breakpoint-up(lg) { height: 100%; }
66
- }
67
-
68
- // Adjusts padding on the top of builder-container depending on how many elements come before it
69
- .builder-header ~ .builder-container {
70
- @include media-breakpoint-up(lg) { padding-top: $builder-header-height; }
71
- }
72
- .builder-header ~ .builder-nav ~ .builder-container {
73
- @include media-breakpoint-up(lg) { padding-top: $builder-header-height + $builder-nav-height; }
74
- }
4
+ .builder-nav { border-bottom: $border-width solid $border-color; }
5
+ .builder-nav-sm { background-color: $blue-700; }
75
6
 
76
7
  // Block containers for side by side view
77
- .builder-body {
78
- @include media-breakpoint-up(lg) {
79
- width: 100%;
80
- height: 100%;
81
- overflow: hidden;
82
- }
83
- }
84
- .builder-preview {
85
- padding: $builder-preview-padding ($builder-preview-padding / 2);
86
- @include media-breakpoint-up(lg) {
87
- float: left;
88
- width: 67%;
89
- height: 100%;
90
- overflow-y: auto;
91
- > :last-child { margin-bottom: $builder-preview-padding; }
92
- }
93
- }
94
8
  .builder-options {
95
- padding: $builder-options-padding;
96
- background-color: $white;
97
9
  @include media-breakpoint-down(md) { border-bottom: $border-width solid $border-color; }
98
- @include media-breakpoint-up(lg) {
99
- float: right;
100
- width: 33%;
101
- height: 100%;
102
- border-left: $border-width solid $border-color;
103
- overflow-y: auto;
104
- > :last-child { margin-bottom: $builder-options-padding; }
105
- }
10
+ @include media-breakpoint-up(lg) { border-left: $border-width solid $border-color; }
106
11
  }
@@ -1,5 +1,7 @@
1
1
  // Our custom styles
2
2
  @import 'custom/avatar';
3
+ @import 'custom/builder_layout';
4
+ @import 'custom/iframe_preview';
3
5
  @import 'custom/chat';
4
6
  @import 'custom/device_preview';
5
7
  @import 'custom/drawer';
@@ -0,0 +1,102 @@
1
+ // Setting a common height for the builder header and nav
2
+ $builder-header-height: ($spacer * 2.25);
3
+ $builder-header-padding: ($spacer * .25) ($spacer * .5);
4
+ $builder-nav-height: ($spacer * 3.25);
5
+ $builder-nav-padding: ($spacer * .75) ($spacer * .5);
6
+ $builder-options-padding: $spacer;
7
+ $builder-preview-padding: ($spacer * 1.5);
8
+
9
+ // Put on the <body> to help with correct scrolling within builder-wrap and builder-options
10
+ .builder-layout {
11
+ background-color: $white;
12
+ @include media-breakpoint-up(lg) {
13
+ height: 100%;
14
+ > form { height: 100%; } // targets form directly inside <body> and needed for correct scrolling
15
+ }
16
+ }
17
+
18
+ // Header and nav styles for builder layout
19
+ .builder-header, .builder-header-fixed-bottom {
20
+ padding: $builder-header-padding;
21
+ width: 100%;
22
+ min-height: $builder-header-height;
23
+ background-color: $blue-700;
24
+ z-index: $zindex-fixed + 1;
25
+ @include media-breakpoint-up(lg) {
26
+ position: fixed;
27
+ top: 0;
28
+ left: 0;
29
+ right: 0;
30
+ }
31
+ .text-muted { color: $blue-200 !important; }
32
+ }
33
+ .builder-header-fixed-bottom {
34
+ position: fixed;
35
+ @include media-breakpoint-down(md) { bottom: 0; }
36
+ }
37
+ .builder-nav, .builder-nav-sm {
38
+ width: 100%;
39
+ z-index: $zindex-fixed;
40
+ }
41
+ .builder-nav {
42
+ padding: $builder-nav-padding;
43
+ background-color: $white;
44
+ @include media-breakpoint-up(lg) {
45
+ position: fixed;
46
+ top: $builder-header-height;
47
+ left: 0;
48
+ right: 0;
49
+ min-height: $builder-nav-height;
50
+ }
51
+ }
52
+ .builder-nav-sm {
53
+ position: fixed;
54
+ bottom: 0;
55
+ padding: $builder-header-padding;
56
+ min-height: $builder-header-height;
57
+ @include media-breakpoint-up(lg) { display: none; }
58
+ }
59
+
60
+ // Container that provides padding to the top of the page to move content below header and nav
61
+ .builder-container {
62
+ @include media-breakpoint-down(md) { padding-bottom: $builder-header-height; }
63
+ @include media-breakpoint-up(lg) { height: 100%; }
64
+ }
65
+
66
+ // Adjusts padding on the top of builder-container depending on how many elements come before it
67
+ .builder-header ~ .builder-container {
68
+ @include media-breakpoint-up(lg) { padding-top: $builder-header-height; }
69
+ }
70
+ .builder-header ~ .builder-nav ~ .builder-container {
71
+ @include media-breakpoint-up(lg) { padding-top: $builder-header-height + $builder-nav-height; }
72
+ }
73
+
74
+ // Block containers for side by side view
75
+ .builder-body {
76
+ @include media-breakpoint-up(lg) {
77
+ width: 100%;
78
+ height: 100%;
79
+ overflow: hidden;
80
+ }
81
+ }
82
+ .builder-preview {
83
+ padding: $builder-preview-padding ($builder-preview-padding / 2);
84
+ @include media-breakpoint-up(lg) {
85
+ float: left;
86
+ width: 67%;
87
+ height: 100%;
88
+ overflow-y: auto;
89
+ > :last-child { margin-bottom: $builder-preview-padding; }
90
+ }
91
+ }
92
+ .builder-options {
93
+ padding: $builder-options-padding;
94
+ background-color: $white;
95
+ @include media-breakpoint-up(lg) {
96
+ float: right;
97
+ width: 33%;
98
+ height: 100%;
99
+ overflow-y: auto;
100
+ > :last-child { margin-bottom: $builder-options-padding; }
101
+ }
102
+ }
@@ -1,5 +1,6 @@
1
1
  // Our custom styles
2
2
  @import 'custom/background_variations';
3
+ @import 'custom/builder_layout';
3
4
  @import 'custom/donor_account';
4
5
  @import 'custom/donor_scroll';
5
6
  @import 'custom/event';
@@ -0,0 +1,12 @@
1
+ // Specific styles needed for public onboarding pages
2
+
3
+ // Header and nav styles for builder layout
4
+ .builder-nav {
5
+ @include media-breakpoint-up(lg) { top: 113px; }
6
+ .btn { border-radius: 50px; }
7
+ }
8
+ .builder-nav-sm {
9
+ background-color: $white;
10
+ border-top: $border-width solid $border-color;
11
+ .btn { border-radius: 50px; }
12
+ }
@@ -1,5 +1,6 @@
1
1
  $page-header-height: ($spacer * 3.5); // 11.2rem
2
2
  $page-header-height-admin: ($spacer * 5); // 16rem
3
+ $page-header-height-public: (($spacer * 6.75) + 1); // 21.7rem (adds 1px for width of bottom border)
3
4
 
4
5
  // Page header specific styles
5
6
  .page-header {
@@ -14,17 +15,22 @@ $page-header-height-admin: ($spacer * 5); // 16rem
14
15
  right: 0;
15
16
  min-height: $page-header-height;
16
17
  }
17
- body.admin & { // this renders as body.admin .page-header specifying when the view is in admin status
18
+
19
+ // this renders as body.admin .page-header specifying when the view there is an admin logged in (includes top admin black bar)
20
+ body.admin & {
18
21
  @include media-breakpoint-up(lg) { min-height: $page-header-height-admin; }
19
22
  }
20
23
  }
21
24
 
22
25
  // Moving .page-content container down with padding when page-header exists but ONLY on larger screens
23
26
  .page-header {
24
- + .page-content {
25
- @include media-breakpoint-up(lg) { padding-top: $page-header-height; }
26
- }
27
- body.admin & + .page-content { // this renders as body.admin .page-header + .page-content specifying when the view is in admin status
28
- @include media-breakpoint-up(lg) { padding-top: $page-header-height-admin; }
27
+ @include media-breakpoint-up(lg) {
28
+ + .page-content { padding-top: $page-header-height; }
29
+
30
+ // this renders as body.admin .page-header + .page-content specifying when the view there is an admin logged in (includes top admin black bar)
31
+ body.admin & + .page-content { padding-top: $page-header-height-admin; }
32
+
33
+ // this renders as body.nfg_ui_onboarder .page-header + .page-content specifying when the view is in a public onboarding status i.e. fundraiser onboarder in Fundraising Pages
34
+ body.nfg_ui_onboarder & + .page-content { padding-top: $page-header-height-public; }
29
35
  }
30
36
  }
@@ -1,5 +1,5 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module NfgUi
4
- VERSION = '0.13.1'
4
+ VERSION = '0.13.2'
5
5
  end
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.13.1
4
+ version: 0.13.2
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: 2022-01-20 00:00:00.000000000 Z
12
+ date: 2022-03-09 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: bootstrap
@@ -433,7 +433,6 @@ files:
433
433
  - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_bee.scss
434
434
  - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_builder_layout.scss
435
435
  - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_campaign_card.scss
436
- - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_campaign_preview.scss
437
436
  - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_content_section.scss
438
437
  - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_custom_questions_questionnaire.scss
439
438
  - app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_custom_receipt_language.scss
@@ -524,10 +523,12 @@ files:
524
523
  - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_tooltip.scss
525
524
  - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_type.scss
526
525
  - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_avatar.scss
526
+ - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_builder_layout.scss
527
527
  - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_chat.scss
528
528
  - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_device_preview.scss
529
529
  - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_drawer.scss
530
530
  - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_icon.scss
531
+ - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_iframe_preview.scss
531
532
  - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_illustration.scss
532
533
  - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_mobile.scss
533
534
  - app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_nav_step.scss
@@ -568,6 +569,7 @@ files:
568
569
  - app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/_navbar.scss
569
570
  - app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/_reboot.scss
570
571
  - app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_background_variations.scss
572
+ - app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_builder_layout.scss
571
573
  - app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_donor_account.scss
572
574
  - app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_donor_scroll.scss
573
575
  - app/assets/stylesheets/nfg_ui/network_for_good/public/nfg_theme/custom/_event.scss