summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/App.vue6
-rw-r--r--src/components/Navigation.vue8
-rw-r--r--src/components/News.vue1
-rw-r--r--src/views/AccountRecovery.vue38
-rw-r--r--src/views/NotFound.vue2
-rw-r--r--src/views/Registration.vue32
6 files changed, 48 insertions, 39 deletions
diff --git a/src/App.vue b/src/App.vue
index d6ccd44..a6f1aea 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -42,13 +42,17 @@
margin-top: 2em;
}
}
+
+ & p {
+ margin: 0px 40px 5px 30px;
+ }
}
& > .footer {
grid-area: footer;
}
- font-family: Helvetica, Arial, sans-serif;
+ font-family: sans-serif;
color: #2c3e50;
width: 100%;
diff --git a/src/components/Navigation.vue b/src/components/Navigation.vue
index 7527999..54a50b0 100644
--- a/src/components/Navigation.vue
+++ b/src/components/Navigation.vue
@@ -73,7 +73,7 @@
padding: 1ch;
&:hover, &.router-link-exact-active, &.custom-active {
- background: rgba(255,255,255,0.4);
+ background-color: rgba(255,255,255,0.4);
border: solid 1px #2f2e32;
font-weight: bold;
}
@@ -101,7 +101,7 @@
border-radius: 0 0 5px 5px;
&:hover {
- background: rgba(255,255,255,0.4);
+ background-color: rgba(255,255,255,0.4);
}
}
@@ -113,6 +113,10 @@
padding: 0;
width: 133px;
height: 100px;
+
+ &:hover {
+ opacity: 0.8;
+ }
}
}
}
diff --git a/src/components/News.vue b/src/components/News.vue
index ac24144..5e2b598 100644
--- a/src/components/News.vue
+++ b/src/components/News.vue
@@ -30,6 +30,7 @@
& > .date {
float: right;
+ color: #0000FF;
}
& .body {
diff --git a/src/views/AccountRecovery.vue b/src/views/AccountRecovery.vue
index c04829e..7345f59 100644
--- a/src/views/AccountRecovery.vue
+++ b/src/views/AccountRecovery.vue
@@ -2,24 +2,24 @@
<main>
<div v-if="step == 1">
<h1>Account Recovery</h1>
- Use this form if you forgot your username or password.
- If it matches any account we have on file you will receive a message containing the list of your account usernames
- along with a password reset link, should you wish to reset your password.
+ <p>Use this form if you forgot your username or password.</p>
+ <p>If it matches any account we have on file you will receive a message containing the list of your account usernames
+ along with a password reset link, should you wish to reset your password.</p>
</div>
<div v-if="step == -1">
<h1>reCAPTCHA could not be loaded</h1>
- This page requires reCAPTCHA but something prevents it from loading.
- If you are using an ad blocker or tracker blocker please whitelist this page and refresh to continue.
+ <p>This page requires reCAPTCHA but something prevents it from loading.
+ If you are using an ad blocker or tracker blocker please whitelist this page and refresh to continue.</p>
</div>
<div v-if="step == 1">
<h1>Email address</h1>
- The email address that was used to register your account(s).
+ <p>The email address that was used to register your account(s).</p>
<div class="error notFound" v-if="notFound">
<h2>Not found</h2>
- We were not able to find any accounts associated with this email address.
+ <p>We were not able to find any accounts associated with this email address.</p>
</div>
<form @submit.prevent="checkEmail">
@@ -38,34 +38,34 @@
<div v-if="step == 3">
<h1>Recovery process started</h1>
- An email was sent with the list of your accounts.
+ <p>An email was sent with the list of your accounts.</p>
<h1>Next steps</h1>
- If you wish to reset the password of your accounts, click the provided link in the email you received.<br>
- This link is only valid once: if you wish to reset more than one password you will have to repeat the process.
+ <p>If you wish to reset the password of your accounts, click the provided link in the email you received.</p>
+ <p>This link is only valid once: if you wish to reset more than one password you will have to repeat the process.</p>
<br><br><br>
<h1>Can't find the account you were looking for?</h1>
- Double-check the email address you entered; You might have used a different address when you created the account or you might have omitted to provide an email address.
+ <p>Double-check the email address you entered; You might have used a different address when you created the account or you might have omitted to provide an email address.</p>
<h1>Still need help?</h1>
- Feel free to <router-link :to="{ name: 'support' }">contact us</router-link> for further assistance.
+ <p>Feel free to <router-link :to="{ name: 'support' }">contact us</router-link> for further assistance.</p>
</div>
<!-- PART TWO: -->
<div v-if="step == -2">
<h1>Expired link</h1>
- This password reset link has expired or is invalid.<br>
- Keep in mind that emailed links are only valid for 60 minutes.
+ <p>This password reset link has expired or is invalid.</p>
+ <p>Keep in mind that emailed links are only valid for 60 minutes.</p>
<h1>Start over</h1>
- You may try again in 5 minutes: <router-link :to="{ name: 'support' }">account recovery</router-link>
+ <p>You may try again in 5 minutes: <router-link :to="{ name: 'support' }">account recovery</router-link></p>
</div>
<div v-if="step == 4">
<h1>Username</h1>
- Your password reset link is <em>only</em> valid for account usernames listed in the email that was sent to you.
+ <p>Your password reset link is <em>only</em> valid for account usernames listed in the email that was sent to you.</p>
<form @submit.prevent="checkUser">
<label for="user">Enter a username:</label>
@@ -76,7 +76,7 @@
<div v-if="step == 5">
<h1>Password</h1>
- Please choose a new, hard-to-guess password.
+ <p>Please choose a new, hard-to-guess password.</p>
<p>It must contain between 8 and 23 characters. Letters and numbers only. Case-sensitive.</p>
<div v-if="exposed" class="exposed">
@@ -115,10 +115,10 @@
<div v-if="step == 7">
<h1>The deed is done</h1>
- The password of account <q>{{user.name}}</q> has been reset.
+ <p>The password of account <q>{{user.name}}</q> has been reset.</p>
<h1>Next steps</h1>
- To start playing, <a href="https://wiki.themanaworld.org/index.php/Downloads">download ManaPlus</a> and select the server <i>The Mana World</i>
+ <p>To start playing, <a href="https://wiki.themanaworld.org/index.php/Downloads">download ManaPlus</a> and select the server <i>The Mana World</i>.</p>
</div>
<div class="g-recaptcha" id="recaptcha-container"
diff --git a/src/views/NotFound.vue b/src/views/NotFound.vue
index b45a4f2..35b9753 100644
--- a/src/views/NotFound.vue
+++ b/src/views/NotFound.vue
@@ -1,6 +1,6 @@
<template>
<main>
<h1>Page not found</h1>
- This page does not exist or has been removed
+ <p>This page does not exist or has been removed.</p>
</main>
</template>
diff --git a/src/views/Registration.vue b/src/views/Registration.vue
index 0029fc4..8aac0c2 100644
--- a/src/views/Registration.vue
+++ b/src/views/Registration.vue
@@ -1,20 +1,20 @@
<template>
<main class="registration">
<h1>Account creation</h1>
- Welcome to The Mana World! With this form you can register for a new game account.<br>
- Please note that you will also need to down and install ManaPlus, our official game client.
- <br><br>
+ <p>Welcome to The Mana World! With this form you can register for a new game account.</p>
+ <p>Please note that you will also need to down and install ManaPlus, our official game client.</p>
+ <br>
<button v-if="!step" @click="start">Begin!</button>
<div v-if="step == -1">
<h1>reCAPTCHA could not be loaded</h1>
- This page requires reCAPTCHA but something prevents it from loading.
- If you are using an ad blocker or tracker blocker please whitelist this page and refresh to continue.
+ <p>This page requires reCAPTCHA but something prevents it from loading.
+ If you are using an ad blocker or tracker blocker please whitelist this page and refresh to continue.</p>
<h1>Registering without reCAPTCHA</h1>
- If you would rather not use reCAPTCHA, you may register by contacting us by email.<br>
- We will create a new account for you and associate it with the email address that you used to contact us.
- <br><br>
+ <p>If you would rather not use reCAPTCHA, you may register by contacting us by email.</p>
+ <p>We will create a new account for you and associate it with the email address that you used to contact us.</p>
+ <br>
<address>sysadmin@themanaworld.org</address>
</div>
@@ -22,9 +22,9 @@
<div v-if="step == 1">
<h1>Email address</h1>
- We will never give your email address to someone else or send you spam.
- Providing an email address is entirely optional but it is the only way to request a password reset, should you loose access to your account.
- If you did not provide an email address you will be unable to perform password resets.
+ <p>We will never give your email address to someone else or send you spam.</p>
+ <p>Providing an email address is entirely optional but it is the only way to request a password reset, should you loose access to your account.
+ If you did not provide an email address you will be unable to perform password resets.</p>
<form @submit.prevent="checkEmail">
<label for="email">Enter your email (optional):</label>
<input v-model="user.email" type="email" maxlength="39" id="email" ref="email" placeholder="your@email.com">
@@ -34,12 +34,12 @@
<div v-if="step == 2">
<h1>Username</h1>
- Your username is used to log in to the game server. It is never shared with other players: only you see this name.
+ <p>Your username is used to log in to the game server. It is never shared with other players: only you see this name.</p>
<p>It must contain between 4 and 23 characters. Letters and numbers only.</p>
<div class="error taken" v-if="taken">
<h2>Username taken</h2>
- Please choose another username.
+ <p>Please choose another username.</p>
</div>
<form @submit.prevent="checkUser">
@@ -51,7 +51,7 @@
<div v-if="step == 3">
<h1>Password</h1>
- Please choose a hard-to-guess password.
+ <p>Please choose a hard-to-guess password.</p>
<p>It must contain between 8 and 23 characters. Letters and numbers only. Case-sensitive.</p>
<div v-if="exposed" class="exposed">
@@ -93,10 +93,10 @@
<div v-if="step == 5">
<h1>Thank you</h1>
- Your account has been successfully created.
+ <p>Your account has been successfully created.</p>
<h1>Next steps</h1>
- To start playing, <a href="https://wiki.themanaworld.org/index.php/Downloads">download ManaPlus</a> and select the server <i>The Mana World</i>
+ <p>To start playing, <a href="https://wiki.themanaworld.org/index.php/Downloads">download ManaPlus</a> and select the server <i>The Mana World</i>.</p>
</div>
<div class="g-recaptcha" id="recaptcha-container"