Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

ENHANCEMENT: SSF-168 updated print styles to the datagrid

  • Loading branch information...
commit 4ffef20b09fe004881077d36867a20e5f1757754 1 parent 721184c
@felipesilverstripe felipesilverstripe authored
View
39 admin/css/screen.css
@@ -35,7 +35,7 @@ If more variables exist in the future, consider creating a variables file.*/
/** ---------------------------------------------------- Double tone borders http://daverupert.com/2011/06/two-tone-borders-with-css3/ ----------------------------------------------------- */
/** ----------------------------- Sprite images ----------------------------- */
/** Helper SCSS file for generating sprites for the interface. */
-.btn-icon-sprite, .ui-state-default .btn-icon-accept, .ui-state-default .btn-icon-accept_disabled, .ui-state-default .btn-icon-add, .ui-state-default .btn-icon-add_disabled, .ui-state-default .btn-icon-addpage, .ui-state-default .btn-icon-addpage_disabled, .ui-state-default .btn-icon-arrow-circle-135-left, .ui-state-default .btn-icon-back, .ui-state-default .btn-icon-back_disabled, .ui-state-default .btn-icon-chain--arrow, .ui-state-default .btn-icon-chain--exclamation, .ui-state-default .btn-icon-chain--minus, .ui-state-default .btn-icon-chain--pencil, .ui-state-default .btn-icon-chain--plus, .ui-state-default .btn-icon-chain-small, .ui-state-default .btn-icon-chain-unchain, .ui-state-default .btn-icon-chain, .ui-state-default .btn-icon-cross-circle, .ui-state-default .btn-icon-cross-circle_disabled, .ui-state-default .btn-icon-decline, .ui-state-default .btn-icon-decline_disabled, .ui-state-default .btn-icon-download-csv, .ui-state-default .btn-icon-drive-upload, .ui-state-default .btn-icon-drive-upload_disabled, .ui-state-default .btn-icon-magnifier, .ui-state-default .btn-icon-minus-circle, .ui-state-default .btn-icon-minus-circle_disabled, .ui-state-default .btn-icon-navigation, .ui-state-default .btn-icon-navigation_disabled, .ui-state-default .btn-icon-network-cloud, .ui-state-default .btn-icon-network-cloud_disabled, .ui-state-default .btn-icon-pencil, .ui-state-default .btn-icon-pencil_disabled, .ui-state-default .btn-icon-plug-disconnect-prohibition, .ui-state-default .btn-icon-plug-disconnect-prohibition_disabled, .ui-state-default .btn-icon-preview, .ui-state-default .btn-icon-preview_disabled, .ui-state-default .btn-icon-settings, .ui-state-default .btn-icon-settings_disabled, .ui-state-default .btn-icon-unpublish, .ui-state-default .btn-icon-unpublish_disabled { background: url('../images/btn-icon-s41050dc384.png') no-repeat; }
+.btn-icon-sprite, .ui-state-default .btn-icon-accept, .ui-state-default .btn-icon-accept_disabled, .ui-state-default .btn-icon-add, .ui-state-default .btn-icon-add_disabled, .ui-state-default .btn-icon-addpage, .ui-state-default .btn-icon-addpage_disabled, .ui-state-default .btn-icon-arrow-circle-135-left, .ui-state-default .btn-icon-back, .ui-state-default .btn-icon-back_disabled, .ui-state-default .btn-icon-chain--arrow, .ui-state-default .btn-icon-chain--exclamation, .ui-state-default .btn-icon-chain--minus, .ui-state-default .btn-icon-chain--pencil, .ui-state-default .btn-icon-chain--plus, .ui-state-default .btn-icon-chain-small, .ui-state-default .btn-icon-chain-unchain, .ui-state-default .btn-icon-chain, .ui-state-default .btn-icon-cross-circle, .ui-state-default .btn-icon-cross-circle_disabled, .ui-state-default .btn-icon-decline, .ui-state-default .btn-icon-decline_disabled, .ui-state-default .btn-icon-download-csv, .ui-state-default .btn-icon-drive-upload, .ui-state-default .btn-icon-drive-upload_disabled, .ui-state-default .btn-icon-grid_print, .ui-state-default .btn-icon-magnifier, .ui-state-default .btn-icon-minus-circle, .ui-state-default .btn-icon-minus-circle_disabled, .ui-state-default .btn-icon-navigation, .ui-state-default .btn-icon-navigation_disabled, .ui-state-default .btn-icon-network-cloud, .ui-state-default .btn-icon-network-cloud_disabled, .ui-state-default .btn-icon-pencil, .ui-state-default .btn-icon-pencil_disabled, .ui-state-default .btn-icon-plug-disconnect-prohibition, .ui-state-default .btn-icon-plug-disconnect-prohibition_disabled, .ui-state-default .btn-icon-preview, .ui-state-default .btn-icon-preview_disabled, .ui-state-default .btn-icon-settings, .ui-state-default .btn-icon-settings_disabled, .ui-state-default .btn-icon-unpublish, .ui-state-default .btn-icon-unpublish_disabled { background: url('../images/btn-icon-s469eb2bf90.png') no-repeat; }
.ui-state-default .btn-icon-accept { background-position: 0 0; }
.ui-state-default .btn-icon-accept_disabled { background-position: 0 -17px; }
@@ -61,23 +61,24 @@ If more variables exist in the future, consider creating a variables file.*/
.ui-state-default .btn-icon-download-csv { background-position: 0 -343px; }
.ui-state-default .btn-icon-drive-upload { background-position: 0 -361px; }
.ui-state-default .btn-icon-drive-upload_disabled { background-position: 0 -377px; }
-.ui-state-default .btn-icon-magnifier { background-position: 0 -393px; }
-.ui-state-default .btn-icon-minus-circle { background-position: 0 -409px; }
-.ui-state-default .btn-icon-minus-circle_disabled { background-position: 0 -425px; }
-.ui-state-default .btn-icon-navigation { background-position: 0 -441px; }
-.ui-state-default .btn-icon-navigation_disabled { background-position: 0 -457px; }
-.ui-state-default .btn-icon-network-cloud { background-position: 0 -473px; }
-.ui-state-default .btn-icon-network-cloud_disabled { background-position: 0 -489px; }
-.ui-state-default .btn-icon-pencil { background-position: 0 -505px; }
-.ui-state-default .btn-icon-pencil_disabled { background-position: 0 -521px; }
-.ui-state-default .btn-icon-plug-disconnect-prohibition { background-position: 0 -537px; }
-.ui-state-default .btn-icon-plug-disconnect-prohibition_disabled { background-position: 0 -553px; }
-.ui-state-default .btn-icon-preview { background-position: 0 -569px; }
-.ui-state-default .btn-icon-preview_disabled { background-position: 0 -586px; }
-.ui-state-default .btn-icon-settings { background-position: 0 -603px; }
-.ui-state-default .btn-icon-settings_disabled { background-position: 0 -619px; }
-.ui-state-default .btn-icon-unpublish { background-position: 0 -635px; }
-.ui-state-default .btn-icon-unpublish_disabled { background-position: 0 -653px; }
+.ui-state-default .btn-icon-grid_print { background-position: 0 -393px; }
+.ui-state-default .btn-icon-magnifier { background-position: 0 -409px; }
+.ui-state-default .btn-icon-minus-circle { background-position: 0 -425px; }
+.ui-state-default .btn-icon-minus-circle_disabled { background-position: 0 -441px; }
+.ui-state-default .btn-icon-navigation { background-position: 0 -457px; }
+.ui-state-default .btn-icon-navigation_disabled { background-position: 0 -473px; }
+.ui-state-default .btn-icon-network-cloud { background-position: 0 -489px; }
+.ui-state-default .btn-icon-network-cloud_disabled { background-position: 0 -505px; }
+.ui-state-default .btn-icon-pencil { background-position: 0 -521px; }
+.ui-state-default .btn-icon-pencil_disabled { background-position: 0 -537px; }
+.ui-state-default .btn-icon-plug-disconnect-prohibition { background-position: 0 -553px; }
+.ui-state-default .btn-icon-plug-disconnect-prohibition_disabled { background-position: 0 -569px; }
+.ui-state-default .btn-icon-preview { background-position: 0 -585px; }
+.ui-state-default .btn-icon-preview_disabled { background-position: 0 -602px; }
+.ui-state-default .btn-icon-settings { background-position: 0 -619px; }
+.ui-state-default .btn-icon-settings_disabled { background-position: 0 -635px; }
+.ui-state-default .btn-icon-unpublish { background-position: 0 -651px; }
+.ui-state-default .btn-icon-unpublish_disabled { background-position: 0 -669px; }
.icon { text-indent: -9999px; border: none; outline: none; }
.icon.icon-24 { width: 24px; height: 24px; background: url('../images/menu-icons/24x24-s546fcae8fd.png'); }
@@ -272,7 +273,7 @@ body.cms { overflow: hidden; }
/** -------------------------------------------- Tabs -------------------------------------------- */
.cms-content-header .ui-tabs-nav li, .cms-dialog .ui-tabs-nav li { margin: 0; }
.cms-content-header .ui-tabs-nav li a, .cms-dialog .ui-tabs-nav li a { font-weight: bold; line-height: 16px; padding: 12px 20px 11px; }
-.cms-content-header .ui-tabs-nav .ui-state-default, .cms-content-header .ui-tabs-nav .ui-widget-content .ui-state-default, .cms-content-header .ui-tabs-nav .ui-widget-header .ui-state-default, .cms-dialog .ui-tabs-nav .ui-state-default, .cms-dialog .ui-tabs-nav .ui-widget-content .ui-state-default, .cms-dialog .ui-tabs-nav .ui-widget-header .ui-state-default { background-color: #b0bec7; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IwYmVjNyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzhjYTFhZSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b0bec7), color-stop(100%, #8ca1ae)); background-image: -webkit-linear-gradient(#b0bec7, #8ca1ae); background-image: -moz-linear-gradient(#b0bec7, #8ca1ae); background-image: -o-linear-gradient(#b0bec7, #8ca1ae); background-image: -ms-linear-gradient(#b0bec7, #8ca1ae); background-image: linear-gradient(#b0bec7, #8ca1ae); border-right-color: #a6a6a6; border-left-color: #d9d9d9; border-bottom: none; text-shadow: white 0 1px 0; }
+.cms-content-header .ui-tabs-nav .ui-state-default, .cms-content-header .ui-tabs-nav .ui-widget-content .ui-state-default, .cms-content-header .ui-tabs-nav .ui-widget-header .ui-state-default, .cms-dialog .ui-tabs-nav .ui-state-default, .cms-dialog .ui-tabs-nav .ui-widget-content .ui-state-default, .cms-dialog .ui-tabs-nav .ui-widget-header .ui-state-default { background-color: #b0bec7; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IwYmVjNyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzhjYTFhZSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b0bec7), color-stop(100%, #8ca1ae)); background-image: -webkit-linear-gradient(#b0bec7, #8ca1ae); background-image: -moz-linear-gradient(#b0bec7, #8ca1ae); background-image: -o-linear-gradient(#b0bec7, #8ca1ae); background-image: -ms-linear-gradient(#b0bec7, #8ca1ae); background-image: linear-gradient(#b0bec7, #8ca1ae); border-right-color: #a6a6a6; border-left-color: #d9d9d9; border-bottom: none; text-shadow: #e6e6e6 0 1px 0; }
.cms-content-header .ui-tabs-nav .ui-state-active, .cms-content-header .ui-tabs-nav .ui-widget-content .ui-state-active, .cms-content-header .ui-tabs-nav .ui-widget-header .ui-state-active, .cms-dialog .ui-tabs-nav .ui-state-active, .cms-dialog .ui-tabs-nav .ui-widget-content .ui-state-active, .cms-dialog .ui-tabs-nav .ui-widget-header .ui-state-active { background: #eceff1; border-right-color: #a6a6a6; border-left-color: #a6a6a6; margin-right: -1px; margin-left: -1px; z-index: 2; }
.cms-content-header .ui-tabs-nav .ui-state-active a, .cms-content-header .ui-tabs-nav .ui-widget-content .ui-state-active a, .cms-content-header .ui-tabs-nav .ui-widget-header .ui-state-active a, .cms-dialog .ui-tabs-nav .ui-state-active a, .cms-dialog .ui-tabs-nav .ui-widget-content .ui-state-active a, .cms-dialog .ui-tabs-nav .ui-widget-header .ui-state-active a { border-bottom: none; }
View
BIN  admin/images/btn-icon-s41050dc384.png
Deleted file not rendered
View
BIN  admin/images/btn-icon-sc495ceeeca.png
Deleted file not rendered
View
2  admin/scss/_style.scss
@@ -206,7 +206,7 @@ body.cms {
bottom:none;
}
- text-shadow: lighten($color-tab, 60%) 0 1px 0;
+ text-shadow: lighten($color-tab, 5%) 0 1px 0;
}
.ui-state-active,
View
2  css/GridField.css
@@ -8,6 +8,8 @@
.cms .ss-gridfield p button#action_export span.ui-button-text { padding-left: 26px; }
.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 thead { color: #1d2224; background: transparent; }
.cms table.ss-gridfield-table thead tr.filter-header .fieldgroup { max-width: 512px; }
View
2  forms/gridfield/GridFieldExportButton.php
@@ -56,7 +56,7 @@ public function getHTMLFragments($gridField) {
$button->setAttribute('data-icon', 'download-csv');
$button->addExtraClass('no-ajax');
return array(
- $this->targetFragment => '<p>' . $button->Field() . '</p>',
+ $this->targetFragment => '<p class="grid-csv-button">' . $button->Field() . '</p>',
);
}
View
2  forms/gridfield/GridFieldPrintButton.php
@@ -52,7 +52,7 @@ public function getHTMLFragments($gridField) {
$button->addExtraClass('gridfield-button-print');
//$button->addExtraClass('no-ajax');
return array(
- $this->targetFragment => '<p>' . $button->Field() . '</p>',
+ $this->targetFragment => '<p class="grid-print-button">' . $button->Field() . '</p>',
);
}
View
6 scss/GridField.scss
@@ -75,6 +75,12 @@ $gf_grid_x: 16px;
}
width: 500px;
}
+ .grid-print-button{
+ display: inline-block;
+ }
+ .grid-csv-button{
+ display: inline-block;
+ }
}
table.ss-gridfield-table {
View
29 scss/GridField_print.scss
@@ -1,3 +1,28 @@
-table td{
- border: 1px solid black;
+table {
+ border-collapse: collapse;
+ font-family: Arial, sans-serif;
+ color: #333;
+ font-size: 12pt;
+ tr{
+
+ }
+ th{
+ border-bottom: 2px solid #333;
+ padding: 5px 10px;
+ font-weight: bold;
+ text-align: left;
+ &:first-child{
+ padding-left: 0px;
+ }
+
+ }
+ td{
+ border-top: 1px solid #aaa;
+ border-bottom: 1px solid #aaa;
+ text-align: left;
+ padding: 5px 10px;
+ &:first-child{
+ padding-left: 0px;
+ }
+ }
}
View
6 templates/Includes/GridField_print.ss
@@ -1,5 +1,5 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//MI" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="mi" lang="mi">
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
</head>
@@ -7,7 +7,7 @@
<% if $Title %><h3>$Title</h3><% end_if %>
<table>
<thead>
- <tr><% control Header %><td>$CellString</td><% end_control %></tr>
+ <tr><% control Header %><th>$CellString</th><% end_control %></tr>
</thead>
<tbody>
<% control ItemRows %>
Please sign in to comment.
Something went wrong with that request. Please try again.