mirror of
https://github.com/linsa-io/linsa.git
synced 2026-04-24 09:18:37 +02:00
chore: height on mobile
This commit is contained in:
@@ -47,7 +47,7 @@ const LinkSectionHeader: React.FC<LinkSectionHeaderProps> = ({ linkCount }) => {
|
|||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex min-h-[30px] items-center gap-px rounded-md",
|
"flex h-9 items-center gap-px rounded-md sm:h-[30px]",
|
||||||
isLinksActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
|
isLinksActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
@@ -55,7 +55,7 @@ const LinkSectionHeader: React.FC<LinkSectionHeaderProps> = ({ linkCount }) => {
|
|||||||
href="/links"
|
href="/links"
|
||||||
className="flex flex-1 items-center justify-start rounded-md px-2 py-1 focus-visible:outline-none focus-visible:ring-0"
|
className="flex flex-1 items-center justify-start rounded-md px-2 py-1 focus-visible:outline-none focus-visible:ring-0"
|
||||||
>
|
>
|
||||||
<p className="flex w-full items-center text-xs font-medium">
|
<p className="flex w-full items-center text-sm font-medium sm:text-xs">
|
||||||
Links
|
Links
|
||||||
{linkCount > 0 && <span className="text-muted-foreground ml-1">{linkCount}</span>}
|
{linkCount > 0 && <span className="text-muted-foreground ml-1">{linkCount}</span>}
|
||||||
</p>
|
</p>
|
||||||
@@ -112,7 +112,7 @@ const ListItem: React.FC<ListItemProps> = ({ label, href, count, isActive }) =>
|
|||||||
<Link
|
<Link
|
||||||
href={href}
|
href={href}
|
||||||
className={cn(
|
className={cn(
|
||||||
"relative flex h-8 w-full items-center gap-2 rounded-md p-1.5 font-medium",
|
"relative flex h-9 w-full items-center gap-2 rounded-md p-1.5 font-medium sm:h-8",
|
||||||
isActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
|
isActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -77,12 +77,12 @@ interface PageSectionHeaderProps {
|
|||||||
const PageSectionHeader: React.FC<PageSectionHeaderProps> = ({ pageCount, isActive }) => (
|
const PageSectionHeader: React.FC<PageSectionHeaderProps> = ({ pageCount, isActive }) => (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex min-h-[30px] items-center gap-px rounded-md",
|
"flex h-9 items-center gap-px rounded-md sm:h-[30px]",
|
||||||
isActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
|
isActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<Link href="/pages" className="flex flex-1 items-center justify-start rounded-md px-2 py-1">
|
<Link href="/pages" className="flex flex-1 items-center justify-start rounded-md px-2 py-1">
|
||||||
<p className="text-xs">
|
<p className="text-sm sm:text-xs">
|
||||||
Pages
|
Pages
|
||||||
{pageCount > 0 && <span className="text-muted-foreground ml-1">{pageCount}</span>}
|
{pageCount > 0 && <span className="text-muted-foreground ml-1">{pageCount}</span>}
|
||||||
</p>
|
</p>
|
||||||
@@ -165,7 +165,7 @@ const PageListItem: React.FC<PageListItemProps> = ({ page, isActive }) => (
|
|||||||
<Link
|
<Link
|
||||||
href={`/pages/${page.id}`}
|
href={`/pages/${page.id}`}
|
||||||
className={cn(
|
className={cn(
|
||||||
"group-hover/sidebar-link:bg-accent group-hover/sidebar-link:text-accent-foreground relative flex h-8 w-full items-center gap-2 rounded-md p-1.5 font-medium",
|
"group-hover/sidebar-link:bg-accent group-hover/sidebar-link:text-accent-foreground relative flex h-9 w-full items-center gap-2 rounded-md p-1.5 font-medium sm:h-8",
|
||||||
{ "bg-accent text-accent-foreground": isActive }
|
{ "bg-accent text-accent-foreground": isActive }
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -45,12 +45,12 @@ interface TopicSectionHeaderProps {
|
|||||||
const TopicSectionHeader: React.FC<TopicSectionHeaderProps> = ({ topicCount, isActive }) => (
|
const TopicSectionHeader: React.FC<TopicSectionHeaderProps> = ({ topicCount, isActive }) => (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex min-h-[30px] items-center gap-px rounded-md",
|
"flex h-9 items-center gap-px rounded-md sm:h-[30px]",
|
||||||
isActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
|
isActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<Link href="/topics" className="flex flex-1 items-center justify-start rounded-md px-2 py-1">
|
<Link href="/topics" className="flex flex-1 items-center justify-start rounded-md px-2 py-1">
|
||||||
<p className="text-xs">
|
<p className="text-sm sm:text-xs">
|
||||||
Topics
|
Topics
|
||||||
{topicCount > 0 && <span className="text-muted-foreground ml-1">{topicCount}</span>}
|
{topicCount > 0 && <span className="text-muted-foreground ml-1">{topicCount}</span>}
|
||||||
</p>
|
</p>
|
||||||
@@ -116,7 +116,7 @@ const ListItem: React.FC<ListItemProps> = ({ label, value, href, count, isActive
|
|||||||
<Link
|
<Link
|
||||||
href={href}
|
href={href}
|
||||||
className={cn(
|
className={cn(
|
||||||
"group-hover/topic-link:bg-accent relative flex h-8 w-full items-center gap-2 rounded-md p-1.5 font-medium",
|
"group-hover/topic-link:bg-accent relative flex h-9 w-full items-center gap-2 rounded-md p-1.5 font-medium sm:h-8",
|
||||||
{ "bg-accent text-accent-foreground": isActive },
|
{ "bg-accent text-accent-foreground": isActive },
|
||||||
le.className
|
le.className
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -42,7 +42,7 @@ export const LinkHeader = React.memo(() => {
|
|||||||
</ContentHeader>
|
</ContentHeader>
|
||||||
|
|
||||||
{isTablet && (
|
{isTablet && (
|
||||||
<div className="flex min-h-10 flex-row items-start justify-between border-b px-6 pb-4 pt-2 max-lg:pl-4">
|
<div className="flex flex-row items-start justify-between border-b px-6 pb-4 pt-2 max-lg:pl-4">
|
||||||
<LearningTab />
|
<LearningTab />
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -152,7 +152,7 @@ export const LinkItem = React.forwardRef<HTMLDivElement, LinkItemProps>(
|
|||||||
prefetch={false}
|
prefetch={false}
|
||||||
target="_blank"
|
target="_blank"
|
||||||
onClick={e => e.stopPropagation()}
|
onClick={e => e.stopPropagation()}
|
||||||
className="hover:text-primary truncate text-xs"
|
className="hover:text-primary mr-1 truncate text-xs"
|
||||||
>
|
>
|
||||||
{personalLink.url}
|
{personalLink.url}
|
||||||
</Link>
|
</Link>
|
||||||
|
|||||||
@@ -23,33 +23,6 @@ import { usePageActions } from "../hooks/use-page-actions"
|
|||||||
|
|
||||||
const TITLE_PLACEHOLDER = "Untitled"
|
const TITLE_PLACEHOLDER = "Untitled"
|
||||||
|
|
||||||
const isPageEmpty = (page: PersonalPage): boolean => {
|
|
||||||
return (!page.title || page.title.trim() === "") && (!page.content || Object.keys(page.content).length === 0)
|
|
||||||
}
|
|
||||||
|
|
||||||
const useDeleteEmptyPage = (currentPageId: string | null) => {
|
|
||||||
const router = useRouter()
|
|
||||||
const { me } = useAccount({
|
|
||||||
root: {
|
|
||||||
personalPages: []
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
return () => {
|
|
||||||
if (!currentPageId || !me?.root?.personalPages) return
|
|
||||||
|
|
||||||
const currentPage = me.root.personalPages.find(page => page?.id === currentPageId)
|
|
||||||
if (currentPage && isPageEmpty(currentPage)) {
|
|
||||||
const index = me.root.personalPages.findIndex(page => page?.id === currentPageId)
|
|
||||||
if (index !== -1) {
|
|
||||||
me.root.personalPages.splice(index, 1)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}, [currentPageId, me, router])
|
|
||||||
}
|
|
||||||
|
|
||||||
export function PageDetailRoute({ pageId }: { pageId: string }) {
|
export function PageDetailRoute({ pageId }: { pageId: string }) {
|
||||||
const { me } = useAccount({ root: { personalLinks: [] } })
|
const { me } = useAccount({ root: { personalLinks: [] } })
|
||||||
const isMobile = useMedia("(max-width: 770px)")
|
const isMobile = useMedia("(max-width: 770px)")
|
||||||
@@ -58,8 +31,6 @@ export function PageDetailRoute({ pageId }: { pageId: string }) {
|
|||||||
const { deletePage } = usePageActions()
|
const { deletePage } = usePageActions()
|
||||||
const confirm = useConfirm()
|
const confirm = useConfirm()
|
||||||
|
|
||||||
// useDeleteEmptyPage(pageId)
|
|
||||||
|
|
||||||
const handleDelete = useCallback(async () => {
|
const handleDelete = useCallback(async () => {
|
||||||
const result = await confirm({
|
const result = await confirm({
|
||||||
title: "Delete page",
|
title: "Delete page",
|
||||||
|
|||||||
Reference in New Issue
Block a user