diff options
-rw-r--r-- | assets/css/app.css | 43 | ||||
-rw-r--r-- | assets/css/src/responsive.css | 16 | ||||
-rw-r--r-- | assets/css/src/sidebar.css | 26 |
3 files changed, 35 insertions, 50 deletions
diff --git a/assets/css/app.css b/assets/css/app.css index d30ec528..5e65f997 100644 --- a/assets/css/app.css +++ b/assets/css/app.css @@ -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; } diff --git a/assets/css/src/responsive.css b/assets/css/src/responsive.css index f319c341..78a7a478 100644 --- a/assets/css/src/responsive.css +++ b/assets/css/src/responsive.css @@ -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; } diff --git a/assets/css/src/sidebar.css b/assets/css/src/sidebar.css index 73a99008..5413f7f6 100644 --- a/assets/css/src/sidebar.css +++ b/assets/css/src/sidebar.css @@ -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; -}
\ No newline at end of file +} + +@media only screen and (max-width: 767px) { + .sidebar { + width: 96.5%; + float: none; + } + + .sidebar-content { + margin: 0; + margin-top: 20px; + } +} |