ariejan/devroom.io
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

restyle contact form

Browse Source
This commit is contained in:
Ariejan de Vroom 2024-01-24 14:24:41 +01:00
parent d565e3d5f2
commit d6692526d5
Signed by: ariejan
GPG Key ID: AD739154F713697B
2 changed files with 60 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
content/contact.md
View File

@ -3,38 +3,24 @@ type = "page"
title = "Contact"
+++
I _love_ hearing from you, especially if any of my posts was helpful to you. I know
a lot of you are looking to repair your television or audio equipment. Go for it!
I _love_ hearing from you, especially if any of my posts was helpful to you. Please note, I don't have the time or
resources to diagnose specific issues with your audio or TV equipment.
I do have to disappoint those who want to send me their gear for repair or request
specific instruction on how to so themselves. I don't have the time to assist you
to a degree that would make either of us happy. I _can_ refer you to
[/r/AskElectronics](https://www.reddit.com/r/AskElectronics/) and
[/r/audiorepair](https://www.reddit.com/r/audiorepair/) on Reddit, where many
helpful (and more knowledgeable) people are ready to help out.
_Note: this form is processed through [Fromspree.io](https://formspree.io)_
## Let's get to it
<form name="contact" method="POST" class="pure-form pure-form-stacked" action="https://formspree.io/ariejan@devroom.io">
<form name="contact" method="POST" action="https://formspree.io/ariejan@devroom.io">
<fieldset>
<div class="pure-control-group">
<label for="name">Your name:</label>
<input type="text" name="name" class="pure-input-1" id="inputName" required>
</div>
<div class="pure-control-group">
<label for="email">Your email address:</label>
<input type="email" name="email" class="pure-input-1" id="inputEmail" required>
</div>
<div class="pure-control-group">
<label for="email">Your messages</label>
<textarea name="message" class="pure-input-1" id="inputMessage" rows="6" required></textarea>
</div>
<div class="pure-controls">
<button class="pure-button pure-button-primary" style="background-color: #F6019D; margin-top: 1.2vh;" type="submit">Send</button>
</div>
<label for="name">Your name:</label>
<input type="text" name="name" id="inputName" required>
<br />
<label for="email">Your email address:</label>
<input type="email" name="email" id="inputEmail" required>
<br />
<label for="email">Your messages</label>
<textarea name="message" id="inputMessage" rows="12" required></textarea>
<br />
<input type="submit" value="Send it">
</fieldset>
</form>
If you need to, use my [GPG Key](/gpg/) or [Keybase](https://keybase.io/adevroom) to
encrypt your message to me. Your message will result in a regular email to me and will
be treated confidentially.
If you need privacy use my [GPG Key](/gpg/).

57
themes/devroom-2024/assets/scss/devroom.scss
View File

@ -11,7 +11,7 @@ $line-height: 1.6;
$accent: rgb(90, 126, 193);
$background: rgb(40, 44, 53);
$backdrop: $background;
$backdrop: darken($background, 5%);
$text: rgb(226, 226, 226);
$subtext: #868686;
$links: $accent;
@ -20,13 +20,14 @@ $meta: $text;
$header: $text;
$highlight: $links;
$blockquote_border: $accent;
$important_border: #f00;
$code_background: $background;
$code_border_color: $background;
$code: #ff9327;
$separator: darken(desaturate($accent, 20%), 20%);
html, body {
background-color: $backdrop;
background-color: $background;
color: $text;
font-family: "Mulish", sans-serif;
font-size: $font_size;
@ -39,16 +40,9 @@ code, pre {
}
.important {
width: 100%;
display: block;
font-style: italic;
}
.important::before {
content: '\f0a4';
font-family: "Font Awesome 6 Free";
font-size: 1rem;
margin-right: 0.7rem;
display: block;
border-left: 5px solid $important_border;
padding-left: 1rem;
}
.container {
@ -407,4 +401,43 @@ a.tag {
border-radius: 50%;
}
}
}
form {
fieldset {
border: 2px solid $separator;
padding: 12px 16px;
}
input, textarea {
width: 100%;
padding: 12px;
margin: 8px 0;
box-sizing: border-box;
border: 2px solid $separator;
border-radius: 4px;
background-color: $backdrop;
color: $text;
&:focus {
outline: none;
border: 2px solid $accent;
}
}
textarea {
resize: none;
}
input[type=button], input[type=submit], input[type=reset] {
background-color: $accent;
border: none;
color: $text;
padding: 16px 32px;
text-decoration: none;
margin: 4px 2px;
cursor: pointer;
}
}