aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorrubo77 <github@r.z11.de>2016-09-16 21:15:32 +0200
committerrubo77 <github@r.z11.de>2016-09-16 21:25:23 +0200
commitc74947720e495756014dd8919ac51e15a57fbe32 (patch)
treebe5cc2efd8780e95fc39d7123452860ba66c0f2f
parent1bf242256294c083a8b210c2f09662e0f57e38ce (diff)
Knotenalarmseite verbessert
-rw-r--r--index.html2
-rw-r--r--nodealarm.html18
-rw-r--r--stylesheets/app.css23
3 files changed, 33 insertions, 10 deletions
diff --git a/index.html b/index.html
index ccbf56c..ef5cdb7 100644
--- a/index.html
+++ b/index.html
@@ -49,7 +49,7 @@ layout: base
</script>
<div class="eight columns" id="startpagecontent">
<div style="float:right">
- <input onclick="responsiveVoice.speak($('#startpagecontent').text(), 'Deutsch Female', {pitch: .7});" type="button" value="🔊 Play" />
+ <input onclick="responsiveVoice.speak($('#startpagecontent').text(), 'Deutsch Female', {pitch: .7});" type="button" value="🔊 Anhören" />
<input onclick="toggleSpeech()" type="button" value="||" />
</div>
diff --git a/nodealarm.html b/nodealarm.html
index 6c4ae6a..71d8af0 100644
--- a/nodealarm.html
+++ b/nodealarm.html
@@ -38,17 +38,17 @@ textarea {
><h3>Möchtest du automatisiert Status-E-Mails bekommen?</h3>
<form method="post" action="{{ site.community.url_nodealarm }}">
<p>
- Du kannst Dich automatisiert benachrichtigen lassen, sobald dein Knoten lÀngere Zeit offline ist. <!--Die erste E-Mail bekommst du nach 3 Stunden, nach einem Tag gibt es dann nochmal eine Erinnerung. Sollte dein Knoten nach einer Woche immernoch offline sein, bekommst du eine letzte Status-E-Mail.-->
+ Hier kannst du dich automatisiert benachrichtigen lassen, sobald dein Knoten lÀngere Zeit offline sein sollte. <!--Die erste E-Mail bekommst du nach 3 Stunden, nach einem Tag gibt es dann nochmal eine Erinnerung. Sollte dein Knoten nach einer Woche immernoch offline sein, bekommst du eine letzte Status-E-Mail.
+ Den automatisierten Versand von Status-E-Mails kannst du jederzeit wieder deaktivieren.-->
</p>
- <p>Du kannst den automatisierten Versand von Status-E-Mails selbstverstÀndlich jederzeit wieder deaktivieren.</p>
- <p><input type="checkbox" name="confirm" checked> Informiert mich, wenn mein Knoten offline ist</p>
- <div><label>Dein Name:</label> <input title="text" name="name"></div>
- <div><label>Deine Email-Adresse:</label> <input title="email" name="from"></div>
- <div>Name, MAC-Adresse oder ID deiner Knoten:<br>
- <textarea name="body"></textarea>
- </div>
+ <p><input type="checkbox" name="confirm" checked> <strong>Ja, bitte informiert mich wenn mein Knoten offline ist!</strong></p>
+ <p><label class="inputleft">Dein Name:</label> <input type="text" class="inputright" name="name"></p>
+ <p><label class="inputleft">Deine Email-Adresse:</label> <input type="email" class="inputright" name="from"></p>
<p>
- (Deinen Namen und deine E-Mail-Adresse werden selbstverstÀndlich nicht öffentlich einsehbar sein und werden von uns nicht weitergegeben oder anderweitig verwendet. Versprochen!)
+ Trage hier den Hostnamen oder MAC-Adresse deiner Knoten ein oder die Kontakt&shy;information, die du in der Knotenkonfiguration hinterlegt hast (einen Eintrag pro Zeile)<br>
+ <strong>Deine Knoten:</strong>
+ <textarea name="body"></textarea>
+ (Dein Name und deine E-Mail-Adresse werden selbstverstÀndlich nicht öffentlich einsehbar sein und werden von uns weder weitergegeben noch anderweitig verwendet. Versprochen!)
</p>
<div id="nodealarminfobox" class="nodealarm-info alert alert-info">
<p>
diff --git a/stylesheets/app.css b/stylesheets/app.css
index 4dc1a64..4c2541f 100644
--- a/stylesheets/app.css
+++ b/stylesheets/app.css
@@ -47,6 +47,29 @@ h1 > .postdate {
text-indent: -1em;
}
+label.inputleft{
+ float:left;
+ min-width: 160px;
+ font-weight: bold;
+}
+input.inputright{
+ width: 370px;
+ border-radius: 4px;
+}
+textarea, input[type='text'], input[type='email'], input[type='password'], select {
+ transition: all 0.30s ease-in-out;
+ border:1px solid
+ padding: 4px;
+}
+textarea:focus, input[type='text']:focus, input[type='email']:focus, input[type='password']:focus, select:focus {
+ background-color: #fff;
+ border:1px solid
+ padding: 4px;
+ border-color: rgba(82, 168, 236, 0.8);
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(82, 168, 236, 0.6);
+ outline: 0 none;
+}
+
/* -----------------------------------------
bootstrap alerts
----------------------------------------- */