Cool_Tools/upscayl
1
0
Fork 0
mirror of https://github.com/upscayl/upscayl.git synced 2024-12-18 02:16:01 +01:00
Code Releases Wiki Activity

Updated UI

Browse Source
This commit is contained in:
Feenix 2022-08-15 12:51:12 +05:30
parent 5941ed6a84
commit 292442c36f
2 changed files with 32 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
main/index.js
View File

@ -38,7 +38,7 @@ app.on("ready", async () => {
// Quit the app once all windows are closed
app.on("window-all-closed", app.quit);
// listen the channel `message` and resend the received message to the renderer process
// ! DONT FORGET TO RESTART THE APP WHEN YOU CHANGE CODE HERE
ipcMain.on("sendMessage", (_, message) => {
console.log(message);
});

34
renderer/pages/index.jsx
View File

@ -6,9 +6,37 @@ const Home = () => {
window.electron.send("sendMessage", { message: "Hello!" });
}, []);
return (
<div className="h-screen w-screen bg-neutral-900">
<div>
<input />
<div className="flex h-screen w-screen flex-row bg-neutral-900">
<div className="flex h-screen w-96 flex-col bg-neutral-800 p-5">
<h1 className="text-3xl font-bold text-neutral-50">Upscayl</h1>
<div className="mt-10">
<p className="mb-2 font-medium text-neutral-100">Step 1</p>
<button className="rounded-lg bg-sky-400 p-3">Select Image</button>
</div>
<div className="mt-10">
<p className="mb-2 font-medium text-neutral-100">Step 2</p>
<p className="mb-1 text-neutral-300">Select Scale Factor:</p>
<div className="flex flex-row gap-2">
<button className="rounded-lg bg-red-400 p-3">2x</button>
<button className="rounded-lg bg-red-400 p-3">4x</button>
<button className="rounded-lg bg-red-400 p-3">6x</button>
</div>
</div>
<div className="mt-10">
<p className="mb-2 font-medium text-neutral-100">Step 3</p>
<button className="rounded-lg bg-violet-400 p-3">
Set Output Folder
</button>
</div>
<div className="mt-10">
<p className="mb-2 font-medium text-neutral-100">Step 4</p>
<button className="rounded-lg bg-green-400 p-3">Upscayl</button>
</div>
</div>
<div className="flex h-screen w-full flex-col items-center justify-center p-5">
<p className="text-lg font-medium text-neutral-400">
Select an Image to Upscale
</p>
</div>
</div>
);