mirror of
https://github.com/blitzkit/blitzkit.git
synced 2026-11-03 16:00:36 +01:00
Fix: dialogs clipping under the navbar and uneven Compare spacing
This commit is contained in:
1 parent
2e10052732
commit
2288c089e8
5 files changed
+12
-5
No files matched your search
@@ -1,5 +1,6 @@
|
|||||||
import { PlusIcon, TrashIcon } from "@radix-ui/react-icons";
|
import { PlusIcon, TrashIcon } from "@radix-ui/react-icons";
|
||||||
import { Button, Dialog, Flex, SegmentedControl } from "@radix-ui/themes";
|
import { Button, Dialog, Flex, SegmentedControl } from "@radix-ui/themes";
|
||||||
|
import { DIALOG_MAX_HEIGHT } from "../../constants/dialog";
|
||||||
import { api } from "../../core/blitzkit/api";
|
import { api } from "../../core/blitzkit/api";
|
||||||
import { tankToCompareMember } from "../../core/blitzkit/tankToCompareMember";
|
import { tankToCompareMember } from "../../core/blitzkit/tankToCompareMember";
|
||||||
import { useLocale } from "../../hooks/useLocale";
|
import { useLocale } from "../../hooks/useLocale";
|
||||||
@@ -36,11 +37,11 @@ export function Controls({
|
|||||||
</Button>
|
</Button>
|
||||||
</Dialog.Trigger>
|
</Dialog.Trigger>
|
||||||
|
|
||||||
<Dialog.Content>
|
<Dialog.Content maxHeight={DIALOG_MAX_HEIGHT}>
|
||||||
<Dialog.Title align="center">
|
<Dialog.Title align="center">
|
||||||
{strings.website.tools.compare.actions.add.title}
|
{strings.website.tools.compare.actions.add.title}
|
||||||
</Dialog.Title>
|
</Dialog.Title>
|
||||||
<Dialog.Description align="center">
|
<Dialog.Description align="center" mb="4">
|
||||||
{strings.website.tools.compare.actions.add.description}
|
{strings.website.tools.compare.actions.add.description}
|
||||||
</Dialog.Description>
|
</Dialog.Description>
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import { ExternalLinkIcon, LoopIcon, TrashIcon } from "@radix-ui/react-icons";
|
import { ExternalLinkIcon, LoopIcon, TrashIcon } from "@radix-ui/react-icons";
|
||||||
import { Dialog, Flex, IconButton } from "@radix-ui/themes";
|
import { Dialog, Flex, IconButton } from "@radix-ui/themes";
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
|
import { DIALOG_MAX_HEIGHT } from "../../constants/dialog";
|
||||||
import { api } from "../../core/blitzkit/api";
|
import { api } from "../../core/blitzkit/api";
|
||||||
import { tankToCompareMember } from "../../core/blitzkit/tankToCompareMember";
|
import { tankToCompareMember } from "../../core/blitzkit/tankToCompareMember";
|
||||||
import { useLocale } from "../../hooks/useLocale";
|
import { useLocale } from "../../hooks/useLocale";
|
||||||
@@ -43,7 +44,7 @@ export function TankControl({ index, slug }: TankControlProps) {
|
|||||||
</IconButton>
|
</IconButton>
|
||||||
</Dialog.Trigger>
|
</Dialog.Trigger>
|
||||||
|
|
||||||
<Dialog.Content>
|
<Dialog.Content maxHeight={DIALOG_MAX_HEIGHT}>
|
||||||
<Dialog.Title align="center">
|
<Dialog.Title align="center">
|
||||||
{strings.website.common.tank_search.swap_dialog_title}
|
{strings.website.common.tank_search.swap_dialog_title}
|
||||||
</Dialog.Title>
|
</Dialog.Title>
|
||||||
|
|||||||
@@ -27,6 +27,7 @@ import {
|
|||||||
Tooltip,
|
Tooltip,
|
||||||
} from "@radix-ui/themes";
|
} from "@radix-ui/themes";
|
||||||
import { Suspense, useState, type RefObject } from "react";
|
import { Suspense, useState, type RefObject } from "react";
|
||||||
|
import { DIALOG_MAX_HEIGHT } from "../../../../../constants/dialog";
|
||||||
import { Pose, poseEvent } from "../../../../../core/blitzkit/pose";
|
import { Pose, poseEvent } from "../../../../../core/blitzkit/pose";
|
||||||
import { useEquipment } from "../../../../../hooks/useEquipment";
|
import { useEquipment } from "../../../../../hooks/useEquipment";
|
||||||
import { useFullScreen } from "../../../../../hooks/useFullScreen";
|
import { useFullScreen } from "../../../../../hooks/useFullScreen";
|
||||||
@@ -485,7 +486,7 @@ export function Options({ thicknessRange, canvas, skeleton }: OptionsProps) {
|
|||||||
</Button>
|
</Button>
|
||||||
</Dialog.Trigger>
|
</Dialog.Trigger>
|
||||||
|
|
||||||
<Dialog.Content>
|
<Dialog.Content maxHeight={DIALOG_MAX_HEIGHT}>
|
||||||
<Dialog.Title align="center">
|
<Dialog.Title align="center">
|
||||||
{strings.website.common.tank_search.select_dialog_title}
|
{strings.website.common.tank_search.select_dialog_title}
|
||||||
</Dialog.Title>
|
</Dialog.Title>
|
||||||
|
|||||||
@@ -0,0 +1,3 @@
|
|||||||
|
import { NAVBAR_HEIGHT } from "./navbar";
|
||||||
|
|
||||||
|
export const DIALOG_MAX_HEIGHT = `calc(100svh - 2 * (${NAVBAR_HEIGHT}px + var(--space-4)))`;
|
||||||
@@ -24,6 +24,7 @@ import { ModuleButton } from "../../../../components/ModuleButtons/ModuleButton"
|
|||||||
import { PageWrapper } from "../../../../components/PageWrapper";
|
import { PageWrapper } from "../../../../components/PageWrapper";
|
||||||
import { ScreenshotButton } from "../../../../components/ScreenshotButton";
|
import { ScreenshotButton } from "../../../../components/ScreenshotButton";
|
||||||
import { TankSearch } from "../../../../components/TankSearch";
|
import { TankSearch } from "../../../../components/TankSearch";
|
||||||
|
import { DIALOG_MAX_HEIGHT } from "../../../../constants/dialog";
|
||||||
import { api } from "../../../../core/blitzkit/api";
|
import { api } from "../../../../core/blitzkit/api";
|
||||||
import { curateMixer } from "../../../../core/blitzkit/curateMixer";
|
import { curateMixer } from "../../../../core/blitzkit/curateMixer";
|
||||||
import {
|
import {
|
||||||
@@ -117,7 +118,7 @@ function ModuleChooser({
|
|||||||
</Button>
|
</Button>
|
||||||
</Dialog.Trigger>
|
</Dialog.Trigger>
|
||||||
|
|
||||||
<Dialog.Content>
|
<Dialog.Content maxHeight={DIALOG_MAX_HEIGHT}>
|
||||||
<Dialog.Title>
|
<Dialog.Title>
|
||||||
{strings.website.common.tank_search.select_dialog_title}
|
{strings.website.common.tank_search.select_dialog_title}
|
||||||
</Dialog.Title>
|
</Dialog.Title>
|
||||||
|
|||||||
Reference in new issue
Block a user