diff --git a/admin/css/screen.css b/admin/css/screen.css index 21c9574e3..6b739f098 100644 --- a/admin/css/screen.css +++ b/admin/css/screen.css @@ -364,7 +364,7 @@ body.cms { overflow: hidden; } .cms-content-tools { background-color: #c6d7df; width: 192px; border-right: 1px solid #bfcad2; overflow-y: auto; overflow-x: hidden; z-index: 70; -moz-box-shadow: rgba(107, 120, 123, 0.5) 0 0 4px; -webkit-box-shadow: rgba(107, 120, 123, 0.5) 0 0 4px; -o-box-shadow: rgba(107, 120, 123, 0.5) 0 0 4px; box-shadow: rgba(107, 120, 123, 0.5) 0 0 4px; float: left; position: relative; } .cms-content-tools.filter { padding: 0 !important; } .cms-content-tools .cms-panel-header { clear: both; margin: 0 0 7px; line-height: 24px; border-bottom: 1px solid rgba(201, 205, 206, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -o-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); } -.cms-content-tools .cms-panel-content { width: 176px; padding: 0 8px; overflow: auto; overflow-x: hidden; height: 100%; } +.cms-content-tools .cms-panel-content { width: 176px; padding: 0 8px; overflow: auto; height: 100%; } .cms-content-tools .cms-panel-content .dropdown select { width: 160px; } .cms-content-tools .cms-panel-content #LastEditedFrom { -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; box-shadow: none; } .cms-content-tools .cms-panel-content #LastEditedFrom input { width: 160px; } diff --git a/css/GridField.css b/css/GridField.css index 94669d0b5..8055e3574 100644 --- a/css/GridField.css +++ b/css/GridField.css @@ -5,32 +5,32 @@ /** ----------------------------------------------- Typography. ------------------------------------------------ */ /** ----------------------------------------------- Grid Units (px) We have a vertical rhythm that the grid is based off both x (=horizontal) and y (=vertical). All internal padding and margins are scaled to this and accounting for paragraphs ------------------------------------------------ */ /** ----------------------------------------------- Application Logo (CMS Logo) Must be 24px x 24px ------------------------------------------------ */ -/** This file contains the default theme definitions for the admin interface. Please put mostly SCSS variable definitions in here, and leave the actual styling to _style.scss and auxilliary files. */ -/** ----------------------------------------------- Colours ------------------------------------------------ */ -/** ----------------------------------------------- Textures ----------------------------------------------- */ -/** ----------------------------------------------- Typography. ------------------------------------------------ */ -/** ----------------------------------------------- Grid Units (px) We have a vertical rhythm that the grid is based off both x (=horizontal) and y (=vertical). All internal padding and margins are scaled to this and accounting for paragraphs ------------------------------------------------ */ -/** ----------------------------------------------- Application Logo (CMS Logo) Must be 24px x 24px ------------------------------------------------ */ .cms .ss-gridfield > div { margin-bottom: 36px; } .cms .ss-gridfield > div.addNewGridFieldButton { margin-bottom: 12px; } +.cms .ss-gridfield > div.addNewGridFieldButton:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } +*:first-child .cms .ss-gridfield > div.addNewGridFieldButton { zoom: 1; } .cms .ss-gridfield[data-selectable] tr.ui-selected, .cms .ss-gridfield[data-selectable] tr.ui-selecting { background: #FFFAD6 !important; } .cms .ss-gridfield[data-selectable] td { cursor: pointer; } .cms .ss-gridfield span button#action_gridfield_relationfind { display: none; } .cms .ss-gridfield p button#action_export { margin-top: 12px; } .cms .ss-gridfield p button#action_export span.btn-icon-download-csv { height: 17px; } .cms .ss-gridfield p button#action_export span.ui-button-text { padding-left: 26px; } +.cms .ss-gridfield .right { float: right; } +.cms .ss-gridfield .right > * { float: right; margin-left: 5px; font-size: 14.4px; } +.cms .ss-gridfield .left { float: left; } +.cms .ss-gridfield .left > * { margin-right: 5px; float: left; font-size: 14.4px; } .cms .ss-gridfield .grid-levelup { text-indent: -9999em; margin-bottom: 6px; } .cms .ss-gridfield .grid-levelup a.list-parent-link { background: transparent url(../images/gridfield-level-up.png) no-repeat 0 0; display: block; } .cms .ss-gridfield .add-existing-autocompleter { width: 500px; } .cms .ss-gridfield .add-existing-autocompleter input.relation-search { width: 380px; } .cms .ss-gridfield .grid-print-button { display: inline-block; } .cms .ss-gridfield .grid-csv-button { display: inline-block; } -.cms table.ss-gridfield-table { display: table; box-shadow: none; padding: 0; border-collapse: separate; border-bottom: 0 none; width: 100%; } +.cms table.ss-gridfield-table { display: table; box-shadow: none; padding: 0; border-collapse: separate; border-bottom: 0 none; width: 100%; margin-bottom: 12px; } .cms table.ss-gridfield-table thead { color: #1e2527; background: transparent; } .cms table.ss-gridfield-table thead tr.filter-header .fieldgroup { max-width: 512px; } .cms table.ss-gridfield-table thead tr.filter-header .fieldgroup .fieldgroup-field { padding: 0; } -.cms table.ss-gridfield-table thead tr:first-child th:first-child { -moz-border-radius-topleft: 7px; -webkit-border-top-left-radius: 7px; -ms-border-top-left-radius: 7px; -o-border-top-left-radius: 7px; border-top-left-radius: 7px; } -.cms table.ss-gridfield-table thead tr:first-child th:last-child { -moz-border-radius-topright: 7px; -webkit-border-top-right-radius: 7px; -ms-border-top-right-radius: 7px; -o-border-top-right-radius: 7px; border-top-right-radius: 7px; } +.cms table.ss-gridfield-table thead tr:first-child th:first-child { -moz-border-radius-topleft: 7px; -webkit-border-top-left-radius: 7px; -o-border-top-left-radius: 7px; -ms-border-top-left-radius: 7px; -khtml-border-top-left-radius: 7px; border-top-left-radius: 7px; } +.cms table.ss-gridfield-table thead tr:first-child th:last-child { -moz-border-radius-topright: 7px; -webkit-border-top-right-radius: 7px; -o-border-top-right-radius: 7px; -ms-border-top-right-radius: 7px; -khtml-border-top-right-radius: 7px; border-top-right-radius: 7px; } .cms table.ss-gridfield-table tbody { background: #FFF; } .cms table.ss-gridfield-table tbody tr { cursor: pointer; } .cms table.ss-gridfield-table tbody td { width: auto; white-space: nowrap; } @@ -39,7 +39,7 @@ .cms table.ss-gridfield-table tbody td.col-listChildrenLink { width: 16px; border-right: none; text-indent: -9999em; padding: 0; } .cms table.ss-gridfield-table tbody td.col-listChildrenLink .list-children-link { background: transparent url(../images/sitetree_ss_default_icons.png) no-repeat 12px -4px; display: block; } .cms table.ss-gridfield-table tbody td.col-getTreeTitle span.item { color: #1556b2; } -.cms table.ss-gridfield-table tbody td.col-getTreeTitle span.badge { clear: both; text-transform: uppercase; display: inline-block; padding: 0px 3px; font-size: 0.75em; line-height: 1em; margin-left: 10px; margin-right: 6px; margin-top: -1px; -webkit-border-radius: 2px 2px; -moz-border-radius: 2px / 2px; -ms-border-radius: 2px / 2px; -o-border-radius: 2px / 2px; border-radius: 2px / 2px; } +.cms table.ss-gridfield-table tbody td.col-getTreeTitle span.badge { clear: both; text-transform: uppercase; display: inline-block; padding: 0px 3px; font-size: 0.75em; line-height: 1em; margin-left: 10px; margin-right: 6px; margin-top: -1px; -webkit-border-radius: 2px 2px; -moz-border-radius: 2px / 2px; -o-border-radius: 2px / 2px; -ms-border-radius: 2px / 2px; -khtml-border-radius: 2px / 2px; border-radius: 2px / 2px; } .cms table.ss-gridfield-table tbody td.col-getTreeTitle span.badge.modified { color: #7E7470; border: 1px solid #C9B800; background-color: #FFF0BC; } .cms table.ss-gridfield-table tbody td.col-getTreeTitle span.badge.addedtodraft { color: #7E7470; border: 1px solid #C9B800; background-color: #FFF0BC; } .cms table.ss-gridfield-table tbody td.col-getTreeTitle span.badge.deletedonlive { color: #636363; border: 1px solid #E49393; background-color: #F2DADB; } @@ -54,9 +54,7 @@ .cms table.ss-gridfield-table tfoot { color: #1e2527; } .cms table.ss-gridfield-table tfoot tr td { background: #97a8ad; padding: .7em; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .cms table.ss-gridfield-table tr.title th { position: relative; background: #899ca2; border-top: 1px solid rgba(0, 0, 0, 0.1); padding: 5px; min-height: 40px; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IzYzBjNCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzg5OWNhMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b3c0c4), color-stop(100%, #899ca2)); background-image: -webkit-linear-gradient(#b3c0c4, #899ca2); background-image: -moz-linear-gradient(#b3c0c4, #899ca2); background-image: -o-linear-gradient(#b3c0c4, #899ca2); background-image: -ms-linear-gradient(#b3c0c4, #899ca2); background-image: linear-gradient(#b3c0c4, #899ca2); text-shadow: rgba(0, 0, 0, 0.3) 0px -1px 0; } -.cms table.ss-gridfield-table tr.title th h2 { padding: 0px; font-size: 16.8px; color: #fff; margin: 3px 8px 0; display: inline-block; } -.cms table.ss-gridfield-table tr.title th .right > * { float: right; font-size: 14.4px; } -.cms table.ss-gridfield-table tr.title th .left > * { float: left; font-size: 14.4px; } +.cms table.ss-gridfield-table tr.title th h2 { padding: 0px; font-size: 16.8px; color: #fff; margin: 3px 8px 0; display: inline-block; float: left; } .cms table.ss-gridfield-table tr.sortable-header { background: #bfcdd2; } .cms table.ss-gridfield-table tr.sortable-header th { padding: 0px; } .cms table.ss-gridfield-table tr:hover { background: #FFFAD6 !important; } @@ -75,13 +73,13 @@ .cms table.ss-gridfield-table tr th.extra, .cms table.ss-gridfield-table tr th.action { padding: 0; cursor: default; } .cms table.ss-gridfield-table tr th.extra { position: relative; background: #637276; background: rgba(0, 0, 0, 0.7); padding: 5px; border-top: rgba(0, 0, 0, 0.3); } .cms table.ss-gridfield-table tr th.extra input { height: 28px; } -.cms table.ss-gridfield-table tr th.extra button.ss-ui-button { padding: .3em; line-height: 1; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; position: relative; border-bottom-width: 0; -webkit-border-radius: 2px 2px; -moz-border-radius: 2px / 2px; -ms-border-radius: 2px / 2px; -o-border-radius: 2px / 2px; border-radius: 2px / 2px; } -.cms table.ss-gridfield-table tr th.first { -moz-border-radius-topleft: 7px; -webkit-border-top-left-radius: 7px; -ms-border-top-left-radius: 7px; -o-border-top-left-radius: 7px; border-top-left-radius: 7px; } -.cms table.ss-gridfield-table tr th.last { -moz-border-radius-topright: 7px; -webkit-border-top-right-radius: 7px; -ms-border-top-right-radius: 7px; -o-border-top-right-radius: 7px; border-top-right-radius: 7px; } +.cms table.ss-gridfield-table tr th.extra button.ss-ui-button { padding: .3em; line-height: 1; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; position: relative; border-bottom-width: 0; -webkit-border-radius: 2px 2px; -moz-border-radius: 2px / 2px; -o-border-radius: 2px / 2px; -ms-border-radius: 2px / 2px; -khtml-border-radius: 2px / 2px; border-radius: 2px / 2px; } +.cms table.ss-gridfield-table tr th.first { -moz-border-radius-topleft: 7px; -webkit-border-top-left-radius: 7px; -o-border-top-left-radius: 7px; -ms-border-top-left-radius: 7px; -khtml-border-top-left-radius: 7px; border-top-left-radius: 7px; } +.cms table.ss-gridfield-table tr th.last { -moz-border-radius-topright: 7px; -webkit-border-top-right-radius: 7px; -o-border-top-right-radius: 7px; -ms-border-top-right-radius: 7px; -khtml-border-top-right-radius: 7px; border-top-right-radius: 7px; } .cms table.ss-gridfield-table tr th button#action_gridfield_relationadd:hover { color: #444 !important; /* Not sure why IE think it needs this */ } .cms table.ss-gridfield-table tr th button:hover { color: #ccc !important; /* Not sure why IE think it needs this */ } .cms table.ss-gridfield-table tr th button.ss-gridfield-sort:hover { color: #fff !important; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } -.cms table.ss-gridfield-table tr th button.ss-gridfield-sort { background: transparent url(../images/arrows.png) no-repeat right 10px; border: none; width: 100%; text-align: left; padding: 4px 8px 4px 0; text-shadow: rgba(0, 0, 0, 0.3) 0px -1px 0; color: #fff; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } +.cms table.ss-gridfield-table tr th button.ss-gridfield-sort { background: transparent url(../images/arrows.png) no-repeat right 10px; border: none; width: 100%; text-align: left; padding: 4px 8px 4px 0; text-shadow: rgba(0, 0, 0, 0.3) 0px -1px 0; color: #fff; -moz-border-radius: 0; -webkit-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; -khtml-border-radius: 0; border-radius: 0; } .cms table.ss-gridfield-table tr th button.ss-gridfield-sort:hover { background-position: right -30px; } .cms table.ss-gridfield-table tr th button.ss-gridfield-sort.ss-gridfield-sorted-desc { background-position: right -72px; } .cms table.ss-gridfield-table tr th button.ss-gridfield-sort.ss-gridfield-sorted-asc { background-position: right -116px; } @@ -105,7 +103,7 @@ .cms table.ss-gridfield-table tr th input.ss-gridfield-sort:focus { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } .cms table.ss-gridfield-table tr th span.non-sortable { padding: 1em 1em; display: block; } .cms table.ss-gridfield-table tr td { border-right: 1px solid rgba(0, 0, 0, 0.1); padding: 6.4px 12px; color: #666666; } -.cms table.ss-gridfield-table tr td.bottom-all { -moz-border-radius-bottomleft: 7px; -webkit-border-bottom-left-radius: 7px; -ms-border-bottom-left-radius: 7px; -o-border-bottom-left-radius: 7px; border-bottom-left-radius: 7px; -moz-border-radius-bottomright: 7px; -webkit-border-bottom-right-radius: 7px; -ms-border-bottom-right-radius: 7px; -o-border-bottom-right-radius: 7px; border-bottom-right-radius: 7px; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IzYzBjNCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzg5OWNhMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b3c0c4), color-stop(100%, #899ca2)); background-image: -webkit-linear-gradient(#b3c0c4, #899ca2); background-image: -moz-linear-gradient(#b3c0c4, #899ca2); background-image: -o-linear-gradient(#b3c0c4, #899ca2); background-image: -ms-linear-gradient(#b3c0c4, #899ca2); background-image: linear-gradient(#b3c0c4, #899ca2); } +.cms table.ss-gridfield-table tr td.bottom-all { -moz-border-radius-bottomleft: 7px; -webkit-border-bottom-left-radius: 7px; -o-border-bottom-left-radius: 7px; -ms-border-bottom-left-radius: 7px; -khtml-border-bottom-left-radius: 7px; border-bottom-left-radius: 7px; -moz-border-radius-bottomright: 7px; -webkit-border-bottom-right-radius: 7px; -o-border-bottom-right-radius: 7px; -ms-border-bottom-right-radius: 7px; -khtml-border-bottom-right-radius: 7px; border-bottom-right-radius: 7px; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IzYzBjNCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzg5OWNhMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b3c0c4), color-stop(100%, #899ca2)); background-image: -webkit-linear-gradient(#b3c0c4, #899ca2); background-image: -moz-linear-gradient(#b3c0c4, #899ca2); background-image: -o-linear-gradient(#b3c0c4, #899ca2); background-image: -ms-linear-gradient(#b3c0c4, #899ca2); background-image: linear-gradient(#b3c0c4, #899ca2); } .cms table.ss-gridfield-table tr td.bottom-all .datagrid-footer-message { text-align: center; padding-top: 6px; color: white; } .cms table.ss-gridfield-table tr td.bottom-all .datagrid-pagination { padding-top: 2px; position: absolute; left: 50%; margin-left: -116px; z-index: 5; } .cms table.ss-gridfield-table tr td.bottom-all .datagrid-pagination .pagination-page-number { color: white; } diff --git a/forms/gridfield/GridField.php b/forms/gridfield/GridField.php index 20aff06b1..40b06cfd0 100755 --- a/forms/gridfield/GridField.php +++ b/forms/gridfield/GridField.php @@ -226,7 +226,6 @@ class GridField extends FormField { $content = array( "before" => "", "after" => "", - "buttons" => "", "header" => "", "footer" => "", ); @@ -251,7 +250,7 @@ class GridField extends FormField { // Circular dependencies are detected by disallowing any item to be deferred more than 5 times // It's a fairly crude algorithm but it works - $fragmentDefined = array('header' => true, 'buttons'=>true, 'footer' => true, 'before' => true, 'after' => true); + $fragmentDefined = array('header' => true, 'footer' => true, 'before' => true, 'after' => true); reset($content); while(list($k,$v) = each($content)) { if(preg_match_all('/\$DefineFragment\(([a-z0-9\-_]+)\)/i', $v, $matches)) { @@ -356,7 +355,6 @@ class GridField extends FormField { return $this->createTag('fieldset', $attrs, $content['before'] . - $content['buttons'] . $this->createTag('table', $tableAttrs, $head."\n".$foot."\n".$body) . $content['after'] ); diff --git a/forms/gridfield/GridFieldButtonRow.php b/forms/gridfield/GridFieldButtonRow.php index 1f7a16346..cb1cbdffe 100644 --- a/forms/gridfield/GridFieldButtonRow.php +++ b/forms/gridfield/GridFieldButtonRow.php @@ -9,9 +9,19 @@ * @subpackage gridfield */ class GridFieldButtonRow implements GridField_HTMLProvider { + protected $targetFragment; + + public function __construct($targetFragment = 'before') { + $this->targetFragment = $targetFragment; + } + public function getHTMLFragments( $gridField) { + $data = new ArrayData(array( + "LeftFragment" => "\$DefineFragment(buttons-{$this->targetFragment}-left)", + "RightFragment" => "\$DefineFragment(buttons-{$this->targetFragment}-right)", + )); return array( - 'buttons' => $gridField->renderWith('GridFieldButtonRow') + $this->targetFragment => $data->renderWith('GridFieldButtonRow') ); } } diff --git a/forms/gridfield/GridFieldConfig.php b/forms/gridfield/GridFieldConfig.php index 118b6de0e..208d302ca 100644 --- a/forms/gridfield/GridFieldConfig.php +++ b/forms/gridfield/GridFieldConfig.php @@ -191,11 +191,10 @@ class GridFieldConfig_RecordEditor extends GridFieldConfig { * @param int $itemsPerPage - How many items per page should show up */ public function __construct($itemsPerPage=null) { - - $this->addComponent(new GridFieldToolbarHeader()); - $this->addComponent(new GridFieldButtonRow()); - $this->addComponent(new GridFieldAddNewButton('toolbar-header-left')); + $this->addComponent(new GridFieldButtonRow('before')); + $this->addComponent(new GridFieldAddNewButton('buttons-before-left')); + $this->addComponent(new GridFieldToolbarHeader()); $this->addComponent($sort = new GridFieldSortableHeader()); $this->addComponent($filter = new GridFieldFilterHeader()); $this->addComponent(new GridFieldDataColumns()); @@ -241,10 +240,11 @@ class GridFieldConfig_RelationEditor extends GridFieldConfig { * @param int $itemsPerPage - How many items per page should show up */ public function __construct($itemsPerPage=null) { + + $this->addComponent(new GridFieldButtonRow('before')); + $this->addComponent(new GridFieldAddNewButton('buttons-before-left')); + $this->addComponent(new GridFieldAddExistingAutocompleter('buttons-before-left')); $this->addComponent(new GridFieldToolbarHeader()); - $this->addComponent(new GridFieldAddExistingAutocompleter('toolbar-header-left')); - $this->addComponent(new GridFieldButtonRow()); - $this->addComponent(new GridFieldAddNewButton('toolbar-header-left')); $this->addComponent($sort = new GridFieldSortableHeader()); $this->addComponent($filter = new GridFieldFilterHeader()); $this->addComponent(new GridFieldDataColumns()); diff --git a/scss/GridField.scss b/scss/GridField.scss index 7209ac093..a6db5f6c2 100644 --- a/scss/GridField.scss +++ b/scss/GridField.scss @@ -12,7 +12,7 @@ @import "compass/css3/text-shadow"; @import "compass/css3/border-radius"; @import "../admin/scss/themes/default"; -@import "../admin/scss/themes/default"; +@import "../admin/scss/_mixins"; @import "_elementMixins"; //$experimental-support-for-svg variable comes from @@ -47,6 +47,7 @@ $gf_grid_x: 16px; margin-bottom: $gf_grid_y*3; &.addNewGridFieldButton{ margin-bottom:$gf_grid_y; + @include clearfix; } } @@ -73,6 +74,22 @@ $gf_grid_x: 16px; padding-left:26px; //to accomodate wider export icon } } + .right { + float:right; + & > * { + float: right; + margin-left:5px; + font-size: $gf_grid_y*1.2; + } + } + .left { + float:left; + & > * { + margin-right:5px; + float: left; + font-size: $gf_grid_y*1.2; + } + } } .ss-gridfield { @@ -105,6 +122,7 @@ $gf_grid_x: 16px; border-collapse: separate; border-bottom: 0 none; width: 100%; + margin-bottom:$gf_grid_y; thead { color: darken($gf_colour_base, 50%); @@ -256,7 +274,7 @@ $gf_grid_x: 16px; tr { &.title { th { - position: relative; + position: relative; background: $gf_colour_gradient_dark; border-top: 1px solid $gf_colour_border; padding: 5px; @@ -269,15 +287,8 @@ $gf_grid_x: 16px; color:#fff; margin:3px 8px 0; display:inline-block; - } - .right > * { - float: right; - font-size: $gf_grid_y*1.2; - } - .left > * { - float: left; - font-size: $gf_grid_y*1.2; - } + float:left; + } } } &.sortable-header { diff --git a/templates/Includes/GridFieldButtonRow.ss b/templates/Includes/GridFieldButtonRow.ss index 04b3cf264..41347c5c6 100644 --- a/templates/Includes/GridFieldButtonRow.ss +++ b/templates/Includes/GridFieldButtonRow.ss @@ -1,4 +1,4 @@
-
\$DefineFragment(toolbar-header-left)
-
\$DefineFragment(toolbar-header-right)
+
$LeftFragment
+
$RightFragment
\ No newline at end of file diff --git a/templates/Includes/GridFieldToolbarHeader.ss b/templates/Includes/GridFieldToolbarHeader.ss index 5515c43c8..27aabb79a 100644 --- a/templates/Includes/GridFieldToolbarHeader.ss +++ b/templates/Includes/GridFieldToolbarHeader.ss @@ -1,5 +1,7 @@ <% if Title %>

$Title

<% end_if %> +
\$DefineFragment(toolbar-header-right)
+
\$DefineFragment(toolbar-header-left)
\ No newline at end of file