New menu UI. Props filosofo. see #12713

git-svn-id: https://develop.svn.wordpress.org/trunk@14248 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Ryan Boren
2010-04-27 01:05:58 +00:00
parent cb27ac1a30
commit 77be931ef4
20 changed files with 2278 additions and 1203 deletions
File diff suppressed because one or more lines are too long
+8 -4
View File
@@ -110,11 +110,13 @@ div.dashboard-widget-submit {
}
div.tabs-panel,
ul.category-tabs li.tabs {
ul.category-tabs li.tabs,
ul.add-menu-item-tabs li.tabs {
border-color: #dfdfdf;
}
ul.category-tabs li.tabs {
ul.category-tabs li.tabs,
ul.add-menu-item-tabs li.tabs {
background-color: #f1f1f1;
}
@@ -380,7 +382,8 @@ div.dashboard-widget-submit input:hover,
border-color: #dfdfdf;
}
#side-sortables .category-tabs .tabs a {
#side-sortables .category-tabs .tabs a,
#side-sortables .add-menu-item-tabs .tabs a {
color: #333;
}
@@ -1467,7 +1470,8 @@ fieldset.inline-edit-col-right .inline-edit-col {
background-color: #f5f5f5;
}
#post-body ul.category-tabs li.tabs a {
#post-body ul.category-tabs li.tabs a,
#post-body ul.add-menu-item-tabs li.tabs a {
color: #333;
}
File diff suppressed because one or more lines are too long
+10 -4
View File
@@ -110,11 +110,13 @@ div.dashboard-widget-submit {
}
div.tabs-panel,
ul.category-tabs li.tabs {
ul.category-tabs li.tabs,
ul.add-menu-item-tabs li.tabs {
border-color: #dfdfdf;
}
ul.category-tabs li.tabs {
ul.category-tabs li.tabs,
ul.add-menu-item-tabs li.tabs {
background-color: #f1f1f1;
}
@@ -379,7 +381,8 @@ div.dashboard-widget-submit input:hover,
border-color: #dfdfdf;
}
#side-sortables .category-tabs .tabs a {
#side-sortables .category-tabs .tabs a,
#side-sortables .add-menu-item-tabs .tabs a {
color: #333;
}
@@ -490,7 +493,9 @@ a,
}
/* Because we don't want visited on these links */
body.press-this .tabs a,
body.press-this .tabs a:hover {
background-color: #fff;
border-color: #c6d9e9;
border-bottom-color: #fff;
color: #d54e21;
@@ -1460,7 +1465,8 @@ fieldset.inline-edit-col-right .inline-edit-col {
background-color: #f5f5f5;
}
#post-body ul.category-tabs li.tabs a {
#post-body ul.category-tabs li.tabs a,
#post-body ul.add-menu-item-tabs li.tabs a {
color: #333;
}
+1 -1
View File
@@ -1 +1 @@
#menu-management{clear:both;}#menu-management .inside{padding:0 10px;}#menu-container .submit{margin:0 0 10px;padding:0;}.submitdelete{font-size:11px;}#cancel-save{color:#f00;text-decoration:underline;font-size:11px;margin-left:20px;margin-top:5px;}#cancel-save:hover{background-color:#F00;color:#fff;}.list-controls{float:left;}.add-to-menu{float:right;}.button-controls{margin:10px 0;}.show-all,.hide-all{cursor:pointer;}.hide-all{display:none;}#create-menu-name{width:159px;}#manage-menu .inside{padding:0;}#available-links dt{display:block;}#add-custom-link .howto{font-size:11px;}#add-custom-link label span{display:block;float:left;margin-top:5px;padding-right:5px;}.menu-item-textbox{float:right;width:220px;}.howto span{margin-top:4px;display:block;float:left;}.quick-search{width:190px;}.list-wrap{display:none;clear:both;margin-bottom:10px;}.list-container{max-height:200px;overflow-y:auto;padding:10px 10px 5px;border:1px solid #DFDFDF;-moz-border-radius:4px;}.postbox p.submit{margin-bottom:0;}.list li{display:none;margin:0;margin-bottom:5px;}.list li .menu-item-title{cursor:pointer;display:block;}.list li .menu-item-title input{margin-right:3px;margin-top:-3px;}.list li ul li .menu-item-title{margin-left:14px;}.list li ul li ul li .menu-item-title{margin-left:28px;}.list li ul li ul li ul li .menu-item-title{margin-left:42px;}.list li ul li ul li ul li ul li .menu-item-title{margin-left:56px;}.list li ul li ul li ul li ul li ul li .menu-item-title{margin-left:70px;}.list li ul li ul li ul li ul li ul li ul li .menu-item-title{margin-left:84px;}.list li ul li ul li ul li ul li ul li ul li ul li .menu-item-title{margin-left:98px;}.list li ul li ul li ul li ul li ul li ul li ul li ul li .menu-item-title{margin-left:112px;}#menu-container .inside{padding-bottom:10px;}.menu ul{width:100%;}.menu li{margin:0;}.menu li dl dt{-webkit-border-radius:6px;border-radius:6px;-moz-border-radius:6px;border:1px solid #E6E6E6;position:relative;padding-left:10px;background-color:#f1f1f1;height:35px;line-height:35px;}.menu li dl dt:hover{cursor:move;}.menu li ul li{margin-left:20px;opacity:.7;}.menu li ul li ul li{opacity:.9;}.menu li ul li ul li ul li{opacity:.9;}.menu li ul li ul li ul li ul li{opacity:.95;}.dropzone{height:7px;margin:3px 0 3px 0;}.ui-draggable-dragging{width:600px;}.item-type{text-transform:uppercase;font-size:11px;color:#999;padding-right:10px;}.item-controls{font-size:11px;position:absolute;right:15px;top:-1px;}.item-controls a{text-decoration:none;}.item-controls a:hover{cursor:pointer;}.item-controls .menu-item-delete:hover{color:#f00;}#menu-item-settings{display:none;}#cancel-save{cursor:pointer;}#cancel-save:hover{color:#fff!important;}#update-menu-item{color:#fff!important;}#update-menu-item:hover,#update-menu-item:active,#update-menu-item:focus{color:#eaf2fa!important;border-color:#13455b!important;}.button-controls:after,#menu-item-url-wrap:after,#menu-item-name-wrap:after{content:".";display:block;height:0;clear:both;visibility:hidden;}.button-controls,#menu-item-url-wrap,#menu-item-name-wrap{display:block;}
.nav-edit-wrap{clear:both;}#menu-settings-column{display:block;float:left;width:281px;}#menu-settings-column .inside{padding:0 10px;}#menu-management{float:left;margin-left:15px;}#menu-management .menu-edit{background-color:#fff;border-color:#dfdfdf;border-width:1px;border-style:solid;margin-bottom:20px;padding:0 10px 10px;-moz-border-radius-bottomleft:6px;-webkit-border-bottom-left-radius:6px;-khtml-border-bottom-left-radius:6px;border-bottom-left-radius:6px;-moz-border-radius-bottomright:6px;-webkit-border-bottom-right-radius:6px;-khtml-border-bottom-right-radius:6px;border-bottom-right-radius:6px;-moz-border-radius-topright:6px;-webkit-border-top-right-radius:6px;-khtml-border-top-right-radius:6px;border-top-right-radius:6px;}#menu-management .menu-add-new abbr{font-weight:bold;}#menu-management .menu-tabs{background-color:#fff;border-color:#dfdfdf;border-bottom-color:#fff;}#menu-management .menu-tab-inactive{background-color:#fafafa;border-bottom-color:#fafafa;}#menu-management .inside{padding:0 10px;}#menu-container .submit{margin:0 0 10px;padding:0;}.submitdelete{font-size:11px;}#cancel-save{color:#f00;text-decoration:underline;font-size:11px;margin-left:20px;margin-top:5px;}#cancel-save:hover{background-color:#F00;color:#fff;}.list-controls{float:left;}.add-to-menu{float:right;}form.processing .add-to-menu{background:url("../images/wpspin_light.gif") no-repeat top center;display:block;height:20px;overflow:hidden;text-align:left;text-indent:-999em;width:20px;}.button-controls{margin:10px 0;}.show-all,.hide-all{cursor:pointer;}.hide-all{display:none;}#create-menu-name{width:159px;}#manage-menu .inside{padding:0;}#available-links dt{display:block;}#add-custom-link .howto{font-size:11px;}#add-custom-link label span{display:block;float:left;margin-top:5px;padding-right:5px;}.menu-item-textbox{float:right;width:220px;}.howto span{margin-top:4px;display:block;float:left;}.quick-search{width:190px;}.list-wrap{display:none;clear:both;margin-bottom:10px;}.list-container{max-height:200px;overflow-y:auto;padding:10px 10px 5px;border:1px solid #DFDFDF;-moz-border-radius:4px;}.postbox p.submit{margin-bottom:0;}.list li{display:none;margin:0;margin-bottom:5px;}.list li .menu-item-title{cursor:pointer;display:block;}.list li .menu-item-title input{margin-right:3px;margin-top:-3px;}.list li ul li .menu-item-title{margin-left:14px;}.list li ul li ul li .menu-item-title{margin-left:28px;}.list li ul li ul li ul li .menu-item-title{margin-left:42px;}.list li ul li ul li ul li ul li .menu-item-title{margin-left:56px;}.list li ul li ul li ul li ul li ul li .menu-item-title{margin-left:70px;}.list li ul li ul li ul li ul li ul li ul li .menu-item-title{margin-left:84px;}.list li ul li ul li ul li ul li ul li ul li ul li .menu-item-title{margin-left:98px;}.list li ul li ul li ul li ul li ul li ul li ul li ul li .menu-item-title{margin-left:112px;}#menu-container .inside{padding-bottom:10px;}.menu{padding-top:1em;}.menu ul{width:100%;}.menu li{margin:0;}.menu li dl{clear:both;line-height:1.5em;position:relative;}.menu li dl dt{-webkit-border-radius:6px;border-radius:6px;-moz-border-radius:6px;border:1px solid #E6E6E6;clear:both;cursor:move;position:relative;padding-left:10px;background-color:#f1f1f1;height:35px;line-height:35px;}.menu li.deleting dl dt{background-color:#faa;}.menu li .item-title{display:block;height:1em;margin-right:18em;}.menu li div.sortable-placeholder{background:#f5f5f5;border:1px dashed #bbb;margin:10px 0;padding-top:40px;}.menu li dl.sortable-placeholder{background:#f5f5f5;padding-bottom:40px;}.menu li ul li{margin-left:20px;opacity:.7;}.menu li ul li ul li{opacity:.9;}.menu li ul li ul li ul li{opacity:.9;}.menu li ul li ul li ul li ul li{opacity:.95;}.dropzone{height:7px;margin:3px 0 3px 0;}.ui-draggable-dragging{width:600px;}.item-type{text-transform:uppercase;font-size:11px;color:#999;padding-right:10px;}.item-controls{font-size:11px;position:absolute;right:15px;top:-1px;}.item-controls a{text-decoration:none;}.item-controls a:hover{cursor:pointer;}.item-controls .item-order a{font-weight:bold;}body.js .item-order{display:none;}.item-controls .menu-item-delete:hover{color:#f00;}.menu-item-edit-active{display:block;}.menu-item-edit-inactive{display:none;}.add-menu-item-pagelinks{margin:.5em auto;text-align:center;}#cancel-save{cursor:pointer;}#cancel-save:hover{color:#fff!important;}#update-menu-item{color:#fff!important;}#update-menu-item:hover,#update-menu-item:active,#update-menu-item:focus{color:#eaf2fa!important;border-color:#13455b!important;}.button-controls:after,#menu-item-url-wrap:after,#menu-item-name-wrap:after{content:".";display:block;height:0;clear:both;visibility:hidden;}.button-controls,#menu-item-url-wrap,#menu-item-name-wrap{display:block;}
+141 -9
View File
@@ -8,8 +8,61 @@
* @subpackage Administration
*/
.nav-edit-wrap {
clear:both;
}
#menu-settings-column {
display:block;
float:left;
width:281px;
}
#menu-settings-column .inside {
padding:0 10px;
}
/* Menu Container */
#menu-management { clear: both; }
#menu-management {
float:left;
margin-left:15px;
}
#menu-management .menu-edit {
background-color:#fff;
border-color: #dfdfdf;
border-width: 1px;
border-style: solid;
margin-bottom: 20px;
padding:0 10px 10px;
-moz-border-radius-bottomleft: 6px;
-webkit-border-bottom-left-radius: 6px;
-khtml-border-bottom-left-radius: 6px;
border-bottom-left-radius: 6px;
-moz-border-radius-bottomright: 6px;
-webkit-border-bottom-right-radius: 6px;
-khtml-border-bottom-right-radius: 6px;
border-bottom-right-radius: 6px;
-moz-border-radius-topright: 6px;
-webkit-border-top-right-radius: 6px;
-khtml-border-top-right-radius: 6px;
border-top-right-radius: 6px;
}
#menu-management .menu-add-new abbr {
font-weight:bold;
}
#menu-management .menu-tabs {
background-color:#fff;
border-color:#dfdfdf;
border-bottom-color:#fff;
}
#menu-management .menu-tab-inactive {
background-color:#fafafa;
border-bottom-color:#fafafa;
}
#menu-management .inside { padding: 0 10px; }
/* Button Primary Actions */
@@ -21,7 +74,20 @@
/* Button Secondary Actions */
.list-controls { float: left; }
.add-to-menu { float: right; }
.add-to-menu {
float: right;
}
form.processing .add-to-menu {
background: url("../images/wpspin_light.gif") no-repeat top center;
display:block;
height:20px;
overflow:hidden;
text-align:left;
text-indent:-999em;
width:20px;
}
.button-controls { margin: 10px 0; }
.show-all, .hide-all { cursor: pointer; }
.hide-all { display: none; }
@@ -61,12 +127,58 @@
/* Nav Menu */
#menu-container .inside { padding-bottom: 10px; }
.menu {
padding-top:1em;
}
.menu ul { width: 100%; }
.menu li { margin: 0; }
.menu li dl dt { -webkit-border-radius: 6px; border-radius: 6px; -moz-border-radius: 6px; border: 1px solid #E6E6E6; position: relative; padding-left: 10px; background-color: #f1f1f1; height: 35px; line-height: 35px; }
.menu li dl dt:hover { cursor: move; }
.menu ul.sub-menu {
}
.menu li {
margin: 0;
}
.menu li dl {
clear:both;
line-height:1.5em;
position:relative;
}
.menu li dl dt {
-webkit-border-radius: 6px;
border-radius: 6px;
-moz-border-radius: 6px;
border: 1px solid #E6E6E6;
clear:both;
cursor: move;
position: relative;
padding-left: 10px;
background-color: #f1f1f1;
height: 35px;
line-height: 35px;
}
.menu li dl dt:hover {
}
.menu li.deleting dl dt {
background-color:#faa;
}
.menu li .item-title {
display:block;
height:1em;
margin-right:18em;
}
.menu li div.sortable-placeholder {
background: #f5f5f5;
border: 1px dashed #bbb;
margin: 10px 0px;
padding-top:40px;
}
.menu li dl.sortable-placeholder {
background: #f5f5f5;
padding-bottom:40px;
}
.menu li .item-title { }
.menu li ul li { margin-left: 20px; opacity: .7; }
.menu li ul li ul li { opacity: .9; }
.menu li ul li ul li ul li { opacity: .9; }
@@ -81,10 +193,30 @@
.item-controls { font-size: 11px; position: absolute; right: 15px; top: -1px; }
.item-controls a { text-decoration: none; }
.item-controls a:hover { cursor: pointer; }
.item-controls .item-order a {
font-weight:bold;
}
body.js .item-order {
display:none;
}
.item-controls .menu-item-delete:hover { color: #ff0000; }
/* Thickbox */
#menu-item-settings { display: none; }
/* Menu editing */
.menu-item-edit-active {
display:block;
}
.menu-item-edit-inactive {
display:none;
}
.add-menu-item-pagelinks {
margin:.5em auto;
text-align:center;
}
#cancel-save { cursor: pointer; }
#cancel-save:hover { color: #fff !important; }
#update-menu-item { color: #fff !important; }
@@ -94,4 +226,4 @@
/* Clearfix */
.button-controls:after, #menu-item-url-wrap:after, #menu-item-name-wrap:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.button-controls, #menu-item-url-wrap, #menu-item-name-wrap { display: block; }
.button-controls, #menu-item-url-wrap, #menu-item-name-wrap { display: block; }
File diff suppressed because one or more lines are too long
+8 -3
View File
@@ -298,7 +298,8 @@ td.available-theme {
margin-left: 0;
margin-right: 120px;
}
#post-body ul.category-tabs li.tabs {
#post-body ul.category-tabs li.tabs,
#post-body ul.add-menu-item-tabs li.tabs {
-moz-border-radius: 0 3px 3px 0;
-webkit-border-top-left-radius: 0;
-webkit-border-top-right-radius: 3px;
@@ -309,21 +310,25 @@ td.available-theme {
border-bottom-left-radius: 0;
border-bottom-right-radius: 3px;
}
#post-body ul.category-tabs {
#post-body ul.category-tabs,
#post-body ul.add-menu-item-tabs {
float: right;
text-align: left;
margin: 0 0 0 -120px;
}
#post-body .categorydiv div.tabs-panel,
#post-body .taxonomy div.tabs-panel,
#post-body #linkcategorydiv div.tabs-panel {
margin: 0 120px 0 5px;
}
/* 1800 - 2000
=================================== */
#side-sortables .category-tabs li {
#side-sortables .category-tabs li,
#side-sortables .add-menu-item-tabs li {
padding-left: 8px;
}
.categorydiv ul.categorychecklist ul,
.taxonomydiv ul.categorychecklist ul,
#linkcategorydiv ul.categorychecklist ul {
margin-left: 0;
margin-right: 18px;
File diff suppressed because one or more lines are too long
+45 -13
View File
@@ -1959,7 +1959,8 @@ input#link_url {
width: auto;
}
#post-body ul.category-tabs {
#post-body ul.category-tabs,
#post-body ul.add-menu-item-tabs {
float: left;
width: 120px;
text-align: right;
@@ -1968,11 +1969,13 @@ input#link_url {
padding: 0;
}
#post-body ul.category-tabs li {
#post-body ul.category-tabs li,
#post-body ul.add-menu-item-tabs li {
padding: 8px;
}
#post-body ul.category-tabs li.tabs {
#post-body ul.category-tabs li.tabs,
#post-body ul.add-menu-item-tabs li.tabs {
-moz-border-radius: 3px 0 0 3px;
-webkit-border-top-left-radius: 3px;
-webkit-border-bottom-left-radius: 3px;
@@ -1982,12 +1985,16 @@ input#link_url {
border-bottom-left-radius: 3px;
}
#post-body ul.category-tabs li.tabs a {
#post-body ul.category-tabs li.tabs a,
#post-body ul.add-menu-item-tabs li.tabs a {
font-weight: bold;
text-decoration: none;
}
.categorydiv div.tabs-panel,
.customlinkdiv div.tabs-panel,
.posttypediv div.tabs-panel,
.taxonomydiv div.tabs-panel,
#linkcategorydiv div.tabs-panel {
height: 200px;
overflow: auto;
@@ -1996,25 +2003,40 @@ input#link_url {
border-width: 1px;
}
div.tabs-panel-active {
display:block;
}
div.tabs-panel-inactive {
display:none;
}
#post-body .categorydiv div.tabs-panel,
.taxonomy div.tabs-panel,
#post-body #linkcategorydiv div.tabs-panel {
margin: 0 5px 0 125px;
}
#side-sortables .category-tabs li {
#side-sortables .category-tabs li,
#side-sortables .add-menu-item-tabs li {
display: inline;
padding-right: 8px;
}
#side-sortables .category-tabs a {
#side-sortables .category-tabs a,
#side-sortables .add-menu-item-tabs a {
text-decoration: none;
}
#side-sortables .category-tabs {
#side-sortables .category-tabs,
#side-sortables .add-menu-item-tabs {
margin-bottom: 3px;
}
.categorydiv ul,
.customlinkdiv ul,
.posttypediv ul,
.taxonomydiv ul,
#linkcategorydiv ul {
list-style: none;
padding: 0;
@@ -2025,6 +2047,9 @@ input#link_url {
#front-static-pages ul,
.inline-editor ul.cat-checklist ul,
.categorydiv ul.categorychecklist ul,
.customlinkdiv ul.categorychecklist ul,
.posttypediv ul.categorychecklist ul,
.taxonomydiv ul.categorychecklist ul,
#linkcategorydiv ul.categorychecklist ul {
margin-left: 18px;
}
@@ -2040,27 +2065,34 @@ ul.categorychecklist li {
margin-bottom: 0px;
}
.categorydiv .tabs-panel {
.categorydiv .tabs-panel,
.customlinkdiv .tabs-panel,
.posttypediv .tabs-panel,
.taxonomydiv .tabs-panel {
border-width: 3px;
border-style: solid;
}
ul.category-tabs {
ul.category-tabs,
ul.add-menu-item-tabs {
margin-top: 12px;
}
ul.category-tabs li.tabs {
ul.category-tabs li.tabs,
ul.add-menu-item-tabs li.tabs {
border-style: solid solid none;
border-width: 1px 1px 0;
}
#post-body .category-tabs li.tabs {
#post-body .category-tabs li.tabs,
#post-body .add-menu-item-tabs li.tabs {
border-style: solid none solid solid;
border-width: 1px 0 1px 1px;
margin-right: -1px;
}
ul.category-tabs li {
ul.category-tabs li,
ul.add-menu-item-tabs li {
padding: 5px 8px;
-moz-border-radius: 3px 3px 0 0;
-webkit-border-top-left-radius: 3px;
@@ -3705,4 +3737,4 @@ table#available-headers label img {
border-width: 1px 1px 0;
background-color: #fafafa;
color: #c1c1c1;
}
}