From a727ef478d9290ff35eddc745c8474011ed0971b Mon Sep 17 00:00:00 2001
From: Tilman <tliero@gmx.net>
Date: Wed, 26 Sep 2018 20:58:38 +0000
Subject: [PATCH] Update Doorbell-Speaker.ino - lauter/leiser-Buttons

---
 Doorbell-Speaker.ino | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)
diff --git a/Doorbell-Speaker.ino b/Doorbell-Speaker.ino
index d93417e..91be72d 100644
--- a/Doorbell-Speaker.ino
+++ b/Doorbell-Speaker.ino
@@ -137,16 +137,13 @@ void loop() {
             client.println("<!DOCTYPE html><html>");
             client.println("<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">");
             client.println("<link rel=\"icon\" href=\"data:,\">");
-            // CSS to style the on/off buttons 
-            // Feel free to change the background-color and font-size attributes to fit your preferences
-            client.println("<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}");
-            client.println(".button { background-color: #4CAF50; border: none; color: white; padding: 16px 40px;");
-            client.println("text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer;}");
-            client.println(".button2 {background-color: #555555;}</style></head>");
+            client.println("<style>html { font-family: sans-serif; display: inline-block; margin: 0px auto; text-align: center; }");
+            client.println(".button { background-color: #4CAF50; border: none; color: white; padding: 16px 40px; text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer;}");
+            client.println(".button2 { background-color: #4CAF50; border: none; color: white; padding: 4px 10px; text-decoration: none; margin: 1px; cursor: pointer;}</style></head>");
             
              client.println("<body><h1>LeWe T&uuml;rklingel</h1>");
             client.println("<p>LED - State " + ledState + "</p>");
-            client.println("<p>Volume " + String(volume) + "</p>");
+            client.println("<p>Volume: <a href=\"/volume/" + String(volume-1) + "\"><button class=\"button2\">&minus;</button></a> " + String(volume) + " <a href=\"/volume/" + String(volume+1) + "\"><button class=\"button2\">&plus;</button></a></p>");
             client.println("<p><a href=\"/bell/on\"><button class=\"button\">Klingeln</button></a></p>");
             client.println("</body></html>");
             
