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

Pulkit Goyal 7895pulkit at gmail.com
Thu Dec 8 03:23:49 EST 2016


# HG changeset patch
# User Pulkit Goyal <7895pulkit at 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.

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; }


More information about the Mercurial-devel mailing list