@everymatrix/casino-tournaments-table 1.7.3 → 1.8.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/casino-tournaments-table.js +1 -1
  2. package/dist/casino-tournaments-table.js.map +1 -1
  3. package/package.json +2 -2
  4. package/src/CasinoTournamentsTable.svelte +183 -170
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@everymatrix/casino-tournaments-table",
3
- "version": "1.7.3",
3
+ "version": "1.8.3",
4
4
  "main": "dist/casino-tournaments-table.js",
5
5
  "svelte": "src/index.ts",
6
6
  "scripts": {
@@ -36,5 +36,5 @@
36
36
  "publishConfig": {
37
37
  "access": "public"
38
38
  },
39
- "gitHead": "af607736d2fefc2fcb0fc155b2023fcd62806a5c"
39
+ "gitHead": "15df0a4bc1195017b7df65675dfd40261b5dbe8b"
40
40
  }
package/src/CasinoTournamentsTable.svelte CHANGED
@@ -240,175 +240,68 @@
240
240
  $: _fractiondigit = Number(fractiondigit) || 2
241
241
  </script>
242
242
 
243
- {#if data.length > 0 || firstRowData}
244
- {#if isMobile(userAgent) == true}
245
- <div bind:this={customStylingContainer} class="TableContent" part="TableContent">
246
- <div class="TableUser TableHeadRow" part="TableUser TableHeadRow">
247
- {#each columns as column}
248
- <div class="TableCell Table{column}" part="TableCell Table{column}">
249
- {#if sortable == 'true'}
250
- <button on:click={() => sortBy(column)} data-sort={sort}>
251
- {$_(`tournamentsTable.${column}`)}
252
- </button>
243
+ <div bind:this={customStylingContainer}>
244
+ {#if data.length > 0 || firstRowData}
245
+ {#if isMobile(userAgent) == true}
246
+ <div class="TableContent" part="TableContent">
247
+ <div class="TableUser TableHeadRow" part="TableUser TableHeadRow">
248
+ {#each columns as column}
249
+ <div class="TableCell Table{column}" part="TableCell Table{column}">
250
+ {#if sortable == 'true'}
251
+ <button on:click={() => sortBy(column)} data-sort={sort}>
252
+ {$_(`tournamentsTable.${column}`)}
253
+ </button>
254
+ {:else}
255
+ <p data-sort={sort}>{$_(`tournamentsTable.${column}`)}</p>
256
+ {/if}
257
+ </div>
258
+ {/each}
259
+ </div>
260
+ {#if firstrow == 'true' && firstRowData}
261
+ <div class="TableUser CurrentUserRow {firstRowData.Unqualified ? 'UnqualifiedRow' : ''}" part="TableUser CurrentUserRow {firstRowData.Unqualified ? 'UnqualifiedRow' : ''}">
262
+ <div class="TableCell TableRank {firstRowData.Prize? 'Qualified' : ''}" part="TableCell TableRank RankFirstRow {firstRowData.Prize? 'Qualified' : ''}">
263
+ {firstRowData.Rank}
264
+ </div>
265
+ <div class="TableCell TablePlayer" part="TableCell TablePlayer">{shownPlayer(firstRowData.Player)}</div>
266
+ <div class="TableCell TablePoints" part="TableCell TablePoints">{firstRowData.Points}</div>
267
+ {#if firstRowData.Prize}
268
+ <div class="TableCell TablePrize {!firstRowData.Unqualified? 'Qualified' : ''}" part="TableCell TablePrize {!firstRowData.Unqualified? 'Qualified' : ''}">{firstRowData.Prize}</div>
253
269
  {:else}
254
- <p data-sort={sort}>{$_(`tournamentsTable.${column}`)}</p>
270
+ <div class="TableCell TablePrize" part="TableCell TablePrize">-</div>
255
271
  {/if}
256
272
  </div>
257
- {/each}
258
- </div>
259
- {#if firstrow == 'true' && firstRowData}
260
- <div class="TableUser CurrentUserRow {firstRowData.Unqualified ? 'UnqualifiedRow' : ''}" part="TableUser CurrentUserRow {firstRowData.Unqualified ? 'UnqualifiedRow' : ''}">
261
- <div class="TableCell TableRank {firstRowData.Prize? 'Qualified' : ''}" part="TableCell TableRank RankFirstRow {firstRowData.Prize? 'Qualified' : ''}">
262
- {firstRowData.Rank}
273
+ {#if firstRowData.Unqualified}
274
+ <div class="TableUserTooltips" part="TableUserTooltips">
275
+ <svg class="ExclamationMark" part="ExclamationMark" width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
276
+ <path d="M9.03087 3.14062C8.71521 2.56443 8.27722 2.06437 7.74767 1.67553C7.21811 1.28669 6.60971 1.01855 5.96544 0.889885C5.32118 0.761222 4.65646 0.775158 4.01817 0.930778C3.37988 1.0864 2.78361 1.37989 2.27086 1.79064C1.68689 2.25306 1.22358 2.85008 0.920762 3.53063C0.679091 4.08921 0.556377 4.69205 0.560655 5.30065C0.562354 5.92327 0.693172 6.53873 0.944444 7.10839C1.19572 7.67806 1.5622 8.18953 2.02086 8.61059C2.83307 9.36649 3.89773 9.79259 5.00719 9.80553C6.11665 9.81848 7.19124 9.4174 8.02086 8.68066C8.3779 8.38276 8.67913 8.0238 8.91075 7.6206C9.34355 6.92428 9.57213 6.12051 9.57066 5.30065C9.57316 4.54694 9.38776 3.80448 9.03087 3.14062V3.14062ZM4.43077 7.39062C4.41666 7.24208 4.44786 7.09281 4.52013 6.96227C4.59239 6.83174 4.70243 6.72606 4.8358 6.65917C4.96917 6.59228 5.11961 6.56724 5.26744 6.58739C5.41528 6.60754 5.55357 6.67195 5.66417 6.77209C5.77477 6.87223 5.85238 7.00344 5.88707 7.14855C5.92176 7.29367 5.91186 7.44586 5.85851 7.5852C5.80516 7.72454 5.71098 7.84448 5.58824 7.92931C5.46551 8.01415 5.31996 8.05999 5.17076 8.06066C5.0777 8.06746 4.9841 8.05526 4.89586 8.02489C4.80762 7.99453 4.72651 7.94653 4.65733 7.8839C4.58816 7.82127 4.53247 7.74531 4.49352 7.66051C4.45456 7.57572 4.43323 7.4839 4.43077 7.39062V7.39062ZM5.05065 2.69067H5.25084C5.32609 2.69062 5.40056 2.70571 5.46983 2.7351C5.53911 2.76448 5.60165 2.80755 5.65392 2.86169C5.70619 2.91582 5.7471 2.9799 5.77403 3.05016C5.80097 3.12043 5.81334 3.19542 5.81066 3.27062L5.7108 5.66064C5.70312 5.8039 5.64068 5.93873 5.53649 6.03735C5.43229 6.13596 5.29421 6.19087 5.15074 6.19067C5.00827 6.19076 4.87125 6.13559 4.76866 6.03674C4.66607 5.93788 4.60587 5.80301 4.60069 5.66064L4.50084 3.27062C4.49817 3.19625 4.51016 3.12209 4.53648 3.05248C4.5628 2.98287 4.60295 2.91923 4.65416 2.86523C4.70537 2.81123 4.76671 2.76801 4.83483 2.73803C4.90294 2.70805 4.97624 2.69195 5.05065 2.69067V2.69067Z"/>
277
+ </svg>
278
+ <em part="TableUserTooltipsEm">{$_('tournamentsTable.UnqualifiedTips')}</em>
263
279
  </div>
264
- <div class="TableCell TablePlayer" part="TableCell TablePlayer">{shownPlayer(firstRowData.Player)}</div>
265
- <div class="TableCell TablePoints" part="TableCell TablePoints">{firstRowData.Points}</div>
266
- {#if firstRowData.Prize}
267
- <div class="TableCell TablePrize {!firstRowData.Unqualified? 'Qualified' : ''}" part="TableCell TablePrize {!firstRowData.Unqualified? 'Qualified' : ''}">{firstRowData.Prize}</div>
268
- {:else}
269
- <div class="TableCell TablePrize" part="TableCell TablePrize">-</div>
270
280
  {/if}
271
- </div>
272
- {#if firstRowData.Unqualified}
273
- <div class="TableUserTooltips" part="TableUserTooltips">
274
- <svg class="ExclamationMark" part="ExclamationMark" width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
275
- <path d="M9.03087 3.14062C8.71521 2.56443 8.27722 2.06437 7.74767 1.67553C7.21811 1.28669 6.60971 1.01855 5.96544 0.889885C5.32118 0.761222 4.65646 0.775158 4.01817 0.930778C3.37988 1.0864 2.78361 1.37989 2.27086 1.79064C1.68689 2.25306 1.22358 2.85008 0.920762 3.53063C0.679091 4.08921 0.556377 4.69205 0.560655 5.30065C0.562354 5.92327 0.693172 6.53873 0.944444 7.10839C1.19572 7.67806 1.5622 8.18953 2.02086 8.61059C2.83307 9.36649 3.89773 9.79259 5.00719 9.80553C6.11665 9.81848 7.19124 9.4174 8.02086 8.68066C8.3779 8.38276 8.67913 8.0238 8.91075 7.6206C9.34355 6.92428 9.57213 6.12051 9.57066 5.30065C9.57316 4.54694 9.38776 3.80448 9.03087 3.14062V3.14062ZM4.43077 7.39062C4.41666 7.24208 4.44786 7.09281 4.52013 6.96227C4.59239 6.83174 4.70243 6.72606 4.8358 6.65917C4.96917 6.59228 5.11961 6.56724 5.26744 6.58739C5.41528 6.60754 5.55357 6.67195 5.66417 6.77209C5.77477 6.87223 5.85238 7.00344 5.88707 7.14855C5.92176 7.29367 5.91186 7.44586 5.85851 7.5852C5.80516 7.72454 5.71098 7.84448 5.58824 7.92931C5.46551 8.01415 5.31996 8.05999 5.17076 8.06066C5.0777 8.06746 4.9841 8.05526 4.89586 8.02489C4.80762 7.99453 4.72651 7.94653 4.65733 7.8839C4.58816 7.82127 4.53247 7.74531 4.49352 7.66051C4.45456 7.57572 4.43323 7.4839 4.43077 7.39062V7.39062ZM5.05065 2.69067H5.25084C5.32609 2.69062 5.40056 2.70571 5.46983 2.7351C5.53911 2.76448 5.60165 2.80755 5.65392 2.86169C5.70619 2.91582 5.7471 2.9799 5.77403 3.05016C5.80097 3.12043 5.81334 3.19542 5.81066 3.27062L5.7108 5.66064C5.70312 5.8039 5.64068 5.93873 5.53649 6.03735C5.43229 6.13596 5.29421 6.19087 5.15074 6.19067C5.00827 6.19076 4.87125 6.13559 4.76866 6.03674C4.66607 5.93788 4.60587 5.80301 4.60069 5.66064L4.50084 3.27062C4.49817 3.19625 4.51016 3.12209 4.53648 3.05248C4.5628 2.98287 4.60295 2.91923 4.65416 2.86523C4.70537 2.81123 4.76671 2.76801 4.83483 2.73803C4.90294 2.70805 4.97624 2.69195 5.05065 2.69067V2.69067Z"/>
276
- </svg>
277
- <em part="TableUserTooltipsEm">{$_('tournamentsTable.UnqualifiedTips')}</em>
278
- </div>
279
281
  {/if}
280
- {/if}
281
- {#if showTable}
282
- {#each display as row}
283
- <div class="TableUser {row.isCurrentUser ? 'CurrentUserRow' : ''}" part="TableUser {row.isCurrentUser ? 'CurrentUserRow' : ''}">
284
- <div class="TableCell TableRank {row.Prize? 'Qualified' : ''}" part="TableCell Rank-{row.Rank} TableRank {row.Prize? 'Qualified' : ''}">{row.Rank}</div>
285
- <div class="TableCell TablePlayer" part="TableCell TablePlayer">{shownPlayer(row.Player)}</div>
286
- <div class="TableCell TablePoints" part="TableCell TablePoints">{row.Points.toLocaleString('en-US', {minimumFractionDigits: _fractiondigit, maximumFractionDigits: _fractiondigit})}</div>
287
- {#if row.Prize}
288
- <div class="TableCell TablePrize {!row.Unqualified? 'Qualified' : ''}" part="TableCell TablePrize {!row.Unqualified? 'Qualified' : ''}">{row.Prize}</div>
289
- {:else}
290
- <div class="TableCell TablePrize" part="TableCell TablePrize">-</div>
291
- {/if}
292
- </div>
293
- {#if row.isCurrentUser && row.Unqualified}
294
- <div class="TableUserTooltips {row.Unqualified ? 'UnqualifiedRow' : ''}" part="TableUserTooltips {row.Unqualified ? 'UnqualifiedRow' : ''}">
295
- <svg class="ExclamationMark" part="ExclamationMark" width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
296
- <path d="M9.03087 3.14062C8.71521 2.56443 8.27722 2.06437 7.74767 1.67553C7.21811 1.28669 6.60971 1.01855 5.96544 0.889885C5.32118 0.761222 4.65646 0.775158 4.01817 0.930778C3.37988 1.0864 2.78361 1.37989 2.27086 1.79064C1.68689 2.25306 1.22358 2.85008 0.920762 3.53063C0.679091 4.08921 0.556377 4.69205 0.560655 5.30065C0.562354 5.92327 0.693172 6.53873 0.944444 7.10839C1.19572 7.67806 1.5622 8.18953 2.02086 8.61059C2.83307 9.36649 3.89773 9.79259 5.00719 9.80553C6.11665 9.81848 7.19124 9.4174 8.02086 8.68066C8.3779 8.38276 8.67913 8.0238 8.91075 7.6206C9.34355 6.92428 9.57213 6.12051 9.57066 5.30065C9.57316 4.54694 9.38776 3.80448 9.03087 3.14062V3.14062ZM4.43077 7.39062C4.41666 7.24208 4.44786 7.09281 4.52013 6.96227C4.59239 6.83174 4.70243 6.72606 4.8358 6.65917C4.96917 6.59228 5.11961 6.56724 5.26744 6.58739C5.41528 6.60754 5.55357 6.67195 5.66417 6.77209C5.77477 6.87223 5.85238 7.00344 5.88707 7.14855C5.92176 7.29367 5.91186 7.44586 5.85851 7.5852C5.80516 7.72454 5.71098 7.84448 5.58824 7.92931C5.46551 8.01415 5.31996 8.05999 5.17076 8.06066C5.0777 8.06746 4.9841 8.05526 4.89586 8.02489C4.80762 7.99453 4.72651 7.94653 4.65733 7.8839C4.58816 7.82127 4.53247 7.74531 4.49352 7.66051C4.45456 7.57572 4.43323 7.4839 4.43077 7.39062V7.39062ZM5.05065 2.69067H5.25084C5.32609 2.69062 5.40056 2.70571 5.46983 2.7351C5.53911 2.76448 5.60165 2.80755 5.65392 2.86169C5.70619 2.91582 5.7471 2.9799 5.77403 3.05016C5.80097 3.12043 5.81334 3.19542 5.81066 3.27062L5.7108 5.66064C5.70312 5.8039 5.64068 5.93873 5.53649 6.03735C5.43229 6.13596 5.29421 6.19087 5.15074 6.19067C5.00827 6.19076 4.87125 6.13559 4.76866 6.03674C4.66607 5.93788 4.60587 5.80301 4.60069 5.66064L4.50084 3.27062C4.49817 3.19625 4.51016 3.12209 4.53648 3.05248C4.5628 2.98287 4.60295 2.91923 4.65416 2.86523C4.70537 2.81123 4.76671 2.76801 4.83483 2.73803C4.90294 2.70805 4.97624 2.69195 5.05065 2.69067V2.69067Z"/>
297
- </svg>
298
- <em part="TableUserTooltipsEm">{$_('tournamentsTable.UnqualifiedTips')}</em>
282
+ {#if showTable}
283
+ {#each display as row}
284
+ <div class="TableUser {row.isCurrentUser ? 'CurrentUserRow' : ''}" part="TableUser {row.isCurrentUser ? 'CurrentUserRow' : ''}">
285
+ <div class="TableCell TableRank {row.Prize? 'Qualified' : ''}" part="TableCell Rank-{row.Rank} TableRank {row.Prize? 'Qualified' : ''}">{row.Rank}</div>
286
+ <div class="TableCell TablePlayer" part="TableCell TablePlayer">{shownPlayer(row.Player)}</div>
287
+ <div class="TableCell TablePoints" part="TableCell TablePoints">{row.Points.toLocaleString('en-US', {minimumFractionDigits: _fractiondigit, maximumFractionDigits: _fractiondigit})}</div>
288
+ {#if row.Prize}
289
+ <div class="TableCell TablePrize {!row.Unqualified? 'Qualified' : ''}" part="TableCell TablePrize {!row.Unqualified? 'Qualified' : ''}">{row.Prize}</div>
290
+ {:else}
291
+ <div class="TableCell TablePrize" part="TableCell TablePrize">-</div>
292
+ {/if}
299
293
  </div>
300
- {/if}
301
- {/each}
302
- {/if}
303
- </div>
304
- {:else}
305
- <div bind:this={customStylingContainer} class="TournamentsTable" part="TournamentsTable">
306
- <table class="LeftTable" part="LeftTable">
307
- <thead part="LeftTableThead">
308
- <tr part="LeftTableTr">
309
- {#each columns as column}
310
- <th part="LeftTableTh">
311
- {#if sortable == 'true'}
312
- <button on:click={() => sortBy(column)} data-sort={sort} part="LeftTableButton">
313
- {$_(`tournamentsTable.${column}`)}
314
- </button>
315
- {:else}
316
- <p data-sort={sort} part="LeftTableP">{$_(`tournamentsTable.${column}`)}</p>
317
- {/if}
318
- </th>
319
- {/each}
320
- </tr>
321
- </thead>
322
- <tbody part="LeftTableTbody">
323
- {#if firstrow == 'true' && firstRowData}
324
- <tr class="FirstRow {firstRowData.Unqualified ? 'UnqualifiedRow':''}" part="FirstRow {firstRowData.Unqualified ? 'UnqualifiedRow':''}">
325
- <td part="LeftTableTd RankFirstRow"><strong class="RankCol" part="RankCol"><em part="LeftTableTdEm">#{firstRowData.Rank}</em>
326
- <div class="ScoreChangeFlag {isUserPositionChanged ? 'Show' : 'Hidden'}" part="ScoreChangeFlag {isUserPositionChanged ? 'Show' : 'Hidden'}">
327
- <img src="{arrowUpSvg}" part="Rank_Arror_UP" class="svg Arrow Up {isUserPositionChanged && isUserPositionUp ? 'Show' : 'Hidden'}" />
328
- <img src="{arrowDownSvg}" part="Rank_Arror_Down" class="svg Arrow Down {isUserPositionChanged && !isUserPositionUp ? 'Show' : 'Hidden'}" />
329
- </div></strong>
330
- </td>
331
- <td part="LeftTableTd">{shownPlayer(firstRowData.Player)}</td>
332
- <td part="LeftTableTd">
333
- <div class="Flex" part="Flex">{firstRowData.Points}</div>
334
- </td>
335
- <td class="LeftTableTd {!firstRowData.Unqualified? 'Qualified' : ''}" part="LeftTableTd {!firstRowData.Unqualified? 'Qualified' : ''}">
336
- {#if firstRowData.Prize}
337
- {firstRowData.Prize}
338
- {:else}
339
- -
340
- {/if}
341
- </td>
342
- </tr>
343
- {#if firstRowData.Unqualified}
344
- <tr class="TooltipsRow" part="TooltipsRow">
345
- <td colspan="{tooltipColSpan}" part="LeftTableTd">
346
- <svg class="ExclamationMark" part="ExclamationMark" width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
347
- <path d="M9.03087 3.14062C8.71521 2.56443 8.27722 2.06437 7.74767 1.67553C7.21811 1.28669 6.60971 1.01855 5.96544 0.889885C5.32118 0.761222 4.65646 0.775158 4.01817 0.930778C3.37988 1.0864 2.78361 1.37989 2.27086 1.79064C1.68689 2.25306 1.22358 2.85008 0.920762 3.53063C0.679091 4.08921 0.556377 4.69205 0.560655 5.30065C0.562354 5.92327 0.693172 6.53873 0.944444 7.10839C1.19572 7.67806 1.5622 8.18953 2.02086 8.61059C2.83307 9.36649 3.89773 9.79259 5.00719 9.80553C6.11665 9.81848 7.19124 9.4174 8.02086 8.68066C8.3779 8.38276 8.67913 8.0238 8.91075 7.6206C9.34355 6.92428 9.57213 6.12051 9.57066 5.30065C9.57316 4.54694 9.38776 3.80448 9.03087 3.14062V3.14062ZM4.43077 7.39062C4.41666 7.24208 4.44786 7.09281 4.52013 6.96227C4.59239 6.83174 4.70243 6.72606 4.8358 6.65917C4.96917 6.59228 5.11961 6.56724 5.26744 6.58739C5.41528 6.60754 5.55357 6.67195 5.66417 6.77209C5.77477 6.87223 5.85238 7.00344 5.88707 7.14855C5.92176 7.29367 5.91186 7.44586 5.85851 7.5852C5.80516 7.72454 5.71098 7.84448 5.58824 7.92931C5.46551 8.01415 5.31996 8.05999 5.17076 8.06066C5.0777 8.06746 4.9841 8.05526 4.89586 8.02489C4.80762 7.99453 4.72651 7.94653 4.65733 7.8839C4.58816 7.82127 4.53247 7.74531 4.49352 7.66051C4.45456 7.57572 4.43323 7.4839 4.43077 7.39062V7.39062ZM5.05065 2.69067H5.25084C5.32609 2.69062 5.40056 2.70571 5.46983 2.7351C5.53911 2.76448 5.60165 2.80755 5.65392 2.86169C5.70619 2.91582 5.7471 2.9799 5.77403 3.05016C5.80097 3.12043 5.81334 3.19542 5.81066 3.27062L5.7108 5.66064C5.70312 5.8039 5.64068 5.93873 5.53649 6.03735C5.43229 6.13596 5.29421 6.19087 5.15074 6.19067C5.00827 6.19076 4.87125 6.13559 4.76866 6.03674C4.66607 5.93788 4.60587 5.80301 4.60069 5.66064L4.50084 3.27062C4.49817 3.19625 4.51016 3.12209 4.53648 3.05248C4.5628 2.98287 4.60295 2.91923 4.65416 2.86523C4.70537 2.81123 4.76671 2.76801 4.83483 2.73803C4.90294 2.70805 4.97624 2.69195 5.05065 2.69067V2.69067Z"/>
348
- </svg>
349
- {$_('tournamentsTable.UnqualifiedTips')}
350
- </td>
351
- </tr>
294
+ {#if row.isCurrentUser && row.Unqualified}
295
+ <div class="TableUserTooltips {row.Unqualified ? 'UnqualifiedRow' : ''}" part="TableUserTooltips {row.Unqualified ? 'UnqualifiedRow' : ''}">
296
+ <svg class="ExclamationMark" part="ExclamationMark" width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
297
+ <path d="M9.03087 3.14062C8.71521 2.56443 8.27722 2.06437 7.74767 1.67553C7.21811 1.28669 6.60971 1.01855 5.96544 0.889885C5.32118 0.761222 4.65646 0.775158 4.01817 0.930778C3.37988 1.0864 2.78361 1.37989 2.27086 1.79064C1.68689 2.25306 1.22358 2.85008 0.920762 3.53063C0.679091 4.08921 0.556377 4.69205 0.560655 5.30065C0.562354 5.92327 0.693172 6.53873 0.944444 7.10839C1.19572 7.67806 1.5622 8.18953 2.02086 8.61059C2.83307 9.36649 3.89773 9.79259 5.00719 9.80553C6.11665 9.81848 7.19124 9.4174 8.02086 8.68066C8.3779 8.38276 8.67913 8.0238 8.91075 7.6206C9.34355 6.92428 9.57213 6.12051 9.57066 5.30065C9.57316 4.54694 9.38776 3.80448 9.03087 3.14062V3.14062ZM4.43077 7.39062C4.41666 7.24208 4.44786 7.09281 4.52013 6.96227C4.59239 6.83174 4.70243 6.72606 4.8358 6.65917C4.96917 6.59228 5.11961 6.56724 5.26744 6.58739C5.41528 6.60754 5.55357 6.67195 5.66417 6.77209C5.77477 6.87223 5.85238 7.00344 5.88707 7.14855C5.92176 7.29367 5.91186 7.44586 5.85851 7.5852C5.80516 7.72454 5.71098 7.84448 5.58824 7.92931C5.46551 8.01415 5.31996 8.05999 5.17076 8.06066C5.0777 8.06746 4.9841 8.05526 4.89586 8.02489C4.80762 7.99453 4.72651 7.94653 4.65733 7.8839C4.58816 7.82127 4.53247 7.74531 4.49352 7.66051C4.45456 7.57572 4.43323 7.4839 4.43077 7.39062V7.39062ZM5.05065 2.69067H5.25084C5.32609 2.69062 5.40056 2.70571 5.46983 2.7351C5.53911 2.76448 5.60165 2.80755 5.65392 2.86169C5.70619 2.91582 5.7471 2.9799 5.77403 3.05016C5.80097 3.12043 5.81334 3.19542 5.81066 3.27062L5.7108 5.66064C5.70312 5.8039 5.64068 5.93873 5.53649 6.03735C5.43229 6.13596 5.29421 6.19087 5.15074 6.19067C5.00827 6.19076 4.87125 6.13559 4.76866 6.03674C4.66607 5.93788 4.60587 5.80301 4.60069 5.66064L4.50084 3.27062C4.49817 3.19625 4.51016 3.12209 4.53648 3.05248C4.5628 2.98287 4.60295 2.91923 4.65416 2.86523C4.70537 2.81123 4.76671 2.76801 4.83483 2.73803C4.90294 2.70805 4.97624 2.69195 5.05065 2.69067V2.69067Z"/>
298
+ </svg>
299
+ <em part="TableUserTooltipsEm">{$_('tournamentsTable.UnqualifiedTips')}</em>
300
+ </div>
352
301
  {/if}
353
- {/if}
354
- {#if showTable}
355
- {#each display as row}
356
- <tr class="LeftTableTr {row.isCurrentUser ? 'FirstRow' : ''} {row.isCurrentUser && row.Unqualified? 'UnqualifiedRow': ''}" part="LeftTableTr {row.isCurrentUser ? 'FirstRow' : ''} {row.isCurrentUser && row.Unqualified? 'UnqualifiedRow': ''}">
357
- <td part="LeftTableTd Rank-{row.Rank}"><strong class="RankCol" part="RankCol"><em part="LeftTableTdEm">#{row.Rank}
358
- <div class="ScoreChangeFlag {isUserPositionChanged ? 'Show' : 'Hidden'}" part="ScoreChangeFlag {isUserPositionChanged ? 'Show' : 'Hidden'}">
359
- {#if row.isCurrentUser}
360
- <img src="{arrowUpSvg}" part="Rank_Arror_UP" class="svg Arrow Up {isUserPositionChanged && isUserPositionUp ? 'Show' : 'Hidden'}" />
361
- <img src="{arrowDownSvg}" part="Rank_Arror_Down" class="svg Arrow Down {isUserPositionChanged && !isUserPositionUp ? 'Show' : 'Hidden'}" />
362
- {/if}
363
- </div>
364
-
365
- </em></strong></td>
366
- <td part="LeftTableTd">{shownPlayer(row.Player)}</td>
367
- <td part="LeftTableTd"><div class="Flex ScoreUp" part="Flex ScoreUp">{row.Points.toLocaleString('en-US', {minimumFractionDigits: _fractiondigit, maximumFractionDigits: _fractiondigit})}</div></td>
368
- <td class="LeftTableTd {!row.Unqualified? 'Qualified' : ''}" part="LeftTableTd {!row.Unqualified? 'Qualified' : ''}">
369
- {#if row.Prize}
370
- {row.Prize}
371
- {:else}
372
- -
373
- {/if}
374
- </td>
375
- </tr>
376
- {#if row.Unqualified && row.isCurrentUser}
377
- <tr class="TooltipsRow" part="TooltipsRow">
378
- <td colspan="{tooltipColSpan}" part="LeftTableTd">
379
- <svg class="ExclamationMark" part="ExclamationMark" width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
380
- <path d="M9.03087 3.14062C8.71521 2.56443 8.27722 2.06437 7.74767 1.67553C7.21811 1.28669 6.60971 1.01855 5.96544 0.889885C5.32118 0.761222 4.65646 0.775158 4.01817 0.930778C3.37988 1.0864 2.78361 1.37989 2.27086 1.79064C1.68689 2.25306 1.22358 2.85008 0.920762 3.53063C0.679091 4.08921 0.556377 4.69205 0.560655 5.30065C0.562354 5.92327 0.693172 6.53873 0.944444 7.10839C1.19572 7.67806 1.5622 8.18953 2.02086 8.61059C2.83307 9.36649 3.89773 9.79259 5.00719 9.80553C6.11665 9.81848 7.19124 9.4174 8.02086 8.68066C8.3779 8.38276 8.67913 8.0238 8.91075 7.6206C9.34355 6.92428 9.57213 6.12051 9.57066 5.30065C9.57316 4.54694 9.38776 3.80448 9.03087 3.14062V3.14062ZM4.43077 7.39062C4.41666 7.24208 4.44786 7.09281 4.52013 6.96227C4.59239 6.83174 4.70243 6.72606 4.8358 6.65917C4.96917 6.59228 5.11961 6.56724 5.26744 6.58739C5.41528 6.60754 5.55357 6.67195 5.66417 6.77209C5.77477 6.87223 5.85238 7.00344 5.88707 7.14855C5.92176 7.29367 5.91186 7.44586 5.85851 7.5852C5.80516 7.72454 5.71098 7.84448 5.58824 7.92931C5.46551 8.01415 5.31996 8.05999 5.17076 8.06066C5.0777 8.06746 4.9841 8.05526 4.89586 8.02489C4.80762 7.99453 4.72651 7.94653 4.65733 7.8839C4.58816 7.82127 4.53247 7.74531 4.49352 7.66051C4.45456 7.57572 4.43323 7.4839 4.43077 7.39062V7.39062ZM5.05065 2.69067H5.25084C5.32609 2.69062 5.40056 2.70571 5.46983 2.7351C5.53911 2.76448 5.60165 2.80755 5.65392 2.86169C5.70619 2.91582 5.7471 2.9799 5.77403 3.05016C5.80097 3.12043 5.81334 3.19542 5.81066 3.27062L5.7108 5.66064C5.70312 5.8039 5.64068 5.93873 5.53649 6.03735C5.43229 6.13596 5.29421 6.19087 5.15074 6.19067C5.00827 6.19076 4.87125 6.13559 4.76866 6.03674C4.66607 5.93788 4.60587 5.80301 4.60069 5.66064L4.50084 3.27062C4.49817 3.19625 4.51016 3.12209 4.53648 3.05248C4.5628 2.98287 4.60295 2.91923 4.65416 2.86523C4.70537 2.81123 4.76671 2.76801 4.83483 2.73803C4.90294 2.70805 4.97624 2.69195 5.05065 2.69067V2.69067Z"/>
381
- </svg>
382
- {$_('tournamentsTable.UnqualifiedTips')}
383
- </td>
384
- </tr>
385
- {/if}
386
- {/each}
387
- {/if}
388
- </tbody>
389
- </table>
390
- <div class="RightButton" part="RightButton">
391
- <div class="CollapseButton" part="CollapseButton" on:click={() => collapseTable()}>
392
- {#if showTable}
393
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
394
- <path d="M18 15l-6-6-6 6"/>
395
- </svg>
396
- {:else}
397
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
398
- <path d="M6 9l6 6 6-6"/>
399
- </svg>
400
- {/if}
401
- </div>
402
- </div>
403
- </div>
404
- {/if}
405
- {:else}
406
- {#if isMobile(userAgent) == true}
407
- {#if showTable}
408
- <div bind:this={customStylingContainer} class="TableContent" part="TableContent">
409
- <div class="TableUser" part="TableUser"><p>{$_('tournamentsTable.nowinners')}</p></div>
302
+ {/each}
303
+ {/if}
410
304
  </div>
411
- {/if}
412
305
  {:else}
413
306
  <div class="TournamentsTable" part="TournamentsTable">
414
307
  <table class="LeftTable" part="LeftTable">
@@ -428,15 +321,127 @@
428
321
  </tr>
429
322
  </thead>
430
323
  <tbody part="LeftTableTbody">
431
- <tr part="LeftTableTr">
432
- <td colspan="{tooltipColSpan}" part="LeftTableTd">{$_('tournamentsTable.nowinners')}</td>
433
- </tr>
324
+ {#if firstrow == 'true' && firstRowData}
325
+ <tr class="FirstRow {firstRowData.Unqualified ? 'UnqualifiedRow':''}" part="FirstRow {firstRowData.Unqualified ? 'UnqualifiedRow':''}">
326
+ <td part="LeftTableTd RankFirstRow"><strong class="RankCol" part="RankCol"><em part="LeftTableTdEm">#{firstRowData.Rank}</em>
327
+ <div class="ScoreChangeFlag {isUserPositionChanged ? 'Show' : 'Hidden'}" part="ScoreChangeFlag {isUserPositionChanged ? 'Show' : 'Hidden'}">
328
+ <img src="{arrowUpSvg}" part="Rank_Arror_UP" class="svg Arrow Up {isUserPositionChanged && isUserPositionUp ? 'Show' : 'Hidden'}" />
329
+ <img src="{arrowDownSvg}" part="Rank_Arror_Down" class="svg Arrow Down {isUserPositionChanged && !isUserPositionUp ? 'Show' : 'Hidden'}" />
330
+ </div></strong>
331
+ </td>
332
+ <td part="LeftTableTd">{shownPlayer(firstRowData.Player)}</td>
333
+ <td part="LeftTableTd">
334
+ <div class="Flex" part="Flex">{firstRowData.Points}</div>
335
+ </td>
336
+ <td class="LeftTableTd {!firstRowData.Unqualified? 'Qualified' : ''}" part="LeftTableTd {!firstRowData.Unqualified? 'Qualified' : ''}">
337
+ {#if firstRowData.Prize}
338
+ {firstRowData.Prize}
339
+ {:else}
340
+ -
341
+ {/if}
342
+ </td>
343
+ </tr>
344
+ {#if firstRowData.Unqualified}
345
+ <tr class="TooltipsRow" part="TooltipsRow">
346
+ <td colspan="{tooltipColSpan}" part="LeftTableTd">
347
+ <span class="TipsContent" part="TipsContent">
348
+ <svg class="ExclamationMark" part="ExclamationMark" width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
349
+ <path d="M9.03087 3.14062C8.71521 2.56443 8.27722 2.06437 7.74767 1.67553C7.21811 1.28669 6.60971 1.01855 5.96544 0.889885C5.32118 0.761222 4.65646 0.775158 4.01817 0.930778C3.37988 1.0864 2.78361 1.37989 2.27086 1.79064C1.68689 2.25306 1.22358 2.85008 0.920762 3.53063C0.679091 4.08921 0.556377 4.69205 0.560655 5.30065C0.562354 5.92327 0.693172 6.53873 0.944444 7.10839C1.19572 7.67806 1.5622 8.18953 2.02086 8.61059C2.83307 9.36649 3.89773 9.79259 5.00719 9.80553C6.11665 9.81848 7.19124 9.4174 8.02086 8.68066C8.3779 8.38276 8.67913 8.0238 8.91075 7.6206C9.34355 6.92428 9.57213 6.12051 9.57066 5.30065C9.57316 4.54694 9.38776 3.80448 9.03087 3.14062V3.14062ZM4.43077 7.39062C4.41666 7.24208 4.44786 7.09281 4.52013 6.96227C4.59239 6.83174 4.70243 6.72606 4.8358 6.65917C4.96917 6.59228 5.11961 6.56724 5.26744 6.58739C5.41528 6.60754 5.55357 6.67195 5.66417 6.77209C5.77477 6.87223 5.85238 7.00344 5.88707 7.14855C5.92176 7.29367 5.91186 7.44586 5.85851 7.5852C5.80516 7.72454 5.71098 7.84448 5.58824 7.92931C5.46551 8.01415 5.31996 8.05999 5.17076 8.06066C5.0777 8.06746 4.9841 8.05526 4.89586 8.02489C4.80762 7.99453 4.72651 7.94653 4.65733 7.8839C4.58816 7.82127 4.53247 7.74531 4.49352 7.66051C4.45456 7.57572 4.43323 7.4839 4.43077 7.39062V7.39062ZM5.05065 2.69067H5.25084C5.32609 2.69062 5.40056 2.70571 5.46983 2.7351C5.53911 2.76448 5.60165 2.80755 5.65392 2.86169C5.70619 2.91582 5.7471 2.9799 5.77403 3.05016C5.80097 3.12043 5.81334 3.19542 5.81066 3.27062L5.7108 5.66064C5.70312 5.8039 5.64068 5.93873 5.53649 6.03735C5.43229 6.13596 5.29421 6.19087 5.15074 6.19067C5.00827 6.19076 4.87125 6.13559 4.76866 6.03674C4.66607 5.93788 4.60587 5.80301 4.60069 5.66064L4.50084 3.27062C4.49817 3.19625 4.51016 3.12209 4.53648 3.05248C4.5628 2.98287 4.60295 2.91923 4.65416 2.86523C4.70537 2.81123 4.76671 2.76801 4.83483 2.73803C4.90294 2.70805 4.97624 2.69195 5.05065 2.69067V2.69067Z"/>
350
+ </svg>
351
+ {$_('tournamentsTable.UnqualifiedTips')}
352
+ </span>
353
+ </td>
354
+ </tr>
355
+ {/if}
356
+ {/if}
357
+ {#if showTable}
358
+ {#each display as row}
359
+ <tr class="LeftTableTr {row.isCurrentUser ? 'FirstRow' : ''} {row.isCurrentUser && row.Unqualified? 'UnqualifiedRow': ''}" part="LeftTableTr {row.isCurrentUser ? 'FirstRow' : ''} {row.isCurrentUser && row.Unqualified? 'UnqualifiedRow': ''}">
360
+ <td part="LeftTableTd Rank-{row.Rank}"><strong class="RankCol" part="RankCol"><em part="LeftTableTdEm">#{row.Rank}
361
+ <div class="ScoreChangeFlag {isUserPositionChanged ? 'Show' : 'Hidden'}" part="ScoreChangeFlag {isUserPositionChanged ? 'Show' : 'Hidden'}">
362
+ {#if row.isCurrentUser}
363
+ <img src="{arrowUpSvg}" part="Rank_Arror_UP" class="svg Arrow Up {isUserPositionChanged && isUserPositionUp ? 'Show' : 'Hidden'}" />
364
+ <img src="{arrowDownSvg}" part="Rank_Arror_Down" class="svg Arrow Down {isUserPositionChanged && !isUserPositionUp ? 'Show' : 'Hidden'}" />
365
+ {/if}
366
+ </div>
367
+
368
+ </em></strong></td>
369
+ <td part="LeftTableTd">{shownPlayer(row.Player)}</td>
370
+ <td part="LeftTableTd"><div class="Flex ScoreUp" part="Flex ScoreUp">{row.Points.toLocaleString('en-US', {minimumFractionDigits: _fractiondigit, maximumFractionDigits: _fractiondigit})}</div></td>
371
+ <td class="LeftTableTd {!row.Unqualified? 'Qualified' : ''}" part="LeftTableTd {!row.Unqualified? 'Qualified' : ''}">
372
+ {#if row.Prize}
373
+ {row.Prize}
374
+ {:else}
375
+ -
376
+ {/if}
377
+ </td>
378
+ </tr>
379
+ {#if row.Unqualified && row.isCurrentUser}
380
+ <tr class="TooltipsRow" part="TooltipsRow">
381
+ <td colspan="{tooltipColSpan}" part="LeftTableTd">
382
+ <span class="TipsContent" part="TipsContent">
383
+ <svg class="ExclamationMark" part="ExclamationMark" width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
384
+ <path d="M9.03087 3.14062C8.71521 2.56443 8.27722 2.06437 7.74767 1.67553C7.21811 1.28669 6.60971 1.01855 5.96544 0.889885C5.32118 0.761222 4.65646 0.775158 4.01817 0.930778C3.37988 1.0864 2.78361 1.37989 2.27086 1.79064C1.68689 2.25306 1.22358 2.85008 0.920762 3.53063C0.679091 4.08921 0.556377 4.69205 0.560655 5.30065C0.562354 5.92327 0.693172 6.53873 0.944444 7.10839C1.19572 7.67806 1.5622 8.18953 2.02086 8.61059C2.83307 9.36649 3.89773 9.79259 5.00719 9.80553C6.11665 9.81848 7.19124 9.4174 8.02086 8.68066C8.3779 8.38276 8.67913 8.0238 8.91075 7.6206C9.34355 6.92428 9.57213 6.12051 9.57066 5.30065C9.57316 4.54694 9.38776 3.80448 9.03087 3.14062V3.14062ZM4.43077 7.39062C4.41666 7.24208 4.44786 7.09281 4.52013 6.96227C4.59239 6.83174 4.70243 6.72606 4.8358 6.65917C4.96917 6.59228 5.11961 6.56724 5.26744 6.58739C5.41528 6.60754 5.55357 6.67195 5.66417 6.77209C5.77477 6.87223 5.85238 7.00344 5.88707 7.14855C5.92176 7.29367 5.91186 7.44586 5.85851 7.5852C5.80516 7.72454 5.71098 7.84448 5.58824 7.92931C5.46551 8.01415 5.31996 8.05999 5.17076 8.06066C5.0777 8.06746 4.9841 8.05526 4.89586 8.02489C4.80762 7.99453 4.72651 7.94653 4.65733 7.8839C4.58816 7.82127 4.53247 7.74531 4.49352 7.66051C4.45456 7.57572 4.43323 7.4839 4.43077 7.39062V7.39062ZM5.05065 2.69067H5.25084C5.32609 2.69062 5.40056 2.70571 5.46983 2.7351C5.53911 2.76448 5.60165 2.80755 5.65392 2.86169C5.70619 2.91582 5.7471 2.9799 5.77403 3.05016C5.80097 3.12043 5.81334 3.19542 5.81066 3.27062L5.7108 5.66064C5.70312 5.8039 5.64068 5.93873 5.53649 6.03735C5.43229 6.13596 5.29421 6.19087 5.15074 6.19067C5.00827 6.19076 4.87125 6.13559 4.76866 6.03674C4.66607 5.93788 4.60587 5.80301 4.60069 5.66064L4.50084 3.27062C4.49817 3.19625 4.51016 3.12209 4.53648 3.05248C4.5628 2.98287 4.60295 2.91923 4.65416 2.86523C4.70537 2.81123 4.76671 2.76801 4.83483 2.73803C4.90294 2.70805 4.97624 2.69195 5.05065 2.69067V2.69067Z"/>
385
+ </svg>
386
+ {$_('tournamentsTable.UnqualifiedTips')}
387
+ </span>
388
+ </td>
389
+ </tr>
390
+ {/if}
391
+ {/each}
392
+ {/if}
434
393
  </tbody>
435
394
  </table>
395
+ <div class="RightButton" part="RightButton">
396
+ <div class="CollapseButton" part="CollapseButton" on:click={() => collapseTable()}>
397
+ {#if showTable}
398
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
399
+ <path d="M18 15l-6-6-6 6"/>
400
+ </svg>
401
+ {:else}
402
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
403
+ <path d="M6 9l6 6 6-6"/>
404
+ </svg>
405
+ {/if}
406
+ </div>
407
+ </div>
436
408
  </div>
409
+ {/if}
410
+ {:else}
411
+ {#if isMobile(userAgent) == true}
412
+ {#if showTable}
413
+ <div bind:this={customStylingContainer} class="TableContent" part="TableContent">
414
+ <div class="TableUser" part="TableUser"><p>{$_('tournamentsTable.nowinners')}</p></div>
415
+ </div>
416
+ {/if}
417
+ {:else}
418
+ <div class="TournamentsTable" part="TournamentsTable">
419
+ <table class="LeftTable" part="LeftTable">
420
+ <thead part="LeftTableThead">
421
+ <tr part="LeftTableTr">
422
+ {#each columns as column}
423
+ <th part="LeftTableTh">
424
+ {#if sortable == 'true'}
425
+ <button on:click={() => sortBy(column)} data-sort={sort} part="LeftTableButton">
426
+ {$_(`tournamentsTable.${column}`)}
427
+ </button>
428
+ {:else}
429
+ <p data-sort={sort} part="LeftTableP">{$_(`tournamentsTable.${column}`)}</p>
430
+ {/if}
431
+ </th>
432
+ {/each}
433
+ </tr>
434
+ </thead>
435
+ <tbody part="LeftTableTbody">
436
+ <tr part="LeftTableTr">
437
+ <td colspan="{tooltipColSpan}" part="LeftTableTd">{$_('tournamentsTable.nowinners')}</td>
438
+ </tr>
439
+ </tbody>
440
+ </table>
441
+ </div>
442
+ {/if}
437
443
  {/if}
438
- {/if}
439
-
444
+ </div>
440
445
  <style lang="scss">
441
446
  :host {
442
447
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
@@ -561,11 +566,19 @@
561
566
  display: flex;
562
567
  justify-content: space-between;
563
568
  text-align: center;
564
- }
565
-
566
- .LeftTable {
567
- width: 100%;
568
- border-collapse: collapse;
569
+ .LeftTable {
570
+ width: 100%;
571
+ border-collapse: collapse;
572
+ tr td{text-align: center;}
573
+ .TooltipsRow td{
574
+ text-align: center;
575
+ display: table-cell;
576
+ span{
577
+ text-align: center;
578
+ display: inline-block;
579
+ }
580
+ }
581
+ }
569
582
  }
570
583
 
571
584
  .RightButton {