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

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