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

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