aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--apps/browser-extension/package.json2
-rw-r--r--apps/landing/package.json2
-rw-r--r--apps/web/components/dashboard/bookmarks/BookmarkLayoutAdaptingCard.tsx8
-rw-r--r--apps/web/components/dashboard/bookmarks/EditorCard.tsx13
-rw-r--r--apps/web/components/dashboard/bookmarks/TagList.tsx4
-rw-r--r--apps/web/components/dashboard/search/SearchInput.tsx2
-rw-r--r--apps/web/components/dashboard/sidebar/AllLists.tsx6
-rw-r--r--apps/web/components/ui/info-tooltip.tsx2
-rw-r--r--apps/web/components/ui/input.tsx42
-rw-r--r--apps/web/lib/i18n/locales/en/translation.json1
-rw-r--r--apps/web/package.json2
-rw-r--r--pnpm-lock.yaml20
12 files changed, 67 insertions, 37 deletions
diff --git a/apps/browser-extension/package.json b/apps/browser-extension/package.json
index 2f4dd7f7..8a6a66b8 100644
--- a/apps/browser-extension/package.json
+++ b/apps/browser-extension/package.json
@@ -30,7 +30,7 @@
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.0",
"cmdk": "^1.0.0",
- "lucide-react": "^0.330.0",
+ "lucide-react": "^0.501.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-router-dom": "^6.22.0",
diff --git a/apps/landing/package.json b/apps/landing/package.json
index 4d231443..b097ec72 100644
--- a/apps/landing/package.json
+++ b/apps/landing/package.json
@@ -19,7 +19,7 @@
"@svgr/webpack": "^8.1.0",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.0",
- "lucide-react": "^0.330.0",
+ "lucide-react": "^0.501.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-select": "^5.8.0",
diff --git a/apps/web/components/dashboard/bookmarks/BookmarkLayoutAdaptingCard.tsx b/apps/web/components/dashboard/bookmarks/BookmarkLayoutAdaptingCard.tsx
index be061148..a0437c71 100644
--- a/apps/web/components/dashboard/bookmarks/BookmarkLayoutAdaptingCard.tsx
+++ b/apps/web/components/dashboard/bookmarks/BookmarkLayoutAdaptingCard.tsx
@@ -46,7 +46,7 @@ function BottomRow({
}) {
return (
<div className="justify flex w-full shrink-0 justify-between text-gray-500">
- <div className="flex items-center gap-2 overflow-hidden text-nowrap">
+ <div className="flex items-center gap-2 overflow-hidden text-nowrap font-light">
{footer && <>{footer}•</>}
<Link
href={`/dashboard/preview/${bookmark.id}`}
@@ -122,7 +122,7 @@ function ListView({
return (
<div
className={cn(
- "relative flex max-h-96 gap-4 overflow-hidden rounded-lg p-2 shadow-md",
+ "relative flex max-h-96 gap-4 overflow-hidden rounded-lg p-2",
className,
)}
>
@@ -167,7 +167,7 @@ function GridView({
return (
<div
className={cn(
- "relative flex flex-col overflow-hidden rounded-lg shadow-md",
+ "relative flex flex-col overflow-hidden rounded-lg",
className,
fitHeight && layout != "grid" ? "max-h-96" : "h-96",
)}
@@ -200,7 +200,7 @@ function CompactView({ bookmark, title, footer, className }: Props) {
return (
<div
className={cn(
- "relative flex flex-col overflow-hidden rounded-lg shadow-md",
+ "relative flex flex-col overflow-hidden rounded-lg",
className,
"max-h-96",
)}
diff --git a/apps/web/components/dashboard/bookmarks/EditorCard.tsx b/apps/web/components/dashboard/bookmarks/EditorCard.tsx
index 1938fdec..75745bad 100644
--- a/apps/web/components/dashboard/bookmarks/EditorCard.tsx
+++ b/apps/web/components/dashboard/bookmarks/EditorCard.tsx
@@ -148,7 +148,7 @@ export default function EditorCard({ className }: { className?: string }) {
};
const cardHeight = useBookmarkLayoutSwitch({
grid: "h-96",
- masonry: "h-96",
+ masonry: "h-48",
list: undefined,
compact: undefined,
});
@@ -195,10 +195,10 @@ export default function EditorCard({ className }: { className?: string }) {
ref={inputRef}
disabled={isPending}
className={cn(
- "h-full w-full border-none p-0 text-lg focus-visible:ring-0",
+ "text-md h-full w-full border-none p-0 font-light focus-visible:ring-0",
{ "resize-none": bookmarkLayout !== "list" },
)}
- placeholder={t("editor.placeholder")}
+ placeholder={t("editor.placeholder_v2")}
onKeyDown={(e) => {
if (demoMode) {
return;
@@ -218,7 +218,12 @@ export default function EditorCard({ className }: { className?: string }) {
/>
</FormControl>
</FormItem>
- <ActionButton loading={isPending} type="submit" variant="default">
+ <ActionButton
+ disabled={!form.formState.dirtyFields.text}
+ loading={isPending}
+ type="submit"
+ variant="secondary"
+ >
{form.formState.dirtyFields.text
? demoMode
? t("editor.disabled_submissions")
diff --git a/apps/web/components/dashboard/bookmarks/TagList.tsx b/apps/web/components/dashboard/bookmarks/TagList.tsx
index 49a1156c..593a269b 100644
--- a/apps/web/components/dashboard/bookmarks/TagList.tsx
+++ b/apps/web/components/dashboard/bookmarks/TagList.tsx
@@ -29,8 +29,8 @@ export default function TagList({
<Link
key={t.id}
className={cn(
- badgeVariants({ variant: "outline" }),
- "text-nowrap font-normal hover:bg-foreground hover:text-secondary",
+ badgeVariants({ variant: "secondary" }),
+ "text-nowrap font-light text-gray-700 hover:bg-foreground hover:text-secondary dark:text-gray-400",
)}
href={`/dashboard/tags/${t.id}`}
>
diff --git a/apps/web/components/dashboard/search/SearchInput.tsx b/apps/web/components/dashboard/search/SearchInput.tsx
index 5e46fc18..c58542bf 100644
--- a/apps/web/components/dashboard/search/SearchInput.tsx
+++ b/apps/web/components/dashboard/search/SearchInput.tsx
@@ -6,6 +6,7 @@ import { Input } from "@/components/ui/input";
import { useDoBookmarkSearch } from "@/lib/hooks/bookmark-search";
import { useTranslation } from "@/lib/i18n/client";
import { cn } from "@/lib/utils";
+import { SearchIcon } from "lucide-react";
import { EditListModal } from "../lists/EditListModal";
import QueryExplainerTooltip from "./QueryExplainerTooltip";
@@ -99,6 +100,7 @@ const SearchInput = React.forwardRef<
</Button>
)}
<Input
+ startIcon={SearchIcon}
ref={inputRef}
value={value}
onChange={onChange}
diff --git a/apps/web/components/dashboard/sidebar/AllLists.tsx b/apps/web/components/dashboard/sidebar/AllLists.tsx
index 823f439f..8296dafa 100644
--- a/apps/web/components/dashboard/sidebar/AllLists.tsx
+++ b/apps/web/components/dashboard/sidebar/AllLists.tsx
@@ -9,7 +9,7 @@ import { Button } from "@/components/ui/button";
import { CollapsibleTriggerTriangle } from "@/components/ui/collapsible";
import { useTranslation } from "@/lib/i18n/client";
import { cn } from "@/lib/utils";
-import { MoreHorizontal, Plus } from "lucide-react";
+import { CirclePlus, MoreHorizontal } from "lucide-react";
import type { ZBookmarkList } from "@karakeep/shared/types/lists";
import { ZBookmarkListTreeNode } from "@karakeep/shared/utils/listUtils";
@@ -34,11 +34,11 @@ export default function AllLists({
return (
<ul className="max-h-full gap-y-2 overflow-auto text-sm">
- <li className="flex justify-between pb-2 font-bold">
+ <li className="flex justify-between pb-3 font-bold">
<p>Lists</p>
<EditListModal>
<Link href="#">
- <Plus />
+ <CirclePlus className="mr-4 size-5" strokeWidth={1.5} />
</Link>
</EditListModal>
</li>
diff --git a/apps/web/components/ui/info-tooltip.tsx b/apps/web/components/ui/info-tooltip.tsx
index 0254aa80..4dd97199 100644
--- a/apps/web/components/ui/info-tooltip.tsx
+++ b/apps/web/components/ui/info-tooltip.tsx
@@ -23,7 +23,7 @@ export default function InfoTooltip({
{variant === "tip" ? (
<Info
color="#494949"
- className={cn("cursor-pointer", className)}
+ className={cn("z-10 cursor-pointer", className)}
size={size}
/>
) : (
diff --git a/apps/web/components/ui/input.tsx b/apps/web/components/ui/input.tsx
index 5543446c..09f9def9 100644
--- a/apps/web/components/ui/input.tsx
+++ b/apps/web/components/ui/input.tsx
@@ -1,20 +1,42 @@
import * as React from "react";
import { cn } from "@/lib/utils";
+import { LucideIcon } from "lucide-react";
-export type InputProps = React.InputHTMLAttributes<HTMLInputElement>;
+export interface InputProps
+ extends React.InputHTMLAttributes<HTMLInputElement> {
+ startIcon?: LucideIcon;
+ endIcon?: LucideIcon;
+}
const Input = React.forwardRef<HTMLInputElement, InputProps>(
- ({ className, type, ...props }, ref) => {
+ ({ className, type, startIcon, endIcon, ...props }, ref) => {
+ const StartIcon = startIcon;
+ const EndIcon = endIcon;
+
return (
- <input
- type={type}
- className={cn(
- "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
- className,
+ <div className="relative w-full">
+ {StartIcon && (
+ <div className="absolute left-2 top-1/2 -translate-y-1/2 transform">
+ <StartIcon size={18} className="text-muted-foreground" />
+ </div>
+ )}
+ <input
+ type={type}
+ className={cn(
+ "flex h-10 w-full rounded-md border border-input bg-background px-4 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50",
+ startIcon ? "pl-8" : "",
+ endIcon ? "pr-8" : "",
+ className,
+ )}
+ ref={ref}
+ {...props}
+ />
+ {EndIcon && (
+ <div className="absolute right-3 top-1/2 -translate-y-1/2 transform">
+ <EndIcon className="text-muted-foreground" size={18} />
+ </div>
)}
- ref={ref}
- {...props}
- />
+ </div>
);
},
);
diff --git a/apps/web/lib/i18n/locales/en/translation.json b/apps/web/lib/i18n/locales/en/translation.json
index 4e622df5..1d99a96f 100644
--- a/apps/web/lib/i18n/locales/en/translation.json
+++ b/apps/web/lib/i18n/locales/en/translation.json
@@ -298,6 +298,7 @@
"import_as_text": "Import as Text Bookmark",
"import_as_separate_bookmarks": "Import as separate Bookmarks",
"placeholder": "Paste a link or an image, write a note or drag and drop an image in here…",
+ "placeholder_v2": "Paste a link, write a note or drop an image…",
"new_item": "NEW ITEM",
"disabled_submissions": "Submissions are disabled",
"text_toolbar": {
diff --git a/apps/web/package.json b/apps/web/package.json
index 1b26b183..34e4752a 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -64,7 +64,7 @@
"i18next": "^23.16.5",
"i18next-resources-to-backend": "^1.2.1",
"lexical": "^0.20.2",
- "lucide-react": "^0.330.0",
+ "lucide-react": "^0.501.0",
"next": "14.2.25",
"next-auth": "^4.24.5",
"next-i18next": "^15.3.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 9dac1f20..6c077304 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -95,8 +95,8 @@ importers:
specifier: ^1.0.0
version: 1.0.0(@types/react-dom@18.2.19)(@types/react@18.2.58)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
lucide-react:
- specifier: ^0.330.0
- version: 0.330.0(react@18.3.1)
+ specifier: ^0.501.0
+ version: 0.501.0(react@18.3.1)
react:
specifier: ^18.3.1
version: 18.3.1
@@ -234,8 +234,8 @@ importers:
specifier: ^2.1.0
version: 2.1.0
lucide-react:
- specifier: ^0.330.0
- version: 0.330.0(react@18.3.1)
+ specifier: ^0.501.0
+ version: 0.501.0(react@18.3.1)
react:
specifier: ^18.3.1
version: 18.3.1
@@ -645,8 +645,8 @@ importers:
specifier: ^0.20.2
version: 0.20.2
lucide-react:
- specifier: ^0.330.0
- version: 0.330.0(react@18.3.1)
+ specifier: ^0.501.0
+ version: 0.501.0(react@18.3.1)
next:
specifier: 14.2.25
version: 14.2.25(@babel/core@7.26.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -10445,10 +10445,10 @@ packages:
react-native: '*'
react-native-svg: ^12.0.0 || ^13.0.0 || ^14.0.0 || ^15.0.0
- lucide-react@0.330.0:
- resolution: {integrity: sha512-CQwY+Fpbt2kxCoVhuN0RCZDCYlbYnqB870Bl/vIQf3ER/cnDDQ6moLmEkguRyruAUGd4j3Lc4mtnJosXnqHheA==}
+ lucide-react@0.501.0:
+ resolution: {integrity: sha512-E2KoyhW59fCb/yUbR3rbDer83fqn7a8NG91ZhIot2yWaPHjPyGzzsNKh40N//GezYShAuycf3TcQksRQznIsRw==}
peerDependencies:
- react: ^16.5.1 || ^17.0.0 || ^18.0.0
+ react: ^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0
magic-string@0.25.9:
resolution: {integrity: sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==}
@@ -27995,7 +27995,7 @@ snapshots:
react-native-svg: 15.8.0(react-native@0.76.3(@babel/core@7.26.0)(@babel/preset-env@7.26.9(@babel/core@7.26.0))(@types/react@18.3.12)(react@18.3.1))(react@18.3.1)
dev: false
- lucide-react@0.330.0(react@18.3.1):
+ lucide-react@0.501.0(react@18.3.1):
dependencies:
react: 18.3.1
dev: false