PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 5.0.08
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v5.0.08
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.0.08, at css/frm_grids.css

369 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 grid-row-start: span 100;
230 justify-content: end;
231 }
232
233 /* RTL Grids */
234
235 .with_frm_style.frm_rtl .frm_form_fields .star-rating{
236 float:right;
237 }
238
239 .with_frm_style.frm_rtl .frm_grid .frm_primary_label,
240 .with_frm_style.frm_rtl .frm_grid_first .frm_primary_label,
241 .with_frm_style.frm_rtl .frm_grid_odd .frm_primary_label,
242 .with_frm_style.frm_rtl .frm_grid .frm_radio,
243 .with_frm_style.frm_rtl .frm_grid_first .frm_radio,
244 .with_frm_style.frm_rtl .frm_grid_odd .frm_radio,
245 .with_frm_style.frm_rtl .frm_grid .frm_checkbox,
246 .with_frm_style.frm_rtl .frm_grid_first .frm_checkbox,
247 .with_frm_style.frm_rtl .frm_grid_odd .frm_checkbox{
248 float:right !important;
249 margin-right:0 !important;
250 }
251
252 .with_frm_style.frm_rtl .frm_grid_first .frm_radio label input,
253 .with_frm_style.frm_rtl .frm_grid .frm_radio label input,
254 .with_frm_style.frm_rtl .frm_grid_odd .frm_radio label input,
255 .with_frm_style.frm_rtl .frm_grid_first .frm_checkbox label input,
256 .with_frm_style.frm_rtl .frm_grid .frm_checkbox label input,
257 .with_frm_style.frm_rtl .frm_grid_odd .frm_checkbox label input{
258 float:left;
259 }
260
261 .with_frm_style.frm_rtl .frm_catlevel_2,
262 .with_frm_style.frm_rtl .frm_catlevel_3,
263 .with_frm_style.frm_rtl .frm_catlevel_4,
264 .with_frm_style.frm_rtl .frm_catlevel_5{
265 margin-right:18px;
266 }
267
268 .with_frm_style.frm_rtl div > .frm_time_select{
269 margin-right:5px;
270 }
271
272 /* Left and right label styling for non-Formidable styling */
273
274 .frm_form_field.frm_inline_container,
275 .frm_form_field.frm_right_container,
276 .frm_form_field.frm_left_container{
277 display: grid;
278 grid-template-columns: 25% auto;
279 width:100%;
280 grid-auto-rows: min-content;
281 }
282
283 .frm_form_field.frm_right_container{
284 grid-template-columns: auto 25%;
285 }
286
287 .frm_form_field.frm_inline_container{
288 grid-template-columns: repeat(2, minmax(auto, max-content) );
289 }
290
291 .frm_form_field.frm_inline_container .frm_primary_label,
292 .frm_form_field.frm_right_container .frm_primary_label,
293 .frm_form_field.frm_left_container .frm_primary_label{
294 margin-right:10px;
295 grid-row:span 2/span 2;
296 padding-top:4px;
297 }
298
299 .frm_form_field.frm_left_container .frm_primary_label{
300 grid-column:1;
301 grid-row:span 2/span 2; /* cover a row for the description */
302 }
303
304 .frm_form_field.frm_right_container .frm_primary_label{
305 grid-column:2;
306 grid-row:1;
307 margin-right:0;
308 margin-left:10px;
309 }
310
311 .frm_form_field.frm_inline_container .frm_description,
312 .frm_form_field.frm_left_container .frm_description{
313 grid-column:2;
314 }
315
316 .frm_form_field.frm_right_container .frm_description{
317 grid-column:1;
318 }
319
320 .frm_conf_field.frm_left_container{
321 grid-template-columns: 67%;
322 }
323
324 .frm_conf_field.frm_left_container .frm_description{
325 grid-column:1;
326 }
327
328 /* End RTL Grids */
329
330 .frm-fade-in {
331 -webkit-animation-name: fadeIn;
332 animation-name: fadeIn;
333 -webkit-animation-duration: 1s;
334 animation-duration: 1s;
335 -webkit-animation-fill-mode: both;
336 animation-fill-mode: both;
337 }
338
339 @keyframes spin {
340 0% { transform: rotate(0deg); }
341 100% { transform: rotate(360deg); }
342 }
343
344 @keyframes fadeIn {
345 0% {opacity: 0;}
346 100% {opacity: 1;}
347 }
348
349 @media only screen and (max-width: 750px) {
350 .frm_grid_container.frm_no_grid_750 > div{
351 grid-column: span 12/span 12;
352 }
353 }
354
355 @media only screen and (max-width: 600px) {
356 .frm_section_heading > .frm_form_field,
357 .frm_fields_container > .frm_submit,
358 .frm_grid_container > .frm_form_field,
359 .frm_fields_container > .frm_form_field{
360 grid-column: 1 / span 12 !important;
361 }
362
363 .frm_grid_container.frm_no_grid_600,
364 .frm_form_field.frm_inline_container,
365 .frm_form_field.frm_right_container,
366 .frm_form_field.frm_left_container{
367 display:block;
368 }
369 }