mirror of
https://gitea.toothfairyai.com/ToothFairyAI/tf_code.git
synced 2026-03-30 05:43:55 +00:00
fix(app): avoid clipping new session during sidebar anim
This commit is contained in:
parent
ffde837e83
commit
050d71bcf9
@ -218,40 +218,47 @@ export function Titlebar() {
|
|||||||
<div class="hidden xl:flex items-center shrink-0">
|
<div class="hidden xl:flex items-center shrink-0">
|
||||||
<Show when={params.dir}>
|
<Show when={params.dir}>
|
||||||
<div
|
<div
|
||||||
class="overflow-hidden flex items-center shrink-0 transition-[width,opacity,transform]"
|
class="flex items-center shrink-0 w-8 mr-1"
|
||||||
classList={{
|
|
||||||
"w-8 opacity-100 translate-x-0": !layout.sidebar.opened(),
|
|
||||||
"w-0 opacity-0 -translate-x-1 pointer-events-none": layout.sidebar.opened(),
|
|
||||||
"duration-180 ease-out": !layout.sidebar.opened(),
|
|
||||||
"duration-120 ease-in": layout.sidebar.opened(),
|
|
||||||
}}
|
|
||||||
aria-hidden={layout.sidebar.opened() ? "true" : undefined}
|
aria-hidden={layout.sidebar.opened() ? "true" : undefined}
|
||||||
>
|
>
|
||||||
<TooltipKeybind
|
<div
|
||||||
placement="bottom"
|
class="transition-opacity"
|
||||||
title={language.t("command.session.new")}
|
classList={{
|
||||||
keybind={command.keybind("session.new")}
|
"opacity-100 duration-120 ease-out": !layout.sidebar.opened(),
|
||||||
openDelay={2000}
|
"opacity-0 duration-120 ease-in delay-0 pointer-events-none": layout.sidebar.opened(),
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<Button
|
<TooltipKeybind
|
||||||
variant="ghost"
|
placement="bottom"
|
||||||
icon={creating() ? "new-session-active" : "new-session"}
|
title={language.t("command.session.new")}
|
||||||
class="titlebar-icon w-8 h-6 p-0 box-border"
|
keybind={command.keybind("session.new")}
|
||||||
disabled={layout.sidebar.opened()}
|
openDelay={2000}
|
||||||
tabIndex={layout.sidebar.opened() ? -1 : undefined}
|
>
|
||||||
onClick={() => {
|
<Button
|
||||||
if (!params.dir) return
|
variant="ghost"
|
||||||
navigate(`/${params.dir}/session`)
|
icon={creating() ? "new-session-active" : "new-session"}
|
||||||
}}
|
class="titlebar-icon w-8 h-6 p-0 box-border"
|
||||||
aria-label={language.t("command.session.new")}
|
disabled={layout.sidebar.opened()}
|
||||||
aria-current={creating() ? "page" : undefined}
|
tabIndex={layout.sidebar.opened() ? -1 : undefined}
|
||||||
/>
|
onClick={() => {
|
||||||
</TooltipKeybind>
|
if (!params.dir) return
|
||||||
|
navigate(`/${params.dir}/session`)
|
||||||
|
}}
|
||||||
|
aria-label={language.t("command.session.new")}
|
||||||
|
aria-current={creating() ? "page" : undefined}
|
||||||
|
/>
|
||||||
|
</TooltipKeybind>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Show>
|
</Show>
|
||||||
<div
|
<div
|
||||||
class="flex items-center gap-0 transition-[margin] duration-180 ease-out"
|
class="flex items-center gap-0 transition-transform"
|
||||||
classList={{ "ml-1": !!params.dir && !layout.sidebar.opened() }}
|
classList={{
|
||||||
|
"translate-x-0": !layout.sidebar.opened(),
|
||||||
|
"-translate-x-[36px]": layout.sidebar.opened(),
|
||||||
|
"duration-180 ease-out": !layout.sidebar.opened(),
|
||||||
|
"duration-180 ease-in": layout.sidebar.opened(),
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<Tooltip placement="bottom" value={language.t("common.goBack")} openDelay={2000}>
|
<Tooltip placement="bottom" value={language.t("common.goBack")} openDelay={2000}>
|
||||||
<Button
|
<Button
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user