diff options
| -rw-r--r-- | .env | 6 | ||||
| -rw-r--r-- | .env.development | 2 | ||||
| -rw-r--r-- | src/App.vue | 18 | ||||
| -rw-r--r-- | src/views/Registration.vue | 6 |
4 files changed, 28 insertions, 4 deletions
@@ -9,3 +9,9 @@ VUE_APP_RECAPTCHA=6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI # Responsible disclosure PGP key VUE_APP_PGP= + +# Special event to display on the registration page +VUE_APP_EVENT= + +# Special message to display prominently on all pages +VUE_APP_STATUS= diff --git a/.env.development b/.env.development index 6a7d08c..39b9119 100644 --- a/.env.development +++ b/.env.development @@ -1 +1,3 @@ VUE_APP_TITLE=TMW (DEV) + +VUE_APP_EVENT="<b>Staging environment.</b> This is not a production server." diff --git a/src/App.vue b/src/App.vue index f46f063..01632d9 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,5 +1,6 @@ <template> - <Logo class="header"/> + <div v-if="globalStatus" class="dialog" v-html="globalStatus"></div> + <Logo v-else class="header"/> <Navigation class="nav"/> <router-view v-if="loaded" class="content"/> <main v-else class="content" role="alert" aria-busy="true"> @@ -41,6 +42,19 @@ & > .footer { grid-area: footer; } + + & .dialog { + background: #ff0000; + color: #fff; + padding: 2em 1em 2em 1em; + display: block; + font-size: 1.5rem; + margin: 1rem; + z-index: 10000; + grid-area: logo; + border: 5px gray(95) dotted; + } + font-family: sans-serif; color: #2c3e50; width: 100%; @@ -91,6 +105,8 @@ import Copyright from "@/components/Footer.vue"; export default class AppV extends Vue { loaded = false; + globalStatus = process.env.VUE_APP_STATUS?.trim() ?? ""; + mounted () { self.addEventListener("initial-load", () => { this.loaded = true; diff --git a/src/views/Registration.vue b/src/views/Registration.vue index 35c7d07..9fdd686 100644 --- a/src/views/Registration.vue +++ b/src/views/Registration.vue @@ -4,9 +4,7 @@ <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 download and install <a href="https://wiki.themanaworld.org/index.php/Downloads" target="_blank">ManaPlus</a>, our official game client.</p> <br> - <div class="specialEvent"> - <b>The apocalypse is upon us.</b> Due the Doomsday Event, whole towns may vanish from the map temporarily. <a href="https://forums.themanaworld.org/viewtopic.php?p=161550#p161550">Read more details here ￫</a> - </div> + <div class="specialEvent" v-if="specialEvent" v-html="specialEvent"></div> <button v-if="!step" @click="isRecaptchaAccepted ? start() : step = -2">Begin!</button> <div v-if="step == -2"> @@ -162,6 +160,8 @@ export default class Registration extends Vue { recaptcha_key = process.env.VUE_APP_RECAPTCHA; + specialEvent = process.env.VUE_APP_EVENT?.trim() ?? ""; // special in-game events + async mounted () { // already loaded (user returned to this page) if (reCAPTCHA.isReady) { |