Docker/documize
Docker/documize
1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-08-05 05:25:27 +02:00
Code Releases Activity

Provide the basic layout framework for UX/UI

Browse source
This commit is contained in:
Harvey Kandola 2018-05-22 15:56:54 +01:00
parent 942bc386f4
commit eb7ebf391d
18 changed files with 212 additions and 141 deletions
Download patch file Download diff file Expand all files Collapse all files

73
gui/app/styles/layout/layout-master.scss Normal file
View file

@ -0,0 +1,73 @@
.layout-header,
.layout-footer {
flex: 0 0 auto;
}
.layout-body {
display: flex;
flex: 1 0 auto;
flex-direction: column;
padding: 2rem;
}
.layout-content {
margin-top: 2rem;
}
.layout-sidebar {
order: -1;
background-color: $color-gray-light2;
padding: 1rem;
}
footer {
margin: auto auto 0 auto;
position: sticky;
bottom: 0;
}
@media (min-width: 720px) {
.layout-body {
flex-direction: row;
}
.layout-content {
flex: 1;
padding: 0 2rem;
margin: 0;
}
.layout-sidebar {
flex: 0 0 20rem;
height: calc(100vh - 145px);
overflow-x: hidden;
overflow-y: scroll;
}
}
@media (min-width: 1200px) {
.layout-sidebar {
flex: 0 0 30rem;
}
.layout-content {
padding: 0 2rem 0 3rem;
}
}
@media (min-width: 1800px) {
.layout-sidebar {
flex: 0 0 35rem;
}
.layout-content {
padding: 0 2rem 0 4rem;
}
}
@media (max-width: 576px) {
footer {
position: relative;
bottom: auto;
}
}