diff --git a/package-lock.json b/package-lock.json
index 1ab4323..8579d67 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -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",
diff --git a/package.json b/package.json
index a52854a..40beff9 100644
--- a/package.json
+++ b/package.json
@@ -36,6 +36,7 @@
]
},
"devDependencies": {
- "tailwindcss": "^3.4.1"
+ "tailwindcss": "^3.4.1",
+ "tailwindcss-image-rendering": "^1.0.2"
}
}
diff --git a/public/Gitea_Logo.svg b/public/Gitea_Logo.svg
new file mode 100644
index 0000000..797d894
--- /dev/null
+++ b/public/Gitea_Logo.svg
@@ -0,0 +1,12 @@
+
+
\ No newline at end of file
diff --git a/public/Nextcloud_Logo.svg b/public/Nextcloud_Logo.svg
new file mode 100644
index 0000000..cc0cdb6
--- /dev/null
+++ b/public/Nextcloud_Logo.svg
@@ -0,0 +1,3 @@
+
+
+
\ No newline at end of file
diff --git a/public/bunnie96px.png b/public/bunnie96px.png
new file mode 100644
index 0000000..2e56160
Binary files /dev/null and b/public/bunnie96px.png differ
diff --git a/public/bunnie96px.svg b/public/bunnie96px.svg
new file mode 100644
index 0000000..1eef8ba
--- /dev/null
+++ b/public/bunnie96px.svg
@@ -0,0 +1,5127 @@
+
+
\ No newline at end of file
diff --git a/src/App.css b/src/App.css
index e982296..6fea772 100644
--- a/src/App.css
+++ b/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);
}
}
\ No newline at end of file
diff --git a/src/App.js b/src/App.js
index 4c22d61..9e662e2 100644
--- a/src/App.js
+++ b/src/App.js
@@ -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';
diff --git a/src/Home.js b/src/Home.js
index 3da107b..812ea6d 100644
--- a/src/Home.js
+++ b/src/Home.js
@@ -1,11 +1,22 @@
const Home = () => {
- return (
-
-
-
Welcome fellow traveller!
+return (
+
+
+
Welcome fellow traveller!
+
-
- );
- };
+
+
+ );
+};
export default Home;
\ No newline at end of file
diff --git a/src/TopBar.js b/src/TopBar.js
index 5f37c48..006d64b 100644
--- a/src/TopBar.js
+++ b/src/TopBar.js
@@ -1,11 +1,13 @@
const TopBar = () => {
return (
+ shadow-md justify-center items-center space-x-2">
-
-
-
+
+
+
+
+
diff --git a/tailwind.config.js b/tailwind.config.js
index a15d99f..6fa3e1a 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -13,5 +13,7 @@ module.exports = {
},
},
},
- plugins: [],
+ plugins: [
+ require('tailwindcss-image-rendering'),
+ ],
}
\ No newline at end of file