Fix WideScreens

Dieser Commit ist enthalten in:
Chaoscaot 2023-07-25 14:25:58 +02:00
Ursprung 64ddc1c69b
Commit b3b1e460bb
Signiert von: Chaoscaot
GPG-Schlüssel-ID: BDF8FADD7D5EDB7A
2 geänderte Dateien mit 10 neuen und 6 gelöschten Zeilen

Datei anzeigen

@ -3,8 +3,9 @@
import {Button, Checkbox, Modal, Toolbar, ToolbarButton} from "flowbite-svelte"; import {Button, Checkbox, Modal, Toolbar, ToolbarButton} from "flowbite-svelte";
import type {EventFight, ExtendedEvent} from "../../types/event.js"; import type {EventFight, ExtendedEvent} from "../../types/event.js";
import FightEditModal from "./modals/FightEditModal.svelte"; import FightEditModal from "./modals/FightEditModal.svelte";
import {createEventDispatcher} from "svelte"; import {createEventDispatcher, onMount} from "svelte";
import {fightRepo} from "../../repo/repo.js"; import {fightRepo} from "../../repo/repo.js";
import {isWide} from "../../stores/stores.js";
export let fight: EventFight; export let fight: EventFight;
export let data: ExtendedEvent; export let data: ExtendedEvent;
@ -37,16 +38,16 @@
<div class="flex"> <div class="flex">
<div class="flex flex-col"> <div class="flex flex-col">
<div> <div>
<span>{fight.blueTeam.name}</span> <span>{$isWide ? fight.blueTeam.name : fight.blueTeam.kuerzel}</span>
vs. vs.
<span>{fight.redTeam.name}</span> <span>{$isWide ? fight.redTeam.name : fight.redTeam.kuerzel}</span>
</div> </div>
{#if (fight.ergebnis === 3)} {#if (fight.ergebnis === 3)}
<span class="ml-2">Unentschieden</span> <span class="ml-2">Unentschieden</span>
{:else if (fight.ergebnis !== 0)} {:else if (fight.ergebnis !== 0)}
<span class="ml-2">{fight.ergebnis === 1 ? 'Sieger: ' + fight.blueTeam.name : 'Sieger: ' + fight.redTeam.name}</span> <span class="ml-2">{fight.ergebnis === 1 ? 'Sieger: ' + ($isWide ? fight.blueTeam.name : fight.blueTeam.kuerzel) : 'Sieger: ' + ($isWide ? fight.redTeam.name : fight.redTeam.kuerzel)}</span>
{:else} {:else}
<span class="ml-2">Noch nicht gespielt</span> <span class="ml-2">{$isWide ? 'Noch nicht gespielt' : 'kommend'}</span>
{/if} {/if}
</div> </div>
</div> </div>

Datei anzeigen

@ -1,7 +1,7 @@
import type {Player, SchematicType} from "../types/data.js"; import type {Player, SchematicType} from "../types/data.js";
import {cached, cachedFamily} from "./cached.js"; import {cached, cachedFamily} from "./cached.js";
import type {Team} from "../types/team.js"; import type {Team} from "../types/team.js";
import {get} from "svelte/store"; import {get, writable} from "svelte/store";
import {tokenStore} from "../repo/repo.js"; import {tokenStore} from "../repo/repo.js";
export const schemTypes = cached<SchematicType[]>([], () => { export const schemTypes = cached<SchematicType[]>([], () => {
@ -39,3 +39,6 @@ export const teams = cached<Team[]>([], () => {
return fetch("https://steamwar.de/eventplanner-api/team", {headers: {"X-SW-Auth": get(tokenStore)}}) return fetch("https://steamwar.de/eventplanner-api/team", {headers: {"X-SW-Auth": get(tokenStore)}})
.then(res => res.json()) .then(res => res.json())
}) })
export const isWide = writable(window.innerWidth >= 640);
window.addEventListener("resize", () => isWide.set(window.innerWidth >= 640));