all accessible and nice, also added icons

pull/30/head
Ondřej Hruška 8 years ago
parent 5f3cb6685d
commit 7f8f7d8ad1
  1. 32
      html_orig/_pages.php
  2. 120
      html_orig/css/app.css
  3. BIN
      html_orig/fontello/fontello-9ba19eb0.zip
  4. 40
      html_orig/js/app.js
  5. 27
      html_orig/jssrc/appcommon.js
  6. 13
      html_orig/jssrc/utils.js
  7. 19
      html_orig/lang/en.php
  8. 17
      html_orig/pages/_cfg_menu.php
  9. 34
      html_orig/pages/cfg_admin.php
  10. 10
      html_orig/pages/cfg_app.php
  11. 24
      html_orig/pages/cfg_network.php
  12. 38
      html_orig/pages/cfg_wifi.php
  13. 57
      html_orig/sass/_fontello-embedded.scss
  14. 2
      html_orig/sass/app.scss
  15. 11
      html_orig/sass/form/_buttons.scss
  16. 2
      html_orig/sass/form/_fancy_button_mixins.scss
  17. 5
      html_orig/sass/form/_form_elements.scss
  18. 5
      html_orig/sass/layout/_box.scss
  19. 20
      html_orig/sass/layout/_menu.scss
  20. 4
      html_orig/sass/layout/_modal.scss

@ -4,34 +4,40 @@ $pages = [];
if (! function_exists('pg')) { if (! function_exists('pg')) {
/** Add a page */ /** Add a page */
function pg($key, $bc, $path, $titleKey = null) function pg($key, $bc, $icon, $path, $titleKey = null)
{ {
global $pages; global $pages;
$pages[$key] = (object) [ $pages[$key] = (object) [
'key' => $key, 'key' => $key,
'bodyclass' => $bc, 'bodyclass' => $bc,
'path' => $path, 'path' => $path,
'icon' => $icon ? "icn-$icon" : '',
'label' => tr("menu.$key"), 'label' => tr("menu.$key"),
'title' => $titleKey ? tr($titleKey) : tr("menu.$key"), 'title' => $titleKey ? tr($titleKey) : tr("menu.$key"),
]; ];
} }
} }
pg('cfg_wifi', 'cfg', '/cfg/wifi'); pg('cfg_wifi', 'cfg', 'wifi', '/cfg/wifi');
pg('cfg_wifi_conn', '', '/cfg/wifi/connecting'); pg('cfg_wifi_conn', '', '', '/cfg/wifi/connecting');
pg('wifi_connstatus', 'api', '/cfg/wifi/connstatus'); pg('wifi_connstatus', 'api', '', '/cfg/wifi/connstatus');
pg('wifi_set', 'api', '/cfg/wifi/set'); pg('wifi_set', 'api', '', '/cfg/wifi/set');
pg('wifi_scan', 'api', '/cfg/wifi/scan'); pg('wifi_scan', 'api', '', '/cfg/wifi/scan');
pg('cfg_network', 'cfg', '/cfg/network'); pg('cfg_network', 'cfg', 'network', '/cfg/network');
pg('network_set', 'api', '/cfg/network/set'); pg('network_set', 'api', '', '/cfg/network/set');
pg('cfg_app', 'cfg', '/cfg/app'); pg('cfg_app', 'cfg', 'terminal', '/cfg/app');
pg('app_set', 'api', '/cfg/app/set'); pg('app_set', 'api', '', '/cfg/app/set');
pg('help', 'cfg page-help', '/help'); pg('cfg_admin', 'cfg', 'persist', '/cfg/admin');
pg('about', 'cfg page-about', '/about'); pg('write_defaults', 'api', '', '/cfg/admin/write_defaults');
pg('term', 'term', '/', 'title.term'); pg('restore_defaults', 'api', '', '/cfg/admin/restore_defaults');
pg('restore_hard', 'api', '', '/cfg/admin/restore_hard');
pg('help', 'cfg page-help', 'help', '/help');
pg('about', 'cfg page-about', 'about', '/about');
pg('term', 'term', '', '/', 'title.term');
// ajax API // ajax API

File diff suppressed because one or more lines are too long

@ -715,6 +715,19 @@ function bool(x) {
return (x === 1 || x === '1' || x === true || x === 'true'); return (x === 1 || x === '1' || x === true || x === 'true');
} }
/**
* Filter 'spacebar' and 'return' from keypress handler,
* and when they're pressed, fire the callback.
* use $(...).on('keypress', cr(handler))
*/
function cr(hdl) {
return function(e) {
if (e.which == 10 || e.which == 13 || e.which == 32) {
hdl();
}
};
}
/** Extend an objects with options */ /** Extend an objects with options */
function extend(defaults, options) { function extend(defaults, options) {
var target = {}; var target = {};
@ -893,18 +906,30 @@ $.ready(function () {
$(box).toggleClass('checked', inp.value); $(box).toggleClass('checked', inp.value);
$(x).on('click', function() { var hdl = function() {
inp.value = 1 - inp.value; inp.value = 1 - inp.value;
$(box).toggleClass('checked', inp.value) $(box).toggleClass('checked', inp.value)
}); };
$(x).on('click', hdl).on('keypress', cr(hdl));
}); });
// Expanding boxes on mobile // Expanding boxes on mobile
$('.Box.mobcol').forEach(function(x) { $('.Box.mobcol').forEach(function(x) {
var h = x.querySelector('h2'); var h = x.querySelector('h2');
$(h).on('click', function() {
var hdl = function() {
$(x).toggleClass('expanded'); $(x).toggleClass('expanded');
};
$(h).on('click', hdl).on('keypress', cr(hdl));
}); });
qsa('form').forEach(function(x) {
$(x).on('keypress', function(e) {
if ((e.keyCode == 10 || e.keyCode == 13) && e.ctrlKey) {
x.submit();
}
})
}); });
// loader dots... // loader dots...
@ -967,6 +992,15 @@ $.ready(function () {
Modal.init(); Modal.init();
Notify.init(); Notify.init();
// remove tabindixes from h2 if wide
if (window.innerWidth > 550) {
qsa('.Box h2').forEach(function (x) {
x.removeAttribute('tabindex');
});
qs('#brand').removeAttribute('tabindex');
}
}); });
$._loader = function(vis) { $._loader = function(vis) {

@ -7,18 +7,30 @@ $.ready(function () {
$(box).toggleClass('checked', inp.value); $(box).toggleClass('checked', inp.value);
$(x).on('click', function() { var hdl = function() {
inp.value = 1 - inp.value; inp.value = 1 - inp.value;
$(box).toggleClass('checked', inp.value) $(box).toggleClass('checked', inp.value)
}); };
$(x).on('click', hdl).on('keypress', cr(hdl));
}); });
// Expanding boxes on mobile // Expanding boxes on mobile
$('.Box.mobcol').forEach(function(x) { $('.Box.mobcol').forEach(function(x) {
var h = x.querySelector('h2'); var h = x.querySelector('h2');
$(h).on('click', function() {
var hdl = function() {
$(x).toggleClass('expanded'); $(x).toggleClass('expanded');
};
$(h).on('click', hdl).on('keypress', cr(hdl));
}); });
qsa('form').forEach(function(x) {
$(x).on('keypress', function(e) {
if ((e.keyCode == 10 || e.keyCode == 13) && e.ctrlKey) {
x.submit();
}
})
}); });
// loader dots... // loader dots...
@ -81,6 +93,15 @@ $.ready(function () {
Modal.init(); Modal.init();
Notify.init(); Notify.init();
// remove tabindixes from h2 if wide
if (window.innerWidth > 550) {
qsa('.Box h2').forEach(function (x) {
x.removeAttribute('tabindex');
});
qs('#brand').removeAttribute('tabindex');
}
}); });
$._loader = function(vis) { $._loader = function(vis) {

@ -12,6 +12,19 @@ function bool(x) {
return (x === 1 || x === '1' || x === true || x === 'true'); return (x === 1 || x === '1' || x === true || x === 'true');
} }
/**
* Filter 'spacebar' and 'return' from keypress handler,
* and when they're pressed, fire the callback.
* use $(...).on('keypress', cr(handler))
*/
function cr(hdl) {
return function(e) {
if (e.which == 10 || e.which == 13 || e.which == 32) {
hdl();
}
};
}
/** Extend an objects with options */ /** Extend an objects with options */
function extend(defaults, options) { function extend(defaults, options) {
var target = {}; var target = {};

@ -9,6 +9,7 @@ return [
'menu.about' => 'About ESPTerm', 'menu.about' => 'About ESPTerm',
'menu.help' => 'Quick Reference', 'menu.help' => 'Quick Reference',
'menu.term' => 'Back to Terminal', 'menu.term' => 'Back to Terminal',
'menu.cfg_admin' => 'Reset & Restore',
'menu.cfg_wifi_conn' => 'Connecting to External Network', 'menu.cfg_wifi_conn' => 'Connecting to External Network',
'title.term' => 'Terminal', 'title.term' => 'Terminal',
@ -93,6 +94,7 @@ return [
'wifi.sta_active_pw' => '🔒', 'wifi.sta_active_pw' => '🔒',
'wifi.sta_active_nopw' => '🔓 Open access', 'wifi.sta_active_nopw' => '🔓 Open access',
'wifi.connected_ip_is' => 'Connected, IP is ', 'wifi.connected_ip_is' => 'Connected, IP is ',
'wifi.sta_password' => 'Password:',
'wifi.scanning' => 'Scanning', 'wifi.scanning' => 'Scanning',
'wifi.scan_now' => 'Start scanning!', 'wifi.scan_now' => 'Start scanning!',
@ -109,6 +111,23 @@ return [
'wifi.conn.working' => "Connecting to selected AP", 'wifi.conn.working' => "Connecting to selected AP",
'wifi.conn.fail' => "Connection failed, check settings & try again. Cause: ", 'wifi.conn.fail' => "Connection failed, check settings & try again. Cause: ",
'admin.confirm_restore' => 'Restore all settings to their default values?',
'admin.confirm_restore_hard' =>
'Restore to firmware default settings? This will reset ' .
'all active settings and switch to AP mode with the default SSID.',
'admin.confirm_store_defaults' =>
'Enter admin password to confirm you want to store the current settings as defaults.',
'admin.password' => 'Admin password:',
'admin.restore_defaults' => 'Reset to default settings',
'admin.write_defaults' => 'Save current settings as default',
'admin.restore_hard' => 'Reset to firmware default settings',
'admin.explain' => '
ESPTerm contains two persistent memory banks, one for default and
one for active settings. Active settings can be stored as defaults
by the administrator. Use the following button to revert all
active settings to their stored default values.
',
'apply' => 'Apply!', 'apply' => 'Apply!',
'enabled' => 'Enabled', 'enabled' => 'Enabled',
'disabled' => 'Disabled', 'disabled' => 'Disabled',

@ -1,16 +1,19 @@
<nav id="menu"> <nav id="menu">
<div id="brand" onclick="$('#menu').toggleClass('expanded')"><?= tr('appname') ?></div> <div id="brand" tabindex=0><?= tr('appname') ?></div>
<?php <?php
// generate the menu // generate the menu
foreach($_pages as $k => $page) { foreach ($_pages as $k => $page) {
if (strpos($page->bodyclass, 'cfg') === false) continue; if (strpos($page->bodyclass, 'cfg') === false) continue;
$sel = ($_GET['page'] == $k) ? ' class="selected"' : ''; $sel = ($_GET['page'] == $k) ? 'selected' : '';
$text = $page->label; $text = $page->label;
$url = e(url($k)); $url = e(url($k));
echo "<a href=\"$url\"$sel>$text</a>"; echo "<a href=\"$url\" class=\"$page->icon $sel\">$text</a>";
} }
?><a href="<?= e(url('term')) ?>"><?= tr('menu.term') ?></a> ?><a href="<?= e(url('term')) ?>" class="icn-back"><?= tr('menu.term') ?></a>
</nav> </nav>
<script>
function menuOpen() { $('#menu').toggleClass('expanded') }
$('#brand').on('click', menuOpen).on('keypress', cr(menuOpen));
</script>

@ -0,0 +1,34 @@
<div class="Box">
<div class="Row explain">
<?= tr('admin.explain') ?>
</div>
<div class="Row buttons">
<a class="button icn-restore"
onclick="return confirm('<?= tr('admin.confirm_restore') ?>');"
href="<?= e(url('restore_defaults')) ?>"
>
<?= tr('admin.restore_defaults') ?>
</a>
</div>
<div class="Row buttons">
<a onclick="writeDefaults(); return false;" href="#"><?= tr('admin.write_defaults') ?></a>
</div>
<div class="Row buttons">
<a onclick="return confirm('<?= tr('admin.confirm_restore_hard') ?>');"
href="<?= e(url('restore_hard')) ?>"
>
<?= tr('admin.restore_hard') ?>
</a>
</div>
</div>
<script>
function writeDefaults() {
var pw = prompt('<?= tr('admin.confirm_store_defaults') ?>');
if (!pw) return;
location.href = <?=json_encode(url('write_defaults')) ?> + '?pw=' + pw;
}
</script>

@ -1,10 +1,6 @@
<form class="Box mobopen str" action="<?= e(url('app_set')) ?>" method="GET"> <form class="Box mobopen str" action="<?= e(url('app_set')) ?>" method="GET" id='form-1'>
<h2><?= tr('app.defaults') ?></h2> <h2><?= tr('app.defaults') ?></h2>
<div class="Row buttons">
<input type="submit" value="<?= tr('apply') ?>">
</div>
<div class="Row explain"> <div class="Row explain">
<?= tr('app.explain_initials') ?> <?= tr('app.explain_initials') ?>
</div> </div>
@ -68,4 +64,8 @@
<label for="btn5"><?= tr("app.btn5") ?></label> <label for="btn5"><?= tr("app.btn5") ?></label>
<input class="short" type="text" name="btn5" id="btn5" value="%btn5%"> <input class="short" type="text" name="btn5" id="btn5" value="%btn5%">
</div> </div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-1').submit()"><?= tr('apply') ?></a>
</div>
</form> </form>

@ -2,12 +2,8 @@
$ipmask='pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$"'; $ipmask='pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$"';
?> ?>
<form class="Box str mobcol" action="<?= e(url('network_set')) ?>" method="GET"> <form class="Box str mobcol" action="<?= e(url('network_set')) ?>" method="GET" id="form-1">
<h2><?= tr('net.ap') ?></h2> <h2 tabindex=0><?= tr('net.ap') ?></h2>
<div class="Row buttons">
<input type="submit" value="<?= tr('apply') ?>">
</div>
<div class="Row explain"> <div class="Row explain">
<?= tr('net.explain_ap') ?> <?= tr('net.explain_ap') ?>
@ -38,14 +34,14 @@ $ipmask='pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$"';
<label for="ap_addr_mask"><?= tr('net.ap_addr_mask') ?></label> <label for="ap_addr_mask"><?= tr('net.ap_addr_mask') ?></label>
<input type="text" name="ap_addr_mask" id="ap_addr_mask" value="%ap_addr_mask%" <?=$ipmask?> required> <input type="text" name="ap_addr_mask" id="ap_addr_mask" value="%ap_addr_mask%" <?=$ipmask?> required>
</div> </div>
</form>
<form class="Box str mobcol" action="<?= e(url('network_set')) ?>" method="GET">
<h2><?= tr('net.sta') ?></h2>
<div class="Row buttons"> <div class="Row buttons">
<input type="submit" value="<?= tr('apply') ?>"> <a class="button icn-ok" href="#" onclick="qs('#form-1').submit()"><?= tr('apply') ?></a>
</div> </div>
</form>
<form class="Box str mobcol" action="<?= e(url('network_set')) ?>" method="GET" id="form-2">
<h2 tabindex=0><?= tr('net.sta') ?></h2>
<div class="Row explain"> <div class="Row explain">
<?= tr('net.explain_sta') ?> <?= tr('net.explain_sta') ?>
@ -53,7 +49,7 @@ $ipmask='pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$"';
<div class="Row checkbox"> <div class="Row checkbox">
<label><?= tr('net.sta_dhcp_enable') ?></label><!-- <label><?= tr('net.sta_dhcp_enable') ?></label><!--
--><span class="box"></span> --><span class="box" tabindex=0 role=checkbox></span>
<input type="hidden" name="sta_dhcp_enable" value="%sta_dhcp_enable%"> <input type="hidden" name="sta_dhcp_enable" value="%sta_dhcp_enable%">
</div> </div>
@ -71,6 +67,10 @@ $ipmask='pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$"';
<label for="sta_addr_gw"><?= tr('net.sta_addr_gw') ?></label> <label for="sta_addr_gw"><?= tr('net.sta_addr_gw') ?></label>
<input type="text" name="sta_addr_gw" id="sta_addr_gw" value="%sta_addr_gw%" <?=$ipmask?> required> <input type="text" name="sta_addr_gw" id="sta_addr_gw" value="%sta_addr_gw%" <?=$ipmask?> required>
</div> </div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-2').submit()"><?= tr('apply') ?></a>
</div>
</form> </form>
<div class="Box mobcol"> <div class="Box mobcol">

@ -1,13 +1,9 @@
<form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="GET"> <form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="GET" id="form-1">
<h2><?= tr('wifi.ap') ?></h2> <h2 tabindex=0><?= tr('wifi.ap') ?></h2>
<div class="Row buttons">
<input type="submit" value="<?= tr('apply') ?>">
</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" tabindex=0></span>
<input type="hidden" name="ap_enable" value="%ap_enable%"> <input type="hidden" name="ap_enable" value="%ap_enable%">
</div> </div>
@ -37,21 +33,21 @@
<div class="Row checkbox"> <div class="Row checkbox">
<label><?= tr('wifi.ap_hidden') ?></label><!-- <label><?= tr('wifi.ap_hidden') ?></label><!--
--><span class="box"></span> --><span class="box" tabindex=0></span>
<input type="hidden" name="ap_hidden" value="%ap_hidden%"> <input type="hidden" name="ap_hidden" value="%ap_hidden%">
</div> </div>
</form>
<form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="GET">
<h2><?= tr('wifi.sta') ?></h2>
<div class="Row buttons"> <div class="Row buttons">
<input type="submit" value="<?= tr('apply') ?>"> <a class="button icn-ok" href="#" onclick="qs('#form-1').submit()"><?= tr('apply') ?></a>
</div> </div>
</form>
<form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="GET" id="form-2">
<h2 tabindex=0><?= tr('wifi.sta') ?></h2>
<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" tabindex=0></span>
<input type="hidden" name="sta_enable" value="%sta_enable%"> <input type="hidden" name="sta_enable" value="%sta_enable%">
</div> </div>
@ -68,7 +64,7 @@
<div class="nopasswd"><?= tr('wifi.sta_active_nopw') ?></div> <div class="nopasswd"><?= tr('wifi.sta_active_nopw') ?></div>
<div class="ip"></div> <div class="ip"></div>
</div> </div>
<a class="forget" id="forget-sta">×</a> <a class="forget" href="#" id="forget-sta">×</a>
</div> </div>
</div> </div>
<div class="AP-preview-nil" id="sta-nw-nil"> <div class="AP-preview-nil" id="sta-nw-nil">
@ -78,11 +74,15 @@
<div id="ap-box"> <div id="ap-box">
<label><?= tr('wifi.select_ssid') ?></label> <label><?= tr('wifi.select_ssid') ?></label>
<div id="ap-scan"><a onclick="startScanning(); return false"><?= tr('wifi.scan_now') ?></a></div> <div id="ap-scan"><a href="#" onclick="startScanning(); return false"><?= tr('wifi.scan_now') ?></a></div>
<div id="ap-loader" class="hidden"><?= tr('wifi.scanning') ?><span class="anim-dots">.</span></div> <div id="ap-loader" class="hidden"><?= tr('wifi.scanning') ?><span class="anim-dots">.</span></div>
<div id="ap-noscan" class="hidden"><?= tr('wifi.cant_scan_no_sta') ?></div> <div id="ap-noscan" class="hidden"><?= tr('wifi.cant_scan_no_sta') ?></div>
<div id="ap-list" class="hidden"></div> <div id="ap-list" class="hidden"></div>
</div> </div>
<div class="Row buttons">
<a class="button icn-ok" href="#" onclick="qs('#form-2').submit()"><?= tr('apply') ?></a>
</div>
</form> </form>
<div class="Modal hidden" id="psk-modal"> <div class="Modal hidden" id="psk-modal">
@ -120,6 +120,7 @@
// Forget STA credentials // Forget STA credentials
$('#forget-sta').on('click', function() { $('#forget-sta').on('click', function() {
selectSta('', '', ''); selectSta('', '', '');
return false;
}); });
// Display selected STA SSID etc // Display selected STA SSID etc
@ -194,11 +195,12 @@
if (ap.enc > 4) return; // hide unsupported auths if (ap.enc > 4) return; // hide unsupported auths
var item = document.createElement('div'); var item = mk('div');
var $item = $(item) var $item = $(item)
.data('ssid', ap.essid) .data('ssid', ap.essid)
.data('pwd', ap.enc) .data('pwd', ap.enc)
.attr('tabindex', 0)
.addClass('AP'); .addClass('AP');
// mark current SSID // mark current SSID
@ -206,7 +208,7 @@
$item.addClass('selected'); $item.addClass('selected');
} }
var inner = document.createElement('div'); var inner = mk('div');
$(inner).addClass('inner') $(inner).addClass('inner')
.htmlAppend('<div class="rssi">{0}</div>'.format(ap.rssi_perc)) .htmlAppend('<div class="rssi">{0}</div>'.format(ap.rssi_perc))
.htmlAppend('<div class="essid" title="{0}">{0}</div>'.format($.htmlEscape(ap.essid))) .htmlAppend('<div class="essid" title="{0}">{0}</div>'.format($.htmlEscape(ap.essid)))

File diff suppressed because one or more lines are too long

@ -1,4 +1,5 @@
@import "normalize"; @import "normalize";
@import "fontello-embedded";
@import "lib/bourbon/bourbon"; @import "lib/bourbon/bourbon";
@import "grid-settings"; @import "grid-settings";
@ -10,6 +11,7 @@ $form-label-w: 160px;
$form-label-gap: 8px; $form-label-gap: 8px;
$form-field-w: 250px; $form-field-w: 250px;
$c-red-outline: #ff0099;
$c-form-label-fg: white; $c-form-label-fg: white;
$c-form-field-bg: #3c3c3c; $c-form-field-bg: #3c3c3c;
$c-form-field-fg: white; $c-form-field-fg: white;

@ -31,9 +31,18 @@ button, input[type=submit], .button {
min-width: initial; min-width: initial;
} }
text-shadow: 1.5px 1.5px 2px rgba(black, 0.6); &::before {
vertical-align: -1px;
margin-left: 0;
}
text-shadow: 1.5px 1.5px 2px rgba(black, 0.4);
@include fancy-btn-colors($btn-blue-f, $btn-blue-b, $btn-blue-fa, $btn-blue-ba); @include fancy-btn-colors($btn-blue-f, $btn-blue-b, $btn-blue-fa, $btn-blue-ba);
&:focus {
outline-color: $c-red-outline;
}
} }
//input[type="submit"], .btn-green { //input[type="submit"], .btn-green {

@ -7,7 +7,7 @@
border-radius: 2px; border-radius: 2px;
padding: 0 0.6em; padding: 0 0.6em;
border: 0 none; border: 0 none;
outline: 0 none !important; //outline: 0 none !important;
line-height: 1.8em; line-height: 1.8em;
font-size: 1.1em; font-size: 1.1em;
margin-bottom: 3px; margin-bottom: 3px;

@ -7,8 +7,8 @@
color: $c-form-field-fg; color: $c-form-field-fg;
padding: 6px; padding: 6px;
line-height: 1em; line-height: 1em;
outline: 0 none !important; //outline: 0 none !important;
-moz-outline: 0 none !important; //-moz-outline: 0 none !important;
font-weight: normal; font-weight: normal;
&:focus, &:hover { &:focus, &:hover {
@ -21,6 +21,7 @@
line-height: $h; line-height: $h;
.box { .box {
overflow: hidden;
width: $h; width: $h;
height: $h; height: $h;
border: 1px solid #808080; border: 1px solid #808080;

@ -9,6 +9,10 @@
margin-top: dist(-1); margin-top: dist(-1);
} }
h1, h2 {
overflow: hidden;
}
h1 + & { h1 + & {
margin-top: 0; margin-top: 0;
} }
@ -45,6 +49,7 @@
@include media($phone) { @include media($phone) {
right: dist(0); right: dist(0);
top: 1.8em;
margin: 1rem auto; margin: 1rem auto;
} }

@ -69,15 +69,27 @@
box-shadow: 0 0 5px rgba(black, .5); box-shadow: 0 0 5px rgba(black, .5);
} }
&:focus {
outline-color: $c-red-outline;
}
//&::before {
// content: "";
// padding-right: .5rem;
// position: relative;
// top: -0.1rem;
//}
// Fontello
&::before { &::before {
content: ""; vertical-align: -2px;
padding-right: .5rem; margin-left: 0;
position: relative; margin-right: 15px;
top: -0.1rem;
} }
@include media($phone) { @include media($phone) {
display: none; display: none;
&::before {margin-left: 10px;}
} }
} }

@ -27,7 +27,9 @@
background: #1c1c1e; background: #1c1c1e;
border-left: 6px solid $c-form-highlight; border-left: 6px solid $c-form-highlight;
border-right: 6px solid $c-form-highlight; border-right: 6px solid $c-form-highlight;
box-shadow: 0 0 2px 0 #434349, 0 0 6px 0 black; border-top: 1px solid $c-form-highlight;
border-bottom: 1px solid $c-form-highlight;
box-shadow: 0 0 6px 0 black;
border-radius: 6px; border-radius: 6px;

Loading…
Cancel
Save