nfg_ui 0.9.21 → 0.9.22
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/assets/stylesheets/nfg_ui/network_for_good/admin/_variables.scss +12 -10
- 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/_device_preview.scss +54 -0
- data/lib/nfg_ui/bootstrap/components/embed.rb +1 -1
- data/lib/nfg_ui/version.rb +1 -1
- metadata +3 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 25a27ad9e036828091979c536b6a35934201fc0ee7e950c2a06c0c65a82357b7
|
|
4
|
+
data.tar.gz: c1e07b2bd81581d450c3734f00d065b4acc573b30c9492fc5ec10dd8c93bd1d3
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: e2744e53200870105de580fde6f47f23611abdb8c8a9d9a9ffbd1a25e642368a519f11b1f8b4b5c6944e70d7b4461df24983eb4c6fc06586845611975326ca1d
|
|
7
|
+
data.tar.gz: d41e231ad870d99804f5ea7abd74accdd2a43943456fe722a7273ebbe558248a0fc2722788dc02688f5191f06c004713ebda61d6633bac0e45909f13e32b236b
|
|
@@ -253,17 +253,19 @@ $box-shadow-lg: 0 0 50px 0 transparentize($black, 0.9);
|
|
|
253
253
|
// $transition-fade: opacity .15s linear !default;
|
|
254
254
|
// $transition-collapse: height .35s ease !default;
|
|
255
255
|
|
|
256
|
-
|
|
256
|
+
$embed-responsive-aspect-ratios: () !default;
|
|
257
257
|
// stylelint-disable-next-line scss/dollar-variable-default
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
258
|
+
$embed-responsive-aspect-ratios: join(
|
|
259
|
+
(
|
|
260
|
+
(21 9),
|
|
261
|
+
(16 9),
|
|
262
|
+
(9 16),
|
|
263
|
+
(4 3),
|
|
264
|
+
(3 4),
|
|
265
|
+
(1 1),
|
|
266
|
+
),
|
|
267
|
+
$embed-responsive-aspect-ratios
|
|
268
|
+
);
|
|
267
269
|
|
|
268
270
|
// Fonts
|
|
269
271
|
//
|
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
@import 'custom/content_section_buttons';
|
|
6
6
|
@import 'custom/custom_questions_questionnaire';
|
|
7
7
|
@import 'custom/custom_receipt_language';
|
|
8
|
+
@import 'custom/device_preview';
|
|
8
9
|
@import 'custom/email_preview';
|
|
9
10
|
@import 'custom/illustration';
|
|
10
11
|
@import 'custom/interaction';
|
data/app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_device_preview.scss
ADDED
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
// Styles used for showing content (or iframes) in a tablet or mobile device.
|
|
2
|
+
// Note: these are best used with bs4's embed-reponsive ratio classes.
|
|
3
|
+
|
|
4
|
+
.device-preview { // set device width (explicit or percentage) on this container
|
|
5
|
+
position: relative;
|
|
6
|
+
margin: auto;
|
|
7
|
+
|
|
8
|
+
// Device Details
|
|
9
|
+
&.device-preview-tablet, &.device-preview-mobile {
|
|
10
|
+
border: 16px solid $white;
|
|
11
|
+
border-top-width: 60px;
|
|
12
|
+
border-bottom-width: 60px;
|
|
13
|
+
border-radius: 24px;
|
|
14
|
+
box-shadow: $box-shadow-sm;
|
|
15
|
+
&::before, &::after {
|
|
16
|
+
position: absolute;
|
|
17
|
+
left: 50%;
|
|
18
|
+
display: block;
|
|
19
|
+
content: '';
|
|
20
|
+
transform: translate(-50%, -50%);
|
|
21
|
+
border: 1px solid $border-color;
|
|
22
|
+
}
|
|
23
|
+
&::before {
|
|
24
|
+
top: -30px;
|
|
25
|
+
width: 60px;
|
|
26
|
+
height: 6px;
|
|
27
|
+
border-radius: 3px;
|
|
28
|
+
}
|
|
29
|
+
&::after {
|
|
30
|
+
bottom: -65px;
|
|
31
|
+
width: 36px;
|
|
32
|
+
height: 36px;
|
|
33
|
+
border-radius: 50%;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
// Wrapping scrollable screen (used with embed-responsive ratio classes to get proper height -- set width on .device-preview container)
|
|
38
|
+
.device-screen {
|
|
39
|
+
width: 100%;
|
|
40
|
+
background-color: $border-color;
|
|
41
|
+
overflow-x: hidden;
|
|
42
|
+
overflow-y: scroll;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
// For content that isn't an iframe
|
|
46
|
+
.device-content {
|
|
47
|
+
position: absolute;
|
|
48
|
+
top: 0;
|
|
49
|
+
bottom: 0;
|
|
50
|
+
left: 0;
|
|
51
|
+
width: 100%;
|
|
52
|
+
height: 100%;
|
|
53
|
+
}
|
|
54
|
+
}
|
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.9.
|
|
4
|
+
version: 0.9.22
|
|
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: 2019-10-
|
|
12
|
+
date: 2019-10-25 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/nfg_theme/custom/_content_section_buttons.scss
|
|
408
408
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_custom_questions_questionnaire.scss
|
|
409
409
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_custom_receipt_language.scss
|
|
410
|
+
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_device_preview.scss
|
|
410
411
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_email_preview.scss
|
|
411
412
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_illustration.scss
|
|
412
413
|
- app/assets/stylesheets/nfg_ui/network_for_good/admin/nfg_theme/custom/_interaction.scss
|