tonyair/silverstripe-userforms
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-userforms.git synced 2024-10-22 17:05:42 +02:00
Code Issues Projects Releases Wiki Activity

Cms styling for fieldgroups

Browse Source
This commit is contained in:
scott1702 2015-08-12 12:50:14 +12:00
parent 2c93124fb1
commit b483a10566
8 changed files with 187 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -1 +1,2 @@
.DS_Store
.sass-cache/

2
code/model/UserDefinedForm.php
View File

@ -178,6 +178,8 @@ SQL;
$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}
*/

12
config.rb Normal file
View File

@ -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

55
css/UserForm.css
View File

@ -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;
}

44
css/UserForm_cms.css
View File

@ -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-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;
.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;
}

23
javascript/Gridfield.js Normal file
View File

@ -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));

47
scss/UserForm.scss Normal file
View File

@ -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;
}

50
scss/UserForm_cms.scss Normal file
View File

@ -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;
}
}
}
}