Firefly-Shelter/Firefly_Launcher
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 24 Wiki Activity

FIX: Drag drop, ui/ux

Browse Source
This commit is contained in:
Azen Kain
2025-10-20 17:20:16 +07:00
parent 787962c6d0
commit ca612797ee
4 changed files with 77 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
frontend/src/components/header/index.tsx
View File

@@ -2,34 +2,30 @@ import { Link } from "@tanstack/react-router";
import useModalStore from "@/stores/modalStore";
import { Blend, BookOpen, Diff, Home, Info, Languages, Minus, Puzzle, Settings, TrendingUpDown, Wrench, X } from "lucide-react";
import { AppService } from "@bindings/firefly-launcher/internal/app-service";
import { motion } from "motion/react";
export default function Header() {
const { setIsOpenSettingModal } = useModalStore()
const controlButtons = [
{
icon: <Settings className="w-5 h-5 text-white" />,
icon: <Settings className="w-5 h-5" />,
action: () => setIsOpenSettingModal(true),
tip: "Settings",
hover: { rotate: 20, color: "#ffffff" },
},
{
icon: <Minus className="w-5 h-5 text-white" />,
icon: <Minus className="w-5 h-5" />,
action: () => AppService.MinimizeApp(),
tip: "Minimize",
hover: { rotate: 20, color: "#ffffff" },
},
{
icon: <X className="w-5 h-5 text-white" />,
icon: <X className="w-5 h-5" />,
action: () => AppService.CloseApp(),
tip: "Close",
hover: {color: "#ffffff", rotate: -10 },
},
]
return (
<div className="navbar sticky top-0 z-50 px-3">
<div className="navbar sticky top-0 z-50 px-3" style={{ '--wails-draggable': 'drag' } as any}>
<div className="navbar-start">
<div className="dropdown">
<div tabIndex={0} role="button" className="btn btn-ghost md:hidden">
@@ -58,17 +54,32 @@ export default function Header() {
<li><Link to="/about">About</Link></li>
</ul>
</div>
<Link to="/" className="grid grid-cols-1 items-start text-left gap-0 hover:scale-105 px-2">
<Link to="/" className="grid grid-cols-1 items-start text-left gap-0">
<div className="flex items-center justify-center">
<img src="/appicon.png" alt="Logo" className='w-13 h-13 rounded-lg mx-2' />
<div className="flex flex-col justify-center items-start">
<h1 className="text-xl font-bold">
<span className="text-emerald-500">Firefly </span>
<span className="bg-clip-text text-transparent bg-gradient-to-r from-emerald-400 via-orange-500 to-red-500">
<span className="text-emerald-500"
style={{
textShadow: '0 1px 2px rgba(255, 255, 255, 0.2)',
}}
>Firefly </span>
<span className="bg-clip-text text-transparent bg-gradient-to-r from-emerald-400 via-orange-500 to-red-500"
style={{
textShadow: '0 1px 2px rgba(255, 255, 255, 0.2)',
}}
>
Launcher
</span>
</h1>
<p className="text-sm text-gray-500">By Kain</p>
<p
className="text-white text-sm"
style={{
textShadow: '0 1px 2px rgba(0, 0, 0, 0.8)',
}}
>
By Kain
</p>
</div>
</div>
</Link>
@@ -135,14 +146,14 @@ export default function Header() {
<div className="flex items-center gap-2 bg-black/40 backdrop-blur-sm rounded-lg">
{controlButtons.map((btn, i) => (
<div key={i} className="tooltip tooltip-bottom" data-tip={btn.tip}>
<motion.button
whileHover={btn.hover}
transition={{ type: "spring"}}
<button
onClick={btn.action}
className="btn btn-ghost btn-circle bg-transparent border-none flex items-center justify-center"
>
{btn.icon}
</motion.button>
<div className="hover:text-cyan-300 transition-colors">
{btn.icon}
</div>
</button>
</div>
))}
</div>