tonyair
/
silverstripe-framework
mirror of https://github.com/silverstripe/silverstripe-framework
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

MINOR: Fixed nested tab styling. 

* Added and styled border below nested tabs.
* Fixed duplicate nested tabset divs being created.
This commit is contained in:
Andrew Short 2012-06-13 00:43:04 +10:00
parent e1ebb4a8eb
commit 8976c82a35
3 changed files with 33 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
admin/css/screen.css
View File

@ -596,13 +596,13 @@ form.import-form label.left { width: 250px; }
/** -------------------------------------------- Page Edit Controller -------------------------------------------- */
.cms-container .CMSMain.CMSPageEditController { margin-left: -1px; }
.cms-container .CMSMain.CMSPageEditController .cms-edit-form { background: #e6eaed; }
.cms-container .CMSMain.CMSPageEditController .cms-edit-form .ui-tabs-nav { float: right; margin: 8px 24px -1px 0; }
.cms-container .CMSMain.CMSPageEditController .cms-edit-form .ui-tabs-nav { border-bottom: none; float: right; margin: 8px 0 -1px 0; padding: 0 24px 0 0; }
.cms-container .CMSMain.CMSPageEditController .cms-edit-form .ui-tabs-nav li { float: left; }
.cms-container .CMSMain.CMSPageEditController .cms-edit-form .ui-tabs-nav li a { font-weight: bold; line-height: 16px; padding: 8px 20px 8px; }
.cms-container .CMSMain.CMSPageEditController .cms-edit-form .ui-tabs-nav .ui-state-default, .cms-container .CMSMain.CMSPageEditController .cms-edit-form .ui-tabs-nav .ui-widget-content .ui-state-default, .cms-container .CMSMain.CMSPageEditController .cms-edit-form .ui-tabs-nav .ui-widget-header .ui-state-default { border: 1px solid #c0c0c2; }
.cms-container .CMSMain.CMSPageEditController .cms-edit-form .ui-tabs-nav .ui-state-active, .cms-container .CMSMain.CMSPageEditController .cms-edit-form .ui-tabs-nav .ui-widget-content .ui-state-active, .cms-container .CMSMain.CMSPageEditController .cms-edit-form .ui-tabs-nav .ui-widget-header .ui-state-active { padding-bottom: 1px; background: #e6eaed; border: 1px solid #c0c0c2; }
.cms-container .CMSMain.CMSPageEditController .ss-tabset .ui-tabs-panel { background: #e6eaed; clear: both; /* border-top:1px solid $color-button-generic-border; */ }
.cms-container .CMSMain.CMSPageEditController .ss-tabset .ui-tabs-panel .ss-tabset { border-top: none; }
.cms-container .CMSMain.CMSPageEditController .ss-tabset .ui-tabs-panel .ss-tabset .ui-tabs-nav { margin-top: 0px; margin-right: 8px; }
.cms-container .CMSMain.CMSPageEditController .ss-tabset .ss-tabset { position: static; }
.cms-container .CMSMain.CMSPageEditController .ss-tabset .ui-tabs-panel { background: #e6eaed; border-top: 1px solid #c0c0c2; clear: both; }
.cms-container .CMSPageSettingsController .cms-edit-form { background: #e6eaed; }
.cms-container .CMSPageSettingsController .cms-edit-form .ui-tabs-nav { float: right; margin: 8px 40px -1px 0; }
.cms-container .CMSPageSettingsController .cms-edit-form .ui-tabs-nav li a { font-weight: bold; line-height: 16px; padding: 8px 20px 8px; }

35
admin/scss/_style.scss
View File

@ -1734,10 +1734,16 @@ form.import-form {
//Styling of tabs on page edit
.cms-edit-form {
background:darken($color-widget-bg, 2%);
.ui-tabs-nav {
float:right;
margin:$grid-x $grid-x*3 -1px 0;
.ui-tabs-nav {
border-bottom: none;
float: right;
margin: $grid-y 0 -1px 0;
padding: 0 $grid-x*3 0 0;
li {
float: left;
a {
font-weight: bold;
line-height: $grid-y * 2;
@ -1758,18 +1764,17 @@ form.import-form {
}
}
}
.ss-tabset .ui-tabs-panel {
background:darken($color-widget-bg, 2%);
clear:both;
/* border-top:1px solid $color-button-generic-border; */
.ss-tabset {
border-top:none;
.ui-tabs-nav {
margin-top:0px;
margin-right:8px;
}
}
}
.ss-tabset {
.ss-tabset {
position: static;
}
.ui-tabs-panel {
background: darken($color-widget-bg, 2%);
border-top:1px solid $color-button-generic-border;
clear: both;
}
}
}
//Styling of tabs on page settings
.CMSPageSettingsController {

18
templates/forms/TabSet.ss
View File

@ -6,14 +6,14 @@
</ul>
<% loop Tabs %>
<div $AttributesHTML>
<% if Tabs %>
$FieldHolder
<% else %>
<% loop Fields %>
$FieldHolder
<% end_loop %>
<% end_if %>
</div>
<% if Tabs %>
$FieldHolder
<% else %>
<div $AttributesHTML>
<% loop Fields %>
$FieldHolder
<% end_loop %>
</div>
<% end_if %>
<% end_loop %>
</div>