Cms styling for fieldgroups
This commit is contained in:
scott1702
parent
2c93124fb1
commit
b483a10566
|
|
@ -1 +1,2 @@
|
|||
.DS_Store
|
||||
.sass-cache/
|
||||
|
|
|
|||
|
|
@ -177,6 +177,8 @@ SQL;
|
|||
$config->addComponent(new GridFieldDetailForm());
|
||||
$config->addComponent($export = new GridFieldExportButton());
|
||||
$config->addComponent($print = new GridFieldPrintButton());
|
||||
|
||||
Requirements::javascript(USERFORMS_DIR . '/javascript/Gridfield.js');
|
||||
|
||||
/**
|
||||
* Support for {@link https://github.com/colymba/GridFieldBulkEditingTools}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,12 @@
|
|||
require 'compass/import-once/activate'
|
||||
# Require any additional compass plugins here.
|
||||
|
||||
# Set this to the root of your project when deployed:
|
||||
http_path = "/"
|
||||
css_dir = "css"
|
||||
sass_dir = "scss"
|
||||
images_dir = "images"
|
||||
javascripts_dir = "javascript"
|
||||
|
||||
line_comments = false
|
||||
|
||||
|
|
@ -1,38 +1,37 @@
|
|||
/**
|
||||
* Lightweight base styles for the front-end form.
|
||||
*/
|
||||
.userform-progress .step-buttons,
|
||||
.step-navigation .step-buttons {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.userform-progress .step-buttons {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.userform-progress .step-button-jump {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.userform-progress .step-buttons .step-button-wrapper,
|
||||
.step-navigation .step-buttons .step-button-wrapper {
|
||||
display: inline-block;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.userform-progress .progress {
|
||||
position: relative;
|
||||
height: 1em;
|
||||
background: #eee;
|
||||
position: relative;
|
||||
height: 1em;
|
||||
background: #eee;
|
||||
}
|
||||
.userform-progress .progress .progress-bar {
|
||||
position: absolute;
|
||||
height: 1em;
|
||||
background: #666;
|
||||
}
|
||||
.userform-progress .step-buttons {
|
||||
margin-left: 0;
|
||||
position: relative;
|
||||
}
|
||||
.userform-progress .step-buttons .step-button-wrapper {
|
||||
display: inline-block;
|
||||
list-style-type: none;
|
||||
}
|
||||
.userform-progress .step-button-jump {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.userform-progress .progress .progress-bar {
|
||||
position: absolute;
|
||||
height: 1em;
|
||||
background: #666;
|
||||
.step-navigation .step-buttons {
|
||||
margin-left: 0;
|
||||
}
|
||||
.step-navigation .step-buttons .step-button-wrapper {
|
||||
display: inline-block;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.userform {
|
||||
clear: both;
|
||||
clear: both;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,24 +1,28 @@
|
|||
|
||||
.cms .ss-gridfield > div.ss-gridfield-buttonrow-before {
|
||||
margin-bottom: 10px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* Styles for page steps
|
||||
* Styles for cms
|
||||
*/
|
||||
.cms table.ss-gridfield-table .ss-gridfield-inline-new.uf-gridfield-steprow,
|
||||
.cms table.ss-gridfield-table .ss-gridfield-item[data-class='EditableFormStep'],
|
||||
.cms table.ss-gridfield-table .ss-gridfield-inline-new.uf-gridfield-steprow:hover,
|
||||
.cms table.ss-gridfield-table .ss-gridfield-item[data-class='EditableFormStep']:hover
|
||||
{
|
||||
background: #dae2e7;
|
||||
.cms .ss-gridfield > div.ss-gridfield-buttonrow-before {
|
||||
margin-bottom: 10px;
|
||||
overflow: auto;
|
||||
}
|
||||
.cms table.ss-gridfield-table .ss-gridfield-item[data-class='EditableFormStep'], .cms table.ss-gridfield-table .ss-gridfield-item[data-class='EditableFormStep']:hover {
|
||||
background: #dae2e7;
|
||||
}
|
||||
.cms table.ss-gridfield-table .ss-gridfield-item[data-class='EditableFormStep'] label {
|
||||
font-weight: bold;
|
||||
color: #444;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
.cms table.ss-gridfield-table .ss-gridfield-item[data-class^='EditableFieldGroup'], .cms table.ss-gridfield-table .ss-gridfield-item[data-class^='EditableFieldGroup']:hover {
|
||||
background: #E7EFF4;
|
||||
}
|
||||
.cms table.ss-gridfield-table .ss-gridfield-item[data-class^='EditableFieldGroup'] label {
|
||||
font-weight: bold;
|
||||
}
|
||||
.cms table.ss-gridfield-table .ss-gridfield-item[data-class='EditableFieldGroupEnd'] .col-Title input {
|
||||
display: none;
|
||||
}
|
||||
.cms table.ss-gridfield-table .ss-gridfield-item.inFieldGroup .col-reorder,
|
||||
.cms table.ss-gridfield-table .ss-gridfield-item.inFieldGroup .handle {
|
||||
background: #E7EFF4;
|
||||
}
|
||||
|
||||
.cms table.ss-gridfield-table .ss-gridfield-inline-new.uf-gridfield-steprow label,
|
||||
.cms table.ss-gridfield-table .ss-gridfield-item[data-class='EditableFormStep'] label
|
||||
{
|
||||
font-weight: bold;
|
||||
color: #393939;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
/**
|
||||
* form builder behaviour.
|
||||
*/
|
||||
|
||||
(function($) {
|
||||
$.entwine('ss', function($) {
|
||||
$(".ss-gridfield-orderable tbody").entwine({
|
||||
onmatch: function() {
|
||||
this._super();
|
||||
|
||||
this.find('.ss-gridfield-item')
|
||||
.removeClass('inFieldGroup');
|
||||
|
||||
this.find('.ss-gridfield-item[data-class="EditableFieldGroup"]')
|
||||
.nextUntil('.ss-gridfield-item[data-class="EditableFieldGroupEnd"]')
|
||||
.addClass('inFieldGroup');
|
||||
},
|
||||
onunmatch: function () {
|
||||
this._super();
|
||||
}
|
||||
});
|
||||
});
|
||||
}(jQuery));
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
/**
|
||||
* Lightweight base styles for the front-end form.
|
||||
*/
|
||||
|
||||
.userform-progress {
|
||||
.progress {
|
||||
position: relative;
|
||||
height: 1em;
|
||||
background: #eee;
|
||||
|
||||
.progress-bar {
|
||||
position: absolute;
|
||||
height: 1em;
|
||||
background: #666;
|
||||
}
|
||||
}
|
||||
|
||||
.step-buttons {
|
||||
margin-left: 0;
|
||||
position: relative;
|
||||
|
||||
.step-button-wrapper {
|
||||
display: inline-block;
|
||||
list-style-type: none;
|
||||
}
|
||||
}
|
||||
|
||||
.step-button-jump {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.step-navigation {
|
||||
.step-buttons {
|
||||
margin-left: 0;
|
||||
|
||||
.step-button-wrapper {
|
||||
display: inline-block;
|
||||
list-style-type: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.userform {
|
||||
clear: both;
|
||||
}
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
/**
|
||||
* Styles for cms
|
||||
*/
|
||||
|
||||
.cms {
|
||||
.ss-gridfield > div.ss-gridfield-buttonrow-before {
|
||||
margin-bottom: 10px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
table.ss-gridfield-table {
|
||||
.ss-gridfield-item[data-class='EditableFormStep'] {
|
||||
&, &:hover {
|
||||
background: #dae2e7;
|
||||
}
|
||||
|
||||
label {
|
||||
font-weight: bold;
|
||||
color: #444;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
}
|
||||
|
||||
.ss-gridfield-item[data-class^='EditableFieldGroup'] {
|
||||
&, &:hover {
|
||||
background: #E7EFF4;
|
||||
}
|
||||
|
||||
label {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.ss-gridfield-item[data-class='EditableFieldGroupEnd'] {
|
||||
.col-Title input {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.ss-gridfield-item.inFieldGroup {
|
||||
.col-reorder,
|
||||
.handle {
|
||||
background: #E7EFF4;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
Loading…
Reference in New Issue