Contact form test
Marc Riera Irigoyen
parent
856a8e096b
commit
85affb9fd1
|
|
@ -7,3 +7,40 @@ menu:
|
||||||
url: "/contacta/"
|
url: "/contacta/"
|
||||||
---
|
---
|
||||||
Pàgina no disponible temporalment. Disculpeu les molèsties.
|
Pàgina no disponible temporalment. Disculpeu les molèsties.
|
||||||
|
|
||||||
|
{{< netlify-form name="bluestnight-survey" >}}
|
||||||
|
{{< form-input type="text" label="First name:" id="first-name" placeholder="Richard" required="true" >}}
|
||||||
|
{{< form-input type="text" label="Last name:" id="last-name" placeholder="Grayson" >}}
|
||||||
|
{{< form-input type="email" label="Reply-to email:" id="email" placeholder="r.grayson@wayneindustries.com" >}}
|
||||||
|
{{< mult-input type="radio" label="Do you use BluestNight on your website?" name="uses-theme" required="true" >}}
|
||||||
|
{{< form-option label="Yes" value="yes" >}}
|
||||||
|
{{< form-option label="No" value="no" selected="true" >}}
|
||||||
|
{{< /mult-input >}}
|
||||||
|
{{< form-input type="textarea" label="If yes, what has your experience been like?" id="dev-experience" >}}
|
||||||
|
{{< mult-input type="radio" name="why-not-use" label="If no, why not?" add_other="true" >}}
|
||||||
|
{{< form-option label="Not what I'm looking for" value="not looking for" >}}
|
||||||
|
{{< form-option label="Too confusing to use" value="confusing" >}}
|
||||||
|
{{< form-option label="I hadn't heard about it before" value="didn't know" >}}
|
||||||
|
{{< /mult-input >}}
|
||||||
|
{{< mult-input type="checkbox" name="theme-good-side" label="What, if anything, would you say BluestNight does well at?" add_other="true" >}}
|
||||||
|
{{< form-option label="Plenty of customization" value="customization" >}}
|
||||||
|
{{< form-option label="Detailed documentation" value="good docs" >}}
|
||||||
|
{{< form-option label="Pages load quickly" value="fast load" >}}
|
||||||
|
{{< form-option label="Developer friendly" value="dev-friendly" >}}
|
||||||
|
{{< form-option label="Responsive design" value="responsive design" >}}
|
||||||
|
{{< form-option label="Looks professional" value="looks professional" >}}
|
||||||
|
{{< /mult-input >}}
|
||||||
|
{{< form-input type="textarea" label="Explain:" id="good-theme-explanation" >}}
|
||||||
|
{{< mult-input type="checkbox" name="theme-bad-side" label="What, if anything, should be improved in BluestNight?" add_other="true" >}}
|
||||||
|
{{< form-option label="Site build time" value="build time" >}}
|
||||||
|
{{< form-option label="Too many features" value="fewer features" >}}
|
||||||
|
{{< form-option label="More approachable documentation" value="be approachable" >}}
|
||||||
|
{{< form-option label="Too many bugs" value="has bugs" >}}
|
||||||
|
{{< /mult-input >}}
|
||||||
|
{{< form-input type="textarea" label="Explain:" id="bad-theme-explanation" >}}
|
||||||
|
{{< form-input type="textarea" label="Is there anything else you would like to share?" id="anything-else" >}}
|
||||||
|
{{< mult-input type="radio" label="If you entered an email above, may I contact you for follow-up information?" name="can-email" required="true" >}}
|
||||||
|
{{< form-option label="Yes" value="yes" >}}
|
||||||
|
{{< form-option label="No/Didn't enter email" value="no" selected="true" >}}
|
||||||
|
{{< /mult-input >}}
|
||||||
|
{{< /netlify-form >}}
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,8 @@
|
||||||
<nav>
|
<nav>
|
||||||
<ul class="first">
|
<ul class="first">
|
||||||
{{ $currentNode := . }}
|
{{ $currentPage := . }}
|
||||||
{{ range .Site.Menus.main }}
|
{{ range .Site.Menus.main }}
|
||||||
{{ if or ($currentNode.IsMenuCurrent "main" .) ($currentNode.HasMenuCurrent "main" .) }}
|
{{ if false }}
|
||||||
<li><a class="selected">{{ .Name }}</a>
|
<li><a class="selected">{{ .Name }}</a>
|
||||||
{{ else }}
|
{{ else }}
|
||||||
<li><a href="{{.URL}}">{{ .Name }}</a>
|
<li><a href="{{.URL}}">{{ .Name }}</a>
|
||||||
|
|
@ -10,7 +10,7 @@
|
||||||
{{ if .HasChildren }}
|
{{ if .HasChildren }}
|
||||||
<ul class="second">
|
<ul class="second">
|
||||||
{{ range .Children }}
|
{{ range .Children }}
|
||||||
<li><a href="{{.URL}}">{{ .Name }}{{ if .HasChildren }} »{{ end }}</a>
|
<li><a href="{{.URL}}">{{ .Name }}</a>
|
||||||
{{ if .HasChildren }}
|
{{ if .HasChildren }}
|
||||||
<ul class="third">
|
<ul class="third">
|
||||||
{{ range .Children }}
|
{{ range .Children }}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,65 @@
|
||||||
|
<div class="row">
|
||||||
|
<div class="row-item small-full small-text-center medium-third medium-text-right">
|
||||||
|
<label for="{{- .Get "id" -}}">{{- .Get "label" -}}</label>
|
||||||
|
</div>
|
||||||
|
<div class="row-item small-full small-text-center medium-two-thirds medium-text-left">
|
||||||
|
{{- $types := slice "color" "date" "datetime-local" "email" "file" "hidden" "month" "number" "password" "range" "tel" "text" "time" "url" "week" "textarea" -}}
|
||||||
|
{{- $type := .Get "type" -}}
|
||||||
|
{{- $id := .Get "id" -}}
|
||||||
|
{{- $name := (.Get "name" | default $id) -}}
|
||||||
|
{{- $placeholder := (.Get "placeholder" | default "") -}}
|
||||||
|
{{- $minlen := (.Get "minlength" | default "") -}}
|
||||||
|
{{- $maxlen := (.Get "maxlength" | default "") -}}
|
||||||
|
{{- $regex := (.Get "regex" | default "") -}}
|
||||||
|
{{- $value := (.Get "value" | default "") -}}
|
||||||
|
|
||||||
|
{{- if gt (len (findRE "([^a-zA-Z0-9_\\-\\.])+" $id 1)) 0 -}}
|
||||||
|
{{- errorf "ID \"%s\" should not contains characters other than ASCII letters, digits, '_', '-', and '.'" $id -}}
|
||||||
|
{{- else if not (in $types $type) -}}
|
||||||
|
{{- if or (eq $type "checkbox") (eq $type "radio") -}}
|
||||||
|
{{- errorf "To use input type \"%s\", use the mult-input shortcode instead." $type -}}
|
||||||
|
{{- else -}}
|
||||||
|
{{- errorf "Input type \"%s\" for ID \"%s\" is invalid/not allowed.\nValid values are: " $type $id (delimit $types ", ") -}}
|
||||||
|
{{- end -}}
|
||||||
|
{{- else if ne (len (findRE "^(\\d)*$" $minlen)) 1 -}}
|
||||||
|
{{- errorf "Minimum length \"%s\" must be a whole number!" $minlen -}}
|
||||||
|
{{- else if ne (len (findRE "^(\\d)*$" $maxlen)) 1 -}}
|
||||||
|
{{- errorf "Maximum length \"%s\" must be a whole number!" $maxlen -}}
|
||||||
|
{{- end -}}
|
||||||
|
|
||||||
|
{{- $.Scratch.Set "optional-tags" "" -}}
|
||||||
|
{{- with $placeholder -}}{{- $.Scratch.Add "optional-tags" (add (add " placeholder=\"" .) "\"") -}}{{- end -}}
|
||||||
|
{{- with $regex -}}{{- $.Scratch.Add "optional-tags" (add (add " pattern=\"" .) "\"") -}}{{- end -}}
|
||||||
|
{{- with $value -}}{{- $.Scratch.Add "optional-tags" (add (add " value=\"" .) "\"") -}}{{- end -}}
|
||||||
|
{{- with $minlen -}}{{- $.Scratch.Add "optional-tags" (add (add " minlength=\"" .) "\"") -}}{{- end -}}
|
||||||
|
{{- with $maxlen -}}{{- $.Scratch.Add "optional-tags" (add (add " maxlength=\"" .) "\"") -}}{{- end -}}
|
||||||
|
|
||||||
|
{{- if or (or (eq $type "number") (eq $type "date")) (eq $type "range") -}}
|
||||||
|
{{- $min := (.Get "min" | default "") -}}
|
||||||
|
{{- $max := (.Get "max" | default "") -}}
|
||||||
|
{{- $step := (.Get "step" | default "") -}}
|
||||||
|
{{- with $min -}}{{- $.Scratch.Add "optional-tags" (add (add " min=\"" .) "\"") -}}{{- end -}}
|
||||||
|
{{- with $max -}}{{- $.Scratch.Add "optional-tags" (add (add " max=\"" .) "\"") -}}{{- end -}}
|
||||||
|
{{- with $step -}}{{- $.Scratch.Add "optional-tags" (add (add " step=\"" .) "\"") -}}{{- end -}}
|
||||||
|
{{- else if eq $type "file" -}}
|
||||||
|
{{- $accepts := .Get "accept" -}}
|
||||||
|
{{- $.Scratch.Add "optional-tags" (add (add " accept=\"" $accepts) "\"") -}}
|
||||||
|
{{- else if or (eq $type "file") (eq $type "email") -}}
|
||||||
|
{{- if eq (.Get "multiple") "true" -}}
|
||||||
|
{{- $.Scratch.Add "optional-tags" " multiple" -}}
|
||||||
|
{{- end -}}
|
||||||
|
{{- end -}}
|
||||||
|
|
||||||
|
{{- if eq (.Get "required") "true" -}}
|
||||||
|
{{- $.Scratch.Add "optional-tags" " required" -}}
|
||||||
|
{{- end -}}
|
||||||
|
|
||||||
|
{{- if eq $type "textarea" -}}
|
||||||
|
<textarea id="{{ $id }}" name="{{ $id }}" rows="10"{{ ($.Scratch.Get "optional-tags" | safeHTMLAttr) }}></textarea>
|
||||||
|
{{- else if (in $types $type) -}}
|
||||||
|
<input type="{{ $type }}" id="{{ $id }}" name="{{ $id }}"{{ ($.Scratch.Get "optional-tags" | safeHTMLAttr) }} />
|
||||||
|
{{- else -}}
|
||||||
|
{{ errorf "If you are seeing this, please let the developer know at https://gitlab.com/BluestNight/BluestNight/issues\nInvalid input type \"%s\"" $type }}
|
||||||
|
{{- end -}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,16 @@
|
||||||
|
{{- $type := .Parent.Get "type" -}}
|
||||||
|
{{- $name := .Parent.Get "name" -}}
|
||||||
|
{{- $value := .Get "value" -}}
|
||||||
|
{{- $label := .Get "label" -}}
|
||||||
|
{{- $selected := eq (.Get "selected") "true" -}}
|
||||||
|
{{- $required := or (and (eq $type "radio") (eq (.Parent.Get "required") "true")) (and (eq $type "checkbox") (eq (.Get "required") "true")) -}}
|
||||||
|
{{- if eq $type "select" -}}
|
||||||
|
<option value="{{ $value }}"{{ if $selected }} selected{{ end }}>{{ $label }}</option>
|
||||||
|
{{- else -}}
|
||||||
|
<li>
|
||||||
|
<input id="{{ $name }}-{{ $value }}" type="{{ $type }}" name="{{ $name }}" value="{{ $value }}"{{ if $required }} required{{ end }}{{ if $selected }} checked{{ end }}>
|
||||||
|
<label for="{{ $name }}-{{ $value }}">
|
||||||
|
{{ $label }}
|
||||||
|
</label>
|
||||||
|
</li>
|
||||||
|
{{- end -}}
|
||||||
|
|
@ -0,0 +1,54 @@
|
||||||
|
<div class="row">
|
||||||
|
{{ $type := .Get "type" }}
|
||||||
|
{{ $name := .Get "name" }}
|
||||||
|
{{ $has_other := (eq (.Get "add_other") "true") }}
|
||||||
|
{{ $.Scratch.Set "form-input-type" $type }}
|
||||||
|
{{- if not (in (slice "checkbox" "radio" "select") $type) -}}
|
||||||
|
{{- errorf "Invalid multiple-choice input type \"%s\" - valid options are \"checkbox\", \"radio\", and \"select\"" -}}
|
||||||
|
{{- end -}}
|
||||||
|
<div class="row-item small-full small-text-center medium-third medium-text-right">
|
||||||
|
{{ if eq $type "select" }}
|
||||||
|
<label for="{{ $name }}">
|
||||||
|
{{ end }}
|
||||||
|
<p>{{ .Get "label" }}</p>
|
||||||
|
{{ if eq $type "select" }}
|
||||||
|
</label>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
<div class="row-item small-full small-text-left medium-two-thirds medium-text-left">
|
||||||
|
{{ if eq $type "select" }}
|
||||||
|
<select name="{{ $name }}"{{ if eq (.Get "required") "true" }} required{{ end }}>
|
||||||
|
<option value="">[Choose one]</option>
|
||||||
|
{{ .Inner | safeHTML }}
|
||||||
|
{{ if $has_other -}}
|
||||||
|
<option value="other">Other</option>
|
||||||
|
{{- end }}
|
||||||
|
</select>
|
||||||
|
{{ else }}
|
||||||
|
<ul>
|
||||||
|
{{ .Inner | safeHTML }}
|
||||||
|
{{ if $has_other }}
|
||||||
|
<li>
|
||||||
|
<input id="{{ $name }}-other" type="{{ $type }}" name="{{ $name }}" value="other">
|
||||||
|
<label for="{{ $name }}-other">
|
||||||
|
Other
|
||||||
|
</label>
|
||||||
|
<input class="hide" type="text" name="{{ $name }}-other-value"/>
|
||||||
|
</li>
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{ if and (eq $type "select") $has_other }}
|
||||||
|
<div class="row">
|
||||||
|
<div class="row-item small-full small-text-center medium-third medium-text-right">
|
||||||
|
<label for="{{ $name }}_other_value">
|
||||||
|
<p>If "Other", please specify:</p>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="row-item small-full small-text-center medium-two-thirds medium-text-right">
|
||||||
|
<input type="text" id="{{ $name }}_other_value" name="{{ $name }}_other_value" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
|
@ -0,0 +1,14 @@
|
||||||
|
{{ $action := .Get "action" | default "thank-you" -}}
|
||||||
|
{{- if ne $action "thank-you" -}}{{- $action := ($action | absLangURL) -}}{{- end -}}
|
||||||
|
<form class="form-container" netlify-honeypot="antispambot" name="{{ .Get "name" }}" action="{{ $action }}" netlify>
|
||||||
|
<input type="text" name="antispambot" class="hide" />
|
||||||
|
{{ .Inner }}
|
||||||
|
<div class="row">
|
||||||
|
<button class="row-item small-full medium-third large-quarter left button" type="reset">
|
||||||
|
Reset
|
||||||
|
</button>
|
||||||
|
<button class="row-item small-full medium-third large-quarter right button" type="submit">
|
||||||
|
Submit
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
@ -58,6 +58,13 @@ a:hover {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
p a:link,
|
||||||
|
p a:active,
|
||||||
|
p a:visited,
|
||||||
|
p a:hover {
|
||||||
|
color: #208DCC;
|
||||||
|
}
|
||||||
|
|
||||||
#footer {
|
#footer {
|
||||||
background: #3E3E3E;
|
background: #3E3E3E;
|
||||||
color: #BBBBBB;
|
color: #BBBBBB;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue