1 | .noty_theme__sunset.noty_bar {
|
---|
2 | margin: 4px 0;
|
---|
3 | overflow: hidden;
|
---|
4 | border-radius: 2px;
|
---|
5 | position: relative; }
|
---|
6 | .noty_theme__sunset.noty_bar .noty_body {
|
---|
7 | padding: 10px;
|
---|
8 | font-size: 14px;
|
---|
9 | text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); }
|
---|
10 | .noty_theme__sunset.noty_bar .noty_buttons {
|
---|
11 | padding: 10px; }
|
---|
12 |
|
---|
13 | .noty_theme__sunset.noty_type__alert,
|
---|
14 | .noty_theme__sunset.noty_type__notification {
|
---|
15 | background-color: #073B4C;
|
---|
16 | color: #fff; }
|
---|
17 | .noty_theme__sunset.noty_type__alert .noty_progressbar,
|
---|
18 | .noty_theme__sunset.noty_type__notification .noty_progressbar {
|
---|
19 | background-color: #fff; }
|
---|
20 |
|
---|
21 | .noty_theme__sunset.noty_type__warning {
|
---|
22 | background-color: #FFD166;
|
---|
23 | color: #fff; }
|
---|
24 |
|
---|
25 | .noty_theme__sunset.noty_type__error {
|
---|
26 | background-color: #EF476F;
|
---|
27 | color: #fff; }
|
---|
28 | .noty_theme__sunset.noty_type__error .noty_progressbar {
|
---|
29 | opacity: .4; }
|
---|
30 |
|
---|
31 | .noty_theme__sunset.noty_type__info,
|
---|
32 | .noty_theme__sunset.noty_type__information {
|
---|
33 | background-color: #118AB2;
|
---|
34 | color: #fff; }
|
---|
35 | .noty_theme__sunset.noty_type__info .noty_progressbar,
|
---|
36 | .noty_theme__sunset.noty_type__information .noty_progressbar {
|
---|
37 | opacity: .6; }
|
---|
38 |
|
---|
39 | .noty_theme__sunset.noty_type__success {
|
---|
40 | background-color: #06D6A0;
|
---|
41 | color: #fff; }
|
---|
42 |
|
---|
43 | .noty_layout_mixin, #noty_layout__top, #noty_layout__topLeft, #noty_layout__topCenter, #noty_layout__topRight, #noty_layout__bottom, #noty_layout__bottomLeft, #noty_layout__bottomCenter, #noty_layout__bottomRight, #noty_layout__center, #noty_layout__centerLeft, #noty_layout__centerRight {
|
---|
44 | position: fixed;
|
---|
45 | margin: 0;
|
---|
46 | padding: 0;
|
---|
47 | z-index: 9999999;
|
---|
48 | -webkit-transform: translateZ(0) scale(1, 1);
|
---|
49 | transform: translateZ(0) scale(1, 1);
|
---|
50 | -webkit-backface-visibility: hidden;
|
---|
51 | backface-visibility: hidden;
|
---|
52 | -webkit-font-smoothing: subpixel-antialiased;
|
---|
53 | filter: blur(0);
|
---|
54 | -webkit-filter: blur(0);
|
---|
55 | max-width: 90%; }
|
---|
56 |
|
---|
57 | #noty_layout__top {
|
---|
58 | top: 0;
|
---|
59 | left: 5%;
|
---|
60 | width: 90%; }
|
---|
61 |
|
---|
62 | #noty_layout__topLeft {
|
---|
63 | top: 20px;
|
---|
64 | left: 20px;
|
---|
65 | width: 325px; }
|
---|
66 |
|
---|
67 | #noty_layout__topCenter {
|
---|
68 | top: 5%;
|
---|
69 | left: 50%;
|
---|
70 | width: 325px;
|
---|
71 | -webkit-transform: translate(-webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
|
---|
72 | transform: translate(calc(-50% - .5px)) translateZ(0) scale(1, 1); }
|
---|
73 |
|
---|
74 | #noty_layout__topRight {
|
---|
75 | top: 20px;
|
---|
76 | right: 20px;
|
---|
77 | width: 325px; }
|
---|
78 |
|
---|
79 | #noty_layout__bottom {
|
---|
80 | bottom: 0;
|
---|
81 | left: 5%;
|
---|
82 | width: 90%; }
|
---|
83 |
|
---|
84 | #noty_layout__bottomLeft {
|
---|
85 | bottom: 20px;
|
---|
86 | left: 20px;
|
---|
87 | width: 325px; }
|
---|
88 |
|
---|
89 | #noty_layout__bottomCenter {
|
---|
90 | bottom: 5%;
|
---|
91 | left: 50%;
|
---|
92 | width: 325px;
|
---|
93 | -webkit-transform: translate(-webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
|
---|
94 | transform: translate(calc(-50% - .5px)) translateZ(0) scale(1, 1); }
|
---|
95 |
|
---|
96 | #noty_layout__bottomRight {
|
---|
97 | bottom: 20px;
|
---|
98 | right: 20px;
|
---|
99 | width: 325px; }
|
---|
100 |
|
---|
101 | #noty_layout__center {
|
---|
102 | top: 50%;
|
---|
103 | left: 50%;
|
---|
104 | width: 325px;
|
---|
105 | -webkit-transform: translate(-webkit-calc(-50% - .5px), -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
|
---|
106 | transform: translate(calc(-50% - .5px), calc(-50% - .5px)) translateZ(0) scale(1, 1); }
|
---|
107 |
|
---|
108 | #noty_layout__centerLeft {
|
---|
109 | top: 50%;
|
---|
110 | left: 20px;
|
---|
111 | width: 325px;
|
---|
112 | -webkit-transform: translate(0, -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
|
---|
113 | transform: translate(0, calc(-50% - .5px)) translateZ(0) scale(1, 1); }
|
---|
114 |
|
---|
115 | #noty_layout__centerRight {
|
---|
116 | top: 50%;
|
---|
117 | right: 20px;
|
---|
118 | width: 325px;
|
---|
119 | -webkit-transform: translate(0, -webkit-calc(-50% - .5px)) translateZ(0) scale(1, 1);
|
---|
120 | transform: translate(0, calc(-50% - .5px)) translateZ(0) scale(1, 1); }
|
---|
121 |
|
---|
122 | .noty_progressbar {
|
---|
123 | display: none; }
|
---|
124 |
|
---|
125 | .noty_has_timeout.noty_has_progressbar .noty_progressbar {
|
---|
126 | display: block;
|
---|
127 | position: absolute;
|
---|
128 | left: 0;
|
---|
129 | bottom: 0;
|
---|
130 | height: 3px;
|
---|
131 | width: 100%;
|
---|
132 | background-color: #646464;
|
---|
133 | opacity: 0.2;
|
---|
134 | filter: alpha(opacity=10); }
|
---|
135 |
|
---|
136 | .noty_bar {
|
---|
137 | -webkit-backface-visibility: hidden;
|
---|
138 | -webkit-transform: translate(0, 0) translateZ(0) scale(1, 1);
|
---|
139 | -ms-transform: translate(0, 0) scale(1, 1);
|
---|
140 | transform: translate(0, 0) scale(1, 1);
|
---|
141 | -webkit-font-smoothing: subpixel-antialiased;
|
---|
142 | overflow: hidden; }
|
---|
143 |
|
---|
144 | .noty_effects_open {
|
---|
145 | opacity: 0;
|
---|
146 | -webkit-transform: translate(50%);
|
---|
147 | -ms-transform: translate(50%);
|
---|
148 | transform: translate(50%);
|
---|
149 | -webkit-animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
---|
150 | animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
---|
151 | -webkit-animation-fill-mode: forwards;
|
---|
152 | animation-fill-mode: forwards; }
|
---|
153 |
|
---|
154 | .noty_effects_close {
|
---|
155 | -webkit-animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
---|
156 | animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
---|
157 | -webkit-animation-fill-mode: forwards;
|
---|
158 | animation-fill-mode: forwards; }
|
---|
159 |
|
---|
160 | .noty_fix_effects_height {
|
---|
161 | -webkit-animation: noty_anim_height 75ms ease-out;
|
---|
162 | animation: noty_anim_height 75ms ease-out; }
|
---|
163 |
|
---|
164 | .noty_close_with_click {
|
---|
165 | cursor: pointer; }
|
---|
166 |
|
---|
167 | .noty_close_button {
|
---|
168 | position: absolute;
|
---|
169 | top: 2px;
|
---|
170 | right: 2px;
|
---|
171 | font-weight: bold;
|
---|
172 | width: 20px;
|
---|
173 | height: 20px;
|
---|
174 | text-align: center;
|
---|
175 | line-height: 20px;
|
---|
176 | background-color: rgba(0, 0, 0, 0.05);
|
---|
177 | border-radius: 2px;
|
---|
178 | cursor: pointer;
|
---|
179 | -webkit-transition: all .2s ease-out;
|
---|
180 | transition: all .2s ease-out; }
|
---|
181 |
|
---|
182 | .noty_close_button:hover {
|
---|
183 | background-color: rgba(0, 0, 0, 0.1); }
|
---|
184 |
|
---|
185 | .noty_modal {
|
---|
186 | position: fixed;
|
---|
187 | width: 100%;
|
---|
188 | height: 100%;
|
---|
189 | background-color: #000;
|
---|
190 | z-index: 10000;
|
---|
191 | opacity: .3;
|
---|
192 | left: 0;
|
---|
193 | top: 0; }
|
---|
194 |
|
---|
195 | .noty_modal.noty_modal_open {
|
---|
196 | opacity: 0;
|
---|
197 | -webkit-animation: noty_modal_in .3s ease-out;
|
---|
198 | animation: noty_modal_in .3s ease-out; }
|
---|
199 |
|
---|
200 | .noty_modal.noty_modal_close {
|
---|
201 | -webkit-animation: noty_modal_out .3s ease-out;
|
---|
202 | animation: noty_modal_out .3s ease-out;
|
---|
203 | -webkit-animation-fill-mode: forwards;
|
---|
204 | animation-fill-mode: forwards; }
|
---|
205 |
|
---|
206 | @-webkit-keyframes noty_modal_in {
|
---|
207 | 100% {
|
---|
208 | opacity: .3; } }
|
---|
209 |
|
---|
210 | @keyframes noty_modal_in {
|
---|
211 | 100% {
|
---|
212 | opacity: .3; } }
|
---|
213 |
|
---|
214 | @-webkit-keyframes noty_modal_out {
|
---|
215 | 100% {
|
---|
216 | opacity: 0; } }
|
---|
217 |
|
---|
218 | @keyframes noty_modal_out {
|
---|
219 | 100% {
|
---|
220 | opacity: 0; } }
|
---|
221 |
|
---|
222 | @keyframes noty_modal_out {
|
---|
223 | 100% {
|
---|
224 | opacity: 0; } }
|
---|
225 |
|
---|
226 | @-webkit-keyframes noty_anim_in {
|
---|
227 | 100% {
|
---|
228 | -webkit-transform: translate(0);
|
---|
229 | transform: translate(0);
|
---|
230 | opacity: 1; } }
|
---|
231 |
|
---|
232 | @keyframes noty_anim_in {
|
---|
233 | 100% {
|
---|
234 | -webkit-transform: translate(0);
|
---|
235 | transform: translate(0);
|
---|
236 | opacity: 1; } }
|
---|
237 |
|
---|
238 | @-webkit-keyframes noty_anim_out {
|
---|
239 | 100% {
|
---|
240 | -webkit-transform: translate(50%);
|
---|
241 | transform: translate(50%);
|
---|
242 | opacity: 0; } }
|
---|
243 |
|
---|
244 | @keyframes noty_anim_out {
|
---|
245 | 100% {
|
---|
246 | -webkit-transform: translate(50%);
|
---|
247 | transform: translate(50%);
|
---|
248 | opacity: 0; } }
|
---|
249 |
|
---|
250 | @-webkit-keyframes noty_anim_height {
|
---|
251 | 100% {
|
---|
252 | height: 0; } }
|
---|
253 |
|
---|
254 | @keyframes noty_anim_height {
|
---|
255 | 100% {
|
---|
256 | height: 0; } }
|
---|
257 |
|
---|
258 | /*# sourceMappingURL=noty.css.map*/ |
---|