Patchwork [1,of,2,hg-website] css: attach the navigation bar to top of the page

login
register
mail settings
Submitter Pulkit Goyal
Date Dec. 8, 2016, 8:23 a.m.
Message ID <5d30d7a345692b6656b6.1481185429@pulkit-goyal>
Download mbox | patch
Permalink /patch/17874/
State Accepted
Headers show

Comments

Pulkit Goyal - Dec. 8, 2016, 8:23 a.m.
# HG changeset patch
# User Pulkit Goyal <7895pulkit@gmail.com>
# Date 1481184916 -19800
#      Thu Dec 08 13:45:16 2016 +0530
# Node ID 5d30d7a345692b6656b60c9f4dab86f012b391eb
# Parent  8a0dad3adbf7f076bb2daf64c1bcb97117e6e67b
css: attach the navigation bar to top of the page

Currently the navigation bar doesn't looks good as there is some space between
the top and bar. This patch removes that, bring the words in the center and
align the search bar with the menu options.

Patch

diff -r 8a0dad3adbf7 -r 5d30d7a34569 static/css/styles.css
--- a/static/css/styles.css	Fri Sep 30 16:37:49 2016 -0500
+++ b/static/css/styles.css	Thu Dec 08 13:45:16 2016 +0530
@@ -106,15 +106,15 @@ 
 /*
  * Nav
  */
-#nav { position: absolute; top: 17px; right: 0; background: #999; height: 42px; margin: 0; width: 725px; font-size: 1em; *font-size: 16px; line-height: 42px; font-family: Optimer, DejaVuSans, Helvetica, Arial, sans-serif; overflow: hidden; }
+#nav { position: absolute; top: 0px; right: 0; background: #999; height: 61px; margin: 0; width: 725px; font-size: 1em; *font-size: 16px; line-height: 42px; font-family: Optimer, DejaVuSans, Helvetica, Arial, sans-serif; overflow: hidden; }
 #nav li { float: left; margin: 0; padding: 0; list-style: none; }
-#nav a { float: left; color: #fff; text-decoration: none; padding: 0 16px; *padding: 0 14px; }
+#nav a { float: left; color: #fff; text-decoration: none; padding: 14px 21px; *padding: 0 14px; }
 #nav a:hover, #nav a:focus, #nav .active a { background: #00b5f1; }
 
 /*
  * Search
  */
-#search { position: absolute; right: 15px; top: 26px; color: #fff; width: 183px; height: 23px; background: url(../images/search.png) no-repeat 0 0; }
+#search { position: absolute; right: 15px; top: 21px; color: #fff; width: 180px; height: 23px; background: url(../images/search.png) no-repeat 0 0; }
 #search legend { display: none; }
 #search label { position: absolute; left: -9999px; }
 #search .text { width: 150px; background: none; border: none; margin: 0 0 0 5px; position: relative; top: 5px; color: #666; outline:0; }