diff --git a/src/client/components/AppDetail.tsx b/src/client/components/AppDetail.tsx index 7265797..cf1f34b 100644 --- a/src/client/components/AppDetail.tsx +++ b/src/client/components/AppDetail.tsx @@ -6,9 +6,10 @@ import { openAppSelectorModal, openDeleteAppModal, openRenameAppModal } from '.. import { apps, getSelectedTab, isNarrow } from '../state' import { ActionBar, - AppSelectorChevron, Button, ClickableAppName, + HamburgerButton, + HamburgerLine, HeaderActions, InfoLabel, InfoRow, @@ -56,9 +57,11 @@ export function AppDetail({ app, render }: { app: App, render: () => void }) {   openRenameAppModal(app)}>{app.name} {isNarrow && ( - openAppSelectorModal(render)}> - ▼ - + openAppSelectorModal(render)} title="Show apps"> + + + + )} diff --git a/src/client/components/DashboardLanding.tsx b/src/client/components/DashboardLanding.tsx index 758f2d3..520b502 100644 --- a/src/client/components/DashboardLanding.tsx +++ b/src/client/components/DashboardLanding.tsx @@ -3,7 +3,8 @@ import { openAppSelectorModal } from '../modals' import { navigate } from '../router' import { dashboardTab, isNarrow } from '../state' import { - AppSelectorChevron, + HamburgerButton, + HamburgerLine, DashboardContainer, DashboardHeader, DashboardTitle, @@ -47,9 +48,11 @@ export function DashboardLanding({ render }: { render: () => void }) { 🐾 Toes {isNarrow && ( - openAppSelectorModal(render)}> - ▼ - + openAppSelectorModal(render)} title="Show apps"> + + + + )} diff --git a/src/client/styles/index.ts b/src/client/styles/index.ts index f9223fa..2d14a7d 100644 --- a/src/client/styles/index.ts +++ b/src/client/styles/index.ts @@ -29,7 +29,6 @@ export { Form, FormActions, FormCheckbox, FormCheckboxField, FormCheckboxLabel, export { AppItem, AppList, - AppSelectorChevron, ClickableAppName, DashboardContainer, DashboardHeader, diff --git a/src/client/styles/layout.ts b/src/client/styles/layout.ts index 9ab7b01..450b236 100644 --- a/src/client/styles/layout.ts +++ b/src/client/styles/layout.ts @@ -170,20 +170,6 @@ export const MainTitle = define('MainTitle', { margin: 0, }) -export const AppSelectorChevron = define('AppSelectorChevron', { - base: 'button', - background: 'none', - border: 'none', - cursor: 'pointer', - padding: '4px 8px', - marginLeft: 4, - fontSize: 14, - color: theme('colors-textMuted'), - selectors: { - '&:hover': { color: theme('colors-text') }, - }, -}) - export const ClickableAppName = define('ClickableAppName', { cursor: 'pointer', borderRadius: theme('radius-md'),