Anonymous avatar Anonymous committed f78996d

styled nav

Comments (0)

Files changed (3)

ratemyflight/project_template/site_media/css/style.css

 #map_data { width: 950px; padding: 4px; height: 20px; position: absolute; z-index: 3; top: 0; background: rgba(64, 64, 64, 0.5); text-align: right; color: #fff; }
 #map_holder .close { float:right; text-decoration:none; font-size:18px; font-weight:bold; color:#fff; }
 #form_rater { width: 350px; background: rgba(21, 21, 21, 0.95); position: absolute; z-index: 100; top: 20px; left: -100px; -moz-border-radius: 10px; border-radius: 10px; border: 2px solid #fff; padding: 10px 20px; }
-#form_rater h2 { height: 30px; color: #fff; font-size: 21px; text-align: left; }
+#form_rater h2 { height: 30px; color: #65CCE7; font-size: 21px; text-align: left; }
 div.content a { text-decoration: none; color: #00bed4 }
 div.content a:hover { text-decoration: underline; }
 div.content a:visited { color: #c73e3d; }
 #footer { margin: 10px auto; text-align: center; }
-#footer > p { font-size: 14px; color: #23536e; }
+#footer p { font-size: 14px; color: #23536e; }
+#footer a, #footer a:visited { color: #65CCE7; text-decoration: none; }
+#footer a:hover { color: #23536e; text-decoration: underline; }
 .cl { clear: both; }
 form.rate li { list-style: none; }
 form.rate label { width: 50px; }
 form.rate th, form.rate td { padding: 5px; color: #fff; }
 form.rate td { font-size: 10px; text-align: left; }
 form.rate input, form.rate select, form.rate textarea { width: 120px; height: 10px; padding: 5px; border: 2px solid #65cce7; -moz-border-radius: 5px; border-radius: 5px; }
-form.rate select { height: 25px; width: 135px; }
+form.rate select { height: 25px; width: 135px;  }
 form.rate textarea { height: 60px; }
 form.rate input[type="submit"] { height: 40px; margin: 10px 0 0 25px; font-size: 18px; color:#fff; background: #212121; cursor: pointer; }
 form.rate input[type="submit"]:hover { background: #65cce7; color: #212121; }
 #rankings li:first-child { margin-bottom: 15px; }
 #rankings .ranking-icon { float: left; margin-right: 7px; }
 
-#nav { width:200px; margin:0 auto 10px auto; white-space:nowrap; }
-#nav li { display:inline; margin:0 10px; }
-#nav a { font-size:16px; }
+#nav { width:100%; height: 53px; white-space:nowrap; background: url("../img/bg-nav.gif") repeat-x 0 0; }
+#nav li { height: 46px; display:inline-block; color: #fff; margin:7px 0 0 10px; padding: 15px 20px 0; background: #22627f; border-top-left-radius: 5px; border-top-right-radius: 5px;  }
+#nav li.active { background: #fff; }
+
+#nav li:hover { background: #23536e; }
+#nav a { font-size:16px; color: #fff; text-decoration: none; font-weight: bold; }
+#nav li.active a { color: #23536e; }
+#nav li.active a:hover { color: #fff; }
+#nav a:hover { color: #fff; }
+
 .content { padding:50px; font-size:18px; line-height:24px; }
 .content h1, .content h2, .content p, .content pre { margin-bottom:20px; }
 .content pre { background:#eee; padding:20px; }
Add a comment to this file

ratemyflight/project_template/site_media/img/bg-nav.gif

Added
New image

ratemyflight/project_template/templates/base.html

 			</div>
 			
 			<ul id="nav">
-			    <li><a href="{% url home %}">Home</a></li>
+			    <li class="active"><a href="{% url home %}">Home</a></li>
 			    <li><a href="{% url about %}">About</a></li>
 			    <li><a href="{% url api %}">API</a></li>
+				<li><a href="">Rate a flight</a></li>
 			</ul>
 	
 			{% block main %}{% endblock %}
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.