[PATCH 06/19] ui: Let the bootstrap inverse navbar style shine through

Stephen Finucane stephen.finucane at intel.com
Thu Feb 4 08:31:41 AEDT 2016


From: Damien Lespiau <damien.lespiau at intel.com>

Time for another iteration of the design. Let's start by using the
inverse bootsrap style with a slightly whiter color for font for better
contrast.

That color change has repercussions in the style sheet, mostly in the
custom containers/boxes we're still using on the secondary pages
(login/register/...)

Signed-off-by: Damien Lespiau <damien.lespiau at intel.com>
Acked-by: Stephen Finucane <stephen.finucane at intel.com>
---
 htdocs/css/style.css | 56 +++++++++++++++-------------------------------------
 templates/base.html  |  2 +-
 2 files changed, 17 insertions(+), 41 deletions(-)

diff --git a/htdocs/css/style.css b/htdocs/css/style.css
index 96ae809..e86a88a 100644
--- a/htdocs/css/style.css
+++ b/htdocs/css/style.css
@@ -1,11 +1,3 @@
-a {
-	color: #2E2E70;
-}
-
-a:hover {
-	color: #0A0A47;
-}
-
 h2 {
 	font-size: 25px;
 	margin: 18px 0 18px 0;
@@ -30,29 +22,12 @@ pre {
 }
 
 .navbar-patchwork {
-	background-color: #0A0A47;
-	border-color: #e7e7e7;
-	margin-bottom: 0;
-	border-radius: 0;
-	color: #fff;
-}
-
-.navbar-patchwork .navbar-toggle {
-	border-color: #ddd;
+	border-radius: 0px;
+	margin-bottom: 0px;
 }
 
-.navbar-patchwork .nav > li > a:hover,
-.navbar-patchwork .nav > li > a:focus {
-	text-decoration: none;
-	background-color: #2E2E70;
-}
-
-.navbar-patchwork .navbar-toggle .icon-bar {
-	background-color: #eee;
-}
-
-.navbar-patchwork a {
-	color: #fff;
+.navbar-patchwork .navbar-nav>li>a {
+	color: #999;
 }
 
 #breadcrumb {
@@ -369,7 +344,7 @@ table.bundlelist td
 
 /* forms that appear for a patch */
 div.patchform {
-	border: thin solid gray;
+	border: thin solid #080808;
 	padding-left: 0.6em;
 	padding-right: 0.6em;
 	float: left;
@@ -381,8 +356,8 @@ div.patchform h3 {
 	margin-left: -0.6em;
 	margin-right: -0.6em;
 	padding: 0.3em 0.3em 0.3em 0.6em;
-	background-color: #0A0A47;
-	color: white;
+	background-color: #222;
+	color: #999;
 	font-size: 100%;
 }
 
@@ -407,8 +382,8 @@ table.form td {
 }
 
 table.form th.headerrow {
-	background: #0A0A47;
-	color: white;
+	background: #222;
+	color: #999;
 	font-weight: bold;
 	text-align: center;
 }
@@ -427,7 +402,8 @@ table.form td.form-help {
 }
 
 table.form tr td.submitrow {
-	border-bottom: 0.2em solid #0A0A47;
+	border-bottom: 0.2em solid #222;
+	color: #333;
 	text-align: center;
 }
 
@@ -472,8 +448,8 @@ table.vertical {
 	border-collapse: collapse;
 }
 table.vertical th {
-	background: #0A0A47;
-	color: white;
+	background: #222;
+	color: #999;
 	font-weight: bold;
 	text-align: center;
 }
@@ -489,14 +465,14 @@ td.numberformat {
 
 /* boxes */
 div.box {
-	border: thin solid gray;
+	border: thin solid #080808;
 	margin: 1em;
 	padding: 0.5em;
 }
 
 div.box h2 {
-	background: #0A0A47;
-	color: white;
+	background: #222;
+	color: #999;
 	margin: -0.5em -0.5em 1em; -0.5em;
 	padding: 0.3em 0.3em 0.3em 0.6em;
 	font-size: 100%;
diff --git a/templates/base.html b/templates/base.html
index dec904b..c0008f7 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -24,7 +24,7 @@
 {% block headers %}{% endblock %}
  </head>
  <body>
-  <nav class="navbar navbar-patchwork" role="navigation">
+  <nav class="navbar navbar-inverse navbar-patchwork" role="navigation">
    <div class="container-fluid">
     <div class="navbar-header">
       <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse">
-- 
2.0.0



More information about the Patchwork mailing list