Permalink
Browse files

Merge pull request #231 from chillu/pulls/tab-consolidation

ENHANCEMENT Tab style consolidation and design consistency
  • Loading branch information...
2 parents bd86cf2 + a52514a commit 381ab72860c187d28e4bc812335b198333df2e1a @halkyon halkyon committed Nov 6, 2012
@@ -221,11 +221,11 @@ public function getEditForm($id = null, $fields = null) {
$tabList = new Tab('ListView', _t('AssetAdmin.ListView', 'List View')),
$tabTree = new Tab('TreeView', _t('AssetAdmin.TreeView', 'Tree View'))
);
- $tabList->addExtraClass("content-listview");
- $tabTree->addExtraClass("content-treeview");
+ $tabList->addExtraClass("content-listview cms-tabset-icon list");
+ $tabTree->addExtraClass("content-treeview cms-tabset-icon tree");
if($fields->Count() && $folder->exists()) {
$tabs->push($tabDetails = new Tab('DetailsView', _t('AssetAdmin.DetailsView', 'Details')));
- $tabDetails->addExtraClass("content-galleryview");
+ $tabDetails->addExtraClass("content-galleryview cms-tabset-icon edit");
foreach($fields as $field) {
$fields->removeByName($field->getName());
$tabDetails->push($field);
View
@@ -51,10 +51,13 @@ public function getCMSFields() {
$fields = new FieldList(
new TabSet("Root",
- $tabMain = new Tab('Main',
- $titleField = new TextField("Title", _t('SiteConfig.SITETITLE', "Site title")),
- $taglineField = new TextField("Tagline", _t('SiteConfig.SITETAGLINE', "Site Tagline/Slogan")),
- $themeDropdownField = new DropdownField("Theme", _t('SiteConfig.THEME', 'Theme'), $this->getAvailableThemes())
+ $tabMain = new TabSet('Main',
+ new Tab('bla',
+ $titleField = new TextField("Title", _t('SiteConfig.SITETITLE', "Site title")),
+ $taglineField = new TextField("Tagline", _t('SiteConfig.SITETAGLINE', "Site Tagline/Slogan")),
+ $themeDropdownField = new DropdownField("Theme", _t('SiteConfig.THEME', 'Theme'), $this->getAvailableThemes())
+ ),
+ new Tab('blubb')
),
$tabAccess = new Tab('Access',
$viewersOptionsField = new OptionsetField("CanViewType", _t('SiteConfig.VIEWHEADER', "Who can view pages on this site?")),
View
@@ -33,14 +33,6 @@
.cms .AssetAdmin .cms-content-fields .cms-edit-form.AssetAdmin { overflow-y: auto; }
.cms .AssetAdmin .cms-content-fields .cms-content-tools .cms-panel-content { overflow: hidden; }
.cms .AssetAdmin .cms-content-fields .cms-content-tools .cms-panel-content .cms-search-form { height: 100%; }
-.cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav li a { font-weight: bold; padding: 0 20px 0; text-indent: -9999em; background: url(../images/content-header-tabs-sprite.png) no-repeat; }
-.cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav li.content-treeview a { background-position: 2px 0px; }
-.cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav li.content-galleryview a { background-position: -160px 0px; }
-.cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav li.content-listview a { background-position: -39px 0px; }
-.cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-state-active, .cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-widget-content .ui-state-active, .cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-widget-header .ui-state-active { border-top: none; }
-.cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-state-active.content-treeview a, .cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-widget-content .ui-state-active.content-treeview a, .cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-widget-header .ui-state-active.content-treeview a { background-position: 1px -40px; }
-.cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-state-active.content-galleryview a, .cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-widget-content .ui-state-active.content-galleryview a, .cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-widget-header .ui-state-active.content-galleryview a { background-position: -161px -40px; }
-.cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-state-active.content-listview a, .cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-widget-content .ui-state-active.content-listview a, .cms .AssetAdmin .cms-content-header-tabs .ui-tabs-nav .ui-widget-header .ui-state-active.content-listview a { background-position: -38px -40px; }
.cms .AssetAdmin .cms-content-toolbar .cms-page-add-button { background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f3f3f3), color-stop(100%, #d9d9d9)); background-image: -webkit-linear-gradient(#f3f3f3, #d9d9d9); background-image: -moz-linear-gradient(#f3f3f3, #d9d9d9); background-image: -o-linear-gradient(#f3f3f3, #d9d9d9); background-image: linear-gradient(#f3f3f3, #d9d9d9); border-color: #c0c0c2; }
.cms .AssetAdmin .cms-content-toolbar .cms-page-add-button span.btn-icon-add { height: 17px; }
.cms .AssetAdmin .cms-content-toolbar .cms-page-add-button span.ui-button-text { color: #393939; text-shadow: white 0 1px 1px; }
View
@@ -11,46 +11,6 @@
}
}
}
- .cms-content-header-tabs {
- .ui-tabs-nav {
- li {
- a {
- font-weight: bold;
- padding: 0 20px 0;
- text-indent:-9999em;
- background: url(../images/content-header-tabs-sprite.png) no-repeat;
- }
-
- &.content-treeview a {
- background-position: 2px 0px;
- }
- &.content-galleryview a {
- background-position: -160px 0px;
- }
- &.content-listview a {
- background-position: -39px 0px;
- }
- }
-
- .ui-state-active,
- .ui-widget-content .ui-state-active,
- .ui-widget-header .ui-state-active {
- border: {
- top:none;
- }
-
- &.content-treeview a {
- background-position: 1px -40px;
- }
- &.content-galleryview a {
- background-position: -161px -40px;
- }
- &.content-listview a {
- background-position: -38px -40px;
- }
- }
- }
- }
.cms-content-toolbar {
.cms-page-add-button {
@@ -14,7 +14,7 @@
<% if Fields.hasTabset %>
<% with Fields.fieldByName('Root') %>
<div class="cms-content-header-tabs">
- <ul>
+ <ul class="cms-tabset-nav-primary">
<% loop Tabs %>
<li<% if extraClass %> class="$extraClass"<% end_if %>><a href="#$id">$Title</a></li>
<% end_loop %>
@@ -5,7 +5,7 @@
<h2><% _t('AssetAdmin.ADDFILES', 'Add Files') %></h2>
</div>
<div class="cms-content-header-tabs">
- <ul>
+ <ul class="cms-tabset-nav-primary">
<li>
<a href="#cms-content-fromyourcomputer"><% _t('AssetAdmin.FROMYOURCOMPUTER', 'From your computer') %></a>
</li>
@@ -8,7 +8,7 @@
</div>
<div class="cms-content-header-tabs">
- <ul>
+ <ul class="cms-tabset-nav-primary">
<li class="content-treeview<% if class == 'CMSPageEditController' %> ui-tabs-active<% end_if %>">
<a href="$LinkPageEdit" class="cms-panel-link" title="Form_EditForm" data-href="$LinkPageEdit">
<% _t('CMSMain.TabContent', 'Content') %>
@@ -8,15 +8,15 @@
</div>
<div class="cms-content-header-tabs">
- <ul>
- <li class="content-treeview<% if ViewState == tree %> ui-tabs-active<% end_if %>">
+ <ul class="cms-tabset-nav-primary">
+ <li class="content-treeview<% if ViewState == tree %> ui-tabs-active<% end_if %> cms-tabset-icon tree">
<a href="#cms-content-treeview" class="cms-panel-link" data-href="$LinkTreeView"><% _t('CMSPagesController.TreeView', 'Tree View') %></a>
</li>
- <li class="content-listview<% if ViewState == list %> ui-tabs-active<% end_if %>">
+ <li class="content-listview<% if ViewState == list %> ui-tabs-active<% end_if %> cms-tabset-icon list">
<a href="#cms-content-listview" class="cms-panel-link" data-href="$LinkListView"><% _t('CMSPagesController.ListView', 'List View') %></a>
</li>
<!--
- <li class="content-galleryview">
+ <li class="content-galleryview cms-tabset-icon gallery">
<a href="#cms-content-galleryview"><% _t('CMSPagesController.GalleryView', 'Gallery View') %></a>
</li>
-->
@@ -12,7 +12,7 @@
<% if Fields.hasTabset %>
<% with Fields.fieldByName('Root') %>
<div class="cms-content-header-tabs">
- <ul>
+ <ul class="cms-tabset-nav-primary">
<% loop Tabs %>
<li<% if extraClass %> class="$extraClass"<% end_if %>><a href="#$id">$Title</a></li>
<% end_loop %>

0 comments on commit 381ab72

Please sign in to comment.