diff --git a/backend/images/PictoPy.thumbnails/PictoPy_Logo.png b/backend/images/PictoPy.thumbnails/PictoPy_Logo.png new file mode 100644 index 00000000..940fd236 Binary files /dev/null and b/backend/images/PictoPy.thumbnails/PictoPy_Logo.png differ diff --git a/frontend/.prettierrc b/frontend/.prettierrc index 59b6c78b..2bb6a340 100644 --- a/frontend/.prettierrc +++ b/frontend/.prettierrc @@ -1,7 +1,7 @@ { - "semi": true, - "singleQuote": true, - "tabWidth": 2, - "trailingComma": "all", - "plugins": ["prettier-plugin-tailwindcss"] - } \ No newline at end of file + "semi": true, + "singleQuote": true, + "tabWidth": 2, + "trailingComma": "all", + "plugins": ["prettier-plugin-tailwindcss"] +} diff --git a/frontend/postcss.config.js b/frontend/postcss.config.js index 0486115b..8e53f9d1 100644 --- a/frontend/postcss.config.js +++ b/frontend/postcss.config.js @@ -1,7 +1,7 @@ -const postcssConfig = { +const postcssConfig = { plugins: { tailwindcss: {}, autoprefixer: {}, }, -} -export default postcssConfig \ No newline at end of file +}; +export default postcssConfig; diff --git a/frontend/src-tauri/tauri.conf.json b/frontend/src-tauri/tauri.conf.json index 6eae9883..6db42328 100644 --- a/frontend/src-tauri/tauri.conf.json +++ b/frontend/src-tauri/tauri.conf.json @@ -23,9 +23,7 @@ "plugins": { "updater": { "active": true, - "endpoints": [ - "https://server.com//api/v1/tauri/update" - ], + "endpoints": ["https://server.com//api/v1/tauri/update"], "dialog": true, "pubkey": "dW50cnVzdGVkIGNvbW1lbnQ6IG1pbmlzaWduIHB1YmxpYyBrZXk6IEI3ODc5QjNDMERGMzlCMUEKUldRYW0vTU5QSnVIdHplYktOV3hKKzdmSGd6ZVN3eTg4Q2ExbmVTbk4yN0pMWjZLYXl1M1ZzN3AK" } @@ -43,12 +41,10 @@ ], "security": { "assetProtocol": { - "scope": [ - "**" - ], + "scope": ["**"], "enable": true }, "csp": null } } -} \ No newline at end of file +} diff --git a/frontend/src/App.css b/frontend/src/App.css index 8f255c12..da2d7a50 100644 --- a/frontend/src/App.css +++ b/frontend/src/App.css @@ -2,10 +2,10 @@ @tailwind components; @tailwind utilities; - @layer base { - :root { - --background: 0 0% 100%; - --foreground: 0 0% 0%; +@layer base { + :root { + --background: 0 0% 100%; + --foreground: 0 0% 0%; --card: 0 0% 100%; --card-foreground: 222.2 84% 4.9%; @@ -32,39 +32,38 @@ --input: 214.3 31.8% 91.4%; --ring: 222.2 84% 4.9%; - --radius: 0.5rem; - } + --radius: 0.5rem; + } - .dark { - --background: 221, 39%, 11%; - --foreground: 0 0% 100%; + .dark { + --background: 221, 39%, 11%; + --foreground: 0 0% 100%; - --card: 222.2 84% 4.9%; - --card-foreground: 210 40% 98%; + --card: 222.2 84% 4.9%; + --card-foreground: 210 40% 98%; - --popover: 222.2 84% 4.9%; - --popover-foreground: 210 40% 98%; + --popover: 222.2 84% 4.9%; + --popover-foreground: 210 40% 98%; - --primary: 210 40% 98%; - --primary-foreground: 222.2 47.4% 11.2%; + --primary: 210 40% 98%; + --primary-foreground: 222.2 47.4% 11.2%; - --secondary: 217.2 32.6% 17.5%; - --secondary-foreground: 210 40% 98%; + --secondary: 217.2 32.6% 17.5%; + --secondary-foreground: 210 40% 98%; - --muted: 217.2 32.6% 17.5%; - --muted-foreground: 215 20.2% 65.1%; + --muted: 217.2 32.6% 17.5%; + --muted-foreground: 215 20.2% 65.1%; - --accent: 217.2 32.6% 17.5%; - --accent-foreground: 210 40% 98%; + --accent: 217.2 32.6% 17.5%; + --accent-foreground: 210 40% 98%; - --destructive: 0 62.8% 30.6%; - --destructive-foreground: 210 40% 98%; + --destructive: 0 62.8% 30.6%; + --destructive-foreground: 210 40% 98%; - --border: 217.2 32.6% 17.5%; - --input: 217.2 32.6% 17.5%; - --ring: 212.7 26.8% 83.9%; - } - + --border: 217.2 32.6% 17.5%; + --input: 217.2 32.6% 17.5%; + --ring: 212.7 26.8% 83.9%; + } } @layer base { @@ -83,4 +82,3 @@ -ms-overflow-style: none; scrollbar-width: none; } - diff --git a/frontend/src/components/Album/ImageManagementDialog.tsx b/frontend/src/components/Album/ImageManagementDialog.tsx index 435931a7..00c91bca 100644 --- a/frontend/src/components/Album/ImageManagementDialog.tsx +++ b/frontend/src/components/Album/ImageManagementDialog.tsx @@ -104,7 +104,7 @@ const ImageManagementDialog: React.FC = ({ diff --git a/frontend/src/components/Album/ImageSelection.tsx b/frontend/src/components/Album/ImageSelection.tsx index e3a563e7..a1e584ea 100644 --- a/frontend/src/components/Album/ImageSelection.tsx +++ b/frontend/src/components/Album/ImageSelection.tsx @@ -99,7 +99,7 @@ const ImageSelectionPage: React.FC = ({ return (
= ({ return (
{ - return( -
-
- -
-
- ) + return ( +
+
+ +
+
+ ); }; diff --git a/frontend/src/components/Media/MediaView.tsx b/frontend/src/components/Media/MediaView.tsx index 08d014e0..d53322ed 100644 --- a/frontend/src/components/Media/MediaView.tsx +++ b/frontend/src/components/Media/MediaView.tsx @@ -184,4 +184,4 @@ const MediaView: React.FC = ({ ); }; -export default MediaView; \ No newline at end of file +export default MediaView; diff --git a/frontend/src/components/Navigation/Sidebar/Sidebar.tsx b/frontend/src/components/Navigation/Sidebar/Sidebar.tsx index d1e8135f..80a6c272 100644 --- a/frontend/src/components/Navigation/Sidebar/Sidebar.tsx +++ b/frontend/src/components/Navigation/Sidebar/Sidebar.tsx @@ -40,7 +40,7 @@ const Sidebar = () => { return (
= ({ message }) => {

Go Home diff --git a/frontend/src/components/ui/button.tsx b/frontend/src/components/ui/button.tsx index eb7c1ef3..e244184f 100644 --- a/frontend/src/components/ui/button.tsx +++ b/frontend/src/components/ui/button.tsx @@ -9,12 +9,18 @@ const buttonVariants = cva( { variants: { variant: { - default: 'bg-primary text-primary-foreground hover:bg-primary/90 active:bg-primary/80 focus:ring-primary dark:bg-primary-dark dark:text-primary-foreground-dark dark:hover:bg-primary-dark/90 dark:active:bg-primary-dark/80', - destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90 active:bg-destructive/80 focus:ring-destructive dark:bg-destructive-dark dark:text-destructive-foreground-dark dark:hover:bg-destructive-dark/90 dark:active:bg-destructive-dark/80', - outline: 'border border-input hover:bg-accent hover:text-accent-foreground active:bg-accent/90 focus:ring-accent dark:bg-accent-dark dark:text-accent-foreground-dark dark:border-input-dark', - secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80 active:bg-secondary/70 focus:ring-secondary dark:bg-secondary-dark dark:text-secondary-foreground-dark dark:hover:bg-secondary-dark/80 dark:active:bg-secondary-dark/70', - ghost: 'hover:bg-accent hover:text-accent-foreground active:bg-accent/90 focus:ring-accent dark:hover:bg-accent-dark dark:text-accent-foreground-dark', - link: 'text-primary underline-offset-4 hover:underline active:text-primary/80 focus:ring-primary dark:text-primary-dark dark:hover:underline', + default: + 'bg-primary text-primary-foreground hover:bg-primary/90 active:bg-primary/80 focus:ring-primary dark:bg-primary-dark dark:text-primary-foreground-dark dark:hover:bg-primary-dark/90 dark:active:bg-primary-dark/80', + destructive: + 'bg-destructive text-destructive-foreground hover:bg-destructive/90 active:bg-destructive/80 focus:ring-destructive dark:bg-destructive-dark dark:text-destructive-foreground-dark dark:hover:bg-destructive-dark/90 dark:active:bg-destructive-dark/80', + outline: + 'border border-input hover:bg-accent hover:text-accent-foreground active:bg-accent/90 focus:ring-accent dark:bg-accent-dark dark:text-accent-foreground-dark dark:border-input-dark', + secondary: + 'bg-secondary text-secondary-foreground hover:bg-secondary/80 active:bg-secondary/70 focus:ring-secondary dark:bg-secondary-dark dark:text-secondary-foreground-dark dark:hover:bg-secondary-dark/80 dark:active:bg-secondary-dark/70', + ghost: + 'hover:bg-accent hover:text-accent-foreground active:bg-accent/90 focus:ring-accent dark:hover:bg-accent-dark dark:text-accent-foreground-dark', + link: + 'text-primary underline-offset-4 hover:underline active:text-primary/80 focus:ring-primary dark:text-primary-dark dark:hover:underline', }, size: { default: 'h-10 px-4 py-2', @@ -48,7 +54,7 @@ const Button = React.forwardRef( ); }, ); + Button.displayName = 'Button'; export { Button, buttonVariants }; - diff --git a/frontend/src/features/Setup/Setup.tsx b/frontend/src/features/Setup/Setup.tsx index cb559ba6..6be18ddb 100644 --- a/frontend/src/features/Setup/Setup.tsx +++ b/frontend/src/features/Setup/Setup.tsx @@ -11,7 +11,7 @@ export const SetupScreen: React.FC = ({ }) => (
-
+

Pictopy

diff --git a/frontend/src/pages/SettingsPage/Settings.tsx b/frontend/src/pages/SettingsPage/Settings.tsx index 9867798f..25941ac3 100644 --- a/frontend/src/pages/SettingsPage/Settings.tsx +++ b/frontend/src/pages/SettingsPage/Settings.tsx @@ -37,7 +37,7 @@ const Settings: React.FC = () => { return (
-
+

Current Folder Path diff --git a/frontend/tailwind.config.cjs b/frontend/tailwind.config.cjs index 0a0ebfa6..e4bad266 100644 --- a/frontend/tailwind.config.cjs +++ b/frontend/tailwind.config.cjs @@ -1,77 +1,78 @@ /** @type {import('tailwindcss').Config} */ module.exports = { - darkMode: ["class"], + darkMode: ['class'], content: [ './pages/**/*.{ts,tsx}', './components/**/*.{ts,tsx}', './app/**/*.{ts,tsx}', './src/**/*.{ts,tsx}', ], - prefix: "", + prefix: '', theme: { container: { center: true, - padding: "2rem", + padding: '2rem', screens: { - "2xl": "1400px", + '2xl': '1400px', }, }, extend: { colors: { - border: "hsl(var(--border))", - input: "hsl(var(--input))", - ring: "hsl(var(--ring))", - background: "hsl(var(--background))", - foreground: "hsl(var(--foreground))", + border: 'hsl(var(--border))', + input: 'hsl(var(--input))', + ring: 'hsl(var(--ring))', + background: 'hsl(var(--background))', + foreground: 'hsl(var(--foreground))', primary: { - DEFAULT: "hsl(var(--primary))", - foreground: "hsl(var(--primary-foreground))", + DEFAULT: 'hsl(var(--primary))', + foreground: 'hsl(var(--primary-foreground))', }, secondary: { - DEFAULT: "hsl(var(--secondary))", - foreground: "hsl(var(--secondary-foreground))", + DEFAULT: 'hsl(var(--secondary))', + foreground: 'hsl(var(--secondary-foreground))', }, destructive: { - DEFAULT: "hsl(var(--destructive))", - foreground: "hsl(var(--destructive-foreground))", + DEFAULT: 'hsl(var(--destructive))', + foreground: 'hsl(var(--destructive-foreground))', }, muted: { - DEFAULT: "hsl(var(--muted))", - foreground: "hsl(var(--muted-foreground))", + DEFAULT: 'hsl(var(--muted))', + foreground: 'hsl(var(--muted-foreground))', }, accent: { - DEFAULT: "hsl(var(--accent))", - foreground: "hsl(var(--accent-foreground))", + DEFAULT: 'hsl(var(--accent))', + foreground: 'hsl(var(--accent-foreground))', }, popover: { - DEFAULT: "hsl(var(--popover))", - foreground: "hsl(var(--popover-foreground))", + DEFAULT: 'hsl(var(--popover))', + foreground: 'hsl(var(--popover-foreground))', }, card: { - DEFAULT: "hsl(var(--card))", - foreground: "hsl(var(--card-foreground))", + DEFAULT: 'hsl(var(--card))', + foreground: 'hsl(var(--card-foreground))', }, }, borderRadius: { - lg: "var(--radius)", - md: "calc(var(--radius) - 2px)", - sm: "calc(var(--radius) - 4px)", + lg: 'var(--radius)', + md: 'calc(var(--radius) - 2px)', + sm: 'calc(var(--radius) - 4px)', }, keyframes: { - "accordion-down": { - from: { height: "0" }, - to: { height: "var(--radix-accordion-content-height)" }, + 'accordion-down': { + from: { height: '0' }, + to: { height: 'var(--radix-accordion-content-height)' }, }, - "accordion-up": { - from: { height: "var(--radix-accordion-content-height)" }, - to: { height: "0" }, + 'accordion-up': { + from: { height: 'var(--radix-accordion-content-height)' }, + to: { height: '0' }, }, }, animation: { - "accordion-down": "accordion-down 0.2s ease-out", - "accordion-up": "accordion-up 0.2s ease-out", + 'accordion-down': 'accordion-down 0.2s ease-out', + 'accordion-up': 'accordion-up 0.2s ease-out', }, }, }, - plugins: [require("tailwindcss-animate")], + plugins: [require('tailwindcss-animate')], }; + diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js index 88a22540..edbc16f2 100644 --- a/frontend/tailwind.config.js +++ b/frontend/tailwind.config.js @@ -1,100 +1,112 @@ /** @type {import('tailwindcss').Config} */ -const tailwindcssAnimate = require("tailwindcss-animate"); +const tailwindcssAnimate = require('tailwindcss-animate'); module.exports = { - darkMode: ["class"], + darkMode: ['class'], content: [ - "./pages/**/*.{ts,tsx}", - "./components/**/*.{ts,tsx}", - "./app/**/*.{ts,tsx}", - "./src/**/*.{ts,tsx}", + './pages/**/*.{ts,tsx}', + './components/**/*.{ts,tsx}', + './app/**/*.{ts,tsx}', + './src/**/*.{ts,tsx}', ], - prefix: "", + prefix: '', theme: { container: { center: true, - padding: "2rem", + padding: '2rem', screens: { - "2xl": "1400px", + '2xl': '1400px', }, }, extend: { colors: { - border: "hsl(var(--border))", - input: "hsl(var(--input))", - ring: "hsl(var(--ring))", - background: "hsl(var(--background))", - foreground: "hsl(var(--foreground))", + border: 'hsl(var(--border))', + input: 'hsl(var(--input))', + ring: 'hsl(var(--ring))', + background: 'hsl(var(--background))', + foreground: 'hsl(var(--foreground))', primary: { - DEFAULT: "hsl(var(--primary))", - foreground: "hsl(var(--primary-foreground))", + DEFAULT: 'hsl(var(--primary))', + foreground: 'hsl(var(--primary-foreground))', }, secondary: { - DEFAULT: "hsl(var(--secondary))", - foreground: "hsl(var(--secondary-foreground))", + DEFAULT: 'hsl(var(--secondary))', + foreground: 'hsl(var(--secondary-foreground))', }, destructive: { - DEFAULT: "hsl(var(--destructive))", - foreground: "hsl(var(--destructive-foreground))", + DEFAULT: 'hsl(var(--destructive))', + foreground: 'hsl(var(--destructive-foreground))', }, muted: { - DEFAULT: "hsl(var(--muted))", - foreground: "hsl(var(--muted-foreground))", + DEFAULT: 'hsl(var(--muted))', + foreground: 'hsl(var(--muted-foreground))', }, accent: { - DEFAULT: "hsl(var(--accent))", - foreground: "hsl(var(--accent-foreground))", + DEFAULT: 'hsl(var(--accent))', + foreground: 'hsl(var(--accent-foreground))', }, popover: { - DEFAULT: "hsl(var(--popover))", - foreground: "hsl(var(--popover-foreground))", + DEFAULT: 'hsl(var(--popover))', + foreground: 'hsl(var(--popover-foreground))', }, card: { - DEFAULT: "hsl(var(--card))", - foreground: "hsl(var(--card-foreground))", + DEFAULT: 'hsl(var(--card))', + foreground: 'hsl(var(--card-foreground))', }, - gradientFrom: "#6366F1", - gradientVia: "#8B5CF6", - gradientTo: "#EC4899", - gradientFromDark: "#4F46E5", - gradientViaDark: "#7C3AED", - gradientToDark: "#BE185D", + gradientFrom: '#6366F1', + gradientVia: '#8B5CF6', + gradientTo: '#EC4899', + gradientFromDark: '#4F46E5', + gradientViaDark: '#7C3AED', + gradientToDark: '#BE185D', }, boxShadow: { - lg: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)", - xl: "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)", - darkLg: "0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.3)", + lg: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)', + xl: '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)', + darkLg: '0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.3)', }, keyframes: { - "accordion-down": { - from: { height: "0" }, - to: { height: "var(--radix-accordion-content-height)" }, + 'accordion-down': { + from: { height: '0' }, + to: { height: 'var(--radix-accordion-content-height)' }, }, - "accordion-up": { - from: { height: "var(--radix-accordion-content-height)" }, - to: { height: "0" }, + 'accordion-up': { + from: { height: 'var(--radix-accordion-content-height)' }, + to: { height: '0' }, }, - "button-hover": { - "0%": { transform: "scale(1)", boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)" }, - "100%": { transform: "scale(1.05)", boxShadow: "0 6px 10px rgba(0, 0, 0, 0.2)" }, + 'button-hover': { + '0%': { + transform: 'scale(1)', + boxShadow: '0 4px 6px rgba(0, 0, 0, 0.1)', + }, + '100%': { + transform: 'scale(1.05)', + boxShadow: '0 6px 10px rgba(0, 0, 0, 0.2)', + }, }, - "button-hover-dark": { - "0%": { transform: "scale(1)", boxShadow: "0 4px 6px rgba(255, 255, 255, 0.1)" }, - "100%": { transform: "scale(1.05)", boxShadow: "0 6px 10px rgba(255, 255, 255, 0.15)" }, + 'button-hover-dark': { + '0%': { + transform: 'scale(1)', + boxShadow: '0 4px 6px rgba(255, 255, 255, 0.1)', + }, + '100%': { + transform: 'scale(1.05)', + boxShadow: '0 6px 10px rgba(255, 255, 255, 0.15)', + }, }, }, animation: { - "accordion-down": "accordion-down 0.2s ease-out", - "accordion-up": "accordion-up 0.2s ease-out", - "button-hover": "button-hover 0.3s ease-in-out", - "button-hover-dark": "button-hover-dark 0.3s ease-in-out", + 'accordion-down': 'accordion-down 0.2s ease-out', + 'accordion-up': 'accordion-up 0.2s ease-out', + 'button-hover': 'button-hover 0.3s ease-in-out', + 'button-hover-dark': 'button-hover-dark 0.3s ease-in-out', }, }, borderRadius: { - lg: "var(--radius)", - md: "calc(var(--radius) - 2px)", - sm: "calc(var(--radius) - 4px)", + lg: 'var(--radius)', + md: 'calc(var(--radius) - 2px)', + sm: 'calc(var(--radius) - 4px)', }, }, plugins: [tailwindcssAnimate], -}; \ No newline at end of file +};