From b1870b1a096f98d2277efec3a2a3d555410d8c0f Mon Sep 17 00:00:00 2001 From: Misty Stanley-Jones Date: Mon, 9 Nov 2015 08:45:09 +1000 Subject: [PATCH 1/2] Interim --- src/main/site/resources/css/site.css | 55 +----------------------------------- src/main/site/site.xml | 5 ++-- 2 files changed, 4 insertions(+), 56 deletions(-) diff --git a/src/main/site/resources/css/site.css b/src/main/site/resources/css/site.css index 32ab564..a09fa6f 100644 --- a/src/main/site/resources/css/site.css +++ b/src/main/site/resources/css/site.css @@ -25,22 +25,12 @@ html { body { width: 100%; font-size: 16px; + max-width: 1000px; } li { line-height: 120%; } -div#topbar, -div#banner, -div#breadcrumbs, -div#bodyColumn, -footer { - width: 98%; - max-width: 1000px; - margin-left: 5px; - margin-right: 5px; - clear: both; -} footer { background-color: #e5e5e5; } @@ -55,14 +45,6 @@ li#publishDate.pull-right { margin-top: -23px; list-style: none; } -.container, -.navbar-static-top .container, -.navbar-fixed-top .container, -.navbar-fixed-bottom .container, -.navbar-inner { - width: 100%; - margin: 2px; -} /* Change the color and effect when clicking in menus */ .dropdown-menu>li>a:hover, @@ -75,41 +57,6 @@ li#publishDate.pull-right { font-weight: bolder; } -/* On small screens, put the search form on its own line */ -@media only screen and (max-width: 767px) { - body { - width: 100%; - font-size: 120%; - } - div#topbar, - div#banner, - div#breadcrumbs, - div#bodyColumn, - footer { - width: 98%; - margin-left: 5px; - margin-right: 5px; - clear: both; - margin-bottom: 2px; - } - div#banner { - margin-top: 90px; - } - form#search-form.navbar-search.pull-right, .pull-right { - width: 95%; - margin: 2px; - float: left; - clear: both; - } - li#publishDate.pull-right { - display: block; - width: 95%; - float: left; - margin-top: 5px; - list-style: none; - } -} - // Make the font size even bigger on high-DPI small-screen devices // such as iphone 6 and 6+ but not iPad (768 px) only screen and (max-width: 767px) and (-webkit-min-device-pixel-ratio : 1.5), diff --git a/src/main/site/site.xml b/src/main/site/site.xml index cf878be..4becd20 100644 --- a/src/main/site/site.xml +++ b/src/main/site/site.xml @@ -30,8 +30,9 @@ true - width: 98%; - false + true + span1 + span11 false true -- 2.4.9 (Apple Git-60) From 11711e1339130880b4d12ed0be6ff2675d66edbe Mon Sep 17 00:00:00 2001 From: Misty Stanley-Jones Date: Mon, 9 Nov 2015 15:15:54 +1000 Subject: [PATCH 2/2] HBASE-14785 Hamburger menu for mobile site --- src/main/site/resources/css/site.css | 59 +++++++++++++++++++++++++++++++++++- src/main/site/site.xml | 9 +++--- 2 files changed, 62 insertions(+), 6 deletions(-) diff --git a/src/main/site/resources/css/site.css b/src/main/site/resources/css/site.css index a09fa6f..af320cd 100644 --- a/src/main/site/resources/css/site.css +++ b/src/main/site/resources/css/site.css @@ -25,12 +25,22 @@ html { body { width: 100%; font-size: 16px; - max-width: 1000px; } li { line-height: 120%; } +div#topbar, +div#banner, +div#breadcrumbs, +div#bodyColumn, +footer { + width: 98%; + max-width: 1000px; + margin-left: 5px; + margin-right: 5px; + clear: both; +} footer { background-color: #e5e5e5; } @@ -45,6 +55,13 @@ li#publishDate.pull-right { margin-top: -23px; list-style: none; } +.container, +.navbar-static-top .container, +.navbar-fixed-top .container, +.navbar-fixed-bottom .container, +.navbar-inner { + width: 100%; +} /* Change the color and effect when clicking in menus */ .dropdown-menu>li>a:hover, @@ -57,6 +74,46 @@ li#publishDate.pull-right { font-weight: bolder; } +/* On small screens, put the search form on its own line */ +@media only screen and (max-width: 979px) { + body { + width: 100%; + font-size: 120%; + } + div#topbar, + div#banner, + div#breadcrumbs, + div#bodyColumn, + footer { + width: 98%; + margin-left: 5px; + margin-right: 5px; + clear: both; + height: auto; + } + .collapse.in { + height: auto; /* this style already exists in bootstrap.css */ + overflow: visible; /* this one doesn't. Add it! */ + } + .navbar-inner { + margin-top: -60px; + } + + form#search-form.navbar-search.pull-right, .pull-right { + width: 95%; + margin: 2px; + float: left; + clear: both; + } + li#publishDate.pull-right { + display: block; + width: 95%; + float: left; + margin-top: 5px; + list-style: none; + } +} + // Make the font size even bigger on high-DPI small-screen devices // such as iphone 6 and 6+ but not iPad (768 px) only screen and (max-width: 767px) and (-webkit-min-device-pixel-ratio : 1.5), diff --git a/src/main/site/site.xml b/src/main/site/site.xml index 4becd20..045c482 100644 --- a/src/main/site/site.xml +++ b/src/main/site/site.xml @@ -30,9 +30,7 @@ true - true - span1 - span11 + false false true @@ -54,9 +52,10 @@ - + + - + -- 2.4.9 (Apple Git-60)