RyderTech/the-bible
1
0
Fork 0
Code Issues Pull Requests Packages Activity

Favorites and color picker fixes

Browse Source
This commit is contained in:
Joshua Ryder
2025-12-14 12:45:29 -05:00
parent bd4c6e0c3a
commit 82bd94de57
2 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/FavoritesMenu.tsx
View File

@@ -196,7 +196,7 @@ const FavoritesMenu: React.FC<FavoritesMenuProps> = ({
</div> </div>
)} )}
</button> </button>
<div className="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity"> <div className="flex items-center gap-1 sm:opacity-0 sm:group-hover:opacity-100 transition-opacity">
{sections.length > 0 && ( {sections.length > 0 && (
<div className="relative"> <div className="relative">
<button <button

10
frontend/src/components/SectionsManager.tsx
View File

@@ -172,8 +172,8 @@ const SectionsManager: React.FC<SectionsManagerProps> = ({
}; };
const ColorPicker = ({ selectedColor, onSelect }: { selectedColor: string; onSelect: (color: string) => void }) => ( const ColorPicker = ({ selectedColor, onSelect }: { selectedColor: string; onSelect: (color: string) => void }) => (
<div className="absolute z-10 mt-2 p-3 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-xl"> <div className="absolute left-0 z-20 mt-2 p-2 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg shadow-xl">
<div className="grid grid-cols-6 gap-2"> <div className="grid grid-cols-9 gap-1.5">
{SECTION_COLORS.map(color => ( {SECTION_COLORS.map(color => (
<button <button
key={color.value} key={color.value}
@@ -181,10 +181,10 @@ const SectionsManager: React.FC<SectionsManagerProps> = ({
onSelect(color.value); onSelect(color.value);
setShowColorPicker(null); setShowColorPicker(null);
}} }}
className={`w-8 h-8 rounded-full transition-all ${ className={`w-6 h-6 rounded-full transition-all flex-shrink-0 ${
selectedColor === color.value selectedColor === color.value
? 'ring-2 ring-blue-500 ring-offset-2 dark:ring-offset-gray-800' ? 'ring-2 ring-blue-500 ring-offset-1 dark:ring-offset-gray-800 scale-110'
: 'hover:scale-110' : 'hover:scale-110 active:scale-95'
}`} }`}
style={{ backgroundColor: color.value }} style={{ backgroundColor: color.value }}
title={color.name} title={color.name}