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

Add FF warning message

Browse source
This commit is contained in:
Oliver-Akins 2021-03-29 14:11:06 -06:00
parent 0b3121bfe5
commit 983e11ff27
2 changed files with 53 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

26
web/src/views/CreateJoin.vue
View file

@ -9,6 +9,23 @@
> >
</a> </a>
</div> </div>
<div
v-if="$store.getters.isFirefox"
>
<div
id="firefox-warning"
class="error-message"
>
<p class="centre">
<strong>WARNING:</strong>
<br>
It appears as though you are using the Firefox web browser,
please note that Firefox is not recommended for use with
this site. Especially while streaming. This is to have the
site look as good as possible.
</p>
</div>
</div>
<button <button
class="clickable" class="clickable"
@click.stop="createGame()" @click.stop="createGame()"
@ -174,4 +191,13 @@ button {
} }
button:hover { background-color: var(--background2-darken); } button:hover { background-color: var(--background2-darken); }
button:focus { background-color: var(--background2-lighten); } button:focus { background-color: var(--background2-lighten); }
.error-message {
border-color: #F00;
border-style: solid;
border-radius: 5px;
border-width: 2px;
margin: 0 auto;
width: 70%
}
</style> </style>

27
web/src/views/Lobby.vue
View file

@ -30,6 +30,24 @@
@error="$emit(`error`, $event)" @error="$emit(`error`, $event)"
/> />
</div> </div>
<div
class="flex-row"
v-if="$store.getters.isFirefox"
>
<div
id="firefox-warning"
class="error-message"
>
<p class="centre">
<strong>WARNING:</strong>
<br>
It appears as though you are using the Firefox web browser,
please note that Firefox is not recommended for use with
this site. Especially while streaming. This is to have the
site look as good as possible.
</p>
</div>
</div>
<div class="flex-row"> <div class="flex-row">
<button <button
class="clickable" class="clickable"
@ -174,4 +192,13 @@ div.new-line {
width: 100% !important; width: 100% !important;
height: 0px; height: 0px;
} }
.error-message {
border-color: #F00;
border-style: solid;
border-radius: 5px;
border-width: 2px;
margin-top: 10px;
width: 70%
}
</style> </style>