modalist 1.0.0 → 1.0.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/CHANGELOG.md +6 -1
- data/README.md +6 -101
- data/app/helpers/modalist/modal_helper.rb +3 -3
- data/lib/modalist/version.rb +1 -1
- data/vendor/javascripts/modalist.js +26 -0
- data/vendor/javascripts/modalist.min.js +27 -0
- data/vendor/stylesheets/modailst.min.css +27 -0
- metadata +3 -2
- data/vendor/stylesheets/modalist.sass +0 -86
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 7b782323baccf5b9c81bd18326c8e18b4060ce55af8c7a11091f68343b9f1f43
|
4
|
+
data.tar.gz: ac6a9e9915dbb8542ecea9af8cc2f92f1d64814c764707656091d7105c831339
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 78fd5ce85e533ff2f812c803c5886bdaacabd68ff265a1d8fcaaa09cce75421d669091d0654965032f25a752904ff090b4d70942b92c9c27c5054eaddf03d067
|
7
|
+
data.tar.gz: 809b847ce174a8fd66f46d69e8caef10dd51776ff86e9f9de5f41a6ac3c411d076ebb8fe6acf4f9d666894edc80004947d968ae0c9c930abe1e971d7b6c27c85
|
data/CHANGELOG.md
CHANGED
data/README.md
CHANGED
@@ -8,7 +8,7 @@ Modalist is a powerful ajaxified modal solution for Rails. Here is how it works:
|
|
8
8
|
2) Modalist fetches the modal contents from your specific modal-controller-action with AJAX
|
9
9
|
3) The modal opens
|
10
10
|
|
11
|
-
Modalist does not reinvent the wheel and uses
|
11
|
+
Modalist does not reinvent the wheel and uses todays best modal-engine [iziModal.js](https://github.com/dolce/iziModal) to backup its code.
|
12
12
|
|
13
13
|
---
|
14
14
|
|
@@ -18,11 +18,8 @@ Modalist does not reinvent the wheel and uses the best modal-engine [iziModal.js
|
|
18
18
|
* [Usage](#usage)
|
19
19
|
* [Controllers](#controllers)
|
20
20
|
* [Views](#views)
|
21
|
-
* [Trigger a modal](#trigger-a-modal)
|
22
|
-
* [Modalist functions](#modalist-functions)
|
23
|
-
* [Options](#options)
|
24
21
|
* [Styles](#styles)
|
25
|
-
* [
|
22
|
+
* [Modalist.js](#modalistjs)
|
26
23
|
* [To Do](#to-do)
|
27
24
|
* [Contributing](#contributing)
|
28
25
|
* [Contributors](#contributors)
|
@@ -65,7 +62,7 @@ First let's add the necessary assets to your pipeline:
|
|
65
62
|
```css
|
66
63
|
/*
|
67
64
|
*= require iziModal
|
68
|
-
*= require modalist
|
65
|
+
*= require modalist.min
|
69
66
|
*/
|
70
67
|
```
|
71
68
|
|
@@ -79,7 +76,7 @@ Specify where modals should be located in your view:
|
|
79
76
|
%head
|
80
77
|
-# ...
|
81
78
|
%body
|
82
|
-
=
|
79
|
+
= render_modalist
|
83
80
|
= yield
|
84
81
|
```
|
85
82
|
|
@@ -142,86 +139,6 @@ In your Modalist views are a couple of helper methods available:
|
|
142
139
|
Content ...
|
143
140
|
```
|
144
141
|
|
145
|
-
### Trigger a modal
|
146
|
-
|
147
|
-
There are numerous ways to trigger/open a modal with Modalist.
|
148
|
-
|
149
|
-
One options is to open the modal by calling a JavaScript function - more on that [here](#functions).
|
150
|
-
|
151
|
-
#### Links
|
152
|
-
|
153
|
-
The most common scenario is using a link to trigger the opening of a modal:
|
154
|
-
|
155
|
-
```haml
|
156
|
-
= link_to 'Open modal', settings_modalist_url, class: 'modalist--trigger'
|
157
|
-
```
|
158
|
-
|
159
|
-
You can use [data attributes](#options) to pass options customizing the modal.
|
160
|
-
|
161
|
-
#### Forms
|
162
|
-
|
163
|
-
When you want to open a modal after submitting a form - this is as simple as it gets:
|
164
|
-
|
165
|
-
```haml
|
166
|
-
= simple_form_for @setting, settings_modalist_url(id: @setting.id), method: :get do |f|
|
167
|
-
-# ...
|
168
|
-
= f.input :submit, input_html: { class: 'modalist--trigger', data: { modalist_form: true } }
|
169
|
-
```
|
170
|
-
|
171
|
-
You can use [data attributes](#options) to pass options customizing the modal.
|
172
|
-
|
173
|
-
#### Elements
|
174
|
-
|
175
|
-
You can also trigger a modal from any other HTML element in your view:
|
176
|
-
|
177
|
-
```haml
|
178
|
-
.modalist--trigger{ data: { modalist_url: settings_modalist_url } }
|
179
|
-
```
|
180
|
-
|
181
|
-
You can use [data attributes](#options) to pass options customizing the modal.
|
182
|
-
|
183
|
-
### Modalist functions
|
184
|
-
|
185
|
-
Modalist's JavaScript component provides a set of functions to handle your modals:
|
186
|
-
|
187
|
-
#### Open modals
|
188
|
-
|
189
|
-
```js
|
190
|
-
Modalist.open({ url: 'http://localhost:3000/settings/modal' });
|
191
|
-
```
|
192
|
-
|
193
|
-
You can pass [options](#options) to customize the modal:
|
194
|
-
|
195
|
-
```js
|
196
|
-
Modalist.open({
|
197
|
-
url: 'http://localhost:3000/settings/modal',
|
198
|
-
form: false,
|
199
|
-
fullScreen: false
|
200
|
-
});
|
201
|
-
```
|
202
|
-
|
203
|
-
#### Close modals
|
204
|
-
|
205
|
-
```js
|
206
|
-
Modalist.close();
|
207
|
-
```
|
208
|
-
|
209
|
-
### Options
|
210
|
-
|
211
|
-
There are two sets of options you can pass to Modalist. Those who get passed on initialization and those who get passed on any subsequent calls of a function.
|
212
|
-
|
213
|
-
#### Initialization
|
214
|
-
|
215
|
-
**`ìziModal`:** Options hash utilized to initialize [iziModal](https://github.com/dolce/iziModal).
|
216
|
-
|
217
|
-
#### Subsequent calls
|
218
|
-
|
219
|
-
**`url`:** URL to fetch content of the modal from. Takes a string.
|
220
|
-
|
221
|
-
**`form`:** Submit a form and use the response to populate the modal. Takes a string to specify a jQuery selector for the form or `false`.
|
222
|
-
|
223
|
-
**`fullScreen`:** Show a full screen modal instead of the default windowed modal. Takes a 'true', `'mobile'` (uses a full screen modal on devices smaller than `800px`) or `false`.
|
224
|
-
|
225
142
|
### Styles
|
226
143
|
|
227
144
|
To customize the styles of your modals, require the vendored default styles and then override them with your custom CSS.
|
@@ -239,21 +156,9 @@ It is often useful to be able to provide view-specific styles. Modalist therefor
|
|
239
156
|
}
|
240
157
|
```
|
241
158
|
|
242
|
-
###
|
243
|
-
|
244
|
-
Modalist emits events that allow you to track the navigation lifecycle and respond to content loading. Modalist fires events on the `$(document)` object.
|
245
|
-
|
246
|
-
* `modalist:click` fires when you click a Modal enabled link to trigger a modal opening. The clicked element is the event target. Access the requested location with `event.data.url`.
|
247
|
-
|
248
|
-
* `modalist:request-start` fires before Modal issues a network request to fetch the modal content.
|
249
|
-
|
250
|
-
* `modalist:request-end` fires after the network request completes.
|
251
|
-
|
252
|
-
* `modalist:before-render` fires before rendering the content.
|
253
|
-
|
254
|
-
* `modalist:render` fires after Modal renders the content in the modal.
|
159
|
+
### Modalist.js
|
255
160
|
|
256
|
-
|
161
|
+
Continue reading [here](https://github.com/jonhue/modalist.js) to learn how to use modalist.js to open modals and fetch their content vie AJAX.
|
257
162
|
|
258
163
|
---
|
259
164
|
|
@@ -1,12 +1,12 @@
|
|
1
1
|
module Modalist
|
2
2
|
module ModalHelper
|
3
3
|
|
4
|
-
def
|
5
|
-
render 'modalist/modal'
|
4
|
+
def render_modalist
|
5
|
+
render partial: 'modalist/modal'
|
6
6
|
end
|
7
7
|
|
8
8
|
def modalist_close
|
9
|
-
render 'modalist/close'
|
9
|
+
render partial: 'modalist/close'
|
10
10
|
end
|
11
11
|
|
12
12
|
def modalist_title title
|
data/lib/modalist/version.rb
CHANGED
@@ -1,3 +1,29 @@
|
|
1
|
+
/**!
|
2
|
+
* @fileOverview modalist.js - A powerful AJAX modal plugin extending iziModal
|
3
|
+
* @version 1.0.0
|
4
|
+
* @license
|
5
|
+
* MIT License
|
6
|
+
*
|
7
|
+
* Copyright (c) 2017 Jonas Hübotter
|
8
|
+
*
|
9
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
10
|
+
* of this software and associated documentation files (the "Software"), to deal
|
11
|
+
* in the Software without restriction, including without limitation the rights
|
12
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
13
|
+
* copies of the Software, and to permit persons to whom the Software is
|
14
|
+
* furnished to do so, subject to the following conditions:
|
15
|
+
*
|
16
|
+
* The above copyright notice and this permission notice shall be included in all
|
17
|
+
* copies or substantial portions of the Software.
|
18
|
+
*
|
19
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
20
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
21
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
22
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
23
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
24
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
25
|
+
* SOFTWARE.
|
26
|
+
*/
|
1
27
|
(function($) {
|
2
28
|
var Modalist = new function(options) {
|
3
29
|
|
@@ -0,0 +1,27 @@
|
|
1
|
+
/**!
|
2
|
+
* @fileOverview modalist.js - A powerful AJAX modal plugin extending iziModal
|
3
|
+
* @version 1.0.0
|
4
|
+
* @license
|
5
|
+
* MIT License
|
6
|
+
*
|
7
|
+
* Copyright (c) 2017 Jonas Hübotter
|
8
|
+
*
|
9
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
10
|
+
* of this software and associated documentation files (the "Software"), to deal
|
11
|
+
* in the Software without restriction, including without limitation the rights
|
12
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
13
|
+
* copies of the Software, and to permit persons to whom the Software is
|
14
|
+
* furnished to do so, subject to the following conditions:
|
15
|
+
*
|
16
|
+
* The above copyright notice and this permission notice shall be included in all
|
17
|
+
* copies or substantial portions of the Software.
|
18
|
+
*
|
19
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
20
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
21
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
22
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
23
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
24
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
25
|
+
* SOFTWARE.
|
26
|
+
*/
|
27
|
+
(function(b){var a=new function(c){var d={iziModal:{}};c=b.extend(d,c);this.modal=b("#modalist");this.iziModal=b(a.modal).iziModal(c.iziModal);b(".modalist--trigger").unbind("click");b(".modalist--trigger").click(function(h){h.preventDefault();var h=jQuery.Event("modalist:click"),e=b(this).data("modalist-url")||b(this).attr("href"),g=b(this).data("modalist-form")||false,f=b(this).data("modalist-full-screen");h.target=b(this);h.data={url:e};b(document).trigger(h);a.reset();a.fullScreen(f);a.load(e,g)});this.open=function(e){var f={url:null,form:false,fullScreen:false};e=b.extend(f,e);a.reset();a.fullScreen(e.fullScreen);a.load(e.url,e.form)};this.close=function(){b(a.modal).iziModal("close")};this.reset=function(){b(a.modal).iziModal("setTransitionIn","comingIn");b(a.modal).iziModal("setTransitionOut","comingOut");b(a.modal).data("full-screen",false);b(a.modal).iziModal("setTop","auto");b(a.modal).iziModal("setBottom","auto")};this.fullScreen=function(e){if(e=="true"||(e=="mobile"&&b(window).width()<=800)){b(a.modal).iziModal("setTransitionIn","fadeInRight");b(a.modal).iziModal("setTransitionOut","fadeOutRight");b(a.modal).data("full-screen",true)}};this.load=function(f,e){var g={form:false};e=b.extend(g,e);b(document).trigger("modalist:request-start");if(e.form){b.ajax({url:b(e.form).attr("action"),type:"GET",data:b(e.form).serialize(),success:function(h){b(document).trigger("modalist:request-end");a.data(h)}})}else{b.get(f,function(h){b(document).trigger("modalist:request-end");a.data(h)})}};this.data=function(e){b(document).trigger("modalist:before-render");b(a.modal).find(".iziModal-content").html(e);b(document).trigger("modal:render");b(a.modal).iziModal("open");if(b(a.modal).height()+60>b(window).height()){b(a.modal).iziModal("setTop",30);b(a.modal).iziModal("setBottom",30)}b(document).trigger("modalist:load")}}})(jQuery);
|
@@ -0,0 +1,27 @@
|
|
1
|
+
/**!
|
2
|
+
* @fileOverview modalist.js - A powerful AJAX modal plugin extending iziModal
|
3
|
+
* @version 1.0.0
|
4
|
+
* @license
|
5
|
+
* MIT License
|
6
|
+
*
|
7
|
+
* Copyright (c) 2017 Jonas Hübotter
|
8
|
+
*
|
9
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
10
|
+
* of this software and associated documentation files (the "Software"), to deal
|
11
|
+
* in the Software without restriction, including without limitation the rights
|
12
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
13
|
+
* copies of the Software, and to permit persons to whom the Software is
|
14
|
+
* furnished to do so, subject to the following conditions:
|
15
|
+
*
|
16
|
+
* The above copyright notice and this permission notice shall be included in all
|
17
|
+
* copies or substantial portions of the Software.
|
18
|
+
*
|
19
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
20
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
21
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
22
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
23
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
24
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
25
|
+
* SOFTWARE.
|
26
|
+
*/
|
27
|
+
#modalist.iziModal{box-shadow:0 0.0625em 0.3125em 0 rgba(101,119,134,0.05);border:.0625rem solid #DCE2E7;border-radius:.3125rem !important;max-width:90% !important;width:37.5rem;transition:margin-top .25s ease-out !important}#modalist.iziModal::after{content:none}#modalist.iziModal[data-full-screen="true"]{max-width:100% !important;width:100%;border-radius:0 !important;border:none;height:100vh !important}#modalist.iziModal[data-full-screen="true"].fadeInRight{animation:modalist-fadeInRight .35s ease-out !important}#modalist.iziModal[data-full-screen="true"].fadeOutRight{animation:modalist-fadeOutRight .35s ease-out !important}#modalist.iziModal ::-webkit-scrollbar{width:.3125rem}#modalist.iziModal ::-webkit-scrollbar-track{background:transparent}#modalist.iziModal ::-webkit-scrollbar-thumb{border-radius:.15625rem;background:#DCE2E7}#modalist.iziModal ::-webkit-scrollbar-thumb:hover{background:#bec7cf}#modalist.iziModal>.iziModal-wrap{border-radius:.3125rem;border-bottom:.0625rem solid #DCE2E7}#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--header{background:#FCFCFC;border-radius:.3125rem .3125rem 0 0;display:flex;align-items:center;justify-content:space-between;padding:1.25rem;border-bottom:.0625rem solid #DCE2E7}#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--header h4,#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--header p{margin:0}#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--header h4{line-height:1.58;font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";font-weight:600;font-size:1.125rem;color:#14171A}@media (min-width: 800px){#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--header h4{font-size:1.25rem}}#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--header p{font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";color:#3d4553;font-weight:normal;letter-spacing:-.003em;font-size:.875rem;line-height:1.75}@media (min-width: 800px){#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--header p{font-size:1rem}}#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--header .modalist--close{display:flex;align-items:center;justify-content:center;opacity:.85}#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--header .modalist--close:hover,#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--header .modalist--close:focus{opacity:1}#modalist.iziModal>.iziModal-wrap>.iziModal-content>.modalist--content{background:white;border-radius:.3125rem;padding:1.25rem}.iziModal-overlay{background:rgba(231,236,240,0.87) !important}#modalist.iziModal,.iziModal-overlay{animation-duration:.5s !important}@keyframes modalist-fadeInRight{from{transform:translateX(100%)}to{transform:none}}@keyframes modalist-fadeOutRight{from{transform:none}to{transform:translateX(100%)}}
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: modalist
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.0.
|
4
|
+
version: 1.0.1
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Jonas Hübotter
|
@@ -89,9 +89,10 @@ files:
|
|
89
89
|
- vendor/javascripts/iziModal.js
|
90
90
|
- vendor/javascripts/iziModal.min.js
|
91
91
|
- vendor/javascripts/modalist.js
|
92
|
+
- vendor/javascripts/modalist.min.js
|
92
93
|
- vendor/stylesheets/iziModal.css
|
93
94
|
- vendor/stylesheets/iziModal.min.css
|
94
|
-
- vendor/stylesheets/
|
95
|
+
- vendor/stylesheets/modailst.min.css
|
95
96
|
homepage: https://github.com/jonhue/modalist
|
96
97
|
licenses:
|
97
98
|
- MIT
|
@@ -1,86 +0,0 @@
|
|
1
|
-
#modalist.iziModal
|
2
|
-
box-shadow: 0 .0625em .3125em 0 rgba(color(text, base, true), .05)
|
3
|
-
border: .0625rem solid #DCE2E7
|
4
|
-
border-radius: .3125rem !important
|
5
|
-
max-width: 90% !important
|
6
|
-
width: 37.5rem
|
7
|
-
// temporarily fixing height resizing
|
8
|
-
transition: margin-top .25s ease-out !important
|
9
|
-
&::after
|
10
|
-
content: none
|
11
|
-
&[data-full-screen="true"]
|
12
|
-
max-width: 100% !important
|
13
|
-
width: 100%
|
14
|
-
border-radius: 0 !important
|
15
|
-
border: none
|
16
|
-
height: 100vh !important
|
17
|
-
&.fadeInRight
|
18
|
-
animation: modalist-fadeInRight .35s ease-out !important
|
19
|
-
&.fadeOutRight
|
20
|
-
animation: modalist-fadeOutRight .35s ease-out !important
|
21
|
-
::-webkit-scrollbar
|
22
|
-
width: .3125rem
|
23
|
-
::-webkit-scrollbar-track
|
24
|
-
background: transparent
|
25
|
-
::-webkit-scrollbar-thumb
|
26
|
-
border-radius: .15625rem
|
27
|
-
background: #DCE2E7
|
28
|
-
::-webkit-scrollbar-thumb:hover
|
29
|
-
background: #bec7cf
|
30
|
-
& > .iziModal-wrap
|
31
|
-
border-radius: .3125rem
|
32
|
-
border-bottom: .0625rem solid #DCE2E7
|
33
|
-
& > .iziModal-content
|
34
|
-
& > .modalist--header
|
35
|
-
background: #FCFCFC
|
36
|
-
border-radius: .3125rem .3125rem 0 0
|
37
|
-
display: flex
|
38
|
-
align-items: center
|
39
|
-
justify-content: space-between
|
40
|
-
padding: 1.25rem
|
41
|
-
border-bottom: .0625rem solid #DCE2E7
|
42
|
-
h4, p
|
43
|
-
margin: 0
|
44
|
-
h4
|
45
|
-
line-height: 1.58
|
46
|
-
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"
|
47
|
-
font-weight: 600
|
48
|
-
font-size: 1.125rem
|
49
|
-
color: #14171A
|
50
|
-
@media (min-width: 800px)
|
51
|
-
font-size: 1.25rem
|
52
|
-
p
|
53
|
-
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"
|
54
|
-
color: #3d4553
|
55
|
-
font-weight: normal
|
56
|
-
letter-spacing: -.003em
|
57
|
-
font-size: .875rem
|
58
|
-
line-height: 1.75
|
59
|
-
@media (min-width: 800px)
|
60
|
-
font-size: 1rem
|
61
|
-
.modalist--close
|
62
|
-
display: flex
|
63
|
-
align-items: center
|
64
|
-
justify-content: center
|
65
|
-
opacity: .85
|
66
|
-
&:hover, &:focus
|
67
|
-
opacity: 1
|
68
|
-
& > .modalist--content
|
69
|
-
background: white
|
70
|
-
border-radius: .3125rem
|
71
|
-
padding: 1.25rem
|
72
|
-
.iziModal-overlay
|
73
|
-
background: transparentize(#E7ECF0, 0.13) !important
|
74
|
-
#modalist.iziModal, .iziModal-overlay
|
75
|
-
animation-duration: .5s !important
|
76
|
-
|
77
|
-
@keyframes modalist-fadeInRight
|
78
|
-
from
|
79
|
-
transform: translateX(100%)
|
80
|
-
to
|
81
|
-
transform: none
|
82
|
-
@keyframes modalist-fadeOutRight
|
83
|
-
from
|
84
|
-
transform: none
|
85
|
-
to
|
86
|
-
transform: translateX(100%)
|