*/\r
init: function(activeMenuItems) {\r
this._headerNavigation = $('nav#navigationTop');\r
- this._sidebarNavigation = $('nav#navigationSide');\r
+ this._sidebarNavigation = $('nav#navigationSidebar');\r
\r
this._prepareElements(activeMenuItems);\r
},\r
_prepareElements: function(activeMenuItems) {\r
this._headerNavigation.find('li').removeClass('activeMenuItem');\r
\r
- this._sidebarNavigation.find('div.menuContainer h3').each($.proxy(function(index, menuHeader) {\r
+ this._sidebarNavigation.find('div.menuContainer h1').each($.proxy(function(index, menuHeader) {\r
$(menuHeader).click($.proxy(this._toggleItem, this));\r
}, this));\r
\r
font-size: .8em;\r
}\r
\r
+img {\r
+ vertical-align: middle !important;\r
+}\r
+\r
a {\r
color: #00c;\r
text-decoration: none;\r
}\r
\r
header {\r
- border-bottom: 1px solid #ccc;\r
- margin: 21px;\r
- padding: 21px;\r
- padding-bottom: 0;\r
+ margin: 0 23px 23px 23px;\r
}\r
\r
header div#logo h1 {\r
width: 300px;\r
}\r
\r
+/* -- -- -- -- -- Tabs -- -- -- -- -- */\r
+\r
+nav#navigationTop {\r
+ margin: 0 10px;\r
+}\r
+\r
+nav#navigationTop:after {\r
+ content: "";\r
+ display: block;\r
+ clear: both;\r
+}\r
+\r
nav#navigationTop li {\r
- background-color: #eee;\r
- border: 1px solid #ccc;\r
+ font-size: 110%;\r
+ font-weight: normal;\r
+ color: #ccc;\r
+ background-color: #000;\r
border-bottom: 0;\r
cursor: pointer;\r
display: inline-block;\r
- padding: 7px;\r
+ margin: 5px 0 0 0;\r
+ padding: 10px 20px;\r
+ float: left;\r
+}\r
+\r
+nav#navigationTop li:after {\r
+ content: "";\r
+ display: block;\r
+ clear: both;\r
+}\r
+\r
+nav#navigationTop li:hover {\r
+ color: #fff;\r
}\r
\r
nav#navigationTop li.activeMenuItem {\r
- background-color: #faebd7;\r
+ font-weight: bold;\r
+ color: #369;\r
+ background-color: #e7f2fd;\r
border-color: #ff8800;\r
+ border-radius: 7px 7px 0 0;\r
+ margin: 0;\r
+ padding-top: 15px;\r
}\r
\r
-nav#navigationSide div.menuContainer h3 {\r
+nav#navigationSidebar div.menuContainer h1 {\r
background-color: #eee;\r
background-image: url("../../icon/testing/arrowRightS.png");\r
background-position: 7px center;\r
background-repeat: no-repeat;\r
border: 1px solid #ccc;\r
border-top-width: 0;\r
+ color: #369;\r
cursor: pointer;\r
font-size: 120%;\r
+ font-weight: bold;\r
padding: 7px;\r
padding-left: 28px;\r
position: relative;\r
}\r
\r
-nav#navigationSide div.menuContainer h3.activeMenuItem {\r
+nav#navigationSidebar div.menuContainer h1.activeMenuItem {\r
background-image: url("../../icon/testing/arrowDownS.png");\r
}\r
\r
-nav#navigationSide div.menuContainer h3:first-child {\r
+nav#navigationSidebar div.menuContainer h1:first-child {\r
border-top: 1px solid #ccc;\r
}\r
\r
-nav#navigationSide div.menuContainer div {\r
+nav#navigationSidebar div.menuContainer div {\r
background-color: #fefefe;\r
border: 1px solid #ccc;\r
border-top-width: 0;\r
}\r
\r
-nav#navigationSide div.menuContainer ul li {\r
+nav#navigationSidebar div.menuContainer ul li {\r
padding: 7px 7px 7px 21px;\r
}\r
\r
-nav#navigationSide div.menuContainer ul li.activeMenuItem {\r
+nav#navigationSidebar div.menuContainer ul li.activeMenuItem {\r
background-color: #faebd7;\r
}\r
\r
-nav#navigationSide div.menuContainer ul li.activeMenuItem a {\r
+nav#navigationSidebar div.menuContainer ul li.activeMenuItem a {\r
color: #ff8800;\r
font-weight: bold;\r
}\r
\r
-nav#navigationSide div.menuContainer ul li a {\r
+nav#navigationSidebar div.menuContainer ul li a {\r
text-decoration: none !important;\r
}\r
\r
-nav#navigationSide div.menuContainer ul li a:hover {\r
+nav#navigationSidebar div.menuContainer ul li a:hover {\r
text-decoration: underline !important;\r
}\r
\r
padding: 21px;\r
}\r
\r
+/* -- -- -- -- -- Footer -- -- -- -- -- */\r
+\r
footer {\r
background-color: #eee;\r
border: 1px solid #ccc;\r
- border-bottom-width: 0;\r
clear: both;\r
margin: 0 21px 0;\r
padding: 7px;\r
}\r
\r
+footer:after {\r
+ content: "";\r
+ display: block;\r
+ clear: both;\r
+}\r
+\r
footer p.copyright {\r
display: inline-block;\r
+ float: left;\r
}\r
\r
footer nav#navigationFooter {\r
display: inline-block;\r
}\r
\r
+footer .toTopLink {\r
+ float: right;\r
+}\r
+\r
+\r
+\r
div.wcfDimensions {\r
display: inline-block;\r
}\r
</header>\r
\r
<!-- CONTENT -->\r
- <div id="main">\r
+ <div id="main" class="main">\r
<aside>\r
<!-- sub nav -->\r
- <nav id="navigationSide">\r
+ <nav id="navigationSide" class="sideBar">\r
{* work-around for unknown core-object during WCFSetup *}\r
{if PACKAGE_ID}\r
{foreach from=$__wcf->getACPMenu()->getMenuItems('') item=parentMenuItem}\r
<div class="menuContainer" data-parentMenuItem="{$parentMenuItem->menuItem}" id="{$parentMenuItem->menuItem}-container" style="display: none;">\r
{foreach from=$__wcf->getACPMenu()->getMenuItems($parentMenuItem->menuItem) item=menuItem}\r
- <h3 data-menuItem="{$menuItem->menuItem}" class="menuHeader">{lang}{@$menuItem->menuItem}{/lang}</h3>\r
+ <h1 data-menuItem="{$menuItem->menuItem}" class="menuHeader">{lang}{@$menuItem->menuItem}{/lang}</h1>\r
<div>\r
<ul id="{$menuItem->menuItem}">\r
{foreach from=$__wcf->getACPMenu()->getMenuItems($menuItem->menuItem) item=menuItemCategory}\r