Skip to content

Commit 59aa983

Browse files
Advik-GuptaAdvik-Gupta
committed
ui bug fixes
1 parent ff27955 commit 59aa983

File tree

7 files changed

+65
-29
lines changed

7 files changed

+65
-29
lines changed

‎src/components/AddPapers.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,9 @@ const AddPapers = ({ onClick }: { onClick?: () => void }) => {
22
return (
33
<div
44
onClick={onClick}
5-
className="flex h-full w-full cursor-pointer items-center justify-center rounded-md border-2 border-dashed border-purple-500 bg-transparent transition hover:border-gray-400 hover:bg-[#2a2a2a] hover:text-gray-300"
5+
className="flex h-full w-full cursor-pointer items-center justify-center rounded-md border-2 border-dashed border-purple-500 bg-transparent text-purple-500 transition hover:border-gray-400 hover:bg-[#e8e9ff] hover:text-gray-700 dark:hover:bg-[#2a2a2a] dark:hover:text-gray-300"
66
>
7-
<span className="text-4xl text-purple-500 transition-colors duration-200 group-hover:text-gray-300">
8-
+
9-
</span>
7+
<span className="text-4xl transition-colors duration-200">+</span>
108
</div>
119
);
1210
};

‎src/components/PinButton.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,11 @@ export default function PinButton({
1414
return (
1515
<button
1616
onClick={onToggle}
17-
className={`ml-2 flex items-center gap-2 rounded-full px-4 py-2 text-sm font-medium ${
18-
isPinned ? "bg-purple-700 text-white" : "bg-[#2B2B30] text-white/80"
19-
} transition hover:bg-purple-600`}
17+
className={`ml-2 flex items-center gap-2 rounded-full border border-[#3A3745] px-4 py-2 text-sm font-medium transition ${
18+
isPinned
19+
? "bg-purple-700 text-white hover:bg-purple-600 dark:bg-purple-600 dark:hover:bg-purple-500"
20+
: "bg-[#e8e9ff] text-gray-700 hover:bg-slate-50 dark:bg-black dark:text-white dark:hover:bg-[#1A1823]"
21+
}`}
2022
disabled={disabled}
2123
>
2224
{isPinned ? <Pin className="h-4 w-4" /> : <PinOff className="h-4 w-4" />}

‎src/components/Searchbar/pinned-searchbar.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -210,7 +210,7 @@ function PinnedSearchBar({
210210
<PinButton
211211
isPinned={pinned}
212212
onToggle={handlePinToggle}
213-
disabled={!showControls && searchText.trim() === ""}
213+
disabled={!showControls || searchText.trim() === ""}
214214
/>
215215
</div>
216216

@@ -232,14 +232,14 @@ function PinnedSearchBar({
232232
handlePinToggle();
233233
setOpen(false);
234234
}}
235-
disabled={!showControls && searchText.trim() === ""}
235+
disabled={!showControls || searchText.trim() === ""}
236236
/>
237237
<button
238238
onClick={() => {
239239
handleRemoveAll();
240240
setOpen(false);
241241
}}
242-
className="flex items-center gap-2 rounded-full border border-[#3A3745] px-3 py-1.5 text-sm font-semibold text-white transition hover:bg-[#1A1823]"
242+
className="flex items-center gap-2 rounded-full border border-[#3A3745] bg-[#e8e9ff] px-3 py-1.5 text-sm font-semibold text-gray-700 transition hover:bg-slate-50 dark:bg-black dark:text-white dark:hover:bg-[#1A1823]"
243243
>
244244
Remove All <X className="h-4 w-4" />
245245
</button>
@@ -254,8 +254,11 @@ function PinnedSearchBar({
254254
<div className="mt-2 hidden w-full md:block">
255255
<div className="ml-auto w-fit">
256256
<button
257-
onClick={handleRemoveAll}
258-
className={`flex items-center gap-2 rounded-full border border-[#3A3745] px-3 py-1.5 text-sm font-semibold text-white transition hover:bg-[#1A1823] ${showControls ? "block" : "hidden"}`}
257+
onClick={() => {
258+
handleRemoveAll();
259+
setOpen(false);
260+
}}
261+
className="flex items-center gap-2 rounded-full border border-[#3A3745] bg-[#e8e9ff] px-3 py-1.5 text-sm font-semibold text-gray-700 transition hover:bg-slate-50 dark:bg-black dark:text-white dark:hover:bg-[#1A1823]"
259262
>
260263
Remove All <X className="h-4 w-4" />
261264
</button>

‎src/components/Searchbar/searchbar-child.tsx

Lines changed: 31 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -147,7 +147,37 @@ function SearchBarChild({
147147
id="subject"
148148
className="items-center text-sm tracking-wide text-black dark:text-white sm:text-base"
149149
>
150-
{suggestion}
150+
{(() => {
151+
const codeMatch = /\[[^\]]+\]$/.exec(suggestion);
152+
const code = codeMatch ? codeMatch[0] : "";
153+
const title = suggestion.replace(/\s\[[^\]]+\]$/, "");
154+
155+
let displayTitle = title;
156+
const isMobile =
157+
typeof window !== "undefined" &&
158+
window.innerWidth < 640;
159+
160+
if (isMobile) {
161+
if (title.length > 25) {
162+
const start = title.slice(0, 15).trim();
163+
const end = title.slice(-8).trim();
164+
displayTitle = `${start}.....${end}`;
165+
}
166+
} else {
167+
if (title.length > 40) {
168+
const start = title.slice(0, 25).trim();
169+
const end = title.slice(-15).trim();
170+
displayTitle = `${start}.....${end}`;
171+
}
172+
}
173+
174+
return (
175+
<>
176+
<span className="truncate">{displayTitle}</span>
177+
<span className="ml-2 shrink-0">{code}</span>
178+
</>
179+
);
180+
})()}
151181
</span>
152182
</li>
153183
))}

‎src/components/UpcomingPaper.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -94,11 +94,13 @@ export default function PaperCard({ subject, slots }: PaperCardProps) {
9494
e.stopPropagation();
9595
handlePinToggle();
9696
}}
97-
className="group z-10 mt-1"
97+
className="group z-10 mt-1 text-black dark:text-white"
9898
>
9999
<Pin
100-
className={`h-6 w-6 transform stroke-white transition-all ${
101-
pinned ? "fill-[#A78BFA]" : "group-hover:fill-[#A78BFA]"
100+
className={`h-6 w-6 transform stroke-current transition-all ${
101+
pinned
102+
? "fill-violet-400 dark:fill-violet-500"
103+
: "fill-transparent group-hover:fill-violet-400 dark:group-hover:fill-violet-500"
102104
} group-hover:scale-110`}
103105
/>
104106
</button>

‎src/components/ui/PWAInstallButton.tsx

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,8 @@ interface BeforeInstallPromptEvent extends Event {
1313
}
1414

1515
const PWAInstallButton = () => {
16-
const [deferredPrompt, setDeferredPrompt] = useState<BeforeInstallPromptEvent | null>(null);
16+
const [deferredPrompt, setDeferredPrompt] =
17+
useState<BeforeInstallPromptEvent | null>(null);
1718
const [canInstall, setCanInstall] = useState(false);
1819
const [isMobile, setIsMobile] = useState(false);
1920

@@ -53,14 +54,19 @@ const PWAInstallButton = () => {
5354

5455
return (
5556
<>
56-
<div className="md:hidden flex items-center justify-between rounded-full dark:bg-[#2b2343] bg-transparent px-4 py-2 shadow-md text-white w-fit border border-[#3A3745] transition hover:bg-black hover:dark:bg-[#2b2b30]">
57+
<div className="flex w-fit items-center justify-between rounded-full border border-[#3A3745] bg-[#e8e9ff] px-4 py-2 text-gray-700 shadow-md transition hover:bg-slate-50 dark:bg-black dark:text-white dark:hover:bg-[#2b2b30] md:hidden">
5758
<div className="flex items-center gap-3">
58-
<Image src="/papers_logo.png" alt="Papers App" width={32} height={32} />
59-
<span className="font-semibold text-lg text-white">Papers App</span>
59+
<Image
60+
src="/papers_logo.png"
61+
alt="Papers App"
62+
width={32}
63+
height={32}
64+
/>
65+
<span className="text-lg font-semibold">Papers App</span>
6066
</div>
6167
<button
6268
onClick={handleInstall}
63-
className="ml-6 flex items-center gap-2 rounded-full border border-[#3A3745] dark:bg-[#1e1e24] bg-transparent px-4 py-1 text-sm font-semibold text-white transition hover:bg-black hover:dark:bg-[#2b2b30]"
69+
className="ml-6 flex items-center gap-2 rounded-full border border-[#3A3745] bg-[#e8e9ff] px-4 py-1 text-sm font-semibold text-gray-700 transition hover:bg-slate-50 dark:bg-black dark:text-white dark:hover:bg-[#1A1823]"
6470
>
6571
<Download className="h-4 w-4" />
6672
Install
@@ -69,15 +75,10 @@ const PWAInstallButton = () => {
6975

7076
<div
7177
onClick={handleInstall}
72-
className="hidden md:flex items-center gap-3 rounded-full px-5 py-2 text-white cursor-pointer dark:bg-[#130e1f] bg-transparent border border-[#3A3745] transition hover:bg-black hover:dark:bg-[#1A1823]"
78+
className="hidden cursor-pointer items-center gap-3 rounded-full border border-[#3A3745] bg-[#e8e9ff] px-5 py-2 text-gray-700 transition hover:bg-slate-50 dark:bg-black dark:text-white dark:hover:bg-[#1A1823] md:flex"
7379
>
74-
<Image
75-
src="/papers_logo.png"
76-
alt="Papers App"
77-
width={28}
78-
height={28}
79-
/>
80-
<span className="font-semibold text-sm text-white">Papers App</span>
80+
<Image src="/papers_logo.png" alt="Papers App" width={28} height={28} />
81+
<span className="text-sm font-semibold">Papers App</span>
8182
</div>
8283
</>
8384
);

‎src/util/download.tsx renamed to ‎src/util/download_paper.tsx

File renamed without changes.

0 commit comments

Comments
 (0)