Merge pull request #522 from bertyhell/bugfix/improve-setup-styles

fix(setup): increase left padding input fields + avoid clipping
This commit is contained in:
Louis Lam 2021-10-01 21:38:18 +08:00 committed by GitHub
commit 2b1fe815f9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 47 additions and 20 deletions

View file

@ -52,7 +52,7 @@ export default {
token: "",
res: null,
tokenRequired: false,
}
};
},
methods: {
submit() {
@ -60,21 +60,20 @@ export default {
this.$root.login(this.username, this.password, this.token, (res) => {
this.processing = false;
console.log(res)
console.log(res);
if (res.tokenRequired) {
this.tokenRequired = true;
} else {
this.res = res;
}
})
});
},
},
}
};
</script>
<style scoped>
<style lang="scss" scoped>
.form-container {
display: flex;
align-items: center;
@ -82,8 +81,17 @@ export default {
padding-bottom: 40px;
}
.form {
.form-floating {
> label {
padding-left: 1.3rem;
}
> .form-control {
padding-left: 1.3rem;
}
}
.form {
width: 100%;
max-width: 330px;
padding: 15px;

View file

@ -46,8 +46,8 @@
</template>
<script>
import { useToast } from "vue-toastification"
const toast = useToast()
import { useToast } from "vue-toastification";
const toast = useToast();
export default {
data() {
@ -56,7 +56,7 @@ export default {
username: "",
password: "",
repeatPassword: "",
}
};
},
watch: {
"$i18n.locale"() {
@ -66,7 +66,7 @@ export default {
mounted() {
this.$root.getSocket().emit("needSetup", (needSetup) => {
if (! needSetup) {
this.$router.push("/")
this.$router.push("/");
}
});
},
@ -75,31 +75,30 @@ export default {
this.processing = true;
if (this.password !== this.repeatPassword) {
toast.error("Repeat password do not match.")
toast.error("Repeat password do not match.");
this.processing = false;
return;
}
this.$root.getSocket().emit("setup", this.username, this.password, (res) => {
this.processing = false;
this.$root.toastRes(res)
this.$root.toastRes(res);
if (res.ok) {
this.processing = true;
this.$root.login(this.username, this.password, "", (res) => {
this.$root.login(this.username, this.password, "", () => {
this.processing = false;
this.$router.push("/")
})
this.$router.push("/");
});
}
})
});
},
},
}
};
</script>
<style scoped>
<style lang="scss" scoped>
.form-container {
display: flex;
align-items: center;
@ -107,6 +106,26 @@ export default {
padding-bottom: 40px;
}
.form-floating {
> .form-select {
padding-left: 1.3rem;
padding-top: 1.525rem;
line-height: 1.35;
~ label {
padding-left: 1.3rem;
}
}
> label {
padding-left: 1.3rem;
}
> .form-control {
padding-left: 1.3rem;
}
}
.form {
width: 100%;