[mobile ui] better sidebar with padding

This commit is contained in:
Faris Ansari 2016-07-28 12:50:33 +05:30
parent bab65fde2b
commit 497a458eb2
4 changed files with 51 additions and 9 deletions

View file

@ -219,7 +219,6 @@ body[data-route^="Module"] .main-menu .form-sidebar {
box-shadow: 5px 0 25px 0px rgba(0, 0, 0, 0.3);
height: 100%;
width: 40%;
padding: 25px;
display: block !important;
transition: transform 200ms ease-in-out;
}
@ -227,11 +226,31 @@ body[data-route^="Module"] .main-menu .form-sidebar {
transform: translateX(0);
overflow-y: auto;
}
.layout-side-section .overlay-sidebar .divider {
height: 1px;
background-color: #d8dfe5;
opacity: 0.7;
}
.layout-side-section .overlay-sidebar li:not(.divider):not(.tagit-new):not(.module-sidebar-item) {
padding: 10px 15px;
}
.layout-side-section .overlay-sidebar .modified-by,
.layout-side-section .overlay-sidebar .created-by {
margin: 0;
}
.layout-side-section .overlay-sidebar .badge {
top: 9px;
right: 15px;
}
.layout-side-section .overlay-sidebar .reports-dropdown {
margin: 10px 0;
margin-top: 10px;
margin-bottom: -10px;
}
.layout-side-section .overlay-sidebar .reports-dropdown li:not(.divider) {
padding: 10px 0;
padding: 12.5px 0 !important;
}
.layout-side-section .overlay-sidebar .reports-dropdown li.divider {
height: 0;
}
}
@media (max-width: 767px) {
@ -260,7 +279,7 @@ body[data-route^="Module"] .main-menu .form-sidebar {
padding-right: 0;
}
.layout-side-section .module-sidebar-nav .module-link {
padding-left: 25px;
padding: 15px 15px 15px 25px;
}
}
.sidebar-left .list-sidebar .stat-label,

View file

@ -36,7 +36,6 @@
<ul class="list-unstyled sidebar-menu form-attachments">
<li class="divider"></li>
<li class="h6 attachments-label">{%= __("Attachments") %}</li>
<li class="divider"></li>
<li><a class="strong add-attachment">{%= __("Attach File") %}
<i class="octicon octicon-plus" style="margin-left: 2px;"></i></li></a>
</ul>

View file

@ -13,6 +13,7 @@
</ul>
</div>
</li>
<li class="divider"></li>
<li class="hide tree-link"><a href="#Tree/{%= doctype %}">{%= __("Tree") %}</a></li>
<li class="hide calendar-link"><a href="#Calendar/{%= doctype %}">{%= __("Calendar") %}</a></li>
<li class="hide gantt-link"><a href="#Gantt/{%= doctype %}">{%= __("Gantt") %}</a></li>

View file

@ -288,7 +288,6 @@ body[data-route^="Module"] .main-menu {
box-shadow: 5px 0 25px 0px rgba(0,0,0,0.3);
height: 100%;
width: 40%;
padding: 25px;
display: block !important;
transition: transform 200ms ease-in-out;
@ -297,11 +296,35 @@ body[data-route^="Module"] .main-menu {
overflow-y: auto;
}
.divider {
height: 1px;
background-color: #d8dfe5;
opacity: 0.7;
}
li:not(.divider):not(.tagit-new):not(.module-sidebar-item) {
padding: 10px 15px;
}
.modified-by, .created-by {
margin: 0;
}
.badge {
top: 9px;
right: 15px;
}
.reports-dropdown {
margin: 10px 0;
margin-top: 10px;
margin-bottom: -10px;
li:not(.divider) {
padding: 10px 0;
padding: 12.5px 0 !important;
}
li.divider {
height: 0;
}
}
}
@ -334,7 +357,7 @@ body[data-route^="Module"] .main-menu {
padding-right: 0;
.module-link {
padding-left: 25px;
padding: 15px 15px 15px 25px;
}
}
}