From 834a2d327730afe3b5b48ab8224efe2f0edcd794 Mon Sep 17 00:00:00 2001 From: Luzifr Date: Sat, 27 Aug 2011 02:26:16 +0200 Subject: [PATCH] Some more improvements to the menus, CSS clean-up, missing language variables. --- wcfsetup/install/files/acp/style/testing.css | 97 +++++++++++-------- .../files/acp/templates/userGroupAdd.tpl | 1 - wcfsetup/install/lang/de-informal.xml | 2 + wcfsetup/install/lang/de.xml | 2 + wcfsetup/install/lang/en.xml | 2 + 5 files changed, 62 insertions(+), 42 deletions(-) diff --git a/wcfsetup/install/files/acp/style/testing.css b/wcfsetup/install/files/acp/style/testing.css index f68d8b865d..06820db3a3 100644 --- a/wcfsetup/install/files/acp/style/testing.css +++ b/wcfsetup/install/files/acp/style/testing.css @@ -102,7 +102,8 @@ header.pageHeader nav.topMenu > div { } -header.pageHeader nav.topMenu ul li, header.pageHeader nav.topMenu ul li a { +header.pageHeader nav.topMenu ul li, +header.pageHeader nav.topMenu ul li a { color: #69c; text-shadow: 0 -1px 0 #000; } @@ -981,11 +982,12 @@ input[type='submit']:active, .tabMenu { text-shadow: 0 1px 0 #fff; background-color: none; - white-space: nowrap; - position: relative; - display: block; + /* This is the general switch for tab menu orientation */ text-align: center; padding: 0 5px; + display: block; + white-space: nowrap; + position: relative; } .tabMenu:after { @@ -994,6 +996,10 @@ input[type='submit']:active, clear: both; } +.tabMenu ul { + +} + .tabMenu li { list-style: none; display: inline-block; @@ -1004,29 +1010,31 @@ input[type='submit']:active, .tabMenu li a { color: #999; font-size: 110%; + cursor: pointer; padding: 10px 15px 7px; text-decoration: none; - border: 1px solid #ccc; + border-width: 1px 1px 0 1px; + border-style: solid; + border-color: #ddd; border-top-left-radius: 3px; border-top-right-radius: 3px; + background-color: rgba(0, 0, 0, .05); display: inline-block; - background-color: rgba(245, 245, 245, .5); } .tabMenu li a:hover { color: #666; -} - -.tabMenu li.ui-tabs-selected { - margin-bottom: 0; - padding-bottom: 1px; + border-color: #ccc; } .tabMenu li.ui-state-active a { color: #333 !important; font-weight: bold; font-size: 130%; - border-bottom: 1px solid #fff; + border-width: 1px; + border-style: solid; + border-color: #ccc; + border-bottom-color: #fff; background-color: rgba(255, 255, 255, 1); } @@ -1036,11 +1044,6 @@ input[type='submit']:active, cursor: default; } -.tabMenu li a, -.ui-tabs .ui-tabs-collapsible .ui-tabs-nav li.ui-state-active a { - cursor: pointer; -} - /* Tab Menu Content */ .tabMenuContent { @@ -1048,7 +1051,7 @@ input[type='submit']:active, background-color: rgba(255, 255, 255, 1); z-index: 89; /* Prevents border overlay during transition */ display: block; - margin: -2px 0 0; + margin-top: -1px; padding: 15px 23px; } @@ -1068,40 +1071,43 @@ input[type='submit']:active, clip: rect(1px,1px,1px,1px); } -.ui-helper-clearfix:after { - content: ""; - display: block; - height: 0; - clear: both; -} - /* -- -- -- -- -- Menu -- -- -- -- -- */ .menu { color: #666; - margin: -15px -23px 0 -23px; - padding: 10px 7px; + margin: -15px -23px 0; + padding: 0 7px 10px; border-bottom: 1px solid #ccc; } +.tabMenuContent > .menu { + background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, .1)); + background-image: -moz-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, .1)); + background-image: -o-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, .1)); + background-image: -ms-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, .1)); + background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, .1)); +} + .menu ul { + /* This is the general switch for menu orientation */ text-align: center; } .menu ul li { - display: inline; + display: inline-block; + margin-top: 10px; white-space: nowrap; } .menu ul li a { - color: #666 !important; + color: #666; font-size: 85%; text-decoration: none; text-shadow: 0 1px 0 #fff; - border: 1px solid rgba(0, 0, 0, .3); - background-color: rgba(0, 0, 0, .05); + border: 1px solid rgba(0, 0, 0, .2); + background-color: rgba(255, 255, 255, .5); padding: 2px 10px; border-radius: 13px; @@ -1114,6 +1120,7 @@ input[type='submit']:active, .menu ul li a:hover { color: #333; + border: 1px solid rgba(0, 0, 0, .3); background-color: rgba(255, 255, 255, 1); } @@ -1124,9 +1131,12 @@ input[type='submit']:active, } .menu ul li.ui-state-active a { - border: 1px solid rgba(0, 0, 0, .3); - background-color: rgba(255, 255, 255, 1); + color: #fff; cursor: default; + font-weight: bold; + text-shadow: 0 1px 0 #000; + border: 1px solid rgba(0, 0, 0, .2); + background-color: rgba(0, 0, 0, .5); } /* Special */ @@ -1134,10 +1144,14 @@ input[type='submit']:active, .boxTitle > .menu { color: #fff; margin: 0 !important; - padding: 6px 7px; + padding: 6px 7px !important; border: none; } +.boxTitle > .menu ul li { + margin-top: 0; +} + .boxTitle > .menu ul li a { color: #eee !important; font-size: 85%; @@ -1202,7 +1216,8 @@ thead th:last-child { border-top-right-radius: 5px; } -thead th p a, thead th p.emptyHead { +thead th p a, +thead th p.emptyHead { color: #69c !important; text-shadow: 0 -1px 0 #000; display: block; @@ -1500,10 +1515,10 @@ div#ajaxExceptionStacktrace { border: 1px solid #f80; border-top-width: 0; border-radius: 0 0 5px 5px; - left: 43%; padding: 7px 21px 7px; position: fixed; top: 0; + left: 43%; } div.wcfDimensions { @@ -1518,7 +1533,7 @@ div.overlayLoading { } div.ui-dialog { - border: 10px solid rgba(0,0,0,.2); + border: 10px solid rgba(0, 0, 0, .2); border-radius: 15px; display: inline-block !important; width: auto !important; @@ -1532,7 +1547,7 @@ div.ui-dialog-content p { div.ui-dialog-titlebar { background-color: #ccc; - border-bottom: 5px solid rgba(0,0,0,.6); + border-bottom: 5px solid rgba(0, 0, 0, .6); padding: 7px; position: relative; } @@ -1546,11 +1561,11 @@ a.ui-dialog-titlebar-close { background-image: url("../../icon/deleteM.png"); background-position: top left; background-repeat: no-repeat; - height: 24px; position: absolute !important; - right: -16px; top: -16px; + right: -16px; width: 24px; + height: 24px; } a.ui-dialog-titlebar-close span { @@ -1560,10 +1575,10 @@ a.ui-dialog-titlebar-close span { div.ui-widget-overlay { background-color: #000; - left: 0; opacity: .6; position: fixed; top: 0; + left: 0; } diff --git a/wcfsetup/install/files/acp/templates/userGroupAdd.tpl b/wcfsetup/install/files/acp/templates/userGroupAdd.tpl index 9f2e759ce5..cb9066cfb4 100644 --- a/wcfsetup/install/files/acp/templates/userGroupAdd.tpl +++ b/wcfsetup/install/files/acp/templates/userGroupAdd.tpl @@ -60,7 +60,6 @@ {if $additionalFieldSets|isset}{@$additionalFieldSets}{/if} -