PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 5.4
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v5.4
6.35 6.34 6.33.1 6.33 6.32.1 6.32 6.31 6.25 6.25.1 6.26 6.26.1 6.27 6.28 6.29 6.3 6.3.1 6.3.2 6.30 6.4 6.4.1 6.4.2 6.5 6.5.1 6.5.2 6.5.3 All 141 releases
formidable / css / frm_grids.css

frm_grids.css in Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More 5.4, at css/frm_grids.css

368 lines 8.2 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .frm_screen_reader {
2 border: 0;
3 clip: rect(1px, 1px, 1px, 1px);
4 -webkit-clip-path: inset(50%);
5 clip-path: inset(50%);
6 height: 1px;
7 margin: -1px;
8 overflow: hidden;
9 padding: 0;
10 position: absolute;
11 width: 1px;
12 word-wrap: normal !important; /* many screen reader and browser combinations announce broken words as they would appear visually */
13 }
14 .frm_screen_reader.frm_hidden{
15 display:initial;
16 }
17
18 .frm_verify{
19 position:absolute;
20 left:-3000px;
21 }
22
23 .frm_clear_none{
24 clear:none;
25 }
26
27 .frm_clear{
28 clear:both;
29 }
30
31 .frm_form_field.frm_alignright{
32 float:right !important;
33 }
34
35 .with_frm_style .frm_form_field{
36 clear:both;
37 }
38
39 .frm_combo_inputs_container,
40 .frm_grid_container,
41 .frm_form_fields .frm_section_heading,
42 .frm_form_fields .frm_fields_container{
43 display:grid;
44 grid-template-columns: repeat(12, 6.5%);
45 grid-auto-rows: max-content;
46 grid-gap: 0 2%;
47 }
48
49 .frm_combo_inputs_container > *,
50 .frm_grid_container > *,
51 .frm_section_heading > *,
52 .frm_fields_container .frm_form_field,
53 .frm_fields_container > *{
54 grid-column: span 12 / span 12;
55 }
56
57 .frm_inline,
58 .frm_form_field.frm_left_inline,
59 .frm_form_field.frm_first_inline,
60 .frm_form_field.frm_inline,
61 .frm_submit.frm_inline,
62 .frm_form_field.frm_right_inline,
63 .frm_form_field.frm_last_inline{
64 width:auto;
65 grid-column: span 2 / span 2;
66 }
67
68 .frm6,
69 .frm_half,
70 .frm_form_field.frm_three_fifths, /* 5ths deprecated */
71 .frm_form_field.frm6,
72 .frm_submit.frm6,
73 .frm_form_field.frm_left_half,
74 .frm_form_field.frm_right_half,
75 .frm_form_field.frm_first_half,
76 .frm_form_field.frm_last_half,
77 .frm_form_field.frm_half,
78 .frm_submit.frm_half{
79 grid-column:span 6 / span 6;
80 }
81
82 .frm4,
83 .frm_third,
84 .frm_form_field.frm_two_fifths, /* 5ths deprecated */
85 .frm_form_field.frm4,
86 .frm_submit.frm4,
87 .frm_form_field.frm_left_third,
88 .frm_form_field.frm_third,
89 .frm_submit.frm_third,
90 .frm_form_field.frm_right_third,
91 .frm_form_field.frm_first_third,
92 .frm_form_field.frm_last_third{
93 grid-column:span 4 / span 4;
94 }
95
96 .frm8,
97 .frm_two_thirds,
98 .frm_form_field.frm8,
99 .frm_submit.frm8,
100 .frm_form_field.frm_left_two_thirds,
101 .frm_form_field.frm_right_two_thirds,
102 .frm_form_field.frm_first_two_thirds,
103 .frm_form_field.frm_last_two_thirds,
104 .frm_form_field.frm_two_thirds{
105 grid-column: span 8/span 8;
106 }
107
108 .frm3,
109 .frm_fourth,
110 .frm_form_field.frm3,
111 .frm_submit.frm3,
112 .frm_form_field.frm_left_fourth,
113 .frm_form_field.frm_fourth,
114 .frm_submit.frm_fourth,
115 .frm_form_field.frm_right_fourth,
116 .frm_form_field.frm_first_fourth,
117 .frm_form_field.frm_last_fourth{
118 grid-column: span 3/span 3;
119 }
120
121 .frm9,
122 .frm_three_fourths,
123 .frm_form_field.frm_four_fifths, /* 5ths deprecated */
124 .frm_form_field.frm9,
125 .frm_submit.frm9,
126 .frm_form_field.frm_three_fourths{
127 grid-column: span 9/span 9;
128 }
129
130 /* fifths are deprecated */
131 .frm_form_field.frm_left_fifth,
132 .frm_form_field.frm_fifth,
133 .frm_submit.frm_fifth,
134 .frm_form_field.frm_right_fifth,
135 .frm_form_field.frm_first_fifth,
136 .frm_form_field.frm_last_fifth{
137 grid-column: span 2/span 2;
138 }
139
140 .frm2,
141 .frm_sixth,
142 .frm_form_field.frm2,
143 .frm_submit.frm2,
144 .frm_form_field.frm_sixth,
145 .frm_submit.frm_sixth,
146 .frm_form_field.frm_first_sixth,
147 .frm_form_field.frm_last_sixth{
148 grid-column: span 2/span 2;
149 }
150
151 .frm10,
152 .frm_form_field.frm10,
153 .frm_submit.frm10{
154 grid-column: span 10/span 10;
155 }
156
157 .frm1,
158 .frm_form_field.frm1,
159 .frm_submit.frm1,
160 /* 7ths and 8ths are deprecated */
161 .frm_form_field.frm_seventh,
162 .frm_submit.frm_seventh,
163 .frm_form_field.frm_first_seventh,
164 .frm_form_field.frm_last_seventh
165 .frm_form_field.frm_eighth,
166 .frm_submit.frm_eighth,
167 .frm_form_field.frm_first_eighth,
168 .frm_form_field.frm_last_eighth{
169 grid-column: span 1/span 1;
170 }
171
172 .frm5,
173 .frm_form_field.frm5,
174 .frm_submit.frm5{
175 grid-column: span 5/span 5;
176 }
177
178 .frm7,
179 .frm_form_field.frm7,
180 .frm_submit.frm7{
181 grid-column: span 7/span 7;
182 }
183
184 .frm11,
185 .frm_form_field.frm11,
186 .frm_submit.frm11{
187 grid-column: span 11/span 11;
188 }
189
190 .frm12,
191 .frm_full,
192 .frm_full .wp-editor-wrap,
193 .frm_full > input:not([type='checkbox']):not([type='radio']):not([type='button']),
194 .frm_full select,
195 .frm_full textarea{
196 width:100% !important;
197 grid-column: span 12/span 12;
198 box-sizing: border-box;
199 }
200
201 .frm_full .wp-editor-wrap input{
202 width:auto !important;
203 }
204
205 .frm_first,
206 .frm_form_field.frm_left_half,
207 .frm_form_field.frm_left_third,
208 .frm_form_field.frm_left_two_thirds,
209 .frm_form_field.frm_left_fourth,
210 .frm_form_field.frm_left_fifth,
211 .frm_form_field.frm_left_inline,
212 .frm_form_field.frm_first_half,
213 .frm_form_field.frm_first_third,
214 .frm_form_field.frm_first_two_thirds,
215 .frm_form_field.frm_first_fourth,
216 .frm_form_field.frm_first_fifth,
217 .frm_form_field.frm_first_sixth,
218 .frm_form_field.frm_first_seventh,
219 .frm_form_field.frm_first_eighth,
220 .frm_form_field.frm_first_inline,
221 .frm_form_field.frm_first{
222 grid-column-start:1;
223 }
224
225 .frm_last,
226 .frm_form_field.frm_last,
227 .frm_form_field.frm_alignright{
228 grid-column-end:-1;
229 justify-content: end;
230 }
231
232 /* RTL Grids */
233
234 .with_frm_style.frm_rtl .frm_form_fields .star-rating{
235 float:right;
236 }
237
238 .with_frm_style.frm_rtl .frm_grid .frm_primary_label,
239 .with_frm_style.frm_rtl .frm_grid_first .frm_primary_label,
240 .with_frm_style.frm_rtl .frm_grid_odd .frm_primary_label,
241 .with_frm_style.frm_rtl .frm_grid .frm_radio,
242 .with_frm_style.frm_rtl .frm_grid_first .frm_radio,
243 .with_frm_style.frm_rtl .frm_grid_odd .frm_radio,
244 .with_frm_style.frm_rtl .frm_grid .frm_checkbox,
245 .with_frm_style.frm_rtl .frm_grid_first .frm_checkbox,
246 .with_frm_style.frm_rtl .frm_grid_odd .frm_checkbox{
247 float:right !important;
248 margin-right:0 !important;
249 }
250
251 .with_frm_style.frm_rtl .frm_grid_first .frm_radio label input,
252 .with_frm_style.frm_rtl .frm_grid .frm_radio label input,
253 .with_frm_style.frm_rtl .frm_grid_odd .frm_radio label input,
254 .with_frm_style.frm_rtl .frm_grid_first .frm_checkbox label input,
255 .with_frm_style.frm_rtl .frm_grid .frm_checkbox label input,
256 .with_frm_style.frm_rtl .frm_grid_odd .frm_checkbox label input{
257 float:left;
258 }
259
260 .with_frm_style.frm_rtl .frm_catlevel_2,
261 .with_frm_style.frm_rtl .frm_catlevel_3,
262 .with_frm_style.frm_rtl .frm_catlevel_4,
263 .with_frm_style.frm_rtl .frm_catlevel_5{
264 margin-right:18px;
265 }
266
267 .with_frm_style.frm_rtl div > .frm_time_select{
268 margin-right:5px;
269 }
270
271 /* Left and right label styling for non-Formidable styling */
272
273 .frm_form_field.frm_inline_container,
274 .frm_form_field.frm_right_container,
275 .frm_form_field.frm_left_container{
276 display: grid;
277 grid-template-columns: 25% auto;
278 width:100%;
279 grid-auto-rows: min-content;
280 }
281
282 .frm_form_field.frm_right_container{
283 grid-template-columns: auto 25%;
284 }
285
286 .frm_form_field.frm_inline_container{
287 grid-template-columns: repeat(2, minmax(auto, max-content) );
288 }
289
290 .frm_form_field.frm_inline_container .frm_primary_label,
291 .frm_form_field.frm_right_container .frm_primary_label,
292 .frm_form_field.frm_left_container .frm_primary_label{
293 margin-right:10px;
294 grid-row:span 2/span 2;
295 padding-top:4px;
296 }
297
298 .frm_form_field.frm_left_container .frm_primary_label{
299 grid-column:1;
300 grid-row:span 2/span 2; /* cover a row for the description */
301 }
302
303 .frm_form_field.frm_right_container .frm_primary_label{
304 grid-column:2;
305 grid-row:1;
306 margin-right:0;
307 margin-left:10px;
308 }
309
310 .frm_form_field.frm_inline_container .frm_description,
311 .frm_form_field.frm_left_container .frm_description{
312 grid-column:2;
313 }
314
315 .frm_form_field.frm_right_container .frm_description{
316 grid-column:1;
317 }
318
319 .frm_conf_field.frm_left_container{
320 grid-template-columns: 67%;
321 }
322
323 .frm_conf_field.frm_left_container .frm_description{
324 grid-column:1;
325 }
326
327 /* End RTL Grids */
328
329 .frm-fade-in {
330 -webkit-animation-name: fadeIn;
331 animation-name: fadeIn;
332 -webkit-animation-duration: 1s;
333 animation-duration: 1s;
334 -webkit-animation-fill-mode: both;
335 animation-fill-mode: both;
336 }
337
338 @keyframes spin {
339 0% { transform: rotate(0deg); }
340 100% { transform: rotate(360deg); }
341 }
342
343 @keyframes fadeIn {
344 0% {opacity: 0;}
345 100% {opacity: 1;}
346 }
347
348 @media only screen and (max-width: 750px) {
349 .frm_grid_container.frm_no_grid_750 > div{
350 grid-column: span 12/span 12;
351 }
352 }
353
354 @media only screen and (max-width: 600px) {
355 .frm_section_heading > .frm_form_field,
356 .frm_fields_container > .frm_submit,
357 .frm_grid_container > .frm_form_field,
358 .frm_fields_container > .frm_form_field{
359 grid-column: 1 / span 12 !important;
360 }
361
362 .frm_grid_container.frm_no_grid_600,
363 .frm_form_field.frm_inline_container,
364 .frm_form_field.frm_right_container,
365 .frm_form_field.frm_left_container{
366 display:block;
367 }
368 }