diff --git a/client/styles/global.scss b/client/styles/global.scss index 07fa29e7..3cf09467 100644 --- a/client/styles/global.scss +++ b/client/styles/global.scss @@ -473,13 +473,30 @@ a { font-weight: 600; } -.plusbuttoncontainer { +.instancemodsminus { + cursor: pointer; + background-color: red; + color: white; + text-align: center; + font-weight: 600; + width: 31px; + float: left; + height: 30px; + margin: 10px; + border-radius: 5px; + font-size: 23px; +} + +.buttoncontainer { width: 51px; height: 50px; + display: inline; } #recent { padding-bottom: 45px; } - +.modinputfield { + padding-bottom: 2em; +} diff --git a/client/views/create/create.html b/client/views/create/create.html index c3b235b7..43a6d9ae 100644 --- a/client/views/create/create.html +++ b/client/views/create/create.html @@ -7,9 +7,9 @@
- -
-
+
+ +
+
diff --git a/client/views/create/create.js b/client/views/create/create.js index b9cf1b50..5f05e8ca 100644 --- a/client/views/create/create.js +++ b/client/views/create/create.js @@ -48,19 +48,31 @@ Template.create.events({ } }, 'click .instancemodsplus': function (event, template) { - const spacers = document.getElementsByClassName('emptyinputspacer'); - if (spacers.length < 4) { - $('.instancemodsinput').removeClass('lastmodinput'); - $('.plusbuttoncontainer').removeClass('lastmodinput'); - $('.instancemodsplus').remove(); - $('
+
').insertAfter('.lastinputspacer').last(); - $('.lastinputspacer').first().removeClass('lastinputspacer'); - $('#instancebottominputcontainer').height((index, height) => (height + 50)); + const modfields = document.getElementsByClassName('modinputfield'); + let addinputfield = true; + if (modfields.length < 4) { + for (let inputindex = 0; inputindex < modfields.length; inputindex++) { + if (modfields[inputindex].children[0].value === '') { + showCreateError('Fill in the exisitng input fields before creating a new one.'); + addinputfield = false; + break; + } + } + if (addinputfield === true) { + $('.instancemodsplus').remove(); + $('.buttoncontainer').last().append('
x
'); + $('
+
').insertAfter($('.modinputfield').last()); + $('#instancebottominputcontainer').height((index, height) => (height + 50)); + } } else { showCreateError("You've reached the maximum # of moderators (4)."); return false; } }, + 'click .instancemodsminus': function (event, template) { + event.originalEvent.path[2].remove(); + $('#instancebottominputcontainer').height((index, height) => (height - 50)); + }, 'click #buttonarea': function (event, template) { if (!Meteor.user()) { return false; diff --git a/client/views/main/main.scss b/client/views/main/main.scss index d597b9db..adf1312d 100644 --- a/client/views/main/main.scss +++ b/client/views/main/main.scss @@ -53,12 +53,6 @@ $screen-md: 992px; border-bottom: 1px solid #e3e3e3; } -.emptyinputspacer { - float: right; - height: 2em; -} - - .instancemodsinput { float: left; width: 70%;