diff --git a/src/masto/timelines.ts b/src/masto/timelines.ts index 0f04e83..19abea7 100644 --- a/src/masto/timelines.ts +++ b/src/masto/timelines.ts @@ -248,64 +248,6 @@ export type TimelineResource = [ { refetch(info?: TimelineFetchDirection): void }, ]; -export const emptyTimeline = { - list() { - return emptyTimeline; - }, - - setDirection() { - return emptyTimeline; - }, - - async next(): Promise> { - return { - value: undefined, - done: true, - }; - }, - - getDirection(): TimelineFetchDirection { - return "next"; - }, - - clone() { - return emptyTimeline; - }, - - async return(): Promise> { - return { - value: undefined, - done: true, - }; - }, - - async throw(e?: unknown) { - throw e; - }, - - async *values() {}, - async *[Symbol.asyncIterator](): AsyncIterator { - return undefined; - }, - - async then( - onresolve?: null | ((value: any[]) => TNext | PromiseLike), - onrejected?: null | ((reason: unknown) => ENext | PromiseLike), - ) { - try { - if (!onresolve) { - throw new TypeError("no onresolve"); - } - return await onresolve([]); - } catch (reason) { - if (!onrejected) { - throw reason; - } - return await onrejected(reason); - } - }, -}; - /** * Create auto managed timeline controls. * diff --git a/src/material/AppTopBar.css b/src/material/AppTopBar.css index d0976ca..a79321c 100644 --- a/src/material/AppTopBar.css +++ b/src/material/AppTopBar.css @@ -23,5 +23,9 @@ &>.MuiButtonBase-root:last-child { margin-right: -0.15em; } + + &>.title { + margin-top: -0.2ch; + } } } \ No newline at end of file diff --git a/src/material/Tab.css b/src/material/Tab.css deleted file mode 100644 index 83bff90..0000000 --- a/src/material/Tab.css +++ /dev/null @@ -1,23 +0,0 @@ -.Tab { - cursor: pointer; - background: none; - border: none; - height: 100%; - max-width: min(calc(100% - 56px), 264px); - padding: 10px 24px; - font-size: 0.8135rem; - font-weight: 600; - text-transform: uppercase; - transition: color 120ms var(--tutu-anim-curve-std); -} - -.MuiToolbar-root .Tab { - color: rgba(255, 255, 255, 0.7); - - &:hover, - &:focus, - &.focus, - &.Tabs-focus { - color: white; - } -} \ No newline at end of file diff --git a/src/material/Tab.tsx b/src/material/Tab.tsx index 10d781a..2145b89 100644 --- a/src/material/Tab.tsx +++ b/src/material/Tab.tsx @@ -1,18 +1,26 @@ import { + Component, createEffect, splitProps, type JSX, type ParentComponent, } from "solid-js"; +import { css } from "solid-styled"; import { useTabListContext } from "./Tabs"; -import "./Tab.css"; const Tab: ParentComponent< { focus?: boolean; + large?: boolean; } & JSX.ButtonHTMLAttributes > = (props) => { - const [managed, rest] = splitProps(props, ["focus", "type", "role", "ref"]); + const [managed, rest] = splitProps(props, [ + "focus", + "large", + "type", + "role", + "ref", + ]); let self: HTMLButtonElement; const { focusOn: [, setFocusOn], @@ -27,7 +35,32 @@ const Tab: ParentComponent< } return managed.focus; }); + css` + .tab { + cursor: pointer; + background: none; + border: none; + min-width: ${managed.large ? "160px" : "72px"}; + height: 48px; + max-width: min(calc(100% - 56px), 264px); + padding: 10px 24px; + font-size: 0.8135rem; + font-weight: 600; + text-transform: uppercase; + transition: color 120ms var(--tutu-anim-curve-std); + } + :global(.MuiToolbar-root) .tab { + color: rgba(255, 255, 255, 0.7); + + &:hover, + &:focus, + &.focus, + &:global(.tablist-focus) { + color: white; + } + } + `; return (