UI/UX Improvements and Bug Fixes (#138)
* Improve navigation layout: reduce spacing and move help icons inside nav buttons - Reduced horizontal spacing between nav items from sm:space-x-2 lg:space-x-8 to sm:space-x-1 - Moved ContextualHelpIcon components inside Button components for better UX - Removed unnecessary wrapper divs to create more compact layout - Help symbols are now part of the clickable nav area * Enhance stop/destroy button hover effects and colors - Added scaling and shadow hover effects to stop/start and destroy buttons - Enhanced color scheme with high-contrast colors: - Stop button: vibrant red (bg-red-600) with red glow shadow - Start button: vibrant green (bg-green-600) with green glow shadow - Destroy button: dark red (bg-red-800) with intense red glow shadow - Added colored borders and smooth transitions for better visual feedback - Improved button visibility and user experience with color-coded actions * Fix input field alignment in editing mode - Improved vertical alignment of script name and container ID input fields - Removed script path line during editing for cleaner interface - Added consistent min-height and flex centering for both input fields - Enhanced input styling with better padding and focus states - Input fields now align perfectly at the same height level * Improve button styling on available scripts page - Made download button smaller and less colorful with subtle blue theme - Updated Clear Selection and Select All Visible buttons to match Settings button styling - Changed buttons to outline variant with default size for consistency - Removed custom border styling to use standard outline appearance - Improved visual hierarchy and button cohesion across the interface * Reduce footer size by approximately 50% - Changed vertical padding from py-6 to py-3 (3rem to 1.5rem) - Reduced gaps between elements from gap-4 to gap-2 throughout - Made footer more compact while maintaining functionality - Improved screen space utilization for main content * Add tab persistence with localStorage - Implement localStorage persistence for active tab selection - Tab selection now survives page reloads and browser sessions - Added lazy initialization to read saved tab from localStorage - Added useEffect to automatically save tab changes to localStorage - Includes SSR safety checks for Next.js compatibility - Defaults to 'scripts' tab if no saved tab found * Clean up code: remove unused comments and variables - Remove unnecessary comments in InstalledScriptsTab - Clean up unused error variable in installedScripts router - Minor code cleanup for better readability
This commit is contained in:
committed by
GitHub
parent
892b3ae5df
commit
7454799971
@@ -12,10 +12,10 @@ export function Footer({ onOpenReleaseNotes }: FooterProps) {
|
||||
const { data: versionData } = api.version.getCurrentVersion.useQuery();
|
||||
|
||||
return (
|
||||
<footer className="sticky bottom-0 mt-auto border-t border-border bg-muted/30 py-6 backdrop-blur-sm">
|
||||
<footer className="sticky bottom-0 mt-auto border-t border-border bg-muted/30 py-3 backdrop-blur-sm">
|
||||
<div className="container mx-auto px-4">
|
||||
<div className="flex flex-col sm:flex-row items-center justify-between gap-4 text-sm text-muted-foreground">
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="flex flex-col sm:flex-row items-center justify-between gap-2 text-sm text-muted-foreground">
|
||||
<div className="flex items-center gap-2">
|
||||
<span>© 2024 PVE Scripts Local</span>
|
||||
{versionData?.success && versionData.version && (
|
||||
<Button
|
||||
@@ -29,7 +29,7 @@ export function Footer({ onOpenReleaseNotes }: FooterProps) {
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
|
||||
Reference in New Issue
Block a user