Fixes hover event on mobile

This commit is contained in:
Samuel Georges 2017-06-02 23:33:55 +10:00
parent ff04fbff35
commit bfcab59021
4 changed files with 20 additions and 8 deletions

View File

@ -791,13 +791,16 @@ body.drag nav#layout-mainmenu.navbar ul.nav li:hover,body.drag .mainmenu-collaps
#layout-sidenav ul li.active a i,#layout-sidenav ul li a:hover i{color:#ffffff}
#layout-sidenav ul li span.counter{display:block;position:absolute;top:1.071em;right:1.071em;padding:.143em .429em .214em .286em;background-color:#d9350f;color:#ffffff;font-size:.786em;line-height:100%;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;opacity:1;filter:alpha(opacity=100);-webkit-transform:scale(1,);-ms-transform:scale(1,);transform:scale(1,);-webkit-transition:all 0.3s;transition:all 0.3s}
#layout-sidenav ul li span.counter.empty{opacity:0;filter:alpha(opacity=0);-webkit-transform:scale(0,);-ms-transform:scale(0,);transform:scale(0,)}
@media (max-width:480px){#layout-sidenav{font-size:10px}
@media (min-width:768px) and (max-width:991px){#layout-sidenav{font-size:12px}
.layout-sidenav-container{width:100px}
}
@media (max-width:767px){#layout-sidenav{font-size:10px}
.layout-sidenav-container{width:80px}
}
html.mobile #layout-sidenav ul{overflow:auto;-webkit-overflow-scrolling:touch}
#layout-sidenav.layout-sidenav ul.drag li:not(.active) a:hover,.touch #layout-sidenav.layout-sidenav li:not(.active) a:hover{color:rgba(255,255,255,0.6) !important}
#layout-sidenav.layout-sidenav ul.drag li:not(.active) a:hover i,.touch #layout-sidenav.layout-sidenav li:not(.active) a:hover i{color:rgba(255,255,255,0.6) !important}
#layout-sidenav.layout-sidenav ul.drag li:not(.active) a:hover:after,.touch #layout-sidenav.layout-sidenav li:not(.active) a:hover:after{display:none !important}
#layout-sidenav.layout-sidenav ul.drag li:not(.active) a:hover,.atouch #layout-sidenav.layout-sidenav li:not(.active) a:hover{color:rgba(255,255,255,0.6) !important}
#layout-sidenav.layout-sidenav ul.drag li:not(.active) a:hover i,.atouch #layout-sidenav.layout-sidenav li:not(.active) a:hover i{color:rgba(255,255,255,0.6) !important}
#layout-sidenav.layout-sidenav ul.drag li:not(.active) a:hover:after,.atouch #layout-sidenav.layout-sidenav li:not(.active) a:hover:after{display:none !important}
#layout-side-panel .fix-button{position:absolute;right:-25px;top:0;display:none;width:25px;height:25px;font-size:13px;background:#ecf0f1;z-index:120;opacity:0.5;filter:alpha(opacity=50);-webkit-border-radius:0 4px 4px 0;-moz-border-radius:0 4px 4px 0;border-radius:0 4px 4px 0}
#layout-side-panel .fix-button i{display:block;text-align:center;margin-top:5px;color:#aaaaaa}
#layout-side-panel .fix-button:hover{text-decoration:none;display:block;opacity:1 !important;filter:alpha(opacity=100) !important}

View File

@ -83,7 +83,16 @@
}
}
@media (max-width: @screen-xs) {
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
#layout-sidenav {
font-size: 12px;
}
.layout-sidenav-container {
width: 100px;
}
}
@media (max-width: @screen-xs-max) {
#layout-sidenav {
font-size: 10px;
}

View File

@ -24,7 +24,7 @@
<a href="<?= $item->url ?>">
<span class="nav-icon">
<?php if ($item->iconSvg): ?>
<img class="svg-icon" src="<?= URL::asset($item->iconSvg) ?>">
<img class="svg-icon" src="<?= Url::asset($item->iconSvg) ?>">
<?php endif ?>
<i class="<?= $item->iconSvg ? 'svg-replace' : null ?> <?= $item->icon ?>"></i>
@ -42,7 +42,7 @@
<ul class="mainmenu-toolbar">
<li class="mainmenu-preview with-tooltip">
<a
href="<?= URL::to('/') ?>"
href="<?= Url::to('/') ?>"
target="_blank"
title="<?= e(trans('backend::lang.tooltips.preview_website')) ?>">
<i class="icon-crosshairs"></i>

View File

@ -7,7 +7,7 @@
$sideMenuItems = BackendMenu::listSideMenuItems();
?>
<?php if ($sideMenuItems): ?>
<div class="layout-cell w-120">
<div class="layout-cell layout-sidenav-container">
<div class="layout-relative">
<nav
id="layout-sidenav"