Oliver/Phantom-Ink-Online
0
0
Fork 0
Code Issues Activity

Add a disconnect error that appears if the client loses connection

Browse source
This commit is contained in:
Oliver-Akins 2021-03-15 18:39:39 -06:00
parent 9f8842f8be
commit d36319e35b
1 changed files with 26 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

26
web/src/App.vue
View file

@ -1,5 +1,16 @@
<template> <template>
<div id="app" class="maximize"> <div id="app" class="maximize">
<transition name="top-slide">
<div
id="disconnect-error"
v-if="$socket.disconnected"
>
No connection to the game server.
<br>
If you are in the middle of a game, reload the website and you
can reconnect to the game by using the EXACT same name.
</div>
</transition>
<div v-if="!isMobile" class="maximize"> <div v-if="!isMobile" class="maximize">
<transition name="top-slide"> <transition name="top-slide">
<div <div
@ -126,6 +137,21 @@ html, body {
margin: 0; margin: 0;
} }
#disconnect-error {
background-color: red;
justify-content: center;
font-weight: bolder;
text-align: center;
position: fixed;
display: flex;
color: black;
padding: 10px;
width: 100vw;
z-index: 50;
left: 0;
top: 0;
}
.alert-bar { .alert-bar {
justify-content: center; justify-content: center;
align-items: center; align-items: center;