[PATCH 1/1] Use pure.css for SSL WebUI
delphiN
lists at wunschik.net
So Feb 14 20:29:24 CET 2016
-----BEGIN PGP SIGNED MESSAGE-----
Hash: SHA1
Hi Dominik.
Was ist eigentlich aus diesen Patches geworden? Sind die einfach unter
gegangen? Mir ist gerade aufgefallen, das das Web-Interface ja immer
noch echt bescheiden aussieht.
delphiN
Am 28.01.2016 17:09, schrieb Dominik Heidler:
> Signed-off-by: Dominik Heidler <dominik at heidler.eu> ---
> .../fff/fff-web/files/www/public/cgi-bin/status | 2 +-
> .../fff/fff-web/files/www/public/css/style.css | 38 +++-
> .../fff/fff-web/files/www/ssl/cgi-bin/home | 1 +
> src/packages/fff/fff-web/files/www/ssl/css | 1 +
> src/packages/fff/fff-web/files/www/ssl/home.html | 62 +++---
> src/packages/fff/fff-web/files/www/ssl/home.js | 4 +
> src/packages/fff/fff-web/files/www/ssl/index.html | 27 ++-
> .../fff/fff-web/files/www/ssl/password.html | 17 +-
> .../fff/fff-web/files/www/ssl/settings.html | 13 +-
> src/packages/fff/fff-web/files/www/ssl/settings.js | 20 +-
> src/packages/fff/fff-web/files/www/ssl/shared.js | 50 +++--
> src/packages/fff/fff-web/files/www/ssl/style.css | 226
> --------------------- .../fff/fff-web/files/www/ssl/upgrade.html
> | 15 +- .../fff/fff-web/files/www/ssl/wifiscan.html | 11
> +- src/packages/fff/fff-web/files/www/ssl/wifiscan.js | 2 +- 15
> files changed, 168 insertions(+), 321 deletions(-) create mode
> 120000 src/packages/fff/fff-web/files/www/ssl/css delete mode
> 100644 src/packages/fff/fff-web/files/www/ssl/style.css
>
> diff --git
> a/src/packages/fff/fff-web/files/www/public/cgi-bin/status
> b/src/packages/fff/fff-web/files/www/public/cgi-bin/status index
> fa837af..087a318 100755 ---
> a/src/packages/fff/fff-web/files/www/public/cgi-bin/status +++
> b/src/packages/fff/fff-web/files/www/public/cgi-bin/status @@ -39,7
> +39,7 @@ if [ -n "$position_comment" ]; then echo " <li><a
> href='#'>${position_comment}</a></li>" fi %> - <li><form
> action="https://<% echo -n "$HTTP_HOST" %>"><button type="submit"
> class="pure-button">Login</button></form></li> + <li><form
> action="https://<% echo -n "$HTTP_HOST" %>"><button type="submit"
> class="pure-button pure-button-primary">Login</button></form></li>
> </ul> </div> </div> diff --git
> a/src/packages/fff/fff-web/files/www/public/css/style.css
> b/src/packages/fff/fff-web/files/www/public/css/style.css index
> a194087..2b4f818 100644 ---
> a/src/packages/fff/fff-web/files/www/public/css/style.css +++
> b/src/packages/fff/fff-web/files/www/public/css/style.css @@ -26,9
> +26,6 @@ label { }
>
> .pure-button { - background-color: #1f8dd6; - color: white; -
> padding: 0.5em 2em; border-radius: 5px; }
>
> @@ -63,12 +60,15 @@ a.pure-button-primary { color: #6FBEF3; }
>
> -.home-menu li a:hover, -.home-menu li a:focus { +.home-menu li
> a:hover { background: none; color: #AECFE5; }
>
> +.home-menu li a:focus { + background: none; +} + .home-menu {
> text-align: left; } @@ -76,3 +76,31 @@ a.pure-button-primary {
> .home-menu ul { float: right; } + +li { list-style-type: none; } +
> +.pure-form-aligned div.pure-control-group > label { + width:
> 11.5em; +} + +fieldset > legend { + font-weight: bold; +} + +span >
> label { + width: auto !important; + margin: 0 1em 0 3px
> !important; +} + +.formtable th { + padding-right: 5px; +
> text-align: right; + vertical-align: top; + color: #34495e; +
> font-weight: normal; +} + +.formtable ul { + margin: 0; + padding:
> 0; +} diff --git
> a/src/packages/fff/fff-web/files/www/ssl/cgi-bin/home
> b/src/packages/fff/fff-web/files/www/ssl/cgi-bin/home index
> 7b04b05..b696fb2 100755 ---
> a/src/packages/fff/fff-web/files/www/ssl/cgi-bin/home +++
> b/src/packages/fff/fff-web/files/www/ssl/cgi-bin/home @@ -43,6
> +43,7 @@ print 'date' "$(date)"
>
> if [ $(sockread /var/run/fastd.status < /dev/null 2> /dev/null |
> grep -c '"connection": {') -gt 0 ]; then print 'has_vpn' 'Ja' +
> printList 'fastd_peer' "$(cd /etc/fastd/fff/peers/; ls)" else print
> 'has_vpn' 'Nein' fi diff --git
> a/src/packages/fff/fff-web/files/www/ssl/css
> b/src/packages/fff/fff-web/files/www/ssl/css new file mode 120000
> index 0000000..0a52d25 --- /dev/null +++
> b/src/packages/fff/fff-web/files/www/ssl/css @@ -0,0 +1 @@
> +../public/css \ No newline at end of file diff --git
> a/src/packages/fff/fff-web/files/www/ssl/home.html
> b/src/packages/fff/fff-web/files/www/ssl/home.html index
> 3cb0583..023c33f 100644 ---
> a/src/packages/fff/fff-web/files/www/ssl/home.html +++
> b/src/packages/fff/fff-web/files/www/ssl/home.html @@ -4,51 +4,63
> @@ <head> <title>Home</title> <meta charset="utf-8"/> -<link
> rel="stylesheet" type="text/css" href="style.css" /> <script
> src="shared.js"></script> <script src="home.js"></script> </head>
> <body onload="init();">
>
> +<div class="content"> +<div class="pure-form pure-form-aligned">
> <fieldset> <legend id="system">System</legend> -<div><label>Name:
> </label><span id="name">?</span></div> -<div><label>Modell:
> </label><span id="model">?</span></div> -<div><label>MAC-Adresse:
> </label><span id="mac">?</span></div> -<div><label>Bekannte Knoten:
> </label><span id="node_count">?</span></div>
> -<div><label>Nachbarknoten: </label><span
> id="neigh_count">?</span></div> -<div><label>VPN aktiv:
> </label><span id="has_vpn">?</span></div> -<div><label>Laufzeit:
> </label><span id="uptime">?</span></div> -<div><label>Auslastung:
> </label><span id="load">?</span></div> -<div><label>System:
> </label><span id="uname">?</span></div> -<div><label>Uhrzeit:
> </label><span id="date">?</span></div> +<table class="formtable">
> +<tr><th>Name:</th><td id="name">?</td></tr>
> +<tr><th>Modell:</th><td id="model">?</td></tr>
> +<tr><th>MAC-Adresse:</th><td id="mac">?</td></tr>
> +<tr><th>Bekannte Knoten:</th><td id="node_count">?</td></tr>
> +<tr><th>Nachbarknoten:</th><td id="neigh_count">?</td></tr>
> +<tr><th>VPN aktiv:</th><td id="has_vpn">?</td></tr>
> +<tr><th>Laufzeit:</th><td id="uptime">?</td></tr>
> +<tr><th>Auslastung:</th><td id="load">?</td></tr>
> +<tr><th>System:</th><td id="uname">?</td></tr>
> +<tr><th>Uhrzeit:</th><td id="date">?</td></tr> +<tr><th>VPN
> Gateways:</th><td id="fastd_peer">keine</td></tr> +</table>
> </fieldset>
>
> <fieldset> <legend id="freifunk">Netz: Freifunk</legend>
> -<div><label>Nutzer: </label><span
> id="freifunk_user_count">?</span></div> -<div><label>Empfangen:
> </label><span id="freifunk_rx_bytes">?</span> </div>
> -<div><label>Gesendet: </label><span
> id="freifunk_tx_bytes">?</span></div> -<div><label>IPv4 Adressen:
> </label><span id="freifunk_addr4">?</span></div> -<div><label>IPv6
> Adressen: </label><span id="freifunk_addr6">?</span></div> +<table
> class="formtable"> +<tr><th>Nutzer:</th><td
> id="freifunk_user_count">?</td></tr> +<tr><th>Empfangen:</th><td
> id="freifunk_rx_bytes">?</td></tr> +<tr><th>Gesendet:</th><td
> id="freifunk_tx_bytes">?</td></tr> +<tr><th>IPv4 Adressen:</th><td
> id="freifunk_addr4">?</td></tr> +<tr><th>IPv6 Adressen:</th><td
> id="freifunk_addr6">?</td></tr> +</table> </fieldset>
>
> <fieldset> <legend id="wan">Netz: WAN</legend>
> -<div><label>Internet Vorhanden: </label><span
> id="has_internet">?</span></div> -<div><label>Empfangen:
> </label><span id="wan_rx_bytes">?</span> </div>
> -<div><label>Gesendet: </label><span
> id="wan_tx_bytes">?</span></div> -<div><label>IPv4 Adressen:
> </label><span id="wan_addr4">?</span></div> -<div><label>IPv6
> Adressen: </label><span id="wan_addr6">?</span></div> +<table
> class="formtable"> +<tr><th>Internet vorhanden:</th><td
> id="has_internet">?</td></tr> +<tr><th>Empfangen:</th><td
> id="wan_rx_bytes">?</td></tr> +<tr><th>Gesendet:</th><td
> id="wan_tx_bytes">?</td></tr> +<tr><th>IPv4 Adressen:</th><td
> id="wan_addr4">?</td></tr> +<tr><th>IPv6 Adressen:</th><td
> id="wan_addr6">?</td></tr> +</table> </fieldset>
>
> <fieldset> <legend id="software">Software</legend>
> -<div><label>Firmware Version: </label><span
> id="firmware_version">?</span></div> -<div><label>OpenWrt Version:
> </label><span id="openwrt_version">?</span></div>
> -<div><label>Batman-Adv Version: </label><span
> id="batman_version">?</span></div> -<div><label>Fastd Version:
> </label><span id="fastd_version">?</span></div> +<table
> class="formtable"> +<tr><th>Firmware Version:</th><td
> id="firmware_version">?</td></tr> +<tr><th>OpenWrt Version:</th><td
> id="openwrt_version">?</td></tr> +<tr><th>Batman-Adv
> Version:</th><td id="batman_version">?</td></tr> +<tr><th>Fastd
> Version:</th><td id="fastd_version">?</td></tr> +</table>
> </fieldset> +</div> +</div>
>
> </body> </html> diff --git
> a/src/packages/fff/fff-web/files/www/ssl/home.js
> b/src/packages/fff/fff-web/files/www/ssl/home.js index
> da12f32..289c746 100644 ---
> a/src/packages/fff/fff-web/files/www/ssl/home.js +++
> b/src/packages/fff/fff-web/files/www/ssl/home.js @@ -23,6 +23,10 @@
> function init() { continue; }
>
> + if (key == 'name') { +
> document.getElementsByTagName("title")[0].innerHTML = "FFF Router
> :: " + value; + } + //for traffic if(/_bytes$/.test(key)) { value
> = formatSize(value); diff --git
> a/src/packages/fff/fff-web/files/www/ssl/index.html
> b/src/packages/fff/fff-web/files/www/ssl/index.html index
> cc6cff7..ab5c91e 100644 ---
> a/src/packages/fff/fff-web/files/www/ssl/index.html +++
> b/src/packages/fff/fff-web/files/www/ssl/index.html @@ -2,9 +2,12
> @@
>
> <html> <head> -<title>Freifunk</title> +<title>FFF Router</title>
> <meta charset="utf-8"/> -<link rel="stylesheet" type="text/css"
> href="style.css" /> +<link rel="stylesheet"
> href="/css/pure-min.css"> +<link rel="stylesheet"
> href="/css/side-menu.css"> +<link rel="stylesheet"
> href="/css/grids-responsive-min.css"> +<link rel="stylesheet"
> href="/css/style.css"> <script src="shared.js"></script>
>
> <script type="text/javascript"> @@ -28,6 +31,7 @@ function
> adv_toggle(e) adv_mode = !adv_mode; e.innerHTML = adv_mode ?
> "Erweitert: An" : "Erweitert: Aus"; adv_apply(); +
> document.activeElement.blur(); }
>
> function nav_onclick() @@ -70,8 +74,9 @@ function nav_onclick()
> onParents(this, 'UL', function(n) { show(n); });
> onChilds(this.parentNode, 'UL', function(n) { show(n); });
>
> - onDesc($("globalnav"), 'A', function(n) { removeClass(n, "here");
> }); - onParents(this, 'LI', function(n) { addClass(n.firstChild,
> "here"); }); + onDesc($("globalnav"), 'LI', function(n) {
> removeClass(n, "pure-menu-selected"); }); + onParents(this, 'LI',
> function(n) { addClass(n, "pure-menu-selected"); }); +
> document.activeElement.blur();
>
> return false; } @@ -86,6 +91,7 @@ function preselect() { }
>
> function reboot() { + document.activeElement.blur();
> if(!confirm("Neustart durchf\xFChren?")) return;
> send("/cgi-bin/misc", { func : "reboot" }, function(data) {
> setText('msg', data); @@ -99,7 +105,9 @@ function logout() {
>
> </head> <body onload="preselect();"> - +<div class="header"> +<div
> class="home-menu pure-menu pure-menu-open pure-menu-horizontal
> pure-menu-fixed"> +<a class="pure-menu-heading"
> href="http://www.freifunk-franken.de">freifunk-franken.de</a> <ul
> id="globalnav"> <li><a href="home.html" id="first">Home</a></li>
> <li><a href="settings.html">Einstellungen</a></li> @@ -107,13
> +115,14 @@ function logout() { <li><a
> href="upgrade.html">Upgrade</a></li> <li><a
> href="password.html">Password</a></li> <li><a href="#"
> onclick="reboot()">Neustart</a></li> - <li><a href="#"
> onclick="logout()">Logout</a></li> <li><a href="#"
> onclick="adv_toggle(this)">Erweitert: Aus</a></li> + <li><button
> class="pure-button pure-button-primary"
> onclick="logout()">Logout</button></li> </ul> -<br> -<pre id="msg"
> tabindex="-1"></pre> +</div> +</div>
>
> -<div id="help"></div> +<br> +<div class="content"
> style="margin-bottom: 0;"><pre id="msg" tabindex="-1"></pre></div>
>
> <div id="body"></div>
>
> diff --git a/src/packages/fff/fff-web/files/www/ssl/password.html
> b/src/packages/fff/fff-web/files/www/ssl/password.html index
> 08f10b4..f33cf26 100644 ---
> a/src/packages/fff/fff-web/files/www/ssl/password.html +++
> b/src/packages/fff/fff-web/files/www/ssl/password.html @@ -4,24
> +4,27 @@ <head> <title>Password</title> <meta charset="utf-8"/>
> -<link rel="stylesheet" type="text/css" href="style.css" /> <script
> src="shared.js"></script> <script src="password.js"></script>
> </head> <body onload="init();">
>
> +<div class="content"> +<form class="pure-form pure-form-aligned">
> <fieldset> <legend>Passwort</legend> - <div> - <label>Neues
> Password:</label> <input id="p1" type="password"> + <div
> class="pure-control-group"> + <label>Neues Password:</label><input
> id="p1" type="password"> </div> - <div> -
> <label>Bestätigung:</label> <input id="p2" type="password"> + <div
> class="pure-control-group"> +
> <label>Bestätigung:</label><input id="p2" type="password">
> </div> - <div><br />Das Passwort ist für den Zugriff auf die
> Weboberfläche des Routers und auch den Zugriff per SSH. Der
> Benutzername ist 'root'.</div> + <div>Das Passwort ist für den
> Zugriff auf die Weboberfläche des Routers und auch den Zugriff
> per SSH.<br />Der Benutzername ist 'root'.</div> </fieldset> <div>
> - <button type="button" onclick="apply()">Ändern</button> +
> <button type="button" class="pure-button pure-button-primary"
> onclick="apply()">Ändern</button> +</div> +</form> </div>
>
> </body> diff --git
> a/src/packages/fff/fff-web/files/www/ssl/settings.html
> b/src/packages/fff/fff-web/files/www/ssl/settings.html index
> eb081a2..1176d8f 100644 ---
> a/src/packages/fff/fff-web/files/www/ssl/settings.html +++
> b/src/packages/fff/fff-web/files/www/ssl/settings.html @@ -4,23
> +4,26 @@ <head> <title>Einstellungen</title> <meta
> charset="utf-8"/> -<link rel="stylesheet" type="text/css"
> href="style.css" /> <script src="shared.js"></script> <script
> src="settings.js"></script> </head> <body onload="init();">
>
> +<div class="content"> +<form class="pure-form pure-form-aligned"
> onsubmit="save_data(); return false;"> <fieldset>
> <legend>Allgemeine Einstellungen</legend> - <span
> id="general"></span> + <div id="general"></div> </fieldset>
> <fieldset> <legend>Bandbreitenkontrolle</legend> - <span
> id="traffic"></span> - <div><br />Die für das Freifunknetz
> beanspruchte Internet-Bandbreite am WAN kann hier begrenzt
> werden.</div> + <div id="traffic"></div> + <div>Die für das
> Freifunknetz beanspruchte Internet-Bandbreite am WAN kann hier
> begrenzt werden.<br /><br /></div> </fieldset>
>
> -<button type="button" onclick="save_data()">Speichern</button>
> +<input type="submit" class="pure-button pure-button-primary"
> value="Speichern" /> +</form> +</div>
>
> </body> </html> diff --git
> a/src/packages/fff/fff-web/files/www/ssl/settings.js
> b/src/packages/fff/fff-web/files/www/ssl/settings.js index
> bf1b878..f2dfc61 100644 ---
> a/src/packages/fff/fff-web/files/www/ssl/settings.js +++
> b/src/packages/fff/fff-web/files/www/ssl/settings.js @@ -53,27
> +53,21 @@ function appendSetting(p, path, value, mode)
> switch(name) { case "latitude": - b = append_input(p,
> "GPS-Koordinaten Latitude", id, value); + b = append_input(p, "GPS
> Breitengrad", id, value); b.lastChild.placeholder = "52.02713078";
> addInputCheck(b.lastChild, /^$|^\d{1,3}\.\d{1,8}$/, "Ung\xfcltige
> Eingabe. Bitte nur maximal 8 Nachkommastellen und keine Kommas
> verwenden."); addHelpText(b, "Die Latitude Koordinate dieses
> Knotens auf der Freifunk-Karte (z.B. \"52.02713078\")."); - var
> map_button = append_button(b, "Position auf Karte anzeigen /
> setzen", function() { - window.open('/map.html', '_blank',
> 'location=0,status=0,scrollbars=1,width=400,height=300') - }); -
> b.style["position"] = "relative"; - map_button.style["position"] =
> "absolute"; - map_button.style["height"] = "44px"; + var
> map_button = append_button(b, "Position auf Karte anzeigen /
> setzen", function() {window.open('/map.html', '_blank',
> 'location=0,status=0,scrollbars=1,width=400,height=300')});
> map_button.style["margin-left"] = "5px"; -
> map_button.style["z-index"] = "-1"; break; case "longitude": - b =
> append_input(p, "GPS-Koordinaten Longitude", id, value); + b =
> append_input(p, "GPS Längengrad", id, value);
> b.lastChild.placeholder = "8.52829987"; addInputCheck(b.lastChild,
> /^$|^\d{1,3}\.\d{1,8}$/, "Ung\xfcltige Eingabe. Bitte nur maximal 8
> Nachkommastellen und keine Kommas verwenden."); addHelpText(b, "Die
> Longitude Koordinate dieses Knotens auf der Freifunk-Karte (z.B.
> \"8.52829987\")."); break; case "position_comment": - b =
> append_input(p, "Standort Beschreibung", id, value); + b =
> append_input(p, "Standortbeschreibung", id, value);
> b.lastChild.placeholder = "Am Antennenmast";
> addInputCheck(b.lastChild, /^$|^[\-\^'\w\.\:\[\]\(\)\/
> &@\+\u0080-\u00FF]{0,255}$/, "Ung\xfcltige Eingabe.");
> addHelpText(b, "Eine genauere Beschreibung zum Standort"); @@ -83,9
> +77,10 @@ function appendSetting(p, path, value, mode)
> b.lastChild.placeholder = "MeinRouter"; addInputCheck(b.lastChild,
> /^$|^[\-\^'\w\.\:\[\]\(\)\/ &@\+\u0080-\u00FF]{0,32}$/,
> "Ung\xfcltige Eingabe."); addHelpText(b, "Der Name dieses Knotens
> auf der Freifunk-Karte."); +
> document.getElementsByTagName("title")[0].innerHTML = "FFF Router
> :: " + value; break; case "description": - b = append_input(p,
> "Knotenbeschreibung", id, value); + b = append_textarea(p,
> "Knotenbeschreibung", id, value); b.lastChild.placeholder = "In
> einer grauen Kiste versteckt"; addInputCheck(b.lastChild,
> /^$|^[\-\^'\w\.\:\[\]\(\)\/ &@\+\u0080-\u00FF]{0,255}$/,
> "Ung\xfcltige Eingabe."); addHelpText(b, "Beschreibung dieses
> Knotens."); @@ -98,7 +93,7 @@ function appendSetting(p, path,
> value, mode) break; case "enabled": if(cfg == "simple-tc") { - b
> = append_radio(p, "Bandbreitenkontrolle", id, value, [["An", "1"],
> ["Aus", "0"]]); + b = append_radio(p, "Bandbreitenkontrolle", id,
> value, [["An", "1"], ["Aus", "0"]], true); addHelpText(b,
> "Bandbreitenkontrolle f\xfcr den Upload-/Download \xfcber das
> Freifunknetz \xfcber den eigenen Internetanschluss."); } break; @@
> -117,6 +112,7 @@ function appendSetting(p, path, value, mode) }
>
> b.id = id; //needed for updateFrom + addClass(b,
> "pure-control-group"); b.onchange = function() { updateFrom(b); };
> diff --git a/src/packages/fff/fff-web/files/www/ssl/shared.js
> b/src/packages/fff/fff-web/files/www/ssl/shared.js index
> 1c4c0e0..e652595 100644 ---
> a/src/packages/fff/fff-web/files/www/ssl/shared.js +++
> b/src/packages/fff/fff-web/files/www/ssl/shared.js @@ -53,21 +53,7
> @@ function replaceItem(str, old_item, new_item) }
>
> function addHelpText(elem, text) { - var help = $("help"); - -
> if(help) { - elem.onmouseover = function(e) { - help.style.top =
> (e.clientY-20)+"px"; - help.style.left = (e.clientX+80)+"px"; -
> help.innerHTML = text; - show(help); - }; - - elem.onmouseout =
> function() { - help.innerHTML = ""; - hide(help); - }; - } +
> elem.title = text; }
>
> //to config file syntax @@ -261,6 +247,8 @@ function
> collect_inputs(p, obj) { if(p.tagName == "SELECT") obj[p.name] =
> p.value; + if(p.tagName == "TEXTAREA") + obj[p.name] = p.value;
> if(p.tagName == "INPUT") if(p.type == "text" || p.type ==
> "password" || (p.type == "radio" && p.checked)) obj[p.name] =
> p.value @@ -296,6 +284,7 @@ function append_section(parent, title,
> id) function append_button(parent, text, onclick) { var button =
> append(parent, 'button'); + addClass(button, "pure-button");
> button.type = 'button'; button.innerHTML = text; button.onclick =
> onclick; @@ -370,6 +359,27 @@ function append_input(parent, title,
> name, value) input.value = (typeof value == "undefined") ? "" :
> value; input.name = name; input.type = "text"; + addClass(input,
> "pure-input-1-3"); + + div.appendChild(label); +
> div.appendChild(input); + + return div; +} + +//append a textarea
> field +//e.g. append_input(parent, "Name", "name_string",
> "MyName") +function append_textarea(parent, title, name, value) +{
> + var div = append(parent, 'div'); + var label = create('label'); +
> var input = create('textarea'); + + label.innerHTML = title + ":";
> + input.value = (typeof value == "undefined") ? "" : value; +
> input.name = name; + input.type = "text"; + addClass(input,
> "pure-input-1-3");
>
> div.appendChild(label); div.appendChild(input); @@ -378,9 +388,9 @@
> function append_input(parent, title, name, value) }
>
> //append a radio field -//e.g. append_radio(parent, "Enabled",
> "enabled", 0, [["Yes", 1], ["No", 0]) -function
> append_radio(parent, title, name, selected, choices) { - return
> _selection("radio", parent, title, name, [selected], choices);
> +//e.g. append_radio(parent, "Enabled", "enabled", 0, [["Yes", 1],
> ["No", 0], true) +function append_radio(parent, title, name,
> selected, choices, inline) { + return _selection("radio", parent,
> title, name, [selected], choices, inline); }
>
> //append a checkbox field @@ -389,7 +399,7 @@ function
> append_check(parent, title, name, selected, choices) { return
> _selection("checkbox", parent, title, name, selected, choices); }
>
> -function _selection(type, parent, title, name, selected, choices)
> +function _selection(type, parent, title, name, selected, choices,
> inline) { var p = append(parent, 'div'); var label = append(p,
> 'label'); @@ -405,7 +415,7 @@ function _selection(type, parent,
> title, name, selected, choices) var choice_value = "" + (s ?
> choices[i] : choices[i][1]); var choice_help = s ? undefined :
> choices[i][2];
>
> - var div = append(span, 'div'); + var div = append(span,
> (inline)?'span':'div'); var input = append(div, 'input'); var label
> = append(div, 'label');
>
> diff --git a/src/packages/fff/fff-web/files/www/ssl/style.css
> b/src/packages/fff/fff-web/files/www/ssl/style.css deleted file
> mode 100644 index 61fc3f0..0000000 ---
> a/src/packages/fff/fff-web/files/www/ssl/style.css +++ /dev/null @@
> -1,226 +0,0 @@ - -/* common */ - -* { margin:0; padding:0; } - -a {
> text-decoration: none; } - -li { list-style-type: none; } - -html
> { - font: 90%/1.3 arial,sans-serif; - padding:1em; -
> background:#fafafa; -} - -body { - font: normal 16px
> verdana,arial,'Bitstream Vera Sans',helvetica,sans-serif; -} - -
> -/* specific */ - -.mac { - color: #0033CC; - cursor: help; -} -
> -#nds_files label { - width: 18em; -} - -#nds_macs { -
> margin-bottom: 2em; -} - -#wifiscan table { - text-align: center;
> -} - -#wifiscan td:nth-of-type(1) { - text-align: left; -} - -#help
> { - padding: 5px; - height: 0px; - position: absolute; -
> min-height: 50px; - background-color: #f2f2f2; - display:none; -
> border: 2px dotted grey; -} - -#switches label { - width: 6em; -}
> - -/* forms */ - -legend { - color: #0b77b7; - font-size: 1.2em;
> -} - -label { - float: left; - width: 12em; - text-align: right; -
> margin-right: 1em; - white-space: nowrap; -} - -fieldset { -
> border: 1px solid #ddd; - padding: 0.5em; - margin: 0.5em; - width:
> 36em; -} - -fieldset fieldset { - width: auto; -} - -fieldset > *
> { - margin: 0.3em 0; - clear: both; -} - -fieldset div > * { -
> display: inline-block; - vertical-align: middle; -} - -input { -
> padding: 0.15em; - width: 15em; - border: 1px solid #ddd; -
> background: #fafafa; - font: bold 0.95em arial, sans-serif; -
> -moz-border-radius: 0.4em; - -khtml-border-radius: 0.4em; -} -
> -input:hover, input:focus { - border-color: #c5c5c5; - background:
> #f6f6f6; -} - -select { - min-width: 4em; -} - -option { -
> padding-right: 1em; -} - -.radio_option div { - float: left; -
> white-space: nowrap; - clear: none; -} - -.radio_option div label,
> .radio_option div input { - vertical-align: middle; - display:
> inline; - float: none; - width: auto; - background: none; - border:
> none; -} - -.select_option label { - font-size: 1em; - color:
> #000; -} - -.list_option div { - clear: left; - margin: 0; -
> padding: 0; - float: left; - list-style: none; -} - - -/*
> navigation */ - -#globalnav { - position: relative; - float: auto;
> - width: 98%; - padding: 0 0 1.75em 1em; - margin: 0; -
> margin-bottom: 2%; - list-style: none; - line-height: 1em; -} -
> -#globalnav li { - float: left; - margin: 0; - padding: 0; -} -
> -#globalnav a { - display: block; - color: #444; - text-decoration:
> none; - font-weight: bold; - background: #ddd; - margin: 0; -
> padding: 0.25em 1em; - border-left: 1px solid #fff; - border-top:
> 1px solid #fff; - border-right: 1px solid #aaa; -} - -#globalnav
> a:hover, -#globalnav a:active, -#globalnav a.here:link, -#globalnav
> a.here:visited { - background: #bbb; -} - -#globalnav a.here:link,
> -#globalnav a.here:visited { - position: relative; - z-index: 102;
> -} - -/* sub-navigation */ - -#globalnav ul { - position:
> absolute; - left: 0; - top: 1.5em; - float: left; - background:
> #bbb; - width: 100%; - margin: 0; - padding: 0.25em 0.25em 0.25em
> 1em; - list-style: none; - border-top: 1px solid #fff; -} -
> -#globalnav ul li { - float: left; - display: block; - margin-top:
> 1px; -} - -#globalnav ul a { - background: #bbb; - color: #fff; -
> display: inline; - margin: 0; - padding: 0 1em; - border: 0; -} -
> -#globalnav ul a:hover, -#globalnav ul a:active, -#globalnav ul
> a.here:link, -#globalnav ul a.here:visited { - color: #444; -} diff
> --git a/src/packages/fff/fff-web/files/www/ssl/upgrade.html
> b/src/packages/fff/fff-web/files/www/ssl/upgrade.html index
> 41d4543..42e57cd 100644 ---
> a/src/packages/fff/fff-web/files/www/ssl/upgrade.html +++
> b/src/packages/fff/fff-web/files/www/ssl/upgrade.html @@ -4,18
> +4,19 @@ <head> <title>Upgrade</title> <meta charset="utf-8"/>
> -<link rel="stylesheet" type="text/css" href="style.css" /> <script
> src="shared.js"></script> <script src="upgrade.js"></script>
> </head> <body onload="init();">
>
> +<div class="content"> +<div class="pure-form pure-form-aligned">
> <fieldset> <legend>Router Zurücksetzen</legend> <div> -
> <button type="button"
> onclick="restore_firmware()">Zurücksetzen</button> + <button
> type="button" class="pure-button pure-button-primary"
> onclick="restore_firmware()">Zurücksetzen</button> </div> -
> <div><br />Alle Einstellungen werden zurückgesetzt und der
> Router startet neu.</div> + <div>Alle Einstellungen werden
> zurückgesetzt und der Router startet neu.</div> </fieldset>
> <fieldset> <legend>Manuelles Update</legend> @@ -25,8 +26,8 @@
> <label> <input type="file" id="import_file" name="firmware"
> onchange="$('selected_image').innerHTML=this.value.replace(/^.*[\\\/](.*)$/,
> '$1');"
> style="visibility:hidden;position:absolute;top:-50;left:-50"/>
> <input type="hidden" name="func" value="apply_firmware" /> -
> <button type="button" onclick="$('import_file').click()">Image
> Auswählen</button> - <button type="submit">Senden</button> +
> <button type="button" class="pure-button"
> onclick="$('import_file').click()">Image Auswählen</button> +
> <button type="submit" class="pure-button
> pure-button-primary">Senden</button> </label> <div> <input
> type="checkbox" name="keep_config" value="yes" /> @@ -34,8 +35,10
> @@ </div> </div> </form> - <div><br />Hier kann ein Freifunk-Image
> verwendet werden (*-sysupgrade.bin) oder die Firmware des
> Routerherstellers.</div> + <div>Hier kann ein Freifunk-Image
> verwendet werden (*-sysupgrade.bin) oder die Firmware des
> Routerherstellers.</div> </fieldset> +</div> +</div>
>
>
> </body> diff --git
> a/src/packages/fff/fff-web/files/www/ssl/wifiscan.html
> b/src/packages/fff/fff-web/files/www/ssl/wifiscan.html index
> 9e58c85..429301e 100644 ---
> a/src/packages/fff/fff-web/files/www/ssl/wifiscan.html +++
> b/src/packages/fff/fff-web/files/www/ssl/wifiscan.html @@ -4,23
> +4,26 @@ <head> <title>Wifiscan</title> <meta charset="utf-8"/>
> -<link rel="stylesheet" type="text/css" href="style.css" /> <script
> src="shared.js"></script> <script src="wifiscan.js"></script>
> </head> <body onload="init();">
>
> +<div class="content"> +<form class="pure-form pure-form-aligned">
> <fieldset id="wifiscan"> <legend>Wifi Scan</legend> <div> <select
> id="wifiscan_selection"></select> - <button type="button"
> onclick="wifi_scan()">Scan starten</button> + <button
> type="button" class="pure-button" onclick="wifi_scan()">Scan
> starten</button> </div> - <table id="wifiscan_table"
> style="display: none"> -
> <tr><th>Name</th><th>Kanal</th><th>Signal</th><th>Typ</th></tr> +
> <table id="wifiscan_table" style="display: none; margin-top: 1em;"
> class="pure-table pure-table-striped"> +
> <thead><tr><th>Name</th><th>Kanal</th><th>Signal</th><th>Typ</th></tr></thead>
>
>
<tbody id="wifiscan_tbody"></tbody>
> </table> </fieldset> +</form> +</div>
>
> </body> </html> diff --git
> a/src/packages/fff/fff-web/files/www/ssl/wifiscan.js
> b/src/packages/fff/fff-web/files/www/ssl/wifiscan.js index
> 3be2591..bf0815c 100644 ---
> a/src/packages/fff/fff-web/files/www/ssl/wifiscan.js +++
> b/src/packages/fff/fff-web/files/www/ssl/wifiscan.js @@ -46,7 +46,7
> @@ function wifi_scan() }
>
> var table = $('wifiscan_table'); - show(table); +
> table.style["display"] = "table"; }); }
>
>
- --
Freifunk-Franken, Förderverein Freie Netzwerke e.V.
eMail: freifunk at wunschik.net
XMPP : delphiN at jabber.ccc.de
-----BEGIN PGP SIGNATURE-----
Version: GnuPG v1.4.14 (GNU/Linux)
iQIcBAEBAgAGBQJWwNWUAAoJEGuH2dOBPapCYDwP+wX6AvACMuAkJtRJy2kUhdnF
uTxwBHPmbMbT8rf/6VPKkHF02lXxQaBsExVRY/sYDTYPIatpdKE2nm7lnLYT1yyw
TTAHPxspxhzTixfrBpokJ2g9ICqAagvVL7b+t0tMg8DnlbMiYvDcv6jqnTCm34KK
+F+zHcNyJ2GWujLvOfRNuyppfH68TuktLPvl8l3IMRLZgzI+xJSPDEiiPGn/yeey
oGZ156N2K8wuVjXqWEgb6SkB9P27Q2c7fOG6EgXZfdNen5s5oa5qZi/XrqsVCvd9
3bqvuRjmw1+KCJaalncTOqGQd8/ZAV89Ie3fAn85WN/1ORFr5hY7226Cli+2AE4G
yygZbNj0Okwc6BQJ3zkrxs4z3InPEvES3gZU4i7QOx5mw9OugAcNG0laYsXzEUnR
hYDnCPnYdB5w4DD1PGagJFcC30EdGZuOpVKnmkkhynM7klcGjuZ+gcQldP9CrDzW
U58FJcuQR12ypjxhUGb90JGBMO6dV7MrSBZYrFoJy7MEZ7btK4Z2xmC0OQCBDNNT
SkYYcW5NGowPmUcA9vsw/ocQbmDVwbFhAHySeuiatdoIzIG+Y83x1XuvyvqvRGoE
3t/Zomj9nrnu6ilUn4GN198Cky7Ea3k/VgKA4mPVlfSHA2P3ZrELowqPC579TwHn
1vf7bGVKuE9rpXpPdkTY
=4PWL
-----END PGP SIGNATURE-----
Mehr Informationen über die Mailingliste franken-dev