@ -334,19 +334,19 @@ const char AutoConnect::_CSS_LUXBAR[] PROGMEM = {
" z-index:1000; "
" z-index:1000; "
" box-shadow:0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); "
" box-shadow:0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); "
" } "
" } "
" .luxbar-ham burger span, "
" .luxbar-burger span, "
" .luxbar-ham burger span::before, "
" .luxbar-burger span::before, "
" .luxbar-ham burger span::after{ "
" .luxbar-burger span::after{ "
" display:block; "
" display:block; "
" height:2px; "
" height:2px; "
" width:26px; "
" width:26px; "
" transition:0.6s ease; "
" transition:0.6s ease; "
" } "
" } "
" .luxbar-checkbox:checked~.luxbar-menu li .luxbar-ham burger span{ "
" .luxbar-checkbox:checked~.luxbar-menu li .luxbar-burger span{ "
" background-color:transparent; "
" background-color:transparent; "
" } "
" } "
" .luxbar-checkbox:checked~.luxbar-menu li .luxbar-ham burger span::before, "
" .luxbar-checkbox:checked~.luxbar-menu li .luxbar-burger span::before, "
" .luxbar-checkbox:checked~.luxbar-menu li .luxbar-ham burger span::after{ "
" .luxbar-checkbox:checked~.luxbar-menu li .luxbar-burger span::after{ "
" margin-top:0; "
" margin-top:0; "
" } "
" } "
" .luxbar-header{ "
" .luxbar-header{ "
@ -356,7 +356,7 @@ const char AutoConnect::_CSS_LUXBAR[] PROGMEM = {
" align-items:center; "
" align-items:center; "
" height:58px; "
" height:58px; "
" } "
" } "
" .luxbar-menu-right .luxbar-ham burger{ "
" .luxbar-menu-right .luxbar-burger{ "
" margin-left:auto; "
" margin-left:auto; "
" } "
" } "
" .luxbar-brand{ "
" .luxbar-brand{ "
@ -388,20 +388,20 @@ const char AutoConnect::_CSS_LUXBAR[] PROGMEM = {
" padding:18px 24px 18px 24px; "
" padding:18px 24px 18px 24px; "
" display:block; "
" display:block; "
" } "
" } "
" .luxbar-ham burger{ "
" .luxbar-burger{ "
" padding:18px 24px 18px 24px; "
" padding:18px 24px 18px 24px; "
" position:relative; "
" position:relative; "
" cursor:pointer; "
" cursor:pointer; "
" } "
" } "
" .luxbar-ham burger span::before, "
" .luxbar-burger span::before, "
" .luxbar-ham burger span::after{ "
" .luxbar-burger span::after{ "
" content:''; "
" content:''; "
" position:absolute; "
" position:absolute; "
" } "
" } "
" .luxbar-ham burger span::before{ "
" .luxbar-burger span::before{ "
" margin-top:-8px; "
" margin-top:-8px; "
" } "
" } "
" .luxbar-ham burger span::after{ "
" .luxbar-burger span::after{ "
" margin-top:8px; "
" margin-top:8px; "
" } "
" } "
" .luxbar-checkbox{ "
" .luxbar-checkbox{ "
@ -456,7 +456,7 @@ const char AutoConnect::_CSS_LUXBAR[] PROGMEM = {
" flex-flow:row; "
" flex-flow:row; "
" justify-content:flex-end; "
" justify-content:flex-end; "
" } "
" } "
" .luxbar-ham burger{ "
" .luxbar-burger{ "
" display:none; "
" display:none; "
" } "
" } "
" .luxbar-checkbox:not(:checked)~.luxbar-menu{ "
" .luxbar-checkbox:not(:checked)~.luxbar-menu{ "
@ -490,25 +490,25 @@ const char AutoConnect::_CSS_LUXBAR[] PROGMEM = {
" white-space:nowrap; "
" white-space:nowrap; "
" } "
" } "
" } "
" } "
" .luxbar-checkbox:checked+.luxbar-menu .luxbar-ham burger-doublespin span::before{ "
" .luxbar-checkbox:checked+.luxbar-menu .luxbar-burger-doublespin span::before{ "
" transform:rotate(225deg); "
" transform:rotate(225deg); "
" } "
" } "
" .luxbar-checkbox:checked+.luxbar-menu .luxbar-ham burger-doublespin span::after{ "
" .luxbar-checkbox:checked+.luxbar-menu .luxbar-burger-doublespin span::after{ "
" transform:rotate(-225deg); "
" transform:rotate(-225deg); "
" } "
" } "
" .luxbar-menu-material-bluegrey , "
" .luxbar-menu-material, "
" .luxbar-menu-material-bluegrey .dropdown ul{ "
" .luxbar-menu-material .dropdown ul{ "
" background-color:#263238 ; "
" background-color: " AUTOCONNECT_MENUCOLOR_BACKGROUND " ; "
" color:#fff; "
" color: " AUTOCONNECT_MENUCOLOR_TEXT
" } "
" } "
" .luxbar-menu-material-bluegrey .active, "
" .luxbar-menu-material .active, "
" .luxbar-menu-material-bluegrey .luxbar-item:hover{ "
" .luxbar-menu-material .luxbar-item:hover{ "
" background-color:#37474f; "
" background-color: " AUTOCONNECT_MENUCOLOR_ACTIVE
" } "
" } "
" .luxbar-menu-material-bluegrey .luxbar-ham burger span, "
" .luxbar-menu-material .luxbar-burger span, "
" .luxbar-menu-material-bluegrey .luxbar-ham burger span::before, "
" .luxbar-menu-material .luxbar-burger span::before, "
" .luxbar-menu-material-bluegrey .luxbar-ham burger span::after{ "
" .luxbar-menu-material .luxbar-burger span::after{ "
" background-color:#fff; "
" background-color: " AUTOCONNECT_MENUCOLOR_TEXT
" } "
" } "
} ;
} ;
@ -524,11 +524,11 @@ const char AutoConnect::_ELM_HTML_HEAD[] PROGMEM = {
const char AutoConnect : : _ELM_MENU_PRE [ ] PROGMEM = {
const char AutoConnect : : _ELM_MENU_PRE [ ] PROGMEM = {
" <header id= \" luxbar \" class= \" luxbar-fixed \" > "
" <header id= \" luxbar \" class= \" luxbar-fixed \" > "
" <input type= \" checkbox \" class= \" luxbar-checkbox \" id= \" luxbar-checkbox \" /> "
" <input type= \" checkbox \" class= \" luxbar-checkbox \" id= \" luxbar-checkbox \" /> "
" <div class= \" luxbar-menu luxbar-menu-right luxbar-menu-material-bluegrey \" > "
" <div class= \" luxbar-menu luxbar-menu-right luxbar-menu-material \" > "
" <ul class= \" luxbar-navigation \" > "
" <ul class= \" luxbar-navigation \" > "
" <li class= \" luxbar-header \" > "
" <li class= \" luxbar-header \" > "
" <a href= \" " AUTOCONNECT_URI " \" class= \" luxbar-brand \" >MENU_TITLE</a> "
" <a href= \" " AUTOCONNECT_URI " \" class= \" luxbar-brand \" >MENU_TITLE</a> "
" <label class= \" luxbar-ham burger luxbar-ham burger-doublespin \" id= \" luxbar-ham burger \" for= \" luxbar-checkbox \" ><span></span></label> "
" <label class= \" luxbar-burger luxbar-burger-doublespin \" id= \" luxbar-burger \" for= \" luxbar-checkbox \" ><span></span></label> "
" </li> "
" </li> "
" <li class= \" luxbar-item \" ><a href= \" " AUTOCONNECT_URI_CONFIG " \" > " AUTOCONNECT_MENULABEL_CONFIGNEW " </a></li> "
" <li class= \" luxbar-item \" ><a href= \" " AUTOCONNECT_URI_CONFIG " \" > " AUTOCONNECT_MENULABEL_CONFIGNEW " </a></li> "
" <li class= \" luxbar-item \" ><a href= \" " AUTOCONNECT_URI_OPEN " \" > " AUTOCONNECT_MENULABEL_OPENSSIDS " </a></li> "
" <li class= \" luxbar-item \" ><a href= \" " AUTOCONNECT_URI_OPEN " \" > " AUTOCONNECT_MENULABEL_OPENSSIDS " </a></li> "