lucas.mathieu/cachet-docker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Sidebar is better, but not responsive yet

Browse Source
This commit is contained in:
James Brooks
2014-12-13 13:08:18 +00:00
parent 5420ff91f7
commit 48f652b768
9 changed files with 246 additions and 273 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/sass/partials/_base.scss
View File

@@ -4,4 +4,8 @@ body.dashboard {
font-size: $base-font-size;
letter-spacing: $base-letter-spacing;
background: $base-background-color;
display: table;
width: 100%;
height: 100%;
table-layout: fixed;
}

7
app/assets/sass/partials/_content.scss
View File

@@ -1,5 +1,10 @@
body.dashboard {
.content {
padding-top: 69px;
position: relative;
display: table-cell;
vertical-align: top;
width: 100%;
.row {
margin: 10px 0;
}
@@ -21,4 +26,4 @@ body.dashboard {
}
}
}
}
}

94
app/assets/sass/partials/_sidebar.scss
View File

@@ -1,59 +1,59 @@
body.dashboard {
.sidebar {
height: 100%;
position: fixed;
z-index: 998;
display: table-cell;
vertical-align: top;
width: $sidebar-normal-width;
background: $sidebar-background-color;
transition: margin $sidebar-transition-speed;
@media #{$screen-sm-max} {
margin-left: -$sidebar-normal-width;
}
@media #{$screen-xs-max} {
width: $sidebar-phone-width;
margin-left: -$sidebar-phone-width;
}
.profile {
padding: 20px;
margin-bottom: 20px;
.avatar {
width: 70px;
img {
border-radius: 50%;
width: 60px;
}
}
.profile {
color: $sidebar-text-color;
}
}
ul {
clear: both;
margin: 0;
padding: 0;
list-style: none;
position: relative;
z-index: 100;
li {
font-size: 0.8em;
&:last-child {
border-bottom: $sidebar-border-color;
}
&.active {
background: lighten($sidebar-background-color, 10%);
a {
color: $sidebar-text-active-color;
.sidebar-inner {
position: relative;
margin-top: 69px;
.profile {
padding: 20px;
margin-bottom: 20px;
.avatar {
width: 70px;
img {
border-radius: 50%;
width: 60px;
}
}
a {
display: block;
padding: 15px;
border-top: $sidebar-border-color;
.profile {
color: $sidebar-text-color;
i {
padding-right: 10px;
}
}
ul {
clear: both;
margin: 0;
padding: 0;
list-style: none;
li {
font-size: 0.8em;
&:last-child {
border-bottom: $sidebar-border-color;
}
&:hover {
text-decoration: none;
&.active {
background: lighten($sidebar-background-color, 10%);
a {
color: $sidebar-text-active-color;
}
}
a {
display: block;
padding: 15px;
border-top: $sidebar-border-color;
color: $sidebar-text-color;
i {
padding-right: 10px;
}
&:hover {
text-decoration: none;
}
}
}
}

26
app/assets/sass/partials/_wrapper.scss
View File

@@ -1,26 +1,8 @@
body.dashboard {
.wrapper {
width: 100%;
position: absolute;
top: 0;
bottom: 0;
margin-top: 69px;
@media #{$screen-md-min} {
.content {
transition: margin $sidebar-transition-speed;
margin-left: $sidebar-normal-width;
}
}
&.active {
.sidebar {
margin-left: 0;
}
@media #{$screen-sm-min} {
.content {
transition: margin $sidebar-transition-speed;
margin-left: $sidebar-normal-width;
}
}
}
display: table;
height: 100%;
table-layout: fixed;
}
}
}