workadventure/front/src/Components/WarningContainer/WarningContainer.svelte
2022-01-24 18:59:28 +01:00

45 lines
1.2 KiB
Svelte

<script lang="typescript">
import { fly } from "svelte/transition";
import { userIsAdminStore, limitMapStore } from "../../Stores/GameStore";
import { ADMIN_URL } from "../../Enum/EnvironmentVariable";
import LL from "../../i18n/i18n-svelte";
const upgradeLink = ADMIN_URL + "/pricing";
const registerLink = ADMIN_URL + "/second-step-register";
</script>
<main class="warningMain" transition:fly={{ y: -200, duration: 500 }}>
{#if $userIsAdminStore}
<h2>{$LL.warning.title()}</h2>
<p>
{$LL.warning.content({ upgradeLink })}
</p>
{:else if $limitMapStore}
<p>
This map is available for 2 days. You can register your domain <a href={registerLink}>here</a>!
</p>
{:else}
<h2>{$LL.warning.title()}</h2>
<p>{$LL.warning.limit()}</p>
{/if}
</main>
<style lang="scss">
main.warningMain {
pointer-events: auto;
width: 100vw;
background-color: red;
text-align: center;
position: absolute;
left: 50%;
transform: translate(-50%, 0);
font-family: Lato;
min-width: 300px;
opacity: 0.9;
z-index: 2;
h2 {
padding: 5px;
}
}
</style>