From 57348f6e71b0881f743d4bcb0b9674d786ff3e36 Mon Sep 17 00:00:00 2001 From: Go MAEDA Date: Sun, 15 Sep 2019 00:06:35 +0000 Subject: [PATCH] Constrain sidebar width on different resolutions (#32037). Patch by Antonio McDeal. git-svn-id: http://svn.redmine.org/redmine/trunk@18471 e93f8b46-1217-0410-a6f0-8f06a7374b81 --- public/stylesheets/application.css | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css index b2eb47167..b59ebb51b 100644 --- a/public/stylesheets/application.css +++ b/public/stylesheets/application.css @@ -85,7 +85,13 @@ div#wrapper, div#wrapper2, div#wrapper3 { min-height: inherit; } #main {flex-grow: 2; display: flex; flex-direction: row-reverse;} -#sidebar{ flex-shrink: 0; width: 22%; padding-left: 20px; background: #EEEEEE; border-left: 1px solid #ddd} +#sidebar{ flex-shrink: 0; padding-left: 20px; background: #EEEEEE; border-left: 1px solid #ddd} +@media screen and (min-width: 0px) and (max-width: 1089px) {#sidebar{width: 22%;}} +@media screen and (min-width: 1090px) and (max-width: 1279px) {#sidebar{width: 240px;}} +@media screen and (min-width: 1280px) and (max-width: 1599px) {#sidebar{width: 280px;}} +@media screen and (min-width: 1600px) and (max-width: 1919px) {#sidebar{width: 320px;}} +@media screen and (min-width: 1920px) and (max-width: 2559px) {#sidebar{width: 360px;}} +@media screen and (min-width: 2560px) {#sidebar{width: 380px;}} #sidebar h3{ font-size: 14px; margin-top:14px; color: #666; } #sidebar hr{ width: 100%; margin: 0 auto; height: 1px; background: #ccc; border: 0; } * html #sidebar hr{ width: 95%; position: relative; left: -6px; color: #ccc; }