archive/bramw_baserow
1
0
Fork 0
mirror of https://gitlab.com/bramw/baserow.git synced 2025-04-04 13:15:24 +00:00
Code Issues Projects Releases Wiki Activity

made it possible to collapse sidebar

Browse source
This commit is contained in:
Bram Wiepjes 2019-03-27 20:08:47 +01:00
parent 0be9a2956f
commit f8231f53b7
2 changed files with 28 additions and 2 deletions
web-frontend
public
grid.html
src/scss/components
_layout.scss

14
web-frontend/public/grid.html
View file

@ -9,7 +9,7 @@
<title>Baserow</title>
</head>
<body>
<div class="layout">
<div class="layout layout-collapsed">
<div class="layout-col-1 menu">
<ul class="menu-items">
<li>
@ -26,6 +26,12 @@
</li>
</ul>
<ul class="menu-items">
<li class="layout-uncollapse">
<a href="#" class="menu-item" data-toggle-layout-collapse>
<i class="fas fa-angle-double-right"></i>
<span class="menu-item-text">Uncollapse</span>
</a>
</li>
<li>
<a href="#" class="user-item">
B
@ -167,7 +173,7 @@
</nav>
</div>
<div class="sidebar-footer">
<a href="#" class="sidebar-collapse">
<a href="#" class="sidebar-collapse" data-toggle-layout-collapse>
<i class="fas fa-angle-double-left"></i>
Collapse sidebar
</a>
@ -522,6 +528,10 @@
$("[data-context]").click(function() {
$(this).siblings($(this).attr("data-context")).toggleClass("hidden");
});
$("[data-toggle-layout-collapse]").click(function() {
$(".layout").toggleClass("layout-collapsed");
});
})();
</script>
</body>

16
web-frontend/src/scss/components/_layout.scss
View file

@ -22,6 +22,10 @@
top: 0;
bottom: 0;
width: 226px;
.layout-collapsed & {
display: none;
}
}
.layout-col-3 {
@ -31,6 +35,10 @@
top: 0;
bottom: 0;
right: 0;
.layout-collapsed & {
left: 52px;
}
}
.layout-col-3-1 {
@ -48,3 +56,11 @@
right: 0;
bottom: 0;
}
.layout-uncollapse {
display: none;
.layout-collapsed & {
display: block;
}
}