nfg_ui 0.11.0 → 0.11.4
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/README.md +40 -0
- data/Rakefile +28 -2
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_badge.scss +4 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/color_variations/nfg_theme/_buttons.scss +4 -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/_modal.scss +16 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_builder_layout.scss +1 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_campaign_card.scss +1 -1
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_gallery.scss +46 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_alert.scss +4 -4
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_badge.scss +3 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_buttons.scss +3 -0
- data/app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_sizing.scss +11 -0
- data/lib/nfg_ui/bootstrap/components/modal.rb +5 -1
- data/lib/nfg_ui/components/elements/avatar.rb +1 -1
- data/lib/nfg_ui/components/patterns/modal.rb +7 -0
- data/lib/nfg_ui/components/traits.rb +1 -0
- data/lib/nfg_ui/components/traits/modal.rb +15 -0
- data/lib/nfg_ui/version.rb +1 -1
- metadata +6 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: b74d360cda26e2c2761e08f2e7518801f4ff7b6748c47c8329c8201eda8ebc71
|
|
4
|
+
data.tar.gz: 114168053528379c43dfadcb54c4c3fdf73355c76013fcda368aa0b13748758e
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 31bc70d2cc5e96ac4c8414d1d1c38cb8ff760e23b4e021c6ff4b2583b783e9f505cf39540e93a311b786629c03075286eca26af1d5846fc02ca502b60285cba7
|
|
7
|
+
data.tar.gz: 87c5a53d2f865c51d0af6c090d9b25166aee6c72d3215cafeb672b3d6aa605e509530dd7844c2dad1a59e12c77c13fd3271d1ef03f4ddba940fc0486c4748e41
|
data/README.md
CHANGED
|
@@ -88,6 +88,46 @@ Examples:
|
|
|
88
88
|
= ui.nfg :icon, 'trash', class: 'mr-1', text: 'Delete Row'
|
|
89
89
|
```
|
|
90
90
|
|
|
91
|
+
## Asset publishing
|
|
92
|
+
|
|
93
|
+
### Depedency Installation
|
|
94
|
+
|
|
95
|
+
NFG UI assets are published for cross-site usage to a publicly-accessible AWS S3 bucket (`s3://nfg-ui/v#.##.#/`) using the AWS command-line interface:
|
|
96
|
+
|
|
97
|
+
1. [Install the AWS command-line interface](https://docs.aws.amazon.com/cli/latest/userguide/install-cliv2-mac.html#cliv2-mac-install-gui)
|
|
98
|
+
2. Install AWS credentials provided by anyone on the team who has permissions to mint IAM users (such as Mike or Timothy). The credentials are sensitive and should be stored at `~/.aws/credentials`. See example below.
|
|
99
|
+
3. (Optional but recommended) Install `~/.aws/config` per below to set a default region for S3 operations.
|
|
100
|
+
|
|
101
|
+
```
|
|
102
|
+
# Example ~/.aws/credentials file
|
|
103
|
+
|
|
104
|
+
[default]
|
|
105
|
+
aws_access_key_id = ####################
|
|
106
|
+
aws_secret_access_key = ########################################
|
|
107
|
+
|
|
108
|
+
# Example ~/.aws/config
|
|
109
|
+
[default]
|
|
110
|
+
region = us-east-1
|
|
111
|
+
```
|
|
112
|
+
|
|
113
|
+
4. Use the following command to confirm successful installation:
|
|
114
|
+
|
|
115
|
+
```
|
|
116
|
+
aws s3 ls --recursive s3://nfg-ui/
|
|
117
|
+
```
|
|
118
|
+
|
|
119
|
+
### Workflow
|
|
120
|
+
|
|
121
|
+
After `rake release` successfully completes, the `rake publish` task will run. This command wraps a separate `rake publish` task contained within the `/publisher` subdirectory.
|
|
122
|
+
`/publisher` contains a skeleton Rails app. The `rake publish` task contained within `/publisher` precompiles the assets that are part of the new `nfg_ui` release and uploads them to S3.
|
|
123
|
+
|
|
124
|
+
If necessary, `rake publish` can be invoked from within the `nfg_ui` parent directory, separately:
|
|
125
|
+
|
|
126
|
+
```
|
|
127
|
+
rake publish # upload assets to S3; fails if files are already exist for the release
|
|
128
|
+
rake publish[override] # uploads assets to S3 without checking for existing files
|
|
129
|
+
```
|
|
130
|
+
|
|
91
131
|
#### Trait details
|
|
92
132
|
Traits are designed to allow you to speedily build components, or pre-design complex components using meaningful symbols.
|
|
93
133
|
|
data/Rakefile
CHANGED
|
@@ -15,9 +15,35 @@ RDoc::Task.new(:rdoc) do |rdoc|
|
|
|
15
15
|
end
|
|
16
16
|
|
|
17
17
|
APP_RAKEFILE = File.expand_path("spec/test_app/Rakefile", __dir__)
|
|
18
|
-
load 'rails/tasks/engine.rake'
|
|
19
|
-
|
|
20
18
|
|
|
19
|
+
load 'rails/tasks/engine.rake'
|
|
21
20
|
load 'rails/tasks/statistics.rake'
|
|
22
21
|
|
|
23
22
|
require 'bundler/gem_tasks'
|
|
23
|
+
|
|
24
|
+
desc <<~DESC
|
|
25
|
+
Publish precompiled assets to s3://nfg-ui. This task is automatically invoked after successful "rake release" and normally it should not be called directly.
|
|
26
|
+
Requires installation of AWS CLI: https://docs.aws.amazon.com/cli/latest/userguide/cli-chap-install.html
|
|
27
|
+
Please see additional instructions in README.md.
|
|
28
|
+
DESC
|
|
29
|
+
task :publish, %i[override_flag] do |_, override_flag: nil|
|
|
30
|
+
require 'fileutils'
|
|
31
|
+
|
|
32
|
+
version = Bundler.load_gemspec("#{__dir__}/nfg_ui.gemspec").version
|
|
33
|
+
puts "Compiling and publishing NFG UI v#{version} assets"
|
|
34
|
+
|
|
35
|
+
subtask_args = version.to_s
|
|
36
|
+
subtask_args << ",#{override_flag}" if override_flag
|
|
37
|
+
|
|
38
|
+
Dir.chdir("#{__dir__}/publisher") do
|
|
39
|
+
Bundler.with_unbundled_env do
|
|
40
|
+
sh "RAILS_ENV=production bundle exec rake publish[#{subtask_args}]" do |ok, _|
|
|
41
|
+
puts 'unable to publish assets' unless ok
|
|
42
|
+
end
|
|
43
|
+
end
|
|
44
|
+
end
|
|
45
|
+
end
|
|
46
|
+
|
|
47
|
+
Rake::Task['release'].enhance do
|
|
48
|
+
Rake::Task['publish'].invoke # runs :publish task after successful release
|
|
49
|
+
end
|
|
@@ -4,3 +4,19 @@
|
|
|
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
|
+
}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
// Gallery styles
|
|
2
|
+
.card-gallery {
|
|
3
|
+
|
|
4
|
+
// Gallery image styles
|
|
5
|
+
.card-gallery-img {
|
|
6
|
+
height: ($spacer * 14); // sets height of gallery image preview
|
|
7
|
+
overflow: hidden;
|
|
8
|
+
z-index: 0;
|
|
9
|
+
.card-img {
|
|
10
|
+
min-height: 100%;
|
|
11
|
+
z-index: 0;
|
|
12
|
+
}
|
|
13
|
+
.card-img-overlay { z-index: 1; }
|
|
14
|
+
.card-gallery-img-overlay {
|
|
15
|
+
display: block;
|
|
16
|
+
position: absolute;
|
|
17
|
+
top: 0;
|
|
18
|
+
right: 0;
|
|
19
|
+
bottom: 0;
|
|
20
|
+
left: 0;
|
|
21
|
+
text-align: center;
|
|
22
|
+
background-color: $modal-backdrop-bg;
|
|
23
|
+
transition: $transition-fade;
|
|
24
|
+
opacity: 0;
|
|
25
|
+
z-index: 10;
|
|
26
|
+
@include hover { opacity: 1; }
|
|
27
|
+
> .card-gallery-img-overlay-text {
|
|
28
|
+
position: absolute;
|
|
29
|
+
top: 50%;
|
|
30
|
+
left: 50%;
|
|
31
|
+
width: 100%;
|
|
32
|
+
transform: translate(-50%, -50%);
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
// Gallery card body styles
|
|
38
|
+
.card-body { z-index: 10; }
|
|
39
|
+
.badge-highlight {
|
|
40
|
+
position: absolute;
|
|
41
|
+
top: -($card-spacer-y * .5);
|
|
42
|
+
left: $card-spacer-y;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
|
|
@@ -6,11 +6,11 @@
|
|
|
6
6
|
&:hover, &:active { text-decoration: none; }
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
|
-
.alert-success a:not(.btn) { color: $success; }
|
|
10
|
-
.alert-info a:not(.btn) { color: $info; }
|
|
11
|
-
.alert-warning a:not(.btn) { color: $warning; }
|
|
9
|
+
.alert-success a:not(.btn) { color: $success !important; }
|
|
10
|
+
.alert-info a:not(.btn) { color: $info !important; }
|
|
11
|
+
.alert-warning a:not(.btn) { color: $warning !important; }
|
|
12
12
|
.alert-danger, .alert-error {
|
|
13
|
-
a:not(.btn) { color: $danger; }
|
|
13
|
+
a:not(.btn) { color: $danger !important; }
|
|
14
14
|
}
|
|
15
15
|
.alert-gray, .alert-notice,
|
|
16
16
|
.alert-light, .alert-dark {
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
// Width and height based on viewport
|
|
2
|
+
@each $breakpoint in map-keys($grid-breakpoints) {
|
|
3
|
+
@include media-breakpoint-up($breakpoint) {
|
|
4
|
+
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
|
|
5
|
+
@each $prop, $abbrev in (width: w, height: h) {
|
|
6
|
+
@each $size, $length in $sizes {
|
|
7
|
+
.#{$abbrev}#{$infix}-#{$size} { #{$prop}: $length !important; }
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
}
|
|
@@ -28,7 +28,11 @@ module NfgUi
|
|
|
28
28
|
content_tag(:div, class: modal_dialog_css_classes, role: 'document') do
|
|
29
29
|
content_tag(:div, class: 'modal-content') do
|
|
30
30
|
capture do
|
|
31
|
-
|
|
31
|
+
# Optionally, leave title nil
|
|
32
|
+
# and the title / dismiss functionality is left out.
|
|
33
|
+
if title.present?
|
|
34
|
+
concat(NfgUi::Bootstrap::Components::ModalHeader.new({ title: title }, view_context).render)
|
|
35
|
+
end
|
|
32
36
|
if render_in_body
|
|
33
37
|
concat(NfgUi::Bootstrap::Components::ModalBody.new({ body: (block_given? ? yield : body) }, view_context).render)
|
|
34
38
|
else
|
|
@@ -21,7 +21,7 @@ module NfgUi
|
|
|
21
21
|
def render
|
|
22
22
|
content_tag(as, html_options) do
|
|
23
23
|
if image.present?
|
|
24
|
-
image_tag image, alt: alt.presence
|
|
24
|
+
image_tag view_context.image_path(image), alt: alt.presence
|
|
25
25
|
elsif body.present?
|
|
26
26
|
content_tag(:span, (block_given? ? yield : body), class: body_css_class)
|
|
27
27
|
end
|
|
@@ -10,7 +10,14 @@ module NfgUi
|
|
|
10
10
|
include NfgUi::Components::Utilities::Renderable
|
|
11
11
|
include NfgUi::Components::Utilities::Titleable
|
|
12
12
|
|
|
13
|
+
include NfgUi::Components::Traits::Modal
|
|
13
14
|
include NfgUi::Components::Traits::Size
|
|
15
|
+
|
|
16
|
+
private
|
|
17
|
+
|
|
18
|
+
def resized?
|
|
19
|
+
[:sm, :lg, :xl, :cover].include?(size)
|
|
20
|
+
end
|
|
14
21
|
end
|
|
15
22
|
end
|
|
16
23
|
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.4
|
|
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-
|
|
12
|
+
date: 2020-10-26 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: bootstrap
|
|
@@ -427,6 +427,7 @@ files:
|
|
|
427
427
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_custom_receipt_language.scss
|
|
428
428
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_email_preview.scss
|
|
429
429
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_free_trial.scss
|
|
430
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_gallery.scss
|
|
430
431
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_icomoon.scss
|
|
431
432
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_interaction.scss
|
|
432
433
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_overlay_blocker.scss
|
|
@@ -485,6 +486,7 @@ files:
|
|
|
485
486
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/nfg_theme/utilities/_flex.scss
|
|
486
487
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/legacy_browser_support/plugins/_sticky_div.scss
|
|
487
488
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_alert.scss
|
|
489
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_badge.scss
|
|
488
490
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_button-group.scss
|
|
489
491
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_buttons.scss
|
|
490
492
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_card.scss
|
|
@@ -495,6 +497,7 @@ files:
|
|
|
495
497
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_nav.scss
|
|
496
498
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_progress.scss
|
|
497
499
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_reboot.scss
|
|
500
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_sizing.scss
|
|
498
501
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_tooltip.scss
|
|
499
502
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/_type.scss
|
|
500
503
|
- app/assets/stylesheets/nfg_ui/network_for_good/core/nfg_theme/custom/_avatar.scss
|
|
@@ -739,6 +742,7 @@ files:
|
|
|
739
742
|
- lib/nfg_ui/components/traits/dropdown_toggle.rb
|
|
740
743
|
- lib/nfg_ui/components/traits/icon.rb
|
|
741
744
|
- lib/nfg_ui/components/traits/list_group.rb
|
|
745
|
+
- lib/nfg_ui/components/traits/modal.rb
|
|
742
746
|
- lib/nfg_ui/components/traits/muted.rb
|
|
743
747
|
- lib/nfg_ui/components/traits/nav.rb
|
|
744
748
|
- lib/nfg_ui/components/traits/nav_item.rb
|