Big update
This commit is contained in:
parent
ca147cdbf8
commit
ca15fd2cf8
48
package-lock.json
generated
48
package-lock.json
generated
|
|
@ -17,7 +17,8 @@
|
|||
"web-vitals": "^2.1.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"tailwindcss": "^3.4.1"
|
||||
"tailwindcss": "^3.4.1",
|
||||
"tailwindcss-image-rendering": "^1.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/@aashutoshrathi/word-wrap": {
|
||||
|
|
@ -8411,6 +8412,18 @@
|
|||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/flat": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/flat/-/flat-4.1.1.tgz",
|
||||
"integrity": "sha512-FmTtBsHskrU6FJ2VxCnsDb84wu9zhmO3cUX2kGFb5tuwhfXxGciiT0oRY+cck35QmG+NmGh5eLz6lLCpWTqwpA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"is-buffer": "~2.0.3"
|
||||
},
|
||||
"bin": {
|
||||
"flat": "cli.js"
|
||||
}
|
||||
},
|
||||
"node_modules/flat-cache": {
|
||||
"version": "3.2.0",
|
||||
"resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.2.0.tgz",
|
||||
|
|
@ -9536,6 +9549,29 @@
|
|||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/is-buffer": {
|
||||
"version": "2.0.5",
|
||||
"resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.5.tgz",
|
||||
"integrity": "sha512-i2R6zNFDwgEHJyQUtJEk0XFi1i0dPFn/oqjK3/vPCcDeJvW5NQ83V8QbicfF1SupOaB0h8ntgBC2YiE7dfyctQ==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/feross"
|
||||
},
|
||||
{
|
||||
"type": "patreon",
|
||||
"url": "https://www.patreon.com/feross"
|
||||
},
|
||||
{
|
||||
"type": "consulting",
|
||||
"url": "https://feross.org/support"
|
||||
}
|
||||
],
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/is-callable": {
|
||||
"version": "1.2.7",
|
||||
"resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.2.7.tgz",
|
||||
|
|
@ -16554,6 +16590,16 @@
|
|||
"node": ">=14.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/tailwindcss-image-rendering": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/tailwindcss-image-rendering/-/tailwindcss-image-rendering-1.0.2.tgz",
|
||||
"integrity": "sha512-WC3hJd2RbHBYIqtJxwpQ5z94wUNyBrJn1eFz3J/jR7OGrQB8WYbJGvJQ9scNNVzoHEYGoNdZbUI90l9YgpBCwg==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"flat": "^4.1.0",
|
||||
"lodash": "^4.17.11"
|
||||
}
|
||||
},
|
||||
"node_modules/tapable": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz",
|
||||
|
|
|
|||
|
|
@ -36,6 +36,7 @@
|
|||
]
|
||||
},
|
||||
"devDependencies": {
|
||||
"tailwindcss": "^3.4.1"
|
||||
"tailwindcss": "^3.4.1",
|
||||
"tailwindcss-image-rendering": "^1.0.2"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
12
public/Gitea_Logo.svg
Normal file
12
public/Gitea_Logo.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg version="1.1" id="main_outline" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 640 640" style="enable-background:new 0 0 640 640;" xml:space="preserve">
|
||||
<g>
|
||||
<path id="teabag" style="fill:#FFFFFF" d="M395.9,484.2l-126.9-61c-12.5-6-17.9-21.2-11.8-33.8l61-126.9c6-12.5,21.2-17.9,33.8-11.8 c17.2,8.3,27.1,13,27.1,13l-0.1-109.2l16.7-0.1l0.1,117.1c0,0,57.4,24.2,83.1,40.1c3.7,2.3,10.2,6.8,12.9,14.4 c2.1,6.1,2,13.1-1,19.3l-61,126.9C423.6,484.9,408.4,490.3,395.9,484.2z"/>
|
||||
<g>
|
||||
<g>
|
||||
<path style="fill:#609926" d="M622.7,149.8c-4.1-4.1-9.6-4-9.6-4s-117.2,6.6-177.9,8c-13.3,0.3-26.5,0.6-39.6,0.7c0,39.1,0,78.2,0,117.2 c-5.5-2.6-11.1-5.3-16.6-7.9c0-36.4-0.1-109.2-0.1-109.2c-29,0.4-89.2-2.2-89.2-2.2s-141.4-7.1-156.8-8.5 c-9.8-0.6-22.5-2.1-39,1.5c-8.7,1.8-33.5,7.4-53.8,26.9C-4.9,212.4,6.6,276.2,8,285.8c1.7,11.7,6.9,44.2,31.7,72.5 c45.8,56.1,144.4,54.8,144.4,54.8s12.1,28.9,30.6,55.5c25,33.1,50.7,58.9,75.7,62c63,0,188.9-0.1,188.9-0.1s12,0.1,28.3-10.3 c14-8.5,26.5-23.4,26.5-23.4s12.9-13.8,30.9-45.3c5.5-9.7,10.1-19.1,14.1-28c0,0,55.2-117.1,55.2-231.1 C633.2,157.9,624.7,151.8,622.7,149.8z M125.6,353.9c-25.9-8.5-36.9-18.7-36.9-18.7S69.6,321.8,60,295.4 c-16.5-44.2-1.4-71.2-1.4-71.2s8.4-22.5,38.5-30c13.8-3.7,31-3.1,31-3.1s7.1,59.4,15.7,94.2c7.2,29.2,24.8,77.7,24.8,77.7 S142.5,359.9,125.6,353.9z M425.9,461.5c0,0-6.1,14.5-19.6,15.4c-5.8,0.4-10.3-1.2-10.3-1.2s-0.3-0.1-5.3-2.1l-112.9-55 c0,0-10.9-5.7-12.8-15.6c-2.2-8.1,2.7-18.1,2.7-18.1L322,273c0,0,4.8-9.7,12.2-13c0.6-0.3,2.3-1,4.5-1.5c8.1-2.1,18,2.8,18,2.8 l110.7,53.7c0,0,12.6,5.7,15.3,16.2c1.9,7.4-0.5,14-1.8,17.2C474.6,363.8,425.9,461.5,425.9,461.5z"/>
|
||||
<path style="fill:#609926" d="M326.8,380.1c-8.2,0.1-15.4,5.8-17.3,13.8c-1.9,8,2,16.3,9.1,20c7.7,4,17.5,1.8,22.7-5.4 c5.1-7.1,4.3-16.9-1.8-23.1l24-49.1c1.5,0.1,3.7,0.2,6.2-0.5c4.1-0.9,7.1-3.6,7.1-3.6c4.2,1.8,8.6,3.8,13.2,6.1 c4.8,2.4,9.3,4.9,13.4,7.3c0.9,0.5,1.8,1.1,2.8,1.9c1.6,1.3,3.4,3.1,4.7,5.5c1.9,5.5-1.9,14.9-1.9,14.9 c-2.3,7.6-18.4,40.6-18.4,40.6c-8.1-0.2-15.3,5-17.7,12.5c-2.6,8.1,1.1,17.3,8.9,21.3c7.8,4,17.4,1.7,22.5-5.3 c5-6.8,4.6-16.3-1.1-22.6c1.9-3.7,3.7-7.4,5.6-11.3c5-10.4,13.5-30.4,13.5-30.4c0.9-1.7,5.7-10.3,2.7-21.3 c-2.5-11.4-12.6-16.7-12.6-16.7c-12.2-7.9-29.2-15.2-29.2-15.2s0-4.1-1.1-7.1c-1.1-3.1-2.8-5.1-3.9-6.3c4.7-9.7,9.4-19.3,14.1-29 c-4.1-2-8.1-4-12.2-6.1c-4.8,9.8-9.7,19.7-14.5,29.5c-6.7-0.1-12.9,3.5-16.1,9.4c-3.4,6.3-2.7,14.1,1.9,19.8 C343.2,346.5,335,363.3,326.8,380.1z"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.5 KiB |
3
public/Nextcloud_Logo.svg
Normal file
3
public/Nextcloud_Logo.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 10 KiB |
BIN
public/bunnie96px.png
Normal file
BIN
public/bunnie96px.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 929 B |
5127
public/bunnie96px.svg
Normal file
5127
public/bunnie96px.svg
Normal file
File diff suppressed because it is too large
Load diff
|
After Width: | Height: | Size: 295 KiB |
71
src/App.css
71
src/App.css
|
|
@ -1,7 +1,6 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
@tailwind variants;
|
||||
@import 'tailwindcss/base';
|
||||
@import 'tailwindcss/components';
|
||||
@import 'tailwindcss/utilities';
|
||||
|
||||
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
|
|
@ -10,23 +9,61 @@
|
|||
}
|
||||
}
|
||||
|
||||
.H1Welcome {
|
||||
//animation: Welcome-spin 1ms infinite ease-in-out;
|
||||
|
||||
.WelcomeText {
|
||||
animation: Welcome-spin 10s infinite ease-in-out alternate;
|
||||
}
|
||||
|
||||
.App-header {
|
||||
background-color: #282c34;
|
||||
min-height: 100vh;
|
||||
.BunnyLogo,
|
||||
.GiteaLogo,
|
||||
.NextcloudLogo {
|
||||
user-select: none;
|
||||
object-position: center;
|
||||
}
|
||||
|
||||
.LogoBoxes {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: calc(10px + 2vmin);
|
||||
color: white;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.App-link {
|
||||
color: #61dafb;
|
||||
.LogoBoxes {
|
||||
transition: transform 0.25s ease;
|
||||
}
|
||||
|
||||
.LogoBoxes:hover {
|
||||
transform: scale(1.1) rotate(360deg);
|
||||
animation: LogoHoverAnim 1s ease-in-out;
|
||||
}
|
||||
|
||||
@keyframes LogoHoverAnim {
|
||||
from {
|
||||
transform: rotate(0deg) scale(1);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg) scale(1.1);
|
||||
}
|
||||
}
|
||||
|
||||
.MainBG {
|
||||
background: linear-gradient(
|
||||
360deg,
|
||||
#69233b,
|
||||
#473b21,
|
||||
#520a22,
|
||||
#3f2749
|
||||
);
|
||||
background-size: 600% 600%;
|
||||
animation: Gradient 120s ease infinite;
|
||||
animation: Gradient 120s ease infinite;
|
||||
}
|
||||
|
||||
@keyframes Gradient {
|
||||
0% {background-position: 0% 50%;}
|
||||
50% {background-position: 100% 50%;}
|
||||
100% {background-position: 0% 50%;}
|
||||
}
|
||||
|
||||
@keyframes DarkModeButton-spin {
|
||||
|
|
@ -40,9 +77,9 @@
|
|||
|
||||
@keyframes Welcome-spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
transform: rotate(-2deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
transform: rotate(2deg);
|
||||
}
|
||||
}
|
||||
|
|
@ -3,7 +3,7 @@ import './App.css';
|
|||
|
||||
import TopBar from './TopBar';
|
||||
import BottomBar from './BottomBar';
|
||||
import SideBar from './SideBar';
|
||||
//import SideBar from './SideBar';
|
||||
|
||||
import Home from './Home';
|
||||
|
||||
|
|
|
|||
21
src/Home.js
21
src/Home.js
|
|
@ -1,11 +1,22 @@
|
|||
const Home = () => {
|
||||
return (
|
||||
<div className="flex bg-black text-secondary top-14 bottom-8 w-screen h-screen">
|
||||
<div className="flex items-center justify-center text-4xl mx-auto">
|
||||
<h1 className="H1Welcome">Welcome fellow traveller!</h1>
|
||||
return (
|
||||
<div className="flex w-auto h-auto overflow-hidden MainBG">
|
||||
<div className="flex flex-col items-center justify-center text-secondary top-14 bottom-8 w-screen h-screen overflow-scroll">
|
||||
<p className="text-4xl mb-16 shadow-2xl WelcomeText">Welcome fellow traveller!</p>
|
||||
<div className="flex justify-center align-middle">
|
||||
|
||||
<a href="https://librebun.ooguy.com/nc/" className="bg-white shadow-md outline outline-secondary rounded-2xl p-1 mx-2 LogoBoxes">
|
||||
<img className="NextcloudLogo" draggable="false" src={process.env.PUBLIC_URL + "/Nextcloud_Logo.svg"} alt="Nextcloud"></img>
|
||||
</a>
|
||||
|
||||
<a href="https://librebun.ooguy.com/gt/" className="bg-white shadow-md outline outline-secondary rounded-2xl p-1 mx-2 LogoBoxes">
|
||||
<img className="mx-0 GiteaLogo" draggable="false" src={process.env.PUBLIC_URL + "/Gitea_Logo.svg"} alt="Gitea"></img>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
};
|
||||
|
||||
export default Home;
|
||||
|
|
@ -1,11 +1,13 @@
|
|||
const TopBar = () => {
|
||||
return (
|
||||
<div className="fixed top-0 left-0 h-14 w-screen flex flex-row bg-primary text-secondary
|
||||
shadow-sm justify-center items-center space-x-2">
|
||||
shadow-md justify-center items-center space-x-2">
|
||||
<div className="topbar-clickables">
|
||||
<div className="center left-0 flex justify-center items-center">
|
||||
<div className="fixed left-0 ml-6">
|
||||
<img src={process.env.PUBLIC_URL + "/bunnie48px.png"} alt="Bunnie"/>
|
||||
<div className="center left-0 flex justify-center items-center overflow-visible">
|
||||
<div className="BunnyLogo">
|
||||
<div className="fixed top-1 left-0 ml-6">
|
||||
<img draggable="false" src={process.env.PUBLIC_URL + "/bunnie96px.svg"} alt="Bunnie"/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center">
|
||||
<div className="TopButton">
|
||||
|
|
|
|||
|
|
@ -13,5 +13,7 @@ module.exports = {
|
|||
},
|
||||
},
|
||||
},
|
||||
plugins: [],
|
||||
plugins: [
|
||||
require('tailwindcss-image-rendering'),
|
||||
],
|
||||
}
|
||||
Loading…
Reference in a new issue