diff --git a/ajax/networking/wifi_stations.php b/ajax/networking/wifi_stations.php index 37d662ff..aca5bc89 100644 --- a/ajax/networking/wifi_stations.php +++ b/ajax/networking/wifi_stations.php @@ -15,4 +15,8 @@ nearbyWifiStations($networks, !isset($_REQUEST["refresh"])); connectedWifiStations($networks); sortNetworksByRSSI($networks); -echo renderTemplate('wifi_stations', compact('networks'), true); +$connected = array_filter($networks, function($n) { return $n['connected']; } ); +$known = array_filter($networks, function($n) { return !$n['connected'] && $n['configured']; } ); +$nearby = array_filter($networks, function($n) { return !$n['configured']; } ); + +echo renderTemplate('wifi_stations', compact('networks', 'connected', 'known', 'nearby'), true); diff --git a/app/css/custom.php b/app/css/custom.php index 273a9629..dd8c31da 100644 --- a/app/css/custom.php +++ b/app/css/custom.php @@ -16,6 +16,10 @@ body { color: #212529; } +.h-underlined { + border-bottom: 1px solid #343434; +} + .page-header { margin: 20px 0 20px; } @@ -32,7 +36,6 @@ body { .row { margin-left: 0rem; margin-right: 0rem; } .col-lg-12 { padding-right: 0.25rem; padding-left: 0.25rem; } .form-group.col-md-6 { margin-left: -0.5rem; } - .js-wifi-stations { margin-left: -0.5rem; margin-right: -0.5rem; } h4.mt-3 { margin-left: 0.5rem; } } @@ -141,6 +144,7 @@ i.fa.fa-bars:hover{ .service-status { border-width: 0; + align-items: center; } .service-status-up { @@ -190,8 +194,12 @@ pre.unstyled { width: 100%; } -.js-reload-wifi-stations { - min-width: 10rem; +@media (min-width: 576px) { + .card-grid { + display: grid; + grid-template-columns: minmax(0, 1fr) 50%; + grid-gap: 1rem; + } } .sidebar.toggled .nav-item .nav-link span { diff --git a/app/css/hackernews.css b/app/css/hackernews.css index 6d065e80..50e203cb 100644 --- a/app/css/hackernews.css +++ b/app/css/hackernews.css @@ -8,7 +8,6 @@ License: GNU General Public License v3.0 html * { font-family: Verdana, Geneva, sans-serif; - font-size: 0.9rem; color: #828282; } @@ -34,6 +33,10 @@ h5.card-title { color: #212529; } +.h-underlined { + border-bottom: 1px solid #343434; +} + .card, .modal-dialog { border-radius: 1px; border-color: #ff6600; @@ -112,7 +115,6 @@ ul.nav-tabs, .nav-tabs .nav-link { .row { margin-left: 0rem; margin-right: 0rem; } .col-lg-12 { padding-right: 0.25rem; padding-left: 0.25rem; } .form-group.col-md-6 { margin-left: -0.5rem; } - .js-wifi-stations { margin-left: -0.5rem; margin-right: -0.5rem; } h4.mt-3 { margin-left: 0.5rem; } } @@ -176,6 +178,7 @@ ul.nav-tabs, .nav-tabs .nav-link { .service-status { border-width: 0; + align-items: center; } .service-status-up { @@ -223,8 +226,12 @@ pre.unstyled { width: 100%; } -.js-reload-wifi-stations { - min-width: 10rem; +@media (min-width: 576px) { + .card-grid { + display: grid; + grid-template-columns: minmax(0, 1fr) 50%; + grid-gap: 1rem; + } } .sidebar.toggled .nav-item .nav-link { diff --git a/app/css/lightsout.css b/app/css/lightsout.css index 92123da4..d1e14f3e 100644 --- a/app/css/lightsout.css +++ b/app/css/lightsout.css @@ -8,7 +8,6 @@ License: GNU General Public License v3.0 html * { font-family: Helvetica,Arial,sans-serif; - font-size: 1.0rem; color: #afafaf; } @@ -24,6 +23,10 @@ h5.card-title { font-size: 1.2rem; } +.h-underlined { + border-bottom: 1px solid #343434; +} + .page-header { padding: 0 20px; border-left: .01rem solid #d2d2d2; @@ -54,7 +57,6 @@ h5.card-title { .row { margin-left: 0rem; margin-right: 0rem; } .col-lg-12 { padding-right: 0.25rem; padding-left: 0.25rem; } .form-group.col-md-6 { margin-left: -0.5rem; } - .js-wifi-stations { margin-left: -0.5rem; margin-right: -0.5rem; } h4.mt-3 { margin-left: 0.5rem; } } @@ -375,11 +377,6 @@ tspan, rect { fill: #d2d2d2; } -span.text.service-status { - font-size: 0.75rem; - margin-top: 0.2rem; -} - .text-muted { font-size: 0.8rem; } @@ -388,6 +385,10 @@ span.text.service-status { font-size: 0.5rem; } +.service-status { + align-items: center; +} + .service-status-up { color: #a1ec38 !important; } @@ -427,6 +428,14 @@ pre { width: 100%; } +@media (min-width: 576px) { + .card-grid { + display: grid; + grid-template-columns: minmax(0, 1fr) 50%; + grid-gap: 1rem; + } +} + .toggle-off.btn { padding-left: 1.2rem; font-size: 0.9rem!important; diff --git a/includes/configure_client.php b/includes/configure_client.php index 30e048ac..540f0fef 100755 --- a/includes/configure_client.php +++ b/includes/configure_client.php @@ -98,10 +98,6 @@ function DisplayWPAConfig() } } - nearbyWifiStations($networks); - connectedWifiStations($networks); - sortNetworksByRSSI($networks); - $clientInterface = $_SESSION['wifi_client_interface']; exec('ip a show '.$clientInterface, $stdoutIp); diff --git a/includes/wifi_functions.php b/includes/wifi_functions.php index 411c1cff..b7b543df 100755 --- a/includes/wifi_functions.php +++ b/includes/wifi_functions.php @@ -18,6 +18,7 @@ function knownWifiStations(&$networks) switch (strtolower($lineArr[0])) { case 'ssid': $ssid = trim($lineArr[1], '"'); + $network['ssid'] = $ssid; break; case 'psk': if (array_key_exists('passphrase', $network)) { @@ -83,6 +84,8 @@ function nearbyWifiStations(&$networks, $cached = true) continue; } + $networks[$ssid]['ssid'] = $ssid; + // If network is saved if (array_key_exists($ssid, $networks)) { $networks[$ssid]['visible'] = true; diff --git a/templates/configure_client.php b/templates/configure_client.php index 21a23a75..aeca17bd 100755 --- a/templates/configure_client.php +++ b/templates/configure_client.php @@ -2,7 +2,7 @@
-
+
@@ -16,19 +16,23 @@
showMessages(); ?> -
+
-

+

-
- +
+ +
+
+
+
+
+ + + +
-
- - - -
Note: WEP access points appear as 'Open'. RaspAP does not currently support connecting to WEP"); ?>
diff --git a/templates/wifi_stations.php b/templates/wifi_stations.php index f12c9f54..6949a51a 100755 --- a/templates/wifi_stations.php +++ b/templates/wifi_stations.php @@ -1,4 +1,4 @@ - +

@@ -12,103 +12,36 @@
- + + -
- $network) : ?> -
-
-
- - -
-
-
- - - - - - - -
+ +

+
+ + + + +
+ -
-
- - - - X - -
- -
-
- = -200) { - echo htmlspecialchars($network['RSSI'], ENT_QUOTES); - echo "dB ("; - if ($network['RSSI'] >= -50) { - echo 100; - } elseif ($network['RSSI'] <= -100) { - echo 0; - } else { - echo 2*($network['RSSI'] + 100); - } - echo "%)"; - } else { - echo " not found "; - } - ?> -
- - - - - - -
-
- -
-
-
- - - - -
- -
- -
-
- -
- - " id="update" name="update" data-toggle="modal" data-target="#configureClientModal" /> - - - " id="update" name="update" data-toggle="modal" data-target="#configureClientModal" /> - - " name="delete" data-toggle="modal" data-target="#configureClientModal" /> -
-
-
-
- - -
+ +

+
+ + + + +
+ + +

+
+ + + + +
+ diff --git a/templates/wifi_stations/network.php b/templates/wifi_stations/network.php new file mode 100644 index 00000000..e0a9684c --- /dev/null +++ b/templates/wifi_stations/network.php @@ -0,0 +1,83 @@ +
+
+ + +
+ +
+
+ + + + + + + +
+ +
+
+ + + + X + +
+ +
+
+ = -200) { + echo htmlspecialchars($network['RSSI'], ENT_QUOTES); + echo "dB ("; + if ($network['RSSI'] >= -50) { + echo 100; + } elseif ($network['RSSI'] <= -100) { + echo 0; + } else { + echo 2*($network['RSSI'] + 100); + } + echo "%)"; + } else { + echo " not found "; + } + ?> +
+ + + + + + +
+
+ +
+
+
+ + + + +
+ +
+ +
+
+ +
+ + " id="update" name="update" data-toggle="modal" data-target="#configureClientModal" /> + + + " id="update" name="update" data-toggle="modal" data-target="#configureClientModal" /> + + " name="delete" data-toggle="modal" data-target="#configureClientModal" /> +
+
+