modify CSS for navbar

HPC-workshops · Feb 4, 2015 · def3c13 · def3c13
1 parent d9e358e
commit def3c13
Showing 1 changed file with 82 additions and 64 deletions.
diff --git a/css/swc.css b/css/swc.css
@@ -157,91 +157,121 @@ pre.error {
 /* Override Bootstrap CSS                 */
 /*----------------------------------------*/
 
-blockquote p {
-    font-size: inherit;
-    font-weight: inherit;
-    line-height: inherit;
-}
 
-blockquote h2{
-   margin-top: 0px;
+/* navbar */
+.navbar-nav {
+  margin: 0px 10px 0px 0px;
 }
 
-/* readability: darken the alert colour for contrast with background */
-
-.alert {
-    color: rgb(0, 0, 0);
+#swc-navbar {
+    border-top: 5px solid #2b3990;
+    width: 100%;
+    background:  #d6d6d6;
+    border-bottom: 1px solid #CCC;
 }
 
-.navbar-nav {
-  margin:0;
+.navbar-nav .container-fluid {
+    padding: 27px 10px 0px 10px;
+    width: 80%;
 }
 
-.navbar-nav .container {
-    font-size:11pt;
-    padding: 27px 10px 0px 10px;
-    background: url('../img/software-carpentry-banner.png') no-repeat #d6d6d6;
-    border-top: 5px solid #2b3990;
-    background-size: 250px;
-    background-position: 10px 10px;
-    border-bottom: 1px solid #CCC;
+.navbar-brand {
+   position: absolute;
+   top: 0px;
+   left: 15%;
 }
 
+.navbar-brand img {
+    width: 250px;
+    height: 50px;
+}
 
-/* Container for page contents. */
-.container-full-width {
-	max-width: none;
+#swc-navbar-search {
+  background-color: #ffffff;
+  color: #666666;
+  border-color:#2b3990;
+  width:150px;
 }
 
-.container .jumbotron {
-    padding: 20px;
+.navbar-nav a {
+   color: #20267D;
 }
 
-.navbar .container {
-    background-color: inherit;
+.navbar-nav li {
+    margin-right: -5px;
+    margin-left: -5px;
 }
 
-.navbar-inner {
-    min-height: 40px;
-    padding-right: 20px;
-    padding-left: 20px;
-    background-color: #F4F4F4;
-    background-image: none;
-    border: 1px solid #d4d4d4;
-    -webkit-border-radius: 0;
-    -moz-border-radius: 0;
-    border-radius: 0;
+.navbar-nav .navbar {
+    diplay: inline-block;
+    float: none;
 }
 
-code {
-    color: #333333;
+.navbar .navbar-collapse {
+    text-align: center;
 }
 
-.navbar-inverse .navbar-inner {
-    background-color: #20267D;
-    background-image: none;
-    border-color: #20267D;
+.navbar-nav .nav-collapse .nav > li > a,
+.navbar-nav .nav-collapse .dropdown-menu a {
+  color: #2b3990;
+  text-align: center;
 }
-.navbar-inverse .nav .active > a,
-.navbar-inverse .nav .active > a:hover, .navbar-inverse .nav .active > a:focus {
+
+.navbar-nav .nav .active > a,
+.navbar-nav .nav .active > a:hover, .navbar-nav .nav .active > a:focus {
     color: #ffffff;
     background-color: #20267D;
 }
-.navbar-inverse .nav li.dropdown.open > .dropdown-toggle,
-.navbar-inverse .nav li.dropdown.active > .dropdown-toggle,
-.navbar-inverse .nav li.dropdown.open.active > .dropdown-toggle {
+
+.navbar-nav .nav li.dropdown.open > .dropdown-toggle,
+.navbar-nav .nav li.dropdown.active > .dropdown-toggle,
+.navbar-nav .nav li.dropdown.open.active > .dropdown-toggle {
     color: #ffffff;
-    background-color: #20267D;
+     background-color: #20267D;
 }
-.navbar-inverse .nav li.dropdown.active > .dropdown-toggle .caret {
+.navbar-nav .nav li.dropdown.active > .dropdown-toggle .caret {
     border-top-color: #999999;
     border-bottom-color: #999999;
 }
-.navbar-inverse .nav li.dropdown.open > .dropdown-toggle .caret {
+.navbar-nav .nav li.dropdown.open > .dropdown-toggle .caret {
     border-top-color: #ffffff;
     border-bottom-color: #ffffff;
 }
 
+
+
+
+blockquote p {
+    font-size: inherit;
+    font-weight: inherit;
+    line-height: inherit;
+}
+
+blockquote h2{
+   margin-top: 0px;
+}
+
+/* readability: darken the alert colour for contrast with background */
+
+.alert {
+    color: rgb(0, 0, 0);
+}
+
+
+/* Container for page contents. */
+.container-full-width {
+	max-width: none;
+}
+
+.container .jumbotron {
+    padding: 20px;
+}
+
+code {
+    color: #333333;
+}
+
+
 /* Top banner of every page. */
 div.banner {
 	background-color: #FFFFFF;
@@ -472,15 +502,6 @@ section.content {
     margin:0;
 }
 
-#nav-logo {
-    width: 270px;
-    height: 40px;
-    top: 5px;
-    left: 10px;
-    position: absolute;
-    z-index: 10;
-}
-
 #home-options {
     background:#F6F6F6;
     border-top:1px solid #DDDDDD;
@@ -649,9 +670,6 @@ div.chapter h2 {
 
 /* GitHub ribbon breaking point */
 @media screen and (min-width: 600px) {
-    .navbar .btn-navbar {
-        margin-right: 150px;
-    }
     #github-ribbon {
         position: absolute;
         display: block;