Merge pull request #210 from adrexia/feature/addnewcss

FIX: Add new multiclass UI
This commit is contained in:
Marcus 2017-09-06 10:47:27 +10:00 committed by GitHub
commit db29e863f7
3 changed files with 35 additions and 6 deletions

View File

@ -75,6 +75,7 @@
.ss-gridfield-add-new-multi-class { .ss-gridfield-add-new-multi-class {
margin-bottom: 8px !important; margin-bottom: 8px !important;
white-space: nowrap;
} }
.ss-gridfield-add-new-multi-class .field { .ss-gridfield-add-new-multi-class .field {
@ -84,6 +85,34 @@
margin: 0 4px 0 0; margin: 0 4px 0 0;
} }
.cms-edit-form:not(.AssetAdmin) .ss-gridfield-add-new-multi-class .form-group .form__field-holder {
display: inline;
padding: 0;
margin: 0;
}
.cms-edit-form:not(.AssetAdmin) .ss-gridfield-add-new-multi-class .form-group {
display: inline-block;
margin: 0;
min-width: 150px;
width: calc(100% - 20px);
}
.ss-gridfield-add-new-multi-class .form-group:after {
border:0;
}
.btn__addnewmulticlass {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
line-height: 1.85em;
}
.ss-gridfield-add-new-multi-class .chosen-container-active.chosen-with-drop .chosen-single,
.ss-gridfield-add-new-multi-class .chosen-container-single .chosen-single {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
/** /**
* GridFieldEditableColumns * GridFieldEditableColumns
*/ */
@ -154,7 +183,7 @@
width: 5px; width: 5px;
height: 11px; height: 11px;
margin: -5px 0 0 -2px; margin: -5px 0 0 -2px;
background-image: url('../../framework/admin/thirdparty/jquery-ui-themes/smoothness/images/ui-icons_222222_256x240.png'); background-image: url('../../framework/admin/thirdparty/jquery-ui-themes/smoothness/images/ui-icons_222222_256x240.png');
background-position: -5px -227px; background-position: -5px -227px;
} }

View File

@ -215,7 +215,7 @@
* GridFieldAddNewMultiClass * GridFieldAddNewMultiClass
*/ */
$(".ss-gridfield-add-new-multi-class .ss-ui-button").entwine({ $(".ss-gridfield-add-new-multi-class .btn__addnewmulticlass").entwine({
onclick: function() { onclick: function() {
var link = this.data("href"); var link = this.data("href");
var cls = this.parents(".ss-gridfield-add-new-multi-class").find("select").val(); var cls = this.parents(".ss-gridfield-add-new-multi-class").find("select").val();
@ -236,12 +236,12 @@
this.update(); this.update();
}, },
update: function() { update: function() {
var btn = this.parents(".ss-gridfield-add-new-multi-class").find(".ss-ui-button"); var btn = this.parents(".ss-gridfield-add-new-multi-class").find('[data-add-multiclass]');
if(this.val() && this.val().length) { if(this.val() && this.val().length) {
btn.button().button("enable"); btn.removeClass('disabled');
} else { } else {
btn.button().button("disable"); btn.addClass('disabled');
} }
} }
}); });

View File

@ -1,7 +1,7 @@
<div class="ss-gridfield-add-new-multi-class"> <div class="ss-gridfield-add-new-multi-class">
$ClassField.FieldHolder $ClassField.FieldHolder
<a href="#" data-href="$Link" class="ss-ui-action-constructive ss-ui-button" data-icon="add"> <a href="#" data-href="$Link" data-add-multiclass class="btn btn-primary font-icon-plus btn__addnewmulticlass" data-icon="add">
$Title $Title
</a> </a>
</div> </div>