e9a05ce161
* Fixes an issue where long translations cause layout issues * Fixes an issue where the alignment shifts when switching between signup/login * Makes some of the margin/padding more consistent * Removes duplicate .login-modal and .create-account classes and replaces them with .login-modal-body and .create-account-body * Adds another color transformation so we could remove prefers-color-scheme... the problem with that was that my OS' UI might be set to something different than my Discourse preferences (prefers-color-scheme only responds to OS UI settings)
88 lines
2.3 KiB
JavaScript
88 lines
2.3 KiB
JavaScript
import Component from "@ember/component";
|
|
import cookie from "discourse/lib/cookie";
|
|
|
|
export default Component.extend({
|
|
classNames: ["create-account-body"],
|
|
|
|
userInputFocus(event) {
|
|
let label = event.target.parentElement.previousElementSibling;
|
|
if (!label.classList.contains("value-entered")) {
|
|
label.classList.toggle("value-entered");
|
|
}
|
|
},
|
|
|
|
userInputFocusOut(event) {
|
|
let label = event.target.parentElement.previousElementSibling;
|
|
if (
|
|
event.target.value.length === 0 &&
|
|
label.classList.contains("value-entered")
|
|
) {
|
|
label.classList.toggle("value-entered");
|
|
}
|
|
},
|
|
|
|
didInsertElement() {
|
|
this._super(...arguments);
|
|
|
|
if (cookie("email")) {
|
|
this.set("email", cookie("email"));
|
|
}
|
|
|
|
let userTextFields = document.getElementsByClassName("user-fields")[0];
|
|
|
|
if (userTextFields) {
|
|
userTextFields = userTextFields.getElementsByClassName(
|
|
"ember-text-field"
|
|
);
|
|
}
|
|
|
|
if (userTextFields) {
|
|
for (let element of userTextFields) {
|
|
element.addEventListener("focus", this.userInputFocus);
|
|
element.addEventListener("focusout", this.userInputFocusOut);
|
|
}
|
|
}
|
|
|
|
$(this.element).on("keydown.discourse-create-account", (e) => {
|
|
if (!this.disabled && e.keyCode === 13) {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
this.action();
|
|
return false;
|
|
}
|
|
});
|
|
|
|
$(this.element).on("click.dropdown-user-field-label", "[for]", (event) => {
|
|
const $element = $(event.target);
|
|
const $target = $(`#${$element.attr("for")}`);
|
|
|
|
if ($target.is(".select-kit")) {
|
|
event.preventDefault();
|
|
$target.find(".select-kit-header").trigger("click");
|
|
}
|
|
});
|
|
},
|
|
|
|
willDestroyElement() {
|
|
this._super(...arguments);
|
|
|
|
$(this.element).off("keydown.discourse-create-account");
|
|
$(this.element).off("click.dropdown-user-field-label");
|
|
|
|
let userTextFields = document.getElementsByClassName("user-fields")[0];
|
|
|
|
if (userTextFields) {
|
|
userTextFields = userTextFields.getElementsByClassName(
|
|
"ember-text-field"
|
|
);
|
|
}
|
|
|
|
if (userTextFields) {
|
|
for (let element of userTextFields) {
|
|
element.removeEventListener("focus", this.userInputFocus);
|
|
element.removeEventListener("focusout", this.userInputFocusOut);
|
|
}
|
|
}
|
|
},
|
|
});
|