arkorty/DownLink
1
0
Fork 0
mirror of https://github.com/arkorty/DownLink.git synced 2026-03-17 16:51:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

Chore: Update UI to better fit bigger screen sizes

Browse Source
This commit is contained in:
Arkaprabha Chakraborty
2024-08-15 02:13:46 +05:30
parent 738d7528b7
commit 796526ef06
3 changed files with 10 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
frontend/bun.lockb
View File

Binary file not shown.

6
frontend/src/components/DownloadForm.js
View File

@@ -93,7 +93,7 @@ const DownloadForm = () => {
}, [showConfetti]); }, [showConfetti]);
return ( return (
<div className="p-4 relative"> <div className="md: p-4 mt-12 relative">
<form onSubmit={handleDownload} className="space-y-4"> <form onSubmit={handleDownload} className="space-y-4">
<div className="flex gap-2"> <div className="flex gap-2">
<div className="flex-grow"> <div className="flex-grow">
@@ -165,9 +165,9 @@ const DownloadForm = () => {
{!isDownloading && !message.startsWith("Downloading") && ( {!isDownloading && !message.startsWith("Downloading") && (
<button <button
type="submit" type="submit"
className="relative inline-flex items-center px-10 py-6 text-2xl font-bold rounded-2xl text-black bg-white bg-opacity-60 hover:shadow-lg focus:outline-none transition-all duration-300" className="relative inline-flex items-center px-10 py-6 text-2xl font-bold rounded-2xl text-white bg-black bg-opacity-60 border border-white hover:shadow-lg focus:outline-none transition-all duration-300"
> >
<span className="absolute inset-0 bg-black opacity-0 transition-opacity duration-300 ease-in-out active:opacity-40 rounded-xl"></span> <span className="absolute inset-0 bg-black opacity-0 transition-opacity duration-300 ease-in-out active:opacity-40 rounded-2xl"></span>
Download Download
</button> </button>
)} )}

14
frontend/src/components/Home.js
View File

@@ -6,21 +6,21 @@ import { TypeAnimation } from "react-type-animation";
const Home = () => { const Home = () => {
return ( return (
<div className="relative z-10 pt-20"> <div className="relative z-10 sm: pt-32 md: pt-64 lg:pt-96">
<div className="max-w-4xl mx-auto text-center"> <div className="max-w-4xl mx-auto text-center">
<h1 className="text-white mb-4 text-4xl sm:text-5xl lg:text-6xl xl:text-8xl font-extrabold"> <h1 className="text-white mb-4 text-4xl sm:text-5xl lg:text-6xl font-extrabold">
<TypeAnimation <TypeAnimation
sequence={[ sequence={[
"From YouTube!", "From YouTube!",
1000, 800,
"And Instagram!", "And Instagram!",
1000, 800,
"Download Now!", "Download Now!",
1000, 800,
"HD Quality!", "HD Quality!",
1000, 800,
"DownLink!", "DownLink!",
1000, 800,
]} ]}
wrapper="span" wrapper="span"
speed={30} speed={30}