vrr/supermemory
2
0
Fork 0
mirror of https://github.com/supermemoryai/supermemory.git synced 2026-05-20 09:02:51 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: Fixed overflowing content in add memory pop up (#347)

Browse source
This commit is contained in:
Pratiyank Kumar 2025-03-24 23:06:58 +05:30 • committed by GitHub
parent d0c8cb5eba
commit 3eaee58b6d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 148 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

2
apps/web/app/components/memories/AddMemory.tsx
View file

@ -163,7 +163,7 @@ export function AddMemoryModal({
activeTab === "integrations" && "lg:col-span-3",
)}
>
<TabsList className="border md:flex-col md:h-full h-max md:justify-start md:space-y-2 bg-[#FAFBFC] dark:bg-zinc-800 md:col-span-1 p-2 flex flex-row justify-between overflow-x-auto md:overflow-visible shrink-0">
<TabsList className="border md:flex-col md:h-full h-max md:justify-start md:space-y-2 bg-[#FAFBFC] dark:bg-zinc-800 md:col-span-1 p-2 flex flex-row justify-between overflow-x-auto md:overflow-y-scroll shrink-0">
<TabsTrigger
className="w-full justify-start text-left px-4 py-3 rounded-lg border border-transparent data-[state=active]:border-indigo-500/20 data-[state=active]:bg-indigo-500/10 hover:bg-zinc-100 dark:hover:bg-zinc-700 flex flex-col items-start gap-2 transition-all duration-200 hover:shadow-sm"
id="url-tab"

71
apps/web/app/tailwind.css
View file

@ -106,7 +106,7 @@
--chart-5: 340 75% 55%;
}
[data-registry="plate"] {
[data-registry="plate"] {
--background: 0 0% 100%;
--foreground: 240 10% 3.9%;
--card: 0 0% 100%;
@ -135,7 +135,7 @@
--brand: 217.2 91.2% 59.8%;
--highlight: 47.9 95.8% 53.1%;
}
[data-registry="plate"].dark {
[data-registry="plate"].dark {
--background: 240 10% 3.9%;
--foreground: 0 0% 98%;
--card: 240 10% 3.9%;
@ -184,3 +184,70 @@
@apply absolute bottom-0 left-0 right-0 h-12 bg-gradient-to-t from-card to-transparent;
}
}
/* Base state - scrollbar always present but invisible */
.md\:overflow-y-scroll::-webkit-scrollbar {
width: 4px; /* Thin scrollbar */
background-color: transparent;
opacity: 0;
transition: opacity 0.2s ease;
}
.md\:overflow-y-scroll::-webkit-scrollbar-track {
background-color: rgba(240, 240, 240, 0.1); /* Very subtle light track in light mode */
}
.md\:overflow-y-scroll::-webkit-scrollbar-thumb {
background-color: rgba(155, 155, 155, 0.5); /* Light gray thumb */
border-radius: 10px;
opacity: 0;
transition: opacity 0.2s ease;
}
/* Show scrollbar on hover */
.md\:overflow-y-scroll:hover::-webkit-scrollbar,
.md\:overflow-y-scroll:hover::-webkit-scrollbar-thumb {
opacity: 1;
}
/* Dark mode adjustments */
@media (prefers-color-scheme: dark) {
.md\:overflow-y-scroll::-webkit-scrollbar-track {
background-color: rgba(50, 50, 50, 0.1); /* Subtle dark track in dark mode */
}
.md\:overflow-y-scroll::-webkit-scrollbar-thumb {
background-color: rgba(180, 180, 180, 0.5); /* Slightly lighter thumb for dark mode */
}
}
/* For Firefox */
.md\:overflow-y-scroll {
scrollbar-width: thin;
scrollbar-color: rgba(155, 155, 155, 0) transparent; /* Start with opacity 0 */
transition: scrollbar-color 0.2s ease;
}
.md\:overflow-y-scroll:hover {
scrollbar-color: rgba(155, 155, 155, 0.5) rgba(240, 240, 240, 0.1); /* Light mode colors */
}
/* Dark mode for Firefox */
@media (prefers-color-scheme: dark) {
.md\:overflow-y-scroll:hover {
scrollbar-color: rgba(180, 180, 180, 0.5) rgba(50, 50, 50, 0.1); /* Dark mode colors */
}
}
/* For your specific dark mode class */
.dark .md\:overflow-y-scroll::-webkit-scrollbar-track {
background-color: rgba(50, 50, 50, 0.1);
}
.dark .md\:overflow-y-scroll::-webkit-scrollbar-thumb {
background-color: rgba(180, 180, 180, 0.5);
}
.dark .md\:overflow-y-scroll:hover {
scrollbar-color: rgba(180, 180, 180, 0.5) rgba(50, 50, 50, 0.1);
}