Update asset admin toolbar

This commit is contained in:
scott1702 2015-10-23 16:01:29 +13:00
parent f340130e8d
commit 6dc3fc1f26
8 changed files with 38 additions and 7 deletions

View File

@ -190,14 +190,14 @@ JS
$addFolderBtn = new LiteralField( $addFolderBtn = new LiteralField(
'AddFolderButton', 'AddFolderButton',
sprintf( sprintf(
'<a class="ss-ui-button font-icon-plus-circled cms-add-folder-link" data-icon="add" data-url="%s" href="%s">%s</a>', '<a class="ss-ui-button font-icon-folder-add no-text cms-add-folder-link" title="%s" data-icon="add" data-url="%s" href="%s"></a>',
_t('Folder.AddFolderButton', 'Add folder'),
Controller::join_links($this->Link('AddForm'), '?' . http_build_query(array( Controller::join_links($this->Link('AddForm'), '?' . http_build_query(array(
'action_doAdd' => 1, 'action_doAdd' => 1,
'ParentID' => $folder->ID, 'ParentID' => $folder->ID,
'SecurityID' => $form->getSecurityToken()->getValue() 'SecurityID' => $form->getSecurityToken()->getValue()
))), ))),
Controller::join_links($this->Link('addfolder'), '?ParentID=' . $folder->ID), Controller::join_links($this->Link('addfolder'), '?ParentID=' . $folder->ID)
_t('Folder.AddFolderButton', 'Add folder')
) )
); );
} else { } else {

View File

@ -34,10 +34,15 @@
.cms .AssetAdmin .cms-content-fields .cms-edit-form.AssetAdmin { width: 100%; overflow-y: auto; } .cms .AssetAdmin .cms-content-fields .cms-edit-form.AssetAdmin { width: 100%; 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 { overflow: hidden; }
.cms .AssetAdmin .cms-content-fields .cms-content-tools .cms-panel-content .cms-search-form { height: 100%; } .cms .AssetAdmin .cms-content-fields .cms-content-tools .cms-panel-content .cms-search-form { height: 100%; }
.cms .AssetAdmin .cms-content-toolbar { float: left; }
.cms .AssetAdmin .cms-content-toolbar .cms-actions-row .ss-ui-button { z-index: 1; }
.cms .AssetAdmin .cms-content-toolbar .cms-actions-row .ss-ui-button::before { font-size: 23px; }
.cms .AssetAdmin .cms-content-toolbar .cms-actions-row .grid-levelup { margin: 0; }
.cms .AssetAdmin .cms-content-toolbar .cms-page-add-button { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YzZjNmMyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f3f3f3), color-stop(100%, #d9d9d9)); background-image: -moz-linear-gradient(#f3f3f3, #d9d9d9); background-image: -webkit-linear-gradient(#f3f3f3, #d9d9d9); background-image: linear-gradient(#f3f3f3, #d9d9d9); border-color: #c0c0c2; } .cms .AssetAdmin .cms-content-toolbar .cms-page-add-button { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YzZjNmMyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f3f3f3), color-stop(100%, #d9d9d9)); background-image: -moz-linear-gradient(#f3f3f3, #d9d9d9); background-image: -webkit-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.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; } .cms .AssetAdmin .cms-content-toolbar .cms-page-add-button span.ui-button-text { color: #393939; text-shadow: white 0 1px 1px; }
.cms .AssetAdmin #Root_TreeView .cms-tree ul .class-Folder a span.text span.jstree-foldericon { background: url(../images/blue-folder-horizontal.png) no-repeat; width: 16px; height: 16px; float: left; display: block; margin-right: 4px; } .cms .AssetAdmin #Root_TreeView .cms-tree ul .class-Folder a span.text span.jstree-foldericon { background: url(../images/blue-folder-horizontal.png) no-repeat; width: 16px; height: 16px; float: left; display: block; margin-right: 4px; }
.cms .AssetAdmin .ss-gridfield { margin-top: 0; }
.cms .AssetAdmin table.ss-gridfield-table td.bottom-all { padding: 0.7em; } .cms .AssetAdmin table.ss-gridfield-table td.bottom-all { padding: 0.7em; }
.cms .AssetAdmin table.ss-gridfield-table tr[data-class=Folder] td.col-StripThumbnail { background: transparent url(../images/treeicons/blue-folder-horizontal.png) no-repeat center; } .cms .AssetAdmin table.ss-gridfield-table tr[data-class=Folder] td.col-StripThumbnail { background: transparent url(../images/treeicons/blue-folder-horizontal.png) no-repeat center; }
.cms .AssetAdmin table.ss-gridfield-table tr[data-class=File] td.col-StripThumbnail { background: transparent url(../images/treeicons/blue-document.png) no-repeat center; } .cms .AssetAdmin table.ss-gridfield-table tr[data-class=File] td.col-StripThumbnail { background: transparent url(../images/treeicons/blue-document.png) no-repeat center; }

View File

@ -130,6 +130,12 @@
onunmatch: function () { onunmatch: function () {
$('.AssetAdmin.cms-edit-form .ss-gridfield').reload(); $('.AssetAdmin.cms-edit-form .ss-gridfield').reload();
} }
});
$('.AssetAdmin .grid-levelup').entwine({
onmatch: function () {
this.closest('.ui-tabs-panel').find('.cms-actions-row').prepend(this);
}
}) })
}); });
}(jQuery)); }(jQuery));

View File

@ -19,6 +19,22 @@
} }
.cms-content-toolbar { .cms-content-toolbar {
float: left;
.cms-actions-row {
.ss-ui-button {
z-index: 1;
&::before {
font-size: 23px;
}
}
.grid-levelup {
margin: 0;
}
}
.cms-page-add-button { .cms-page-add-button {
@include background-image (linear-gradient(lighten(#e6e6e6, 5%), darken(#e6e6e6, 5%))); @include background-image (linear-gradient(lighten(#e6e6e6, 5%), darken(#e6e6e6, 5%)));
border-color:#c0c0c2; border-color:#c0c0c2;
@ -43,6 +59,10 @@
} }
} }
.ss-gridfield {
margin-top: 0;
}
table.ss-gridfield-table { table.ss-gridfield-table {
td { td {
&.bottom-all { &.bottom-all {

View File

@ -11,7 +11,7 @@
<% if $Fields.hasTabset %> <% if $Fields.hasTabset %>
<% with $Fields.fieldByName('Root') %> <% with $Fields.fieldByName('Root') %>
<div class="cms-content-header-tabs"> <div class="cms-content-header-tabs">
<button id="filters-button" class="icon-button font-icon-search" title="<% _t('CMSPagesController_Tools_ss.FILTER', 'Filter') %>"></button> <button id="filters-button" class="icon-button font-icon-search no-text" title="<% _t('CMSPagesController_Tools_ss.FILTER', 'Filter') %>"></button>
<div class="icon-button-group"> <div class="icon-button-group">
<ul class="cms-tabset-nav-primary ss-tabset"> <ul class="cms-tabset-nav-primary ss-tabset">

View File

@ -46,7 +46,7 @@
</div> </div>
<div class="view-controls"> <div class="view-controls">
<button id="filters-button" class="icon-button font-icon-search" title="<% _t('CMSPagesController_Tools_ss.FILTER', 'Filter') %>"></button> <button id="filters-button" class="icon-button font-icon-search no-text" title="<% _t('CMSPagesController_Tools_ss.FILTER', 'Filter') %>"></button>
<div class="icon-button-group"> <div class="icon-button-group">
<a href="$LinkPages#cms-content-treeview" class="icon-button font-icon-icon-tree active" title="<% _t('CMSPagesController.TreeView', 'Tree View') %>"></a><a href="$LinkPages#cms-content-listview" class="icon-button font-icon-list" title="<% _t('CMSPagesController.ListView', 'List View') %>"></a> <a href="$LinkPages#cms-content-treeview" class="icon-button font-icon-icon-tree active" title="<% _t('CMSPagesController.TreeView', 'Tree View') %>"></a><a href="$LinkPages#cms-content-listview" class="icon-button font-icon-list" title="<% _t('CMSPagesController.ListView', 'List View') %>"></a>
</div> </div>

View File

@ -6,7 +6,7 @@
</div> </div>
<div class="cms-content-header-tabs"> <div class="cms-content-header-tabs">
<button id="filters-button" class="icon-button font-icon-search" title="<% _t('CMSPagesController_Tools_ss.FILTER', 'Filter') %>"></button> <button id="filters-button" class="icon-button font-icon-search no-text" title="<% _t('CMSPagesController_Tools_ss.FILTER', 'Filter') %>"></button>
<div class="icon-button-group"> <div class="icon-button-group">
<ul class="cms-tabset-nav-primary ss-tabset"> <ul class="cms-tabset-nav-primary ss-tabset">
<li class="content-treeview<% if ViewState == tree %> ui-tabs-active ss-tabs-force-active<% end_if %> cms-tabset-icon tree"> <li class="content-treeview<% if ViewState == tree %> ui-tabs-active ss-tabs-force-active<% end_if %> cms-tabset-icon tree">

View File

@ -15,7 +15,7 @@ Feature: Insert an image into a page
Scenario: I can insert an image from a URL Scenario: I can insert an image from a URL
Given I press the "Insert Media" button Given I press the "Insert Media" button
When I click "add by URL" in the ".ss-uploadfield-item-info" element When I press the "Insert from URL" button
And I fill in "RemoteURL" with "http://www.silverstripe.org/themes/ssv3/img/ss_logo.png" And I fill in "RemoteURL" with "http://www.silverstripe.org/themes/ssv3/img/ss_logo.png"
And I press the "Add url" button And I press the "Add url" button
Then I should see "ss_logo.png" in the ".ss-assetuploadfield span.name" element Then I should see "ss_logo.png" in the ".ss-assetuploadfield span.name" element