fix clipped outlines in theme selector

This commit is contained in:
SethBurkart123
2024-05-21 22:11:53 +10:00
parent 010c917f2a
commit 910b465932
3 changed files with 4 additions and 4 deletions
@@ -153,7 +153,7 @@ function BackgroundSelector({ isEditMode, disableTheme }: BackgroundSelectorProp
</div> </div>
)} )}
<div className="relative"> <div className="relative px-1">
<h2 className="pb-2 text-lg font-bold">Background Images</h2> <h2 className="pb-2 text-lg font-bold">Background Images</h2>
<div className="flex flex-wrap gap-4"> <div className="flex flex-wrap gap-4">
{ isEditMode ? <></> : { isEditMode ? <></> :
+2 -2
View File
@@ -189,7 +189,7 @@ const ThemeSelector: ForwardRefExoticComponent<Omit<ThemeSelectorProps, "ref"> &
return ( return (
<div <div
ref={elementRef} ref={elementRef}
className={`my-3 ${isDragging ? '' : ''}`} className={`my-3 w-full ${isDragging ? '' : ''}`}
onDragOver={handleDragOver} onDragOver={handleDragOver}
onDragLeave={handleDragLeave} onDragLeave={handleDragLeave}
onDrop={handleDrop} onDrop={handleDrop}
@@ -210,7 +210,7 @@ const ThemeSelector: ForwardRefExoticComponent<Omit<ThemeSelectorProps, "ref"> &
</div> </div>
</div> </div>
<h2 className="pb-2 text-lg font-bold">Themes</h2> <h2 className="pb-2 text-lg font-bold">Themes</h2>
<div className="flex flex-col gap-2"> <div className="flex flex-col gap-2 px-1">
{themes.map((theme) => ( {themes.map((theme) => (
<ThemeCover <ThemeCover
+1 -1
View File
@@ -16,7 +16,7 @@ const Themes: FC = () => {
return ( return (
<div className="px-0.5"> <div className="">
<button className="absolute top-12 z-20 right-0 p-2 text-[0.8rem] text-blue-500" onClick={() => setIsEditMode(!isEditMode)}> <button className="absolute top-12 z-20 right-0 p-2 text-[0.8rem] text-blue-500" onClick={() => setIsEditMode(!isEditMode)}>
{isEditMode ? 'Done' : 'Edit'} {isEditMode ? 'Done' : 'Edit'}
</button> </button>