PluginProbe
Elementor Website Builder – more than just a page builder / 3.28.4
Elementor Website Builder – more than just a page builder v3.28.4
4.3.0-beta2 4.3.0-beta1 4.2.4 4.2.3 4.2.2 4.2.1 4.2.0 4.1.5 4.2.0-beta2 4.2.0-dev2 4.2.0-beta1 4.1.4 4.1.3 4.1.2 4.1.1 4.1.0 4.1.0-beta3 4.1.0-dev3 4.0.9 4.1.0-beta2 4.1.0-dev2 4.0.8 4.1.0-beta1 4.1.0-dev1 4.0.7 All 451 releases
elementor / assets / css / conditionals / dialog.css

dialog.css in Elementor Website Builder – more than just a page builder 3.28.4, at assets/css/conditionals/dialog.css

262 lines 15.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .dialog-widget-content {
2 background-color: var(--e-a-bg-default);
3 position: absolute;
4 border-radius: 3px;
5 box-shadow: 2px 8px 23px 3px rgba(0, 0, 0, 0.2);
6 overflow: hidden;
7 }
8
9 .dialog-message {
10 line-height: 1.5;
11 box-sizing: border-box;
12 }
13
14 .dialog-close-button {
15 cursor: pointer;
16 position: absolute;
17 margin-block-start: 15px;
18 inset-inline-end: 15px;
19 color: var(--e-a-color-txt);
20 font-size: 15px;
21 line-height: 1;
22 transition: var(--e-a-transition-hover);
23 }
24 .dialog-close-button:hover {
25 color: var(--e-a-color-txt-hover);
26 }
27
28 .dialog-prevent-scroll {
29 overflow: hidden;
30 max-height: 100vh;
31 }
32
33 .dialog-type-lightbox {
34 position: fixed;
35 height: 100%;
36 width: 100%;
37 bottom: 0;
38 left: 0;
39 background-color: rgba(0, 0, 0, 0.8);
40 z-index: 9999;
41 user-select: none;
42 }
43
44 .elementor-editor-active .elementor-popup-modal {
45 background-color: initial;
46 }
47
48 .dialog-type-confirm .dialog-widget-content,
49 .dialog-type-alert .dialog-widget-content {
50 margin: auto;
51 width: 400px;
52 padding: 20px;
53 }
54 .dialog-type-confirm .dialog-header,
55 .dialog-type-alert .dialog-header {
56 font-size: 15px;
57 font-weight: 500;
58 }
59 .dialog-type-confirm .dialog-header:after,
60 .dialog-type-alert .dialog-header:after {
61 content: "";
62 display: block;
63 border-block-end: var(--e-a-border);
64 padding-block-end: 10px;
65 margin-block-end: 10px;
66 margin-inline-start: -20px;
67 margin-inline-end: -20px;
68 }
69 .dialog-type-confirm .dialog-message,
70 .dialog-type-alert .dialog-message {
71 min-height: 50px;
72 }
73 .dialog-type-confirm .dialog-buttons-wrapper,
74 .dialog-type-alert .dialog-buttons-wrapper {
75 padding-block-start: 10px;
76 display: flex;
77 justify-content: flex-end;
78 gap: 15px;
79 }
80 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button,
81 .dialog-type-alert .dialog-buttons-wrapper .dialog-button {
82 font-size: 12px;
83 font-weight: 500;
84 line-height: 1.2;
85 padding: 8px 16px;
86 outline: none;
87 border: none;
88 border-radius: var(--e-a-border-radius);
89 background-color: var(--e-a-btn-bg);
90 color: var(--e-a-btn-color-invert);
91 transition: var(--e-a-transition-hover);
92 }
93 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button:hover,
94 .dialog-type-alert .dialog-buttons-wrapper .dialog-button:hover {
95 border: none;
96 }
97 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button:focus,
98 .dialog-type-alert .dialog-buttons-wrapper .dialog-button:hover,
99 .dialog-type-alert .dialog-buttons-wrapper .dialog-button:focus {
100 background-color: var(--e-a-btn-bg-hover);
101 color: var(--e-a-btn-color-invert);
102 }
103 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button:active,
104 .dialog-type-alert .dialog-buttons-wrapper .dialog-button:active {
105 background-color: var(--e-a-btn-bg-active);
106 }
107 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button:not([disabled]),
108 .dialog-type-alert .dialog-buttons-wrapper .dialog-button:not([disabled]) {
109 cursor: pointer;
110 }
111 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button:disabled,
112 .dialog-type-alert .dialog-buttons-wrapper .dialog-button:disabled {
113 background-color: var(--e-a-btn-bg-disabled);
114 color: var(--e-a-btn-color-disabled);
115 }
116 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button:not(.elementor-button-state) .elementor-state-icon,
117 .dialog-type-alert .dialog-buttons-wrapper .dialog-button:not(.elementor-button-state) .elementor-state-icon {
118 display: none;
119 }
120 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-cancel,
121 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt,
122 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-cancel {
123 background: transparent;
124 color: var(--e-a-color-txt);
125 }
126 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-cancel:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-cancel:focus,
127 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt:hover,
128 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-cancel:hover,
129 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt:focus,
130 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-cancel:focus {
131 background: var(--e-a-bg-hover);
132 color: var(--e-a-color-txt-hover);
133 }
134 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt:disabled, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-cancel:disabled,
135 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt:disabled,
136 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-cancel:disabled {
137 background: transparent;
138 color: var(--e-a-color-txt-disabled);
139 }
140 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt-border,
141 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt-border {
142 border: 1px solid var(--e-a-color-txt-muted);
143 }
144 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-success, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-success,
145 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-success,
146 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-success {
147 background-color: var(--e-a-btn-bg-success);
148 }
149 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-success:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-success:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-success:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-success:focus,
150 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-success:hover,
151 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-success:focus,
152 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-success:hover,
153 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-success:focus {
154 background-color: var(--e-a-btn-bg-success-hover);
155 }
156 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-primary, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-take_over, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-ok,
157 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-primary,
158 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-take_over,
159 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-ok {
160 background-color: var(--e-a-btn-bg-primary);
161 color: var(--e-a-btn-color);
162 }
163 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-primary:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-take_over:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-ok:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-primary:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-take_over:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-ok:focus,
164 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-primary:hover,
165 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-take_over:hover,
166 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-ok:hover,
167 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-primary:focus,
168 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-take_over:focus,
169 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-ok:focus {
170 background-color: var(--e-a-btn-bg-primary-hover);
171 color: var(--e-a-btn-color);
172 }
173 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-primary.e-btn-txt, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-take_over, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-primary.dialog-cancel, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-cancel.dialog-take_over, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-ok, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-ok.dialog-cancel,
174 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-primary.e-btn-txt,
175 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-take_over,
176 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-primary.dialog-cancel,
177 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-cancel.dialog-take_over,
178 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-ok,
179 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-ok.dialog-cancel {
180 background: transparent;
181 color: var(--e-a-color-primary-bold);
182 }
183 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-primary.e-btn-txt:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-take_over:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-primary.dialog-cancel:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-cancel.dialog-take_over:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-ok:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-ok.dialog-cancel:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-primary.e-btn-txt:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-take_over:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-primary.dialog-cancel:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-cancel.dialog-take_over:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-ok:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.dialog-ok.dialog-cancel:focus,
184 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-primary.e-btn-txt:hover,
185 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-take_over:hover,
186 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-primary.dialog-cancel:hover,
187 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-cancel.dialog-take_over:hover,
188 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-ok:hover,
189 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-ok.dialog-cancel:hover,
190 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-primary.e-btn-txt:focus,
191 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-take_over:focus,
192 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-primary.dialog-cancel:focus,
193 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-cancel.dialog-take_over:focus,
194 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-btn-txt.dialog-ok:focus,
195 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.dialog-ok.dialog-cancel:focus {
196 background: var(--e-a-bg-primary);
197 }
198 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.go-pro, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-accent,
199 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.go-pro,
200 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-accent {
201 background-color: var(--e-a-btn-bg-accent);
202 }
203 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.go-pro:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.go-pro:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-accent:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-accent:focus,
204 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.go-pro:hover,
205 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.go-pro:focus,
206 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-accent:hover,
207 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-accent:focus {
208 background-color: var(--e-a-btn-bg-accent-hover);
209 }
210 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.go-pro:active, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-accent:active,
211 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.go-pro:active,
212 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-accent:active {
213 background-color: var(--e-a-btn-bg-accent-active);
214 }
215 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-info, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-info,
216 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-info,
217 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-info {
218 background-color: var(--e-a-btn-bg-info);
219 }
220 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-info:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-info:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-info:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-info:focus,
221 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-info:hover,
222 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-info:focus,
223 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-info:hover,
224 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-info:focus {
225 background-color: var(--e-a-btn-bg-info-hover);
226 }
227 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-warning, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-warning,
228 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-warning,
229 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-warning {
230 background-color: var(--e-a-btn-bg-warning);
231 }
232 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-warning:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-warning:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-warning:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-warning:focus,
233 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-warning:hover,
234 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-warning:focus,
235 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-warning:hover,
236 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-warning:focus {
237 background-color: var(--e-a-btn-bg-warning-hover);
238 }
239 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-danger, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-danger,
240 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-danger,
241 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-danger {
242 background-color: var(--e-a-btn-bg-danger);
243 }
244 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-danger:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.elementor-button-danger:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-danger:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button.e-danger:focus,
245 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-danger:hover,
246 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.elementor-button-danger:focus,
247 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-danger:hover,
248 .dialog-type-alert .dialog-buttons-wrapper .dialog-button.e-danger:focus {
249 background-color: var(--e-a-btn-bg-danger-hover);
250 }
251 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button i,
252 .dialog-type-alert .dialog-buttons-wrapper .dialog-button i {
253 margin-inline-end: 5px;
254 }
255 .dialog-type-confirm .dialog-buttons-wrapper .dialog-button:hover, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button:focus, .dialog-type-confirm .dialog-buttons-wrapper .dialog-button:visited,
256 .dialog-type-alert .dialog-buttons-wrapper .dialog-button:hover,
257 .dialog-type-alert .dialog-buttons-wrapper .dialog-button:focus,
258 .dialog-type-alert .dialog-buttons-wrapper .dialog-button:visited {
259 color: initial;
260 }
261
262 /*# sourceMappingURL=dialog.css.map */