From e2423beca3d36f60f71272114c02894f2f5814fa Mon Sep 17 00:00:00 2001 From: tiito78 Date: Wed, 25 Oct 2017 21:24:30 +0200 Subject: [PATCH 1/2] Create application.css New css file for RaspiWiFi - Setup theme --- application.css | 128 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 128 insertions(+) create mode 100644 application.css diff --git a/application.css b/application.css new file mode 100644 index 00000000..f7b374a7 --- /dev/null +++ b/application.css @@ -0,0 +1,128 @@ + /* General + ---------------------------------------------------------*/ + *, :after, :before { + box-sizing: border-box; + } + body{ + background-color: #000; + margin:0; + } + + div#mainContent{ + background-color: #000; + max-width:680px; + width: 100%; + margin: 0 auto; + text-align: center; + font-size: 3.5rem; + color: #fff; + } + + div#mainContent h1 { + margin:0; + } + + div#mainContent ul{ + list-style: none; + margin: 0; + padding: 0; + } + + /* Select + ---------------------------------------------------------*/ + + li label { + display:inline-block; + margin: 0.5em 0; + padding: 0.5em 0; + } + + li.wifiNetwork { + position: relative; + display: inline-block; + margin: 0; + } + + li.wifiNetwork:after { + content: '▼'; + position: absolute; + width: 50px; + color: #deab04; + font-weight: bold; + font-size: 2rem; + right: 10px; + bottom: 50px; + border-radius: 3px; + pointer-events: none; + z-index: 2; + } + + select.wifiNetworkInputs { + position: relative; + max-width:680px; + width: 100vw; + background: #111; + color: #999; + border: none; + outline: none; + font-size: 2.5rem; + padding: 1em; + margin: 0; + border-radius: 3px; + cursor: pointer; + height: auto; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + } + + .wifiNetworkInputs{ + max-width:680px; + width: 100vw; + padding:1em 0; + font-size: .8em; + color: #999; + background: #111; + border:#999 solid 1px; + } + + .wifiConnectButton{ + width: 310px; + height: 150px; + margin:1.5em 0 0 0; + background-color: #deab04; + font-size: 3rem; + color: #fff; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + } + + .reset input { + background:#BF1A2F; + border:#BF1A2F; + color:white; + padding:1em; + margin-top:1.5em; + font-size:1.5rem; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + } + + /* Wifi Icon + ---------------------------------------------------------*/ + + .wifiIcon { + padding: 20px; + } + .wifiIcon, .wifiIcon:before { + display: inline-block; + border: 60px double transparent; + border-top-color: currentColor; + border-radius: 50%; + } + .wifiIcon:before { + content: ''; + width: 0; height: 0; + } From 9ecefcf06e478ae5049fd98bac2c1dc1149cdc27 Mon Sep 17 00:00:00 2001 From: tiito78 Date: Wed, 25 Oct 2017 21:28:16 +0200 Subject: [PATCH 2/2] Create index.html.erb new html fil for RaspiWiFi-Setup theme --- index.html.erb | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) create mode 100644 index.html.erb diff --git a/index.html.erb b/index.html.erb new file mode 100644 index 00000000..0beb67d4 --- /dev/null +++ b/index.html.erb @@ -0,0 +1,30 @@ +
+

WiFi Setup

+
+ <%=form_tag("/main/save_credentials", method: "get") do%> + +
    +
  • <%=label_tag(:ssid, "Select your WiFi network")%>
  • +
  • + +
  • + +
  • <%=label_tag(:wifi_key, "Your Wifi password")%>
  • +
  • + <%=password_field_tag(:wifi_key, nil, class: "wifiNetworkInputs")%> +
  • + + <%=submit_tag("Connect!", class: "wifiConnectButton")%> +
+ + <%end%> +
+ <%=form_tag("/main/reset_all", method: "get") do%> + <%=submit_tag("RESET DEVICE")%> +
+ <%end%> +