1
0
mirror of https://github.com/upscayl/upscayl.git synced 2024-11-27 17:00:52 +01:00

Update logo to svg

This commit is contained in:
Nayam Amarshe 2024-04-24 16:35:39 +05:30
parent 662a09f04f
commit 49bcbcbb6a
3 changed files with 223 additions and 2 deletions

View File

@ -0,0 +1,171 @@
import React from "react";
const Logo = ({ ...rest }) => {
return (
<svg
width="256"
height="256"
viewBox="0 0 256 256"
fill="none"
xmlns="http://www.w3.org/2000/svg"
{...rest}
>
<g clipPath="url(#clip0_1263_67)">
<path
d="M198.54 256H57.46C42.2425 256 27.6185 249.948 16.8475 239.177C6.077 228.407 0 213.782 0 198.54V57.46C0 42.2425 6.077 27.618 16.8475 16.8475C27.6185 6.077 42.2425 0.0245 57.46 0L198.54 0.024498C213.782 0.024498 228.407 6.077 239.177 16.8475C249.948 27.618 256 42.2425 256 57.46V198.54C256 213.782 249.948 228.407 239.177 239.177C228.407 249.948 213.782 256 198.54 256Z"
fill="#304059"
/>
<mask
id="mask0_1263_67"
style={{
maskType: "luminance",
}}
maskUnits="userSpaceOnUse"
x="0"
y="0"
width="256"
height="256"
>
<path
d="M198.54 256H57.46C42.2425 256 27.6185 249.948 16.8475 239.177C6.077 228.407 0 213.782 0 198.54V57.46C0 42.2425 6.077 27.618 16.8475 16.8475C27.6185 6.077 42.2425 0.0245 57.46 0L198.54 0.024498C213.782 0.024498 228.407 6.077 239.177 16.8475C249.948 27.618 256 42.2425 256 57.46V198.54C256 213.782 249.948 228.407 239.177 239.177C228.407 249.948 213.782 256 198.54 256Z"
fill="white"
/>
</mask>
<g mask="url(#mask0_1263_67)">
<path
d="M198.542 243.642H57.4579C32.5664 243.642 12.3579 223.434 12.3579 198.542V57.4582C12.3579 32.5667 32.5664 12.3582 57.4579 12.3582H198.542C223.433 12.3582 243.642 32.5667 243.642 57.4582V198.542C243.642 223.434 223.433 243.642 198.542 243.642Z"
fill="#304059"
/>
<mask
id="mask1_1263_67"
style={{
maskType: "luminance",
}}
maskUnits="userSpaceOnUse"
x="12"
y="12"
width="232"
height="232"
>
<path
d="M198.542 243.642H57.4579C32.5664 243.642 12.3579 223.434 12.3579 198.542V57.4582C12.3579 32.5667 32.5664 12.3582 57.4579 12.3582H198.542C223.433 12.3582 243.642 32.5667 243.642 57.4582V198.542C243.642 223.434 223.433 243.642 198.542 243.642Z"
fill="white"
/>
</mask>
<g mask="url(#mask1_1263_67)">
<path
d="M127.992 50.9193H89.447V12.3743H127.992V50.9193Z"
fill="#4791CE"
/>
<path
d="M127.992 89.4637H89.447V50.9192H127.992V89.4637Z"
fill="#87BDFF"
/>
<path
d="M127.992 128.008H89.447V89.4636H127.992V128.008Z"
fill="#4791CE"
/>
<path
d="M127.992 166.553H89.447V128.008H127.992V166.553Z"
fill="#87BDFF"
/>
<path
d="M127.992 205.098H89.447V166.553H127.992V205.098Z"
fill="#4791CE"
/>
<path
d="M127.992 243.642H89.447V205.098H127.992V243.642Z"
fill="#87BDFF"
/>
<path
d="M89.4469 50.9193H50.9023V12.3743H89.4469V50.9193Z"
fill="#87BDFF"
/>
<path
d="M89.4469 89.4637H50.9023V50.9192H89.4469V89.4637Z"
fill="#4791CE"
/>
<path
d="M89.4469 128.008H50.9023V89.4636H89.4469V128.008Z"
fill="#87BDFF"
/>
<path
d="M89.4469 166.553H50.9023V128.008H89.4469V166.553Z"
fill="#4791CE"
/>
<path
d="M89.4469 205.098H50.9023V166.553H89.4469V205.098Z"
fill="#87BDFF"
/>
<path
d="M89.4469 243.642H50.9023V205.098H89.4469V243.642Z"
fill="#4791CE"
/>
<path
d="M50.9024 50.92H12.3579V12.375H50.9024V50.92Z"
fill="#4791CE"
/>
<path
d="M50.9024 89.4637H12.3579V50.9192H50.9024V89.4637Z"
fill="#87BDFF"
/>
<path
d="M50.9024 128.008H12.3579V89.4636H50.9024V128.008Z"
fill="#4791CE"
/>
<path
d="M50.9024 166.553H12.3579V128.008H50.9024V166.553Z"
fill="#87BDFF"
/>
<path
d="M50.9024 205.098H12.3579V166.553H50.9024V205.098Z"
fill="#4791CE"
/>
<path
d="M50.9024 243.642H12.3579V205.098H50.9024V243.642Z"
fill="#87BDFF"
/>
<path
d="M243.642 243.659H128V12.3743H243.642V243.659Z"
fill="url(#paint0_linear_1263_67)"
/>
<path
d="M156.701 128C156.701 143.845 143.837 156.71 127.992 156.71C112.146 156.71 99.2825 143.845 99.2825 128C99.2825 112.155 112.146 99.2908 127.992 99.2908C143.837 99.2908 156.701 112.155 156.701 128Z"
fill="#304059"
/>
<path
d="M148.396 128L142.135 123.754L135.874 119.509V128V136.492L142.135 132.246L148.396 128Z"
fill="#87BDFF"
/>
<path
d="M107.588 128L113.857 123.754L120.126 119.509V128V136.492L113.857 132.246L107.588 128Z"
fill="#87BDFF"
/>
</g>
<path
d="M134.182 247.202H121.818V8.79858H134.182V247.202Z"
fill="#304059"
/>
</g>
</g>
<defs>
<linearGradient
id="paint0_linear_1263_67"
x1="184.354"
y1="20.4191"
x2="176.727"
y2="245.417"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#87BDFF" />
<stop offset="0.970833" stop-color="#4791CE" />
</linearGradient>
<clipPath id="clip0_1263_67">
<rect width="256" height="256" fill="white" />
</clipPath>
</defs>
</svg>
);
};
export default Logo;

View File

@ -1,5 +1,6 @@
import React, { useEffect } from "react";
import Spinner from "../../icons/Spinner";
import Logo from "@/components/icons/Logo";
function ProgressBar({
progress,
@ -25,11 +26,12 @@ function ProgressBar({
return (
<div className="absolute z-50 flex h-full w-full flex-col items-center justify-center bg-base-300/50 backdrop-blur-lg">
<div className="flex flex-col items-center rounded-btn bg-base-100/50 p-4 backdrop-blur-lg">
<img
{/* <img
src="icon.png"
alt="Upscayl Icon"
className="spinner mb-4 h-12 w-12"
/>
/> */}
<Logo className="spinner mb-4 h-12 w-12" />
<p className="rounded-full px-2 pb-2 font-bold">
{batchMode && "Batch Upscale In Progress: " + batchProgress}

48
renderer/public/logo.svg Normal file
View File

@ -0,0 +1,48 @@
<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1263_67)">
<path d="M198.54 256H57.46C42.2425 256 27.6185 249.948 16.8475 239.177C6.077 228.407 0 213.782 0 198.54V57.46C0 42.2425 6.077 27.618 16.8475 16.8475C27.6185 6.077 42.2425 0.0245 57.46 0L198.54 0.024498C213.782 0.024498 228.407 6.077 239.177 16.8475C249.948 27.618 256 42.2425 256 57.46V198.54C256 213.782 249.948 228.407 239.177 239.177C228.407 249.948 213.782 256 198.54 256Z" fill="#304059"/>
<mask id="mask0_1263_67" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="256" height="256">
<path d="M198.54 256H57.46C42.2425 256 27.6185 249.948 16.8475 239.177C6.077 228.407 0 213.782 0 198.54V57.46C0 42.2425 6.077 27.618 16.8475 16.8475C27.6185 6.077 42.2425 0.0245 57.46 0L198.54 0.024498C213.782 0.024498 228.407 6.077 239.177 16.8475C249.948 27.618 256 42.2425 256 57.46V198.54C256 213.782 249.948 228.407 239.177 239.177C228.407 249.948 213.782 256 198.54 256Z" fill="white"/>
</mask>
<g mask="url(#mask0_1263_67)">
<path d="M198.542 243.642H57.4579C32.5664 243.642 12.3579 223.434 12.3579 198.542V57.4582C12.3579 32.5667 32.5664 12.3582 57.4579 12.3582H198.542C223.433 12.3582 243.642 32.5667 243.642 57.4582V198.542C243.642 223.434 223.433 243.642 198.542 243.642Z" fill="#304059"/>
<mask id="mask1_1263_67" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="12" y="12" width="232" height="232">
<path d="M198.542 243.642H57.4579C32.5664 243.642 12.3579 223.434 12.3579 198.542V57.4582C12.3579 32.5667 32.5664 12.3582 57.4579 12.3582H198.542C223.433 12.3582 243.642 32.5667 243.642 57.4582V198.542C243.642 223.434 223.433 243.642 198.542 243.642Z" fill="white"/>
</mask>
<g mask="url(#mask1_1263_67)">
<path d="M127.992 50.9193H89.447V12.3743H127.992V50.9193Z" fill="#4791CE"/>
<path d="M127.992 89.4637H89.447V50.9192H127.992V89.4637Z" fill="#87BDFF"/>
<path d="M127.992 128.008H89.447V89.4636H127.992V128.008Z" fill="#4791CE"/>
<path d="M127.992 166.553H89.447V128.008H127.992V166.553Z" fill="#87BDFF"/>
<path d="M127.992 205.098H89.447V166.553H127.992V205.098Z" fill="#4791CE"/>
<path d="M127.992 243.642H89.447V205.098H127.992V243.642Z" fill="#87BDFF"/>
<path d="M89.4469 50.9193H50.9023V12.3743H89.4469V50.9193Z" fill="#87BDFF"/>
<path d="M89.4469 89.4637H50.9023V50.9192H89.4469V89.4637Z" fill="#4791CE"/>
<path d="M89.4469 128.008H50.9023V89.4636H89.4469V128.008Z" fill="#87BDFF"/>
<path d="M89.4469 166.553H50.9023V128.008H89.4469V166.553Z" fill="#4791CE"/>
<path d="M89.4469 205.098H50.9023V166.553H89.4469V205.098Z" fill="#87BDFF"/>
<path d="M89.4469 243.642H50.9023V205.098H89.4469V243.642Z" fill="#4791CE"/>
<path d="M50.9024 50.92H12.3579V12.375H50.9024V50.92Z" fill="#4791CE"/>
<path d="M50.9024 89.4637H12.3579V50.9192H50.9024V89.4637Z" fill="#87BDFF"/>
<path d="M50.9024 128.008H12.3579V89.4636H50.9024V128.008Z" fill="#4791CE"/>
<path d="M50.9024 166.553H12.3579V128.008H50.9024V166.553Z" fill="#87BDFF"/>
<path d="M50.9024 205.098H12.3579V166.553H50.9024V205.098Z" fill="#4791CE"/>
<path d="M50.9024 243.642H12.3579V205.098H50.9024V243.642Z" fill="#87BDFF"/>
<path d="M243.642 243.659H128V12.3743H243.642V243.659Z" fill="url(#paint0_linear_1263_67)"/>
<path d="M156.701 128C156.701 143.845 143.837 156.71 127.992 156.71C112.146 156.71 99.2825 143.845 99.2825 128C99.2825 112.155 112.146 99.2908 127.992 99.2908C143.837 99.2908 156.701 112.155 156.701 128Z" fill="#304059"/>
<path d="M148.396 128L142.135 123.754L135.874 119.509V128V136.492L142.135 132.246L148.396 128Z" fill="#87BDFF"/>
<path d="M107.588 128L113.857 123.754L120.126 119.509V128V136.492L113.857 132.246L107.588 128Z" fill="#87BDFF"/>
</g>
<path d="M134.182 247.202H121.818V8.79858H134.182V247.202Z" fill="#304059"/>
</g>
</g>
<defs>
<linearGradient id="paint0_linear_1263_67" x1="184.354" y1="20.4191" x2="176.727" y2="245.417" gradientUnits="userSpaceOnUse">
<stop stop-color="#87BDFF"/>
<stop offset="0.970833" stop-color="#4791CE"/>
</linearGradient>
<clipPath id="clip0_1263_67">
<rect width="256" height="256" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 4.0 KiB