PluginProbe
Block Animations, Motion & Scroll Effects – Ghost Kit / 3.4.1
Block Animations, Motion & Scroll Effects – Ghost Kit v3.4.1
3.7.2 3.7.1 3.7.0 3.6.1 trunk 1.6.3 2.25.0 3.3.0 3.3.1 3.3.2 3.3.3 3.4.0 3.4.1 3.4.2 3.4.3 3.4.4 3.4.5 3.4.6 3.5.0 3.5.1 3.6.0
ghostkit / gutenberg / blocks / form / mail-template / index.php

index.php in Block Animations, Motion & Scroll Effects – Ghost Kit 3.4.1, at gutenberg/blocks/form/mail-template/index.php

338 lines 6.2 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 /**
3 * Form mail template.
4 *
5 * @var $attributes - form block attributes.
6 *
7 * @package ghostkit
8 */
9
10 ?>
11 <!doctype html>
12 <html>
13 <head>
14 <meta name="viewport" content="width=device-width" />
15 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
16 <title>
17 <?php echo esc_html( get_the_title() ); ?>
18 </title>
19 <style>
20 /* -------------------------------------
21 GLOBAL RESETS
22 ------------------------------------- */
23
24 /*All the styling goes here*/
25
26 img {
27 border: none;
28 -ms-interpolation-mode: bicubic;
29 max-width: 100%;
30 }
31
32 body {
33 background-color: #f6f6f6;
34 font-family: sans-serif;
35 -webkit-font-smoothing: antialiased;
36 font-size: 14px;
37 line-height: 1.4;
38 margin: 0;
39 padding: 0;
40 -ms-text-size-adjust: 100%;
41 -webkit-text-size-adjust: 100%;
42 }
43
44 table {
45 border-collapse: separate;
46 mso-table-lspace: 0pt;
47 mso-table-rspace: 0pt;
48 width: 100%; }
49 table td {
50 font-family: sans-serif;
51 font-size: 14px;
52 vertical-align: top;
53 }
54
55 /* -------------------------------------
56 BODY & CONTAINER
57 ------------------------------------- */
58
59 .body {
60 background-color: #f6f6f6;
61 width: 100%;
62 }
63
64 /* Set a max-width, and make it display as block so it will automatically stretch to that width, but will also shrink down on a phone or something */
65 .container {
66 display: block;
67 margin: 0 auto !important;
68 /* makes it centered */
69 max-width: 580px;
70 padding: 10px;
71 width: 580px;
72 }
73
74 /* This should also be a block element, so that it will fill 100% of the .container */
75 .content {
76 box-sizing: border-box;
77 display: block;
78 margin: 0 auto;
79 max-width: 580px;
80 padding: 10px;
81 }
82
83 /* -------------------------------------
84 HEADER, FOOTER, MAIN
85 ------------------------------------- */
86 .main {
87 background: #ffffff;
88 border-radius: 3px;
89 width: 100%;
90 }
91
92 .wrapper {
93 box-sizing: border-box;
94 padding: 20px;
95 }
96
97 .content-block {
98 padding-bottom: 10px;
99 padding-top: 10px;
100 }
101
102 .footer {
103 clear: both;
104 margin-top: 10px;
105 text-align: center;
106 width: 100%;
107 }
108 .footer td,
109 .footer p,
110 .footer span,
111 .footer a {
112 color: #999999;
113 font-size: 12px;
114 text-align: center;
115 }
116
117 /* -------------------------------------
118 TYPOGRAPHY
119 ------------------------------------- */
120 h1,
121 h2,
122 h3,
123 h4 {
124 color: #000000;
125 font-family: sans-serif;
126 font-weight: 400;
127 line-height: 1.4;
128 margin: 0;
129 margin-bottom: 30px;
130 }
131
132 h1 {
133 font-size: 35px;
134 font-weight: 300;
135 text-align: center;
136 text-transform: capitalize;
137 }
138
139 p,
140 ul,
141 ol {
142 font-family: sans-serif;
143 font-size: 14px;
144 font-weight: normal;
145 margin: 0;
146 margin-bottom: 15px;
147 padding-left: 0;
148 }
149 p li,
150 ul li,
151 ol li {
152 list-style-position: inside;
153 margin-left: 5px;
154 }
155
156 a {
157 color: #3498db;
158 text-decoration: underline;
159 }
160
161 /* -------------------------------------
162 ALL FIELDS OUTPUT
163 ------------------------------------- */
164 .field-row-label {
165 color: #000000;
166 padding-bottom: 3px;
167 word-break: break-all;
168 }
169 .field-row-value {
170 padding-top: 3px;
171 padding-bottom: 5px;
172 word-break: break-all;
173 }
174
175 /* -------------------------------------
176 OTHER STYLES THAT MIGHT BE USEFUL
177 ------------------------------------- */
178 .last {
179 margin-bottom: 0;
180 }
181
182 .first {
183 margin-top: 0;
184 }
185
186 .align-center {
187 text-align: center;
188 }
189
190 .align-right {
191 text-align: right;
192 }
193
194 .align-left {
195 text-align: left;
196 }
197
198 .clear {
199 clear: both;
200 }
201
202 .mt0 {
203 margin-top: 0;
204 }
205
206 .mb0 {
207 margin-bottom: 0;
208 }
209
210 hr {
211 border: 0;
212 border-bottom: 1px solid #f6f6f6;
213 margin: 20px 0;
214 }
215
216 /* -------------------------------------
217 RESPONSIVE AND MOBILE FRIENDLY STYLES
218 ------------------------------------- */
219 @media only screen and (max-width: 620px) {
220 table[class=body] h1 {
221 font-size: 28px !important;
222 margin-bottom: 10px !important;
223 }
224 table[class=body] p,
225 table[class=body] ul,
226 table[class=body] ol,
227 table[class=body] td,
228 table[class=body] span,
229 table[class=body] a {
230 font-size: 16px !important;
231 }
232 table[class=body] .wrapper,
233 table[class=body] .article {
234 padding: 10px !important;
235 }
236 table[class=body] .content {
237 padding: 0 !important;
238 }
239 table[class=body] .container {
240 padding: 0 !important;
241 width: 100% !important;
242 }
243 table[class=body] .main {
244 border-left-width: 0 !important;
245 border-radius: 0 !important;
246 border-right-width: 0 !important;
247 }
248 table[class=body] .img-responsive {
249 height: auto !important;
250 max-width: 100% !important;
251 width: auto !important;
252 }
253 }
254
255 /* -------------------------------------
256 PRESERVE THESE STYLES IN THE HEAD
257 ------------------------------------- */
258 @media all {
259 .ExternalClass {
260 width: 100%;
261 }
262 .ExternalClass,
263 .ExternalClass p,
264 .ExternalClass span,
265 .ExternalClass font,
266 .ExternalClass td,
267 .ExternalClass div {
268 line-height: 100%;
269 }
270 #MessageViewBody a {
271 color: inherit;
272 text-decoration: none;
273 font-size: inherit;
274 font-family: inherit;
275 font-weight: inherit;
276 line-height: inherit;
277 }
278 }
279
280 </style>
281 </head>
282 <body class="">
283 <table role="presentation" border="0" cellpadding="0" cellspacing="0" class="body">
284 <tr>
285 <td>&nbsp;</td>
286 <td class="container">
287 <div class="content">
288
289 <!-- START CENTERED WHITE CONTAINER -->
290 <table role="presentation" class="main">
291
292 <!-- START MAIN CONTENT AREA -->
293 <tr>
294 <td class="wrapper">
295 <table role="presentation" border="0" cellpadding="0" cellspacing="0">
296 <tr>
297 <td>
298 <?php echo wp_kses_post( $attributes['mailMessage'] ); ?>
299 </td>
300 </tr>
301 </table>
302 </td>
303 </tr>
304 <!-- END MAIN CONTENT AREA -->
305
306 </table>
307 <!-- END CENTERED WHITE CONTAINER -->
308
309 <!-- START FOOTER -->
310 <div class="footer">
311 <table role="presentation" border="0" cellpadding="0" cellspacing="0">
312 <tr>
313 <td class="content-block">
314 <?php
315 echo wp_kses_post(
316 sprintf(
317 // translators: %1$s - current page title.
318 // translators: %2$s - current page link.
319 __( 'This e-mail was sent from a contact form on %1$s. (%2$s)', 'ghostkit' ),
320 esc_html( get_the_title() ),
321 '<a href="' . esc_url( get_the_permalink() ) . '">' . esc_url( get_the_permalink() ) . '</a>'
322 )
323 );
324 ?>
325 </td>
326 </tr>
327 </table>
328 </div>
329 <!-- END FOOTER -->
330
331 </div>
332 </td>
333 <td>&nbsp;</td>
334 </tr>
335 </table>
336 </body>
337 </html>
338