mirror of
https://github.com/Pandipipas/scoreko-dev.git
synced 2026-06-06 03:32:06 +00:00
Remove legacy side panels and old center controls
This commit is contained in:
Pandipipas
@@ -1020,312 +1020,6 @@ watch(
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</QCard>
|
</QCard>
|
||||||
|
|
||||||
<div class="scoreboard-grid">
|
|
||||||
<div class="scoreboard-grid__side">
|
|
||||||
<QCard
|
|
||||||
flat
|
|
||||||
bordered
|
|
||||||
>
|
|
||||||
<QCardSection>
|
|
||||||
<div class="text-subtitle1 text-weight-bold">
|
|
||||||
Left side
|
|
||||||
</div>
|
|
||||||
</QCardSection>
|
|
||||||
<QSeparator />
|
|
||||||
<QCardSection>
|
|
||||||
<QSelect
|
|
||||||
v-model="scoreboardStore.scoreboard.leftPlayerId"
|
|
||||||
v-model:input-value="leftInput"
|
|
||||||
:options="leftPlayerOptions"
|
|
||||||
label="Player"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
hide-selected
|
|
||||||
fill-input
|
|
||||||
@filter="onLeftFilter"
|
|
||||||
@focus="onLeftFocus"
|
|
||||||
@blur="onLeftBlur"
|
|
||||||
@update:model-value="onLeftSelect"
|
|
||||||
>
|
|
||||||
<template #append>
|
|
||||||
<QBtn
|
|
||||||
v-if="leftShowsNameSave"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
icon="save"
|
|
||||||
color="primary"
|
|
||||||
@click.stop="onLeftNameSave"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</QSelect>
|
|
||||||
<QSelect
|
|
||||||
v-model="scoreboardStore.scoreboard.leftCharacter"
|
|
||||||
v-model:input-value="leftCharacterInput"
|
|
||||||
:options="characterOptions"
|
|
||||||
option-value="value"
|
|
||||||
option-label="label"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
label="Character"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
hide-selected
|
|
||||||
fill-input
|
|
||||||
clearable
|
|
||||||
class="q-mt-sm"
|
|
||||||
:disable="!scoreboardStore.scoreboard.game"
|
|
||||||
/>
|
|
||||||
<div
|
|
||||||
v-if="leftCharacterImage"
|
|
||||||
class="character-preview q-mt-sm"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
:src="leftCharacterImage"
|
|
||||||
alt="Left character preview"
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<QInput
|
|
||||||
v-model="scoreboardStore.scoreboard.leftTeamOverride"
|
|
||||||
label="Team"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
class="q-mt-sm"
|
|
||||||
>
|
|
||||||
<template #append>
|
|
||||||
<QBtn
|
|
||||||
v-if="leftTeamChanged"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
icon="save"
|
|
||||||
color="primary"
|
|
||||||
@click.stop="saveLeftTeamChange"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</QInput>
|
|
||||||
<QSelect
|
|
||||||
v-model="scoreboardStore.scoreboard.leftCountryOverride"
|
|
||||||
v-model:input-value="leftCountryInput"
|
|
||||||
:options="leftCountryOptions"
|
|
||||||
option-value="value"
|
|
||||||
option-label="label"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
hide-selected
|
|
||||||
fill-input
|
|
||||||
clearable
|
|
||||||
label="Country"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
class="q-mt-sm"
|
|
||||||
@filter="onLeftCountryFilter"
|
|
||||||
>
|
|
||||||
<template #append>
|
|
||||||
<QBtn
|
|
||||||
v-if="leftCountryChanged"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
icon="save"
|
|
||||||
color="primary"
|
|
||||||
@click.stop="saveLeftCountryChange"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</QSelect>
|
|
||||||
<QInput
|
|
||||||
v-model.number="scoreboardStore.leftScore"
|
|
||||||
type="number"
|
|
||||||
label="Score"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
class="q-mt-md"
|
|
||||||
min="0"
|
|
||||||
/>
|
|
||||||
</QCardSection>
|
|
||||||
</QCard>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="scoreboard-grid__center">
|
|
||||||
<QCard
|
|
||||||
flat
|
|
||||||
bordered
|
|
||||||
>
|
|
||||||
<QCardSection>
|
|
||||||
<div class="column items-center q-gutter-sm">
|
|
||||||
<div class="row items-center q-gutter-sm">
|
|
||||||
<QBtn
|
|
||||||
color="secondary"
|
|
||||||
outline
|
|
||||||
round
|
|
||||||
icon="swap_horiz"
|
|
||||||
@click="scoreboardStore.swapPlayers"
|
|
||||||
/>
|
|
||||||
<QBtn
|
|
||||||
color="secondary"
|
|
||||||
outline
|
|
||||||
round
|
|
||||||
icon="restart_alt"
|
|
||||||
@click="scoreboardStore.resetScores"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<QSelect
|
|
||||||
v-model="scoreboardStore.scoreboard.game"
|
|
||||||
:options="fightingGameOptions"
|
|
||||||
label="Juego"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
class="full-width"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</QCardSection>
|
|
||||||
</QCard>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="scoreboard-grid__side">
|
|
||||||
<QCard
|
|
||||||
flat
|
|
||||||
bordered
|
|
||||||
>
|
|
||||||
<QCardSection>
|
|
||||||
<div class="text-subtitle1 text-weight-bold">
|
|
||||||
Right side
|
|
||||||
</div>
|
|
||||||
</QCardSection>
|
|
||||||
<QSeparator />
|
|
||||||
<QCardSection>
|
|
||||||
<QSelect
|
|
||||||
v-model="scoreboardStore.scoreboard.rightPlayerId"
|
|
||||||
v-model:input-value="rightInput"
|
|
||||||
:options="rightPlayerOptions"
|
|
||||||
label="Player"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
hide-selected
|
|
||||||
fill-input
|
|
||||||
@filter="onRightFilter"
|
|
||||||
@focus="onRightFocus"
|
|
||||||
@blur="onRightBlur"
|
|
||||||
@update:model-value="onRightSelect"
|
|
||||||
>
|
|
||||||
<template #append>
|
|
||||||
<QBtn
|
|
||||||
v-if="rightShowsNameSave"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
icon="save"
|
|
||||||
color="primary"
|
|
||||||
@click.stop="onRightNameSave"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</QSelect>
|
|
||||||
<QSelect
|
|
||||||
v-model="scoreboardStore.scoreboard.rightCharacter"
|
|
||||||
v-model:input-value="rightCharacterInput"
|
|
||||||
:options="characterOptions"
|
|
||||||
option-value="value"
|
|
||||||
option-label="label"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
label="Character"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
hide-selected
|
|
||||||
fill-input
|
|
||||||
clearable
|
|
||||||
class="q-mt-sm"
|
|
||||||
:disable="!scoreboardStore.scoreboard.game"
|
|
||||||
/>
|
|
||||||
<div
|
|
||||||
v-if="rightCharacterImage"
|
|
||||||
class="character-preview q-mt-sm"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
:src="rightCharacterImage"
|
|
||||||
alt="Right character preview"
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<QInput
|
|
||||||
v-model="scoreboardStore.scoreboard.rightTeamOverride"
|
|
||||||
label="Team"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
class="q-mt-sm"
|
|
||||||
>
|
|
||||||
<template #append>
|
|
||||||
<QBtn
|
|
||||||
v-if="rightTeamChanged"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
icon="save"
|
|
||||||
color="primary"
|
|
||||||
@click.stop="saveRightTeamChange"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</QInput>
|
|
||||||
<QSelect
|
|
||||||
v-model="scoreboardStore.scoreboard.rightCountryOverride"
|
|
||||||
v-model:input-value="rightCountryInput"
|
|
||||||
:options="rightCountryOptions"
|
|
||||||
option-value="value"
|
|
||||||
option-label="label"
|
|
||||||
emit-value
|
|
||||||
map-options
|
|
||||||
use-input
|
|
||||||
input-debounce="0"
|
|
||||||
hide-selected
|
|
||||||
fill-input
|
|
||||||
clearable
|
|
||||||
label="Country"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
class="q-mt-sm"
|
|
||||||
@filter="onRightCountryFilter"
|
|
||||||
>
|
|
||||||
<template #append>
|
|
||||||
<QBtn
|
|
||||||
v-if="rightCountryChanged"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
icon="save"
|
|
||||||
color="primary"
|
|
||||||
@click.stop="saveRightCountryChange"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</QSelect>
|
|
||||||
<QInput
|
|
||||||
v-model.number="scoreboardStore.rightScore"
|
|
||||||
type="number"
|
|
||||||
label="Score"
|
|
||||||
dense
|
|
||||||
outlined
|
|
||||||
class="q-mt-md"
|
|
||||||
min="0"
|
|
||||||
/>
|
|
||||||
</QCardSection>
|
|
||||||
</QCard>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -1504,31 +1198,11 @@ watch(
|
|||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
||||||
.scoreboard-grid {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 1fr;
|
|
||||||
gap: 24px;
|
|
||||||
align-items: start;
|
|
||||||
}
|
|
||||||
|
|
||||||
.scoreboard-grid__side,
|
@media (min-width: 1024px) {
|
||||||
.scoreboard-grid__center {
|
.scoreboard-preview {
|
||||||
min-width: 0;
|
grid-template-columns: minmax(0, 1fr) minmax(320px, auto) minmax(0, 1fr);
|
||||||
}
|
}
|
||||||
|
|
||||||
.character-preview {
|
|
||||||
width: 100%;
|
|
||||||
border-radius: 8px;
|
|
||||||
overflow: hidden;
|
|
||||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
|
||||||
background: rgba(0, 0, 0, 0.25);
|
|
||||||
}
|
|
||||||
|
|
||||||
.character-preview img {
|
|
||||||
display: block;
|
|
||||||
width: 100%;
|
|
||||||
height: 88px;
|
|
||||||
object-fit: cover;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 900px) {
|
@media (max-width: 900px) {
|
||||||
@@ -1561,17 +1235,4 @@ watch(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 1024px) {
|
|
||||||
.scoreboard-preview {
|
|
||||||
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
|
|
||||||
}
|
|
||||||
|
|
||||||
.scoreboard-grid {
|
|
||||||
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
|
|
||||||
}
|
|
||||||
|
|
||||||
.scoreboard-grid__center {
|
|
||||||
width: 220px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user