105 lines
2.6 KiB
Markdown
105 lines
2.6 KiB
Markdown
---
|
|
title: "Contact"
|
|
date: 2020-01-06T14:05:33+09:00
|
|
description:
|
|
service: formspree
|
|
formId: "maywgyww"
|
|
---
|
|
<form id="fs-frm" name="simple-contact-form" accept-charset="utf-8" action="https://formspree.io/maywgyww" method="post">
|
|
<fieldset id="fs-frm-inputs">
|
|
<label for="full-name">Full Name</label>
|
|
<input type="text" name="name" id="full-name" placeholder="First and Last" required="">
|
|
<label for="email-address">Email Address</label>
|
|
<input type="email" name="_replyto" id="email-address" placeholder="email@email.com" required="">
|
|
<label for="message">Message</label>
|
|
<textarea rows="5" name="message" id="message" placeholder="Message Placeholder" required=""></textarea>
|
|
<input type="hidden" name="_subject" id="email-subject" value="Contact Form Submission">
|
|
</fieldset>
|
|
<input type="submit" value="Submit">
|
|
</form><style>/* reset */
|
|
#fs-frm input,
|
|
#fs-frm select,
|
|
#fs-frm textarea,
|
|
#fs-frm fieldset,
|
|
#fs-frm optgroup,
|
|
#fs-frm label {
|
|
font-family: inherit;
|
|
font-size: 100%;
|
|
color: inherit;
|
|
border: none;
|
|
border-radius: 0;
|
|
display: block;
|
|
width: 100%;
|
|
padding: 0;
|
|
margin: 0;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
}
|
|
#fs-frm label,
|
|
#fs-frm legend {
|
|
font-size: .825em;
|
|
margin-bottom: .5em;
|
|
}
|
|
/* border, padding, margin, width */
|
|
#fs-frm input,
|
|
#fs-frm select,
|
|
#fs-frm textarea {
|
|
border: 1px solid rgba(0,0,0,0.2);
|
|
background-color: rgba(255,255,255,0.9);
|
|
padding: .75em 1em;
|
|
margin-bottom: 1.5em;
|
|
}
|
|
#fs-frm input:focus,
|
|
#fs-frm select:focus,
|
|
#fs-frm textarea:focus {
|
|
background-color: white;
|
|
outline-style: solid;
|
|
outline-width: thin;
|
|
outline-color: gray;
|
|
outline-offset: -1px;
|
|
}
|
|
#fs-frm [type="text"],
|
|
#fs-frm [type="email"] {
|
|
width: 100%;
|
|
}
|
|
#fs-frm [type="button"],
|
|
#fs-frm [type="submit"],
|
|
#fs-frm [type="reset"] {
|
|
width: auto;
|
|
cursor: pointer;
|
|
-webkit-appearance: button;
|
|
-moz-appearance: button;
|
|
appearance: button;
|
|
}
|
|
#fs-frm [type="button"]:focus,
|
|
#fs-frm [type="submit"]:focus,
|
|
#fs-frm [type="reset"]:focus {
|
|
outline: none;
|
|
}
|
|
#fs-frm [type="submit"],
|
|
#fs-frm [type="reset"] {
|
|
margin-bottom: 0;
|
|
}
|
|
#fs-frm select {
|
|
text-transform: none;
|
|
}
|
|
|
|
/* address, locale */
|
|
#fs-frm fieldset.locale input[name="city"],
|
|
#fs-frm fieldset.locale select[name="state"],
|
|
#fs-frm fieldset.locale input[name="postal-code"] {
|
|
display: inline;
|
|
}
|
|
#fs-frm fieldset.locale input[name="city"] {
|
|
width: 52%;
|
|
}
|
|
#fs-frm fieldset.locale select[name="state"],
|
|
#fs-frm fieldset.locale input[name="postal-code"] {
|
|
width: 20%;
|
|
}
|
|
#fs-frm fieldset.locale input[name="city"],
|
|
#fs-frm fieldset.locale select[name="state"] {
|
|
margin-right: 3%;
|
|
}
|
|
</style>
|