Merge pull request #322 from kinode-dao/develop

frontend fixes: background images -> gradients; remove unused fonts
This commit is contained in:
doria 2024-05-02 01:51:04 +09:00 committed by GitHub
commit 5504f2a6c1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
24 changed files with 114 additions and 282 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

View File

@ -84,7 +84,9 @@ button[type="submit"],
} }
body { body {
@apply bg-[url('/main:app_store:sys/assets/background.jpg')] bg-cover bg-no-repeat bg-center bg-fixed text-white; @apply text-white;
background-color: #000000;
background-image: linear-gradient(-128deg, #860001a0 26%, transparent 70.05%), linear-gradient(-179deg, #e25f356b 22%, transparent 53.05%);
} }
input { input {

View File

@ -9,8 +9,8 @@
<meta httpEquiv="X-UA-Compatible" content="IE=edge" /> <meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" <meta name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" /> content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" />
<script type="module" crossorigin src="/assets/index-jKxRCta5.js"></script> <script type="module" crossorigin src="/assets/index-DLSZJDtk.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-BIXROKBk.css"> <link rel="stylesheet" crossorigin href="/assets/index-aLAWXUad.css">
</head> </head>
<body> <body>

File diff suppressed because one or more lines are too long

View File

@ -9,8 +9,8 @@
<meta httpEquiv="X-UA-Compatible" content="IE=edge" /> <meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" <meta name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" /> content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" />
<script type="module" crossorigin src="/assets/index-jKxRCta5.js"></script> <script type="module" crossorigin src="/assets/index-DLSZJDtk.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-BIXROKBk.css"> <link rel="stylesheet" crossorigin href="/assets/index-aLAWXUad.css">
</head> </head>
<body> <body>

View File

@ -1,5 +1,4 @@
import { useEffect, useState } from 'react' import { useEffect, useState } from 'react'
import BgOrangeBlack from './components/BgOrangeBlack'
import KinodeText from './components/KinodeText' import KinodeText from './components/KinodeText'
import KinodeBird from './components/KinodeBird' import KinodeBird from './components/KinodeBird'
import useHomepageStore from './store/homepageStore' import useHomepageStore from './store/homepageStore'
@ -27,11 +26,7 @@ function App() {
}, [our]) }, [our])
return ( return (
<div className="flex-col-center relative h-screen w-screen overflow-hidden"> <div className="flex-col-center relative h-screen w-screen overflow-hidden special-bg-homepage">
<div className='absolute w-full h-full top-0 bottom-0 left-0 right-0 -z-20'>
<BgOrangeBlack />
</div>
<div className='absolute w-full h-full top-0 bottom-0 left-0 right-0 -z-10 backdrop-blur-[128px]' />
<h5 className='absolute top-8 left-8'> <h5 className='absolute top-8 left-8'>
{isHosted && <a {isHosted && <a
href={`https://${our.replace('.os', '')}.hosting.kinode.net/`} href={`https://${our.replace('.os', '')}.hosting.kinode.net/`}

View File

@ -1,17 +0,0 @@
const BgOrangeBlack = () => <svg className='w-full h-full' width="1440" height="1024" viewBox="0 0 1440 1024" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2204.93 1854.1C2007.12 2361.86 1740.87 3004.89 1458.85 2895.03C683.547 2948.26 -70.0558 2061.27 516.949 1794.74C1103.95 1528.2 1687.89 575.296 2052.46 735.792C2443.3 907.858 2402.74 1346.34 2204.93 1854.1Z" fill="url(#paint0_radial_481_6378)" />
<path d="M356.686 2291.42C97.0266 2481.85 -419.874 2165.71 -613.499 1901.69C-807.123 1637.68 -853.603 1351.19 -593.943 1160.76C-334.284 970.328 582.306 1542.9 775.93 1806.92C969.555 2070.94 616.346 2100.99 356.686 2291.42Z" fill="url(#paint1_linear_481_6378)" />
<path d="M755.921 298.637C911.107 861.964 390.158 1408 0.0280762 1408C-390.102 1408 -706.365 975.022 -706.365 440.916C-706.365 -93.1895 -920.491 -648 -530.361 -648C-140.231 -648 755.921 -235.468 755.921 298.637Z" fill="#F75A29" fill-opacity="0.7" />
<defs>
<radialGradient id="paint0_radial_481_6378" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(1526 2391.65) rotate(-86.9561) scale(699.105 590.175)">
<stop offset="0.635" stop-color="#F35422" stop-opacity="0.7" />
<stop offset="1" stop-color="#E60D16" stop-opacity="0.35" />
</radialGradient>
<linearGradient id="paint1_linear_481_6378" x1="-307.52" y1="1523.67" x2="829.127" y2="1837.64" gradientUnits="userSpaceOnUse">
<stop stop-color="#F35422" />
<stop offset="1" stop-color="#E60D16" stop-opacity="0.1" />
</linearGradient>
</defs>
</svg>
export default BgOrangeBlack;

View File

@ -134,4 +134,14 @@ button:disabled {
.c { .c {
@apply place-items-center place-content-center; @apply place-items-center place-content-center;
}
.special-bg-homepage {
background-color: #000000;
background-image: radial-gradient(circle at -255% 50%, #e25f35b3 35%, transparent 86.05%), radial-gradient(circle at -7% -43%, #860001db 50%, transparent 87.05%);
}
.special-bg-loadingscreen {
background-color: #000000;
background-image: radial-gradient(circle at 50% 200%, #e25f35ff 37%, transparent 74.05%), linear-gradient(180deg, #22211fff 50%, transparent 150.05%);
} }

View File

@ -1,17 +1,13 @@
{ {
"files": { "files": {
"main.css": "/static/css/main.eb8419e6.css", "main.css": "/static/css/main.160abeec.css",
"main.js": "/static/js/main.94cc3f8a.js", "main.js": "/static/js/main.94cc3f8a.js",
"static/media/OpenSans-CondBold.ttf": "/static/media/OpenSans-CondBold.6293057f8484b6c0da03.ttf",
"static/media/BarlowCondensed-Black.ttf": "/static/media/BarlowCondensed-Black.3ba02bbdeb04e17f34bf.ttf",
"static/media/Futura-Heavy.ttf": "/static/media/Futura-Heavy.af72c25a6945b0f48abb.ttf",
"static/media/unknown.png": "/static/media/unknown.880d04d4611a45ab1001.png", "static/media/unknown.png": "/static/media/unknown.880d04d4611a45ab1001.png",
"static/media/background.jpg": "/static/media/background.01d2427cfc21fb685016.jpg",
"index.html": "/index.html", "index.html": "/index.html",
"static/media/kinode.svg": "/static/media/kinode.6b178bc9164b31d90099844a82d04497.svg" "static/media/kinode.svg": "/static/media/kinode.6b178bc9164b31d90099844a82d04497.svg"
}, },
"entrypoints": [ "entrypoints": [
"static/css/main.eb8419e6.css", "static/css/main.160abeec.css",
"static/js/main.94cc3f8a.js" "static/js/main.94cc3f8a.js"
] ]
} }

View File

@ -1 +1 @@
<!doctype html><html lang="en"><head><title>Welcome - Kinode</title><meta charset="utf-8"/><meta http-equiv="pragma" content="no-cache"/><meta http-equiv="cache-control" content="no-cache"/><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet"><link rel="icon" href="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzc5IiBoZWlnaHQ9IjUxNCIgdmlld0JveD0iMCAwIDc3OSA1MTQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8c3R5bGU+CiAgICAgICAgQG1lZGlhIChwcmVmZXJzLWNvbG9yLXNjaGVtZTogZGFyaykgewogICAgICAgICAgICBzdmcgeyBmaWxsOiB3aGl0ZTsgfQogICAgICAgIH0KICAgICAgICBAbWVkaWEgKHByZWZlcnMtY29sb3Itc2NoZW1lOiBsaWdodCkgewogICAgICAgICAgICBzdmcgeyBmaWxsOiBibGFjazsgfQogICAgICAgIH0KICAgIDwvc3R5bGU+CiAgICA8cGF0aCBkPSJNNzUzLjA5MiA1LjkxOTMyQzc1Ni41NTcgNS4wOTk3NiA3NTUuOTYyIC0wLjAwMDEyMjA3IDc1Mi40MDEgLTAuMDAwMTIyMDdINDI2LjAwMUM0MjQuNzU1IC0wLjAwMDEyMjA3IDQyMy42MzkgMC43NzAyNyA0MjMuMTk3IDEuOTM1MzVMMjM2Ljk2OCA0OTIuNkMyMzUuNzI5IDQ5NS44NjUgMjQwLjEyMyA0OTguMjU1IDI0Mi4xOTEgNDk1LjQ0MUw1NjkuMzU3IDUwLjExMzJDNTY5Ljc3OCA0OS41MzkyIDU3MC4zOTEgNDkuMTMzOSA1NzEuMDg0IDQ4Ljk3TDc1My4wOTIgNS45MTkzMloiLz4KICAgIDxwYXRoIGQ9Ik0xMS45NjY1IDQwLjIyODhDOS4xMDk0OSAzOC43NzcgMTAuMjEzNSAzNC40NTgzIDEzLjQxNjcgMzQuNTU1N0w0MDQuMjczIDQ2LjQzNjdDNDA2LjMzNCA0Ni40OTkzIDQwNy43MTkgNDguNTc0OSA0MDYuOTg2IDUwLjUwMjNMMzQ3LjQzOCAyMDYuOTgxQzM0Ni44MDQgMjA4LjY0NyAzNDQuODY1IDIwOS4zOTYgMzQzLjI3NSAyMDguNTg4TDExLjk2NjUgNDAuMjI4OFoiLz4KPC9zdmc+Cg=="><meta httpequiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1.00001,viewport-fit=cover"/><script defer="defer" src="/static/js/main.94cc3f8a.js"></script><link href="/static/css/main.eb8419e6.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html> <!doctype html><html lang="en"><head><title>Welcome - Kinode</title><meta charset="utf-8"/><meta http-equiv="pragma" content="no-cache"/><meta http-equiv="cache-control" content="no-cache"/><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet"><link rel="icon" href="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNzc5IiBoZWlnaHQ9IjUxNCIgdmlld0JveD0iMCAwIDc3OSA1MTQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8c3R5bGU+CiAgICAgICAgQG1lZGlhIChwcmVmZXJzLWNvbG9yLXNjaGVtZTogZGFyaykgewogICAgICAgICAgICBzdmcgeyBmaWxsOiB3aGl0ZTsgfQogICAgICAgIH0KICAgICAgICBAbWVkaWEgKHByZWZlcnMtY29sb3Itc2NoZW1lOiBsaWdodCkgewogICAgICAgICAgICBzdmcgeyBmaWxsOiBibGFjazsgfQogICAgICAgIH0KICAgIDwvc3R5bGU+CiAgICA8cGF0aCBkPSJNNzUzLjA5MiA1LjkxOTMyQzc1Ni41NTcgNS4wOTk3NiA3NTUuOTYyIC0wLjAwMDEyMjA3IDc1Mi40MDEgLTAuMDAwMTIyMDdINDI2LjAwMUM0MjQuNzU1IC0wLjAwMDEyMjA3IDQyMy42MzkgMC43NzAyNyA0MjMuMTk3IDEuOTM1MzVMMjM2Ljk2OCA0OTIuNkMyMzUuNzI5IDQ5NS44NjUgMjQwLjEyMyA0OTguMjU1IDI0Mi4xOTEgNDk1LjQ0MUw1NjkuMzU3IDUwLjExMzJDNTY5Ljc3OCA0OS41MzkyIDU3MC4zOTEgNDkuMTMzOSA1NzEuMDg0IDQ4Ljk3TDc1My4wOTIgNS45MTkzMloiLz4KICAgIDxwYXRoIGQ9Ik0xMS45NjY1IDQwLjIyODhDOS4xMDk0OSAzOC43NzcgMTAuMjEzNSAzNC40NTgzIDEzLjQxNjcgMzQuNTU1N0w0MDQuMjczIDQ2LjQzNjdDNDA2LjMzNCA0Ni40OTkzIDQwNy43MTkgNDguNTc0OSA0MDYuOTg2IDUwLjUwMjNMMzQ3LjQzOCAyMDYuOTgxQzM0Ni44MDQgMjA4LjY0NyAzNDQuODY1IDIwOS4zOTYgMzQzLjI3NSAyMDguNTg4TDExLjk2NjUgNDAuMjI4OFoiLz4KPC9zdmc+Cg=="><meta httpequiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1.00001,viewport-fit=cover"/><script defer="defer" src="/static/js/main.94cc3f8a.js"></script><link href="/static/css/main.160abeec.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,143 +0,0 @@
/*!
Copyright (c) 2018 Jed Watson.
Licensed under the MIT License (MIT), see
http://jedwatson.github.io/classnames
*/
/*!
Copyright (c) 2015 Jed Watson.
Based on code that is Copyright 2013-2015, Facebook, Inc.
All rights reserved.
*/
/*!
* Adapted from jQuery UI core
*
* http://jqueryui.com
*
* Copyright 2014 jQuery Foundation and other contributors
* Released under the MIT license.
* http://jquery.org/license
*
* http://api.jqueryui.com/category/ui-core/
*/
/*!
* The buffer module from node.js, for the browser.
*
* @author Feross Aboukhadijeh <https://feross.org>
* @license MIT
*/
/*! ieee754. BSD-3-Clause License. Feross Aboukhadijeh <https://feross.org/opensource> */
/**
* @license React
* react-dom.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* @license React
* react-jsx-runtime.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* @license React
* react.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* @license React
* scheduler.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* @license React
* use-sync-external-store-shim.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* @license React
* use-sync-external-store-shim/with-selector.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* @remix-run/router v1.15.3
*
* Copyright (c) Remix Software Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE.md file in the root directory of this source tree.
*
* @license MIT
*/
/**
* React Router DOM v6.22.3
*
* Copyright (c) Remix Software Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE.md file in the root directory of this source tree.
*
* @license MIT
*/
/**
* React Router v6.22.3
*
* Copyright (c) Remix Software Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE.md file in the root directory of this source tree.
*
* @license MIT
*/
/**
* [js-sha3]{@link https://github.com/emn178/js-sha3}
*
* @version 0.5.7
* @author Chen, Yi-Cyuan [emn178@gmail.com]
* @copyright Chen, Yi-Cyuan 2015-2016
* @license MIT
*/
/**
* [js-sha3]{@link https://github.com/emn178/js-sha3}
*
* @version 0.8.0
* @author Chen, Yi-Cyuan [emn178@gmail.com]
* @copyright Chen, Yi-Cyuan 2015-2018
* @license MIT
*/

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

View File

@ -40,7 +40,7 @@
}, },
"scripts": { "scripts": {
"start": "react-scripts start", "start": "react-scripts start",
"build": "npm run tc && GENERATE_SOURCEMAP=false react-scripts build", "build": "npx tailwindcss -i ./src/input.css -o ./src/index.css && npm run tc && GENERATE_SOURCEMAP=false react-scripts build",
"build:copy": "npm run build", "build:copy": "npm run build",
"inline": "node ./add-inline-tags.js && cd build && inline-source ./index.html > ./inline-index.html && cd ..", "inline": "node ./add-inline-tags.js && cd build && inline-source ./index.html > ./inline-index.html && cd ..",
"build-inline": "npm run build && npm run inline", "build-inline": "npm run build && npm run inline",

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

File diff suppressed because one or more lines are too long

View File

@ -89,7 +89,9 @@
} }
body { body {
@apply bg-[url('./assets/background.jpg')] bg-cover bg-no-repeat bg-center bg-fixed text-white; @apply text-white;
background-color: #000000;
background-image: linear-gradient(-128deg, #860001a0 26%, transparent 70.05%), linear-gradient(-179deg, #e25f356b 22%, transparent 53.05%);
} }
input { input {