Some changes to a bunch of elements. Some of them are experimental.
authorLuzifr <szekely@woltlab.com>
Mon, 18 Jul 2011 19:13:26 +0000 (21:13 +0200)
committerLuzifr <szekely@woltlab.com>
Mon, 18 Jul 2011 19:13:26 +0000 (21:13 +0200)
wcfsetup/install/files/acp/js/WCF.ACP.js
wcfsetup/install/files/acp/style/testing-reset.css
wcfsetup/install/files/acp/style/testing.css
wcfsetup/install/files/acp/templates/footer.tpl
wcfsetup/install/files/acp/templates/header.tpl

index c5a2b6130ac7de4c87d84037a00ae46f7483372e..e3ed5b045de3adefefa88971ab40b38156471bfd 100644 (file)
@@ -25,7 +25,7 @@ WCF.ACP.Menu.prototype = {
         */\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
@@ -36,7 +36,7 @@ WCF.ACP.Menu.prototype = {
        _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
index e9e771a842ce3ad46dcce8d7a5cb273e69c742e4..9535c64d801c87ebd0c8024830415372972c8d37 100644 (file)
@@ -21,7 +21,7 @@ time, mark, audio, video {
        border: 0;\r
        font-size: 100%;\r
        font: inherit;\r
-       vertical-align: baseline;\r
+       /* vertical-align: baseline; */\r
 }\r
 /* HTML5 display-role reset for older browsers */\r
 article, aside, details, figcaption, figure, \r
index 225e4fee4fdb0cdbf2000d822765bb03035d4e8b..917cdd99b4859a4e2a476bbaf89687060acd3f40 100644 (file)
@@ -12,6 +12,10 @@ body {
        font-size: .8em;\r
 }\r
 \r
+img {\r
+       vertical-align: middle !important;\r
+}\r
+\r
 a {\r
        color: #00c;\r
        text-decoration: none;\r
@@ -23,10 +27,7 @@ a:hover {
 }\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
@@ -52,66 +53,99 @@ aside {
        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
@@ -128,17 +162,25 @@ div#content {
        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
@@ -153,6 +195,12 @@ footer nav#navigationFooter ul li {
        display: inline-block;\r
 }\r
 \r
+footer .toTopLink {\r
+       float: right;\r
+}\r
+\r
+\r
+\r
 div.wcfDimensions {\r
        display: inline-block;\r
 }\r
index 104f6a5c968b0241fd54801053e3eb052819c40c..504769ea03fe7dfce4029c1e0e53b97abfb6facb 100644 (file)
@@ -7,7 +7,7 @@
                <p class="copyright"><a href="http://www.woltlab.com" title="www.woltlab.com">&copy; WoltLab&reg; GmbH</a></p>\r
                <nav id="footerNavigation">\r
                        <ul>\r
-                               <li id="toTopLink"><a href="#top" title="{lang}wcf.global.scrollUp{/lang}"><img src="{@RELATIVE_WCF_DIR}icon/upS.png" alt="{lang}wcf.global.scrollUp{/lang}" /> <span class="hidden">{lang}wcf.global.scrollUp{/lang}</span></a></li>\r
+                               <li id="toTopLink" class="toTopLink"><a href="#top" title="{lang}wcf.global.scrollUp{/lang}"><img src="{@RELATIVE_WCF_DIR}icon/upS.png" alt="{lang}wcf.global.scrollUp{/lang}" /> <span class="hidden">{lang}wcf.global.scrollUp{/lang}</span></a></li>\r
                        </ul>\r
                </nav>\r
        </footer>\r
index b44bbc99714b0f3f81dd267643aaf4b81d058bca..35d72f22f50acad63b70605fb82d2eba2c7eb7e1 100644 (file)
        </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