Merge lp:~ronnie.vd.c/ubuntu-nl-artwork/smf-common-header into lp:ubuntu-nl-artwork/light-smf-theme

[Ronnie]

Integratie van de globale site header

=== modified file 'css/index.css'
--- css/index.css	2011-09-25 17:23:29 +0000
+++ css/index.css	2011-11-26 12:30:30 +0000
@@ -33,8 +33,8 @@
 /* Set a fontsize that will look the same in all browsers. */
 body
 {
-	background: #FFF url(../images/theme/backdrop.png);
-	font: 80%/130% "Ubuntu", "Verdana", "Arial", "Helvetica", sans-serif;
+    background: url("../images/dotted.png") repeat scroll 0 0 #F7F7F7;
+	font: 80%/130% 'Ubuntu','Ubuntubeta','Bitstream Vera Sans','DejaVu Sans',Tahoma,sans-serif;
 	margin: 0 auto;
 }
 
@@ -48,7 +48,6 @@
 body, td, th, tr
 {
 	color: #333;
-	width: 980px;
 }
 
 /* This division wraps the entire forum when a forum width is set. */
@@ -971,6 +970,10 @@
 	padding: 0.5em 1.2em;
 	margin: 0;
 	border: none;
+	background-color: #FFFFFF;
+    border-radius: 4px 4px 4px 4px;
+    box-shadow: 1px 1px 2px #CCCCCC;
+    margin: 10px 0;
 }
 .content p
 {
@@ -1021,10 +1024,6 @@
 {
     display: none;
 }
-#page-related
-{
-    min-height: 40px;
-}
 .dropmenu, .dropmenu ul
 {
 	list-style: none;
@@ -1092,14 +1091,13 @@
 	z-index: 90;
 	display: block;
 	font-weight: normal;
-	width: 920px;
-	margin: 0 20px;
-	padding: 0 10px;
-	background-color: #f7f7f7;
 	height: 40px;
-	border-bottom-left-radius: 8px;
-    border-bottom-right-radius: 8px;
+
+    background-color: #F7F7F7;
     box-shadow: 0 1px 1px #DFDFDF;
+    margin: 2px 0 20px;
+    padding: 0;
+    width: 100%;
 }
 #main_menu .dropmenu li:hover ul
 {
@@ -1310,10 +1308,11 @@
     clear: both;
     background-color: #fff;
 }
-#header div.frame
-{   
-    border-left: 1px solid #efefef;
-    border-right: 1px solid #efefef;
+#header .container {
+    max-width: 980px;
+    margin: 0 auto;
+    overflow: hidden;
+    height: 65px;
 }
 /* the content section */
 #content_section
@@ -1464,33 +1463,36 @@
     margin-right: 14px;
     font-size: 0.8em;
 }
-#top_section
-{
-	min-height: 70px;
-	background:	url("../images/header.png") repeat-x scroll 0 0 #DD4814;
+#top-section {
+    background-color: #DD4814;
+    box-shadow: 0 1px 1px #C8C8C8;
+    height: 65px;
+}
+#main-nav:after {
+    content: url("../images/topnav_divider.png");
+    float: left;
+}
+#main-nav:before {
+    content: url("../images/topnav_divider.png");
+    float: left;
 }
 #main-nav {
-    border-left: 1px solid #EF7149;
-    z-index: 10;
+    border-left: medium none;
+    height: 65px;
+    max-width: 770px;
+    width: auto;
+    font-size: 14px;
     float: left;
-    font-size: 0.875em;
-    padding-left: 10px;
 }
-#main-nav .main-nav-item, #main-nav .main-nav-item:visited {
-    border-bottom: 0 none;
-    border-right: 1px solid #EF7149;
-    border-top: 0 none;
+a.main-nav-item, a.main-nav-item:visited {
+    line-height: 65px;
     color: #FFFFFF;
     display: block;
     float: left;
-    height: 70px;
-    line-height: 70px;
-    margin: 0;
     padding: 0 15px;
     text-shadow: 1px 1px 1px #333333;
-    font-size: 1.2em;
 }
-.main-nav-item.current, .main-nav-item:hover, .main-nav-item:active, .main-nav-item:focus {
+a.main-nav-item.current, a.main-nav-item:hover, a.main-nav-item:active, a.main-nav-item:focus {
     background: url("../images/mainnav.png") repeat scroll 0 0 transparent;
     text-decoration: none;
 }
@@ -1499,7 +1501,7 @@
     line-height: 1.5em;
     text-align: right;
     float: right;
-    margin: 5px 10px 5px 0;
+    margin: 0 10px 5px 0;
     padding: 10px 10px 0 0;
     width: 180px;
     font-size: 0.875em;
@@ -1517,29 +1519,30 @@
     color: #FFFFFF;
     display: block;
     float: right;
-    font-size: 1.4em;
+    font-size: 14px;
     font-weight: normal;
+    line-height: 21px;
 }
 #sub-nav-container {
-    background-color: #F7F7F7;
-    border-bottom-left-radius: 8px;
-    border-bottom-right-radius: 8px;
-    box-shadow: 0 1px 1px #DFDFDF;
-    height: 40px;
-    margin: 0 10px;
-    width: 940px;
+    margin: 0 auto;
+    width: 980px;
 }
 #sub-nav {
     float: left;
     padding: 0 10px;
-    font-size: 0.75em;
+    font-size: 12px;
 }
-.sub-nav-item, .sub-nav-item:visited {
+a.sub-nav-item, a.sub-nav-item:visited {
     color: #333333;
     display: block;
     float: left;
     line-height: 40px;
-    padding: 0 10px 0 10px;
+    margin: 0;
+    padding: 0 15px;
+}
+a.sub-nav-item.current, a.sub-nav-item:hover, a.sub-nav-item:active, a.sub-nav-item:focus {
+    background-color: #EFEFEF;
+    color: #DD4814;
 }
 #upper_section
 {

=== added file 'images/dotted.png'
Binary files images/dotted.png	1970-01-01 00:00:00 +0000 and images/dotted.png	2011-11-26 12:30:30 +0000 differ
=== added file 'images/topnav_divider.png'
Binary files images/topnav_divider.png	1970-01-01 00:00:00 +0000 and images/topnav_divider.png	2011-11-26 12:30:30 +0000 differ
=== modified file 'index.template.php'
--- index.template.php	2011-09-25 17:23:29 +0000
+++ index.template.php	2011-11-26 12:30:30 +0000
@@ -173,15 +173,51 @@
 {
 	global $context, $settings, $options, $scripturl, $txt, $modSettings;
 
-	echo !empty($settings['forum_width']) ? '
-<div id="wrapper" style="width: ' . $settings['forum_width'] . '">' : '', '
-    <div id="top-nav">
-        <div class="container">
-            <div id="top-login">';
+	echo'
+	<div id="header"><div class="frame">
+		<div id="top-section">
+            <div class="container">
+                <div id="main-nav">
+                    <a href="http://communityserver.ubuntu-nl.org/ubuntu" class="main-nav-item">Ubuntu</a>
+                    <a href="http://communityserver.ubuntu-nl.org/ondersteuning" class="main-nav-item current">Ondersteuning</a>
+                    <a href="http://communityserver.ubuntu-nl.org/gemeenschap" class="main-nav-item">Gemeenschap</a>
+                    <a href="http://communityserver.ubuntu-nl.org/agenda" class="main-nav-item">Agenda</a>
+                    <a href="http://communityserver.ubuntu-nl.org/nieuws" class="main-nav-item">Nieuws</a>
+                    <a href="http://communityserver.ubuntu-nl.org/partners" class="main-nav-item">Partners</a>
+                </div>
+                <h1 id="top-logo">
+		            <a href="/">
+                        <span id="the-logo"></span>
+                        <span id="loco">'.$context['forum_name'].'</span>
+		            </a>
+                </h1>
+            </div>
+	    </div>
+	    <div id="page-related">
+            <div id="sub-nav-container" class="container">
+                <div id="sub-nav">
+                    <a href="http://wiki.ubuntu-nl.org/" class="sub-nav-item">Documentatie</a>
+                    <a href="/forum/" class="sub-nav-item current">Forum</a>
+                    <a href="http://chat.ubuntu-nl.org/" class="sub-nav-item">Live chat</a>
+                    <a href="http://kaart.ubuntu-nl.org/" class="sub-nav-item">Steunpunten</a>
+                    <a href="http://lists.ubuntu-nl.org/" class="sub-nav-item">Mailinglijst</a>
+                    <a href="http://www.ubuntu.com/support/community" class="sub-nav-item">Engelstalig</a>
+                </div>
+            </div>
+        </div>
+    </div></div>';
+    
+    echo !empty($settings['forum_width']) ? '
+    <div id="wrapper" style="width: ' . $settings['forum_width'] . '">' : '','
+        <div class="content">
+		<div id="upper_section" class="middletext">
+		    <div id="top-login">';
                 if ($context['user']['is_logged']) {
                     echo'
                     <ul class="reset">
+
 					    <li class="greeting">', $txt['hello_member_ndt'], ' <span>', $context['user']['name'], '</span></li>
+
 					    <li><a href="', $scripturl, '?action=unread">', $txt['unread_since_visit'], '</a></li>
 					    <li><a href="', $scripturl, '?action=unreadreplies">', $txt['show_unread_replies'], '</a></li>';
 				    // Is the forum in maintenance mode?
@@ -204,30 +240,6 @@
                 }
                 echo '
             </div>
-            <div id="top-related">
-                <a href="http://www.ubuntu.com" class="top-nav-item">Website</a>
-                <a href="http://www.ubuntu.com/community" class="top-nav-item">Forum</a>
-                <a href="http://www.ubuntu.com/support" class="top-nav-item">Documentatie</a>
-                <a href="http://www.ubuntu.com/partners" class="top-nav-item">Nieuws</a>
-            </div>
-        </div>
-    </div>
-	<div id="header"><div class="frame">
-		<div id="top_section">
-            <div class="container">',
-	                template_menu()
-                ,'
-                <h1 id="top-logo">
-		            <a href="/">
-                        <span id="the-logo"></span>
-                        <span id="loco">Nederlands Forum</span>
-		            </a>
-                </h1>
-            </div>
-	    </div>
-	    <div id="page-related">
-        </div>
-		<div id="upper_section" class="middletext">
 			<div class="user">';
 			    // Show a random news item? (or you could pick one from news_lines...)
 	            if (!empty($settings['enable_news']))
@@ -287,22 +299,26 @@
 			});
 		// ]]></script>';
 
-	// Show the menu here, according to the menu sub template.
-	//template_menu();
+	
+
+    // Custom banners and shoutboxes should be placed here, before the linktree.
+    // Show the navigation tree.
+	theme_linktree();
 
 	echo '
 		<br class="clear" />
-	</div></div>';
+	</div>';
 
 	// The main content should go here.
 	echo '
 	<div id="content_section"><div class="frame">
 		<div id="main_content_section">';
-
-	// Custom banners and shoutboxes should be placed here, before the linktree.
-
-	// Show the navigation tree.
-	theme_linktree();
+		
+	// Show the menu here, according to the menu sub template.
+	template_menu();
+	
+	echo'
+	    <br class="clear" />';
 }
 
 function template_body_below()
@@ -395,8 +411,8 @@
 	global $context, $settings, $options, $scripturl, $txt;
 
 	echo '
-		<div id="main_menu">
-			<ul class="dropmenu" id="menu_nav">';
+		<div id="smf_main_menu">
+			<ul class="dropmenu" id="smf_menu_nav">';
 
 	foreach ($context['menu_buttons'] as $act => $button)
 	{