mirror of
https://github.com/blitzkit/blitzkit.git
synced 2026-11-01 15:00:36 +01:00
get over it
This commit is contained in:
1 parent
c4edafa94b
commit
8d9549f7d5
5 files changed
+62
-64
No files matched your search
@@ -8,14 +8,13 @@
|
|||||||
.label {
|
.label {
|
||||||
margin: var(--space-4) 0;
|
margin: var(--space-4) 0;
|
||||||
|
|
||||||
/* mt="2" gap="1" align="center" justify="center" direction="column" */
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
.count {
|
.count {
|
||||||
/* gap="2" */
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: var(--space-2);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.test-warning {
|
|
||||||
/* justify="center" mt="4" */
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
@@ -29,7 +29,6 @@ import {
|
|||||||
import type { MaybeSkeletonComponentProps } from "../../types/maybeSkeletonComponentProps";
|
import type { MaybeSkeletonComponentProps } from "../../types/maybeSkeletonComponentProps";
|
||||||
import { Callout } from "../Callout";
|
import { Callout } from "../Callout";
|
||||||
import { ExperimentIcon } from "../ExperimentIcon";
|
import { ExperimentIcon } from "../ExperimentIcon";
|
||||||
import { Flex } from "../Flex";
|
|
||||||
import { IncrementalLoader } from "../IncrementalLoader";
|
import { IncrementalLoader } from "../IncrementalLoader";
|
||||||
import { Link } from "../Link";
|
import { Link } from "../Link";
|
||||||
import { RecentlyViewedTanks } from "../RecentlyViewedTanks";
|
import { RecentlyViewedTanks } from "../RecentlyViewedTanks";
|
||||||
@@ -218,52 +217,59 @@ export const TankSearch = memo<TankSearchProps>(
|
|||||||
{!skeleton && !compact && <RecentlyViewedTanks />}
|
{!skeleton && !compact && <RecentlyViewedTanks />}
|
||||||
|
|
||||||
{sorted.length > 0 && (
|
{sorted.length > 0 && (
|
||||||
<Flex justify="center" className={styles.label}>
|
<div className={styles.label}>
|
||||||
<div className={styles.count}>
|
<Text lowContrast className={styles.count}>
|
||||||
<Text lowContrast>
|
{sorted.length === 1
|
||||||
{sorted.length === 1
|
? strings.website.common.tank_search.count_singular
|
||||||
? strings.website.common.tank_search.count_singular
|
: literals(strings.website.common.tank_search.count_plural, {
|
||||||
: literals(strings.website.common.tank_search.count_plural, {
|
count: sorted.length.toLocaleString(locale),
|
||||||
count: sorted.length.toLocaleString(locale),
|
})}
|
||||||
})}
|
|
||||||
</Text>
|
{sortConfig && (
|
||||||
|
<>
|
||||||
|
{" - "}
|
||||||
|
{literals(strings.website.common.tank_search.sorting_by, {
|
||||||
|
name: (
|
||||||
|
strings.tanks.characteristics.items as Record<
|
||||||
|
string,
|
||||||
|
string
|
||||||
|
>
|
||||||
|
)[sortConfig],
|
||||||
|
})}
|
||||||
|
,{" "}
|
||||||
|
{
|
||||||
|
strings.website.common.tank_search.sort.direction[
|
||||||
|
tankopediaSort.direction
|
||||||
|
]
|
||||||
|
}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
|
||||||
{onSelectAll && (
|
{onSelectAll && (
|
||||||
<Link
|
<>
|
||||||
underline="always"
|
{" "}
|
||||||
href="#"
|
<Link
|
||||||
onClick={(event) => {
|
underline="always"
|
||||||
event.preventDefault();
|
href="#"
|
||||||
onSelectAll(sorted);
|
onClick={(event) => {
|
||||||
TankopediaPersistent.mutate((draft) => {
|
event.preventDefault();
|
||||||
draft.recentlyViewed = uniq([
|
onSelectAll(sorted);
|
||||||
...sorted.map(({ id }) => id),
|
TankopediaPersistent.mutate((draft) => {
|
||||||
...draft.recentlyViewed,
|
draft.recentlyViewed = uniq([
|
||||||
])
|
...sorted.map(({ id }) => id),
|
||||||
.filter((id) => id in tankDefinitions.tanks)
|
...draft.recentlyViewed,
|
||||||
.slice(0, MAX_RECENTLY_VIEWED);
|
])
|
||||||
});
|
.filter((id) => id in tankDefinitions.tanks)
|
||||||
}}
|
.slice(0, MAX_RECENTLY_VIEWED);
|
||||||
>
|
});
|
||||||
{strings.website.common.tank_search.select_all}
|
}}
|
||||||
</Link>
|
>
|
||||||
|
{strings.website.common.tank_search.select_all}
|
||||||
|
</Link>
|
||||||
|
</>
|
||||||
)}
|
)}
|
||||||
</div>
|
</Text>
|
||||||
|
</div>
|
||||||
{sortConfig && (
|
|
||||||
<Text color="gray">
|
|
||||||
{literals(strings.website.common.tank_search.sorting_by, {
|
|
||||||
name: (
|
|
||||||
strings.tanks.characteristics.items as Record<
|
|
||||||
string,
|
|
||||||
string
|
|
||||||
>
|
|
||||||
)[sortConfig],
|
|
||||||
})}
|
|
||||||
, {tankopediaSort.direction}
|
|
||||||
</Text>
|
|
||||||
)}
|
|
||||||
</Flex>
|
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{tankFilters.showTesting && !tankFilters.showNonTesting && (
|
{tankFilters.showTesting && !tankFilters.showNonTesting && (
|
||||||
|
|||||||
@@ -107,10 +107,8 @@ export function TankSearchSort() {
|
|||||||
{strings.website.common.tank_search.sort.direction.label}
|
{strings.website.common.tank_search.sort.direction.label}
|
||||||
</DropdownMenu.Label>
|
</DropdownMenu.Label>
|
||||||
<DropdownMenu.RadioGroup
|
<DropdownMenu.RadioGroup
|
||||||
value={`${direction}`}
|
value={direction}
|
||||||
onValueChange={(_value) => {
|
onValueChange={(value) => {
|
||||||
const value = Number(_value);
|
|
||||||
|
|
||||||
if (
|
if (
|
||||||
value !== TankopediaSortDirection.Ascending &&
|
value !== TankopediaSortDirection.Ascending &&
|
||||||
value !== TankopediaSortDirection.Descending
|
value !== TankopediaSortDirection.Descending
|
||||||
@@ -123,18 +121,14 @@ export function TankSearchSort() {
|
|||||||
});
|
});
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<DropdownMenu.RadioItem
|
<DropdownMenu.RadioItem value={TankopediaSortDirection.Ascending}>
|
||||||
value={`${TankopediaSortDirection.Ascending}`}
|
|
||||||
>
|
|
||||||
<DropdownMenu.ItemIndicator>
|
<DropdownMenu.ItemIndicator>
|
||||||
<DotFilledIcon />
|
<DotFilledIcon />
|
||||||
</DropdownMenu.ItemIndicator>
|
</DropdownMenu.ItemIndicator>
|
||||||
|
|
||||||
{strings.website.common.tank_search.sort.direction.ascending}
|
{strings.website.common.tank_search.sort.direction.ascending}
|
||||||
</DropdownMenu.RadioItem>
|
</DropdownMenu.RadioItem>
|
||||||
<DropdownMenu.RadioItem
|
<DropdownMenu.RadioItem value={TankopediaSortDirection.Descending}>
|
||||||
value={`${TankopediaSortDirection.Descending}`}
|
|
||||||
>
|
|
||||||
<DropdownMenu.ItemIndicator>
|
<DropdownMenu.ItemIndicator>
|
||||||
<DotFilledIcon />
|
<DotFilledIcon />
|
||||||
</DropdownMenu.ItemIndicator>
|
</DropdownMenu.ItemIndicator>
|
||||||
|
|||||||
@@ -32,8 +32,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover,
|
&:hover {
|
||||||
&:focus-within {
|
|
||||||
.text {
|
.text {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
import { Soapstone } from "soapstone";
|
import { Soapstone } from "soapstone";
|
||||||
|
|
||||||
export enum TankopediaSortDirection {
|
export enum TankopediaSortDirection {
|
||||||
Ascending,
|
Ascending = "ascending",
|
||||||
Descending,
|
Descending = "descending",
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface TankopediaPersistent {
|
export interface TankopediaPersistent {
|
||||||
|
|||||||
Reference in new issue
Block a user