Pandipipas/scoreko-dev
1
0
Fork 0
mirror of https://github.com/Pandipipas/scoreko-dev.git synced 2026-06-06 03:32:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: update player source chips with icons and improve styling for better visual clarity

Browse Source
This commit is contained in:
Pandipipas
2026-05-18 00:29:31 +02:00
parent 27c0298ca2
commit 79f6653d94
1 changed files with 15 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/dashboard/scoreko-dev/views/Players.vue
+15 -16
View File
@@ -305,27 +305,26 @@ const handleImport = async (event: Event) => {
<QChip <QChip
v-if="playerSource(row.id) === 'startgg'" v-if="playerSource(row.id) === 'startgg'"
dense dense
outline
color="blue-4"
class="q-my-none q-mr-none q-ml-xs" class="q-my-none q-mr-none q-ml-xs"
style="font-size: 10px; height: 18px;" style="height: 18px; padding: 0 4px; background: transparent;"
> >
start.gg <svg style="width: 12px; height: 12px; flex-shrink: 0;" viewBox="0 0 40 40" fill="none" aria-hidden="true">
<QTooltip v-if="playerExpiresAt(row.id)"> <path d="M1.25 20h7.5A1.25 1.25 0 0 0 10 18.75v-7.5A1.25 1.25 0 0 1 11.25 10h27.5A1.25 1.25 0 0 0 40 8.75V1.25A1.25 1.25 0 0 0 38.75 0H10A10 10 0 0 0 0 10v8.75A1.25 1.25 0 0 0 1.25 20Z" fill="#3f80ff" />
Temporary · expires {{ formatExpiresAt(playerExpiresAt(row.id)!) }} <path d="M38.75 20h-7.5A1.25 1.25 0 0 0 30 21.25v7.5A1.25 1.25 0 0 1 28.75 30H1.25A1.25 1.25 0 0 0 0 31.25v7.5A1.25 1.25 0 0 0 1.25 40H30A10 10 0 0 0 40 30V21.25A1.25 1.25 0 0 0 38.75 20Z" fill="#ff2768" />
</svg>
<QTooltip>
start.gg<template v-if="playerExpiresAt(row.id)"> · Temporary · expires {{ formatExpiresAt(playerExpiresAt(row.id)!) }}</template>
</QTooltip> </QTooltip>
</QChip> </QChip>
<QChip <QChip
v-else-if="playerSource(row.id) === 'challonge'" v-else-if="playerSource(row.id) === 'challonge'"
dense dense
outline
color="orange-4"
class="q-my-none q-mr-none q-ml-xs" class="q-my-none q-mr-none q-ml-xs"
style="font-size: 10px; height: 18px;" style="height: 18px; padding: 0 4px; background: transparent;"
> >
Challonge <img src="https://challonge.com/favicon.ico" alt="Challonge" style="width: 12px; height: 12px; border-radius: 2px; flex-shrink: 0;">
<QTooltip v-if="playerExpiresAt(row.id)"> <QTooltip>
Temporary · expires {{ formatExpiresAt(playerExpiresAt(row.id)!) }} Challonge<template v-if="playerExpiresAt(row.id)"> · Temporary · expires {{ formatExpiresAt(playerExpiresAt(row.id)!) }}</template>
</QTooltip> </QTooltip>
</QChip> </QChip>
</div> </div>
@@ -364,8 +363,9 @@ const handleImport = async (event: Event) => {
<!-- ── start.gg ─────────────────────────────────────────────────── --> <!-- ── start.gg ─────────────────────────────────────────────────── -->
<QCard flat bordered class="q-pa-md"> <QCard flat bordered class="q-pa-md">
<div class="text-h6 q-mb-sm startgg-heading"> <div class="text-h6 q-mb-sm startgg-heading">
<svg class="startgg-heading__icon" viewBox="0 0 24 24" aria-hidden="true"> <svg class="startgg-heading__icon" viewBox="0 0 40 40" fill="none" aria-hidden="true">
<path d="M6 0A5.999 5.999 0 00.002 6v5.252a.75.75 0 00.75.748H5.25a.748.748 0 00.75-.747V6.749C6 6.334 6.336 6 6.748 6h16.497a.748.748 0 00.749-.748V.749A.743.743 0 0023.247 0zm12.75 12a.748.748 0 00-.75.75v4.5a.748.748 0 01-.747.748H.753a.754.754 0 00-.75.751v4.5a.75.75 0 00.75.751H18a5.999 5.999 0 005.999-6v-5.25a.75.75 0 00-.75-.75z" /> <path d="M1.25 20h7.5A1.25 1.25 0 0 0 10 18.75v-7.5A1.25 1.25 0 0 1 11.25 10h27.5A1.25 1.25 0 0 0 40 8.75V1.25A1.25 1.25 0 0 0 38.75 0H10A10 10 0 0 0 0 10v8.75A1.25 1.25 0 0 0 1.25 20Z" fill="#3f80ff" />
<path d="M38.75 20h-7.5A1.25 1.25 0 0 0 30 21.25v7.5A1.25 1.25 0 0 1 28.75 30H1.25A1.25 1.25 0 0 0 0 31.25v7.5A1.25 1.25 0 0 0 1.25 40H30A10 10 0 0 0 40 30V21.25A1.25 1.25 0 0 0 38.75 20Z" fill="#ff2768" />
</svg> </svg>
<span>start.gg</span> <span>start.gg</span>
</div> </div>
@@ -828,7 +828,6 @@ const handleImport = async (event: Event) => {
.startgg-heading__icon { .startgg-heading__icon {
width: 20px; width: 20px;
height: 20px; height: 20px;
fill: #2e75ba;
} }
.challonge-heading__icon { .challonge-heading__icon {
@@ -876,4 +875,4 @@ const handleImport = async (event: Event) => {
clip: rect(0, 0, 0, 0); clip: rect(0, 0, 0, 0);
border: 0; border: 0;
} }
</style> </style>