Make the sidebar relative/responsive

This commit is contained in:
Frederic Guillot 2015-02-07 16:42:38 -05:00
parent d3205f1de4
commit 36bbd04c52
3 changed files with 35 additions and 50 deletions

View File

@ -1904,20 +1904,16 @@ a.task-board-nobody {
font-size: 1.1em;
}/* sidebar */
.sidebar-container {
margin-top: 30px;
position: relative;
clear: both;
}
.sidebar-content {
margin-left: 280px;
margin-left: 23%;
}
.sidebar {
position: absolute;
left: 0px;
top: 0;
max-width: 250px;
min-width: 200px;
width: 20%;
float: left;
padding: 10px;
padding-top: 0;
border: 1px solid #ddd;
@ -1929,7 +1925,20 @@ a.task-board-nobody {
list-style-type: square;
margin-left: 30px;
line-height: 1.8em;
}/* responsive design */
}
@media only screen and (max-width: 767px) {
.sidebar {
width: 96.5%;
float: none;
}
.sidebar-content {
margin: 0;
margin-top: 20px;
}
}
/* responsive design */
@media only screen and (max-width: 1024px) {
li.hide-tablet,
@ -1941,10 +1950,6 @@ a.task-board-nobody {
font-size: 0.85em;
}
.sidebar-content {
margin-left: 255px;
}
.form-tab {
max-width: 404px;
}
@ -1974,22 +1979,10 @@ a.task-board-nobody {
@media only screen and (max-width: 1024px) and (orientation: landscape) {
body {
font-size: 0.7em;
}
header {
padding-bottom: 4px;
}
.sidebar {
max-width: 220px;
}
.sidebar-content {
margin-left: 225px;
}
div.chosen-container {
font-size: 0.9em;
}

View File

@ -10,10 +10,6 @@
font-size: 0.85em;
}
.sidebar-content {
margin-left: 255px;
}
.form-tab {
max-width: 404px;
}
@ -43,22 +39,10 @@
@media only screen and (max-width: 1024px) and (orientation: landscape) {
body {
font-size: 0.7em;
}
header {
padding-bottom: 4px;
}
.sidebar {
max-width: 220px;
}
.sidebar-content {
margin-left: 225px;
}
div.chosen-container {
font-size: 0.9em;
}

View File

@ -1,19 +1,15 @@
/* sidebar */
.sidebar-container {
margin-top: 30px;
position: relative;
clear: both;
}
.sidebar-content {
margin-left: 280px;
margin-left: 23%;
}
.sidebar {
position: absolute;
left: 0px;
top: 0;
max-width: 250px;
min-width: 200px;
width: 20%;
float: left;
padding: 10px;
padding-top: 0;
border: 1px solid #ddd;
@ -25,4 +21,16 @@
list-style-type: square;
margin-left: 30px;
line-height: 1.8em;
}
}
@media only screen and (max-width: 767px) {
.sidebar {
width: 96.5%;
float: none;
}
.sidebar-content {
margin: 0;
margin-top: 20px;
}
}