espterm
/
espterm-firmware
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

css for Box folding, impl network forget

Browse Source
pull/30/head
Ondřej Hruška 8 years ago
parent 856a694f0b
commit 357a9b6513
7 changed files with 80 additions and 41 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 40
      html_orig/css/app.css
  2. 4
      html_orig/messages/en.php
  3. 29
      html_orig/pages/cfg_wifi.php
  4. 8
      html_orig/sass/app.scss
  5. 20
      html_orig/sass/layout/_box.scss
  6. 13
      html_orig/sass/layout/_content.scss
  7. 7
      html_orig/sass/pages/_wifi.scss

40
html_orig/css/app.css
Unescape View File

@ -449,13 +449,16 @@ a:hover {
font-size: 2.2807em; font-size: 2.2807em;
margin-top: 0; margin-top: 0;
margin-bottom: 1rem; } margin-bottom: 1rem; }
#content h2 {
font-size: 1.42383em;
margin-bottom: 0.61805rem; }
@media screen and (max-width: 544px) { @media screen and (max-width: 544px) {
#content h1 { #content h1 {
font-size: 1.80203em; font-size: 1.80203em;
margin-bottom: 0.61805rem; }
#content h2 {
font-size: 1.26563em;
margin-bottom: 0.61805rem; } } margin-bottom: 0.61805rem; } }
#content h2 {
font-size: 1.42383em;
margin-bottom: 0.61805rem; }
#content td, #content th { #content td, #content th {
padding: 0.38198rem; } padding: 0.38198rem; }
#content tbody th { #content tbody th {
@ -497,20 +500,21 @@ a:hover {
max-width: 1200px; } max-width: 1200px; }
.Box.str { .Box.str {
position: relative; } position: relative; }
.Box.str .Row.buttons { .Box.str .Row.mq-phone {
position: absolute; position: absolute;
right: 1rem; right: 1rem;
top: 2.7em; margin: 1rem auto; }
margin: 12px auto; } .Box.str .Row.mq-no-phone {
@media screen and (min-width: 545px) { position: absolute;
.Box.str .Row.buttons { right: 0;
right: 0; top: 0;
top: 0; } } margin-top: 0.61805rem; }
@media screen and (max-width: 544px) { @media screen and (max-width: 544px) {
.Box.mobcol h2 { .Box.mobcol h2 {
position: relative; position: relative;
cursor: pointer; cursor: pointer;
padding-right: 1.3rem;
margin-bottom: 0 !important; } margin-bottom: 0 !important; }
.Box.mobcol h2::after { .Box.mobcol h2::after {
position: absolute; position: absolute;
@ -899,6 +903,12 @@ form span.required {
white-space: nowrap; white-space: nowrap;
word-wrap: normal; } word-wrap: normal; }
.AP-preview-nil {
padding: 0.38198rem 0.61805rem;
background: rgba(0, 0, 0, 0.1);
border-radius: 3px;
border: 2px dashed black; }
.AP-preview .wrap { .AP-preview .wrap {
flex-direction: row; flex-direction: row;
background: #eee !important; background: #eee !important;
@ -1128,15 +1138,15 @@ body.term #botnav {
@media screen and (min-width: 545px) { @media screen and (min-width: 545px) {
.mq-phone { .mq-phone {
display: none; } } display: none !important; } }
@media screen and (max-width: 544px) { @media screen and (max-width: 544px) {
.mq-tablet-min { .mq-tablet-min, .mq-no-phone {
display: none; } } display: none !important; } }
@media screen and (min-width: 1001px) { @media screen and (min-width: 1001px) {
.mq-tablet-max { .mq-tablet-max {
display: none; } } display: none !important; } }
@media screen and (max-width: 1000px) { @media screen and (max-width: 1000px) {
.mq-normal-min { .mq-normal-min {
display: none; } } display: none !important; } }
/*# sourceMappingURL=app.css.map */ /*# sourceMappingURL=app.css.map */

4
html_orig/messages/en.php
Unescape View File

@ -11,7 +11,7 @@ return [
'menu.term' => 'Back to Terminal', 'menu.term' => 'Back to Terminal',
'box.ap' => 'Built-in Access Point', 'box.ap' => 'Built-in Access Point',
'box.sta' => 'Client Mode', 'box.sta' => 'Connect to External Network',
'wifi.enable' => 'Enabled:', 'wifi.enable' => 'Enabled:',
'wifi.tpw' => 'Transmit Power:', 'wifi.tpw' => 'Transmit Power:',
@ -24,7 +24,7 @@ return [
'wifi.sta_ssid' => 'Network SSID:', 'wifi.sta_ssid' => 'Network SSID:',
'wifi.sta_password' => 'Password:', 'wifi.sta_password' => 'Password:',
'wifi.not_conn' => 'Not connected.', 'wifi.not_conn' => 'Not connected.',
'wifi.forget' => '', 'wifi.sta_none' => 'None',
'wifi.submit' => 'Apply!', 'wifi.submit' => 'Apply!',

29
html_orig/pages/cfg_wifi.php
Unescape View File

@ -1,6 +1,10 @@
<form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="POST"> <form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="POST">
<h2><?= tr('box.ap') ?></h2> <h2><?= tr('box.ap') ?></h2>
<div class="Row buttons mq-phone">
<input type="submit" value="<?= tr('wifi.submit') ?>">
</div>
<div class="Row checkbox"> <div class="Row checkbox">
<label><?= tr('wifi.enable') ?></label><!-- <label><?= tr('wifi.enable') ?></label><!--
--><span class="box"></span> --><span class="box"></span>
@ -28,7 +32,7 @@
<span class="display x-disp1 mq-phone"></span> <span class="display x-disp1 mq-phone"></span>
</label> </label>
<input type="range" name="tpw" id="tpw" step=1 min=0 max=82 value="%tpw%"> <input type="range" name="tpw" id="tpw" step=1 min=0 max=82 value="%tpw%">
<span class="display x-disp2 mq-tablet-min"></span> <span class="display x-disp2 mq-no-phone"></span>
</div> </div>
<div class="Row checkbox"> <div class="Row checkbox">
@ -37,7 +41,7 @@
<input type="hidden" name="ap_hidden" value="%ap_hidden%"> <input type="hidden" name="ap_hidden" value="%ap_hidden%">
</div> </div>
<div class="Row buttons"> <div class="Row buttons mq-no-phone">
<input type="submit" value="<?= tr('wifi.submit') ?>"> <input type="submit" value="<?= tr('wifi.submit') ?>">
</div> </div>
</form> </form>
@ -45,6 +49,10 @@
<form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="POST"> <form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="POST">
<h2><?= tr('box.sta') ?></h2> <h2><?= tr('box.sta') ?></h2>
<div class="Row buttons mq-phone">
<input type="submit" value="<?= tr('wifi.submit') ?>">
</div>
<div class="Row checkbox"> <div class="Row checkbox">
<label><?= tr('wifi.enable') ?></label><!-- <label><?= tr('wifi.enable') ?></label><!--
--><span class="box"></span> --><span class="box"></span>
@ -56,7 +64,7 @@
<div class="Row sta-info"> <div class="Row sta-info">
<label><?= tr('wifi.sta_info') ?></label> <label><?= tr('wifi.sta_info') ?></label>
<div class="AP-preview" id="sta-nw"> <div class="AP-preview hidden" id="sta-nw">
<div class="wrap"> <div class="wrap">
<div class="inner"> <div class="inner">
<div class="essid"></div> <div class="essid"></div>
@ -66,9 +74,12 @@
<a class="forget" id="forget-sta">×</a> <a class="forget" id="forget-sta">×</a>
</div> </div>
</div> </div>
<div class="AP-preview-nil" id="sta-nw-nil">
<?= tr('wifi.sta_none') ?>
</div>
</div> </div>
<div class="Row buttons"> <div class="Row buttons mq-no-phone">
<input type="submit" value="<?= tr('wifi.submit') ?>"> <input type="submit" value="<?= tr('wifi.submit') ?>">
</div> </div>
</form> </form>
@ -111,7 +122,17 @@
}); });
}); });
$('#forget-sta').on('click', function() {
$('#sta_ssid').val('');
$('#sta_password').val('');
wifiShowSelected('', '', '');
});
function wifiShowSelected(name, password, ip) { function wifiShowSelected(name, password, ip) {
$('#sta-nw').toggleClass('hidden', name.length == 0);
$('#sta-nw-nil').toggleClass('hidden', name.length > 0);
$('#sta-nw .essid').html(e(name)); $('#sta-nw .essid').html(e(name));
var nopw = undef(password) || password.length == 0; var nopw = undef(password) || password.length == 0;
$('#sta-nw .passwd').html(e(password)).toggleClass('hidden', nopw); $('#sta-nw .passwd').html(e(password)).toggleClass('hidden', nopw);

8
html_orig/sass/app.scss
Unescape View File

@ -36,17 +36,17 @@ $c-form-highlight-a: #2ea1f9;
// media queries // media queries
@include media($tablet-min) { @include media($tablet-min) {
.mq-phone { display: none; } .mq-phone { display: none!important; }
} }
@include media($phone) { @include media($phone) {
.mq-tablet-min { display: none; } .mq-tablet-min, .mq-no-phone { display: none !important; }
} }
@include media($normal-min) { @include media($normal-min) {
.mq-tablet-max { display: none; } .mq-tablet-max { display: none !important; }
} }
@include media($tablet-max) { @include media($tablet-max) {
.mq-normal-min { display: none; } .mq-normal-min { display: none !important; }
} }

20
html_orig/sass/layout/_box.scss
Unescape View File

@ -36,21 +36,16 @@
&.str { &.str {
position: relative; position: relative;
.Row.mq-phone {
.Row.buttons {
position: absolute; position: absolute;
right: dist(0); right: dist(0);
top: 2.7em; margin: 1rem auto;
margin: 12px auto;
} }
.Row.mq-no-phone {
@include media($tablet-min) { position: absolute;
.Row.buttons { right: 0;
//position: absolute; top: 0;
right: 0; margin-top: dist(-1);
top: 0;
//margin: 12px auto;
}
} }
} }
} }
@ -60,6 +55,7 @@
h2 { h2 {
position: relative; position: relative;
cursor: pointer; cursor: pointer;
padding-right: 1.3rem;
&::after { &::after {
position: absolute; position: absolute;

13
html_orig/sass/layout/_content.scss
Unescape View File

@ -21,16 +21,21 @@
margin-bottom: dist(0); margin-bottom: dist(0);
} }
h2 {
font-size: fsize(3);
margin-bottom: dist(-1);
}
@include media($phone) { @include media($phone) {
h1 { h1 {
font-size: fsize(5); font-size: fsize(5);
margin-bottom: dist(-1); margin-bottom: dist(-1);
} }
}
h2 { h2 {
font-size: fsize(3); font-size: fsize(2);
margin-bottom: dist(-1); margin-bottom: dist(-1);
}
} }
td, th { td, th {

7
html_orig/sass/pages/_wifi.scss
Unescape View File

@ -110,6 +110,13 @@
} }
} }
.AP-preview-nil {
padding: dist(-2) dist(-1);
background: rgba(black, .1);
border-radius: 3px;
border: 2px dashed black;
}
.AP-preview { .AP-preview {
.wrap { .wrap {
@extend %ap-inner; @extend %ap-inner;

Write Preview
Loading…
Cancel
Save