commento.{js,scss}: add login button in textarea

Closes https://gitlab.com/commento/commento-ce/issues/64
This commit is contained in:
Adhityaa Chandrasekar 2018-08-08 13:48:08 +05:30
parent 88b88a1198
commit b6dc79edd7
2 changed files with 36 additions and 9 deletions

View File

@ -391,19 +391,31 @@
if (!isAuthenticated && !chosenAnonymous) {
var buttonsContainer = create("div");
var question = create("div");
var buttons = create("div");
var createButton = create("div");
var loginButton = create("div");
classAdd(buttonsContainer, "create-container");
classAdd(buttonsContainer, "account-buttons-container");
classAdd(question, "account-buttons-question");
classAdd(buttons, "account-buttons");
classAdd(createButton, "button");
classAdd(createButton, "create-button");
classAdd(loginButton, "button");
classAdd(loginButton, "login-button");
attrSet(createButton, "onclick", "loginBoxShow()");
attrSet(loginButton, "onclick", "loginBoxShow(); loginSwitch(true);");
attrSet(textarea, "disabled", true);
createButton.innerText = "Create an Account";
loginButton.innerText = "Login";
question.innerText = "Want to add to the discussion?";
append(buttonsContainer, createButton);
append(buttons, createButton);
append(buttons, loginButton);
append(buttonsContainer, buttons);
append(textareaContainer, question);
append(textareaContainer, buttonsContainer);
}
else {
@ -1077,7 +1089,7 @@
}
global.loginSwitch = function() {
global.loginSwitch = function(leaveOauth) {
var header = $(ID_LOGIN_BOX_HEADER);
var subtitle = $(ID_LOGIN_BOX_SUBTITLE);
var loginLink = $(ID_LOGIN_BOX_LOGIN_LINK);
@ -1093,7 +1105,7 @@
loginBoxType = "login";
if (configuredOauths.length > 0) {
if (leaveOauth !== true && configuredOauths.length > 0) {
remove(hr);
remove(oauthPretext);
remove(oauthButtonsContainer);

View File

@ -52,7 +52,8 @@ textarea {
}
.commento-oauth-buttons,
.commento-create-container {
.commento-account-buttons,
.commento-account-buttons-container {
display: flex;
flex-direction: column;
align-items: center;
@ -60,12 +61,21 @@ textarea {
z-index: 1;
}
.commento-account-buttons {
flex-direction: row;
}
.commento-account-buttons-container {
padding-bottom: 10px;
}
.commento-oauth-buttons {
display: contents;
}
.commento-create-container::before {
content: "Want to add to the discussion?";
.commento-account-buttons-question {
position: absolute;
top: 25px;
display: block;
text-align: center;
justify-content: center;
@ -139,10 +149,15 @@ textarea {
}
.commento-create-button {
width: 150px;
width: 120px;
background: $pink-9;
}
.commento-login-button {
width: 50px;
background: $cyan-9;
}
.commento-submit-button {
float: right;
background: $indigo-7;