SailorZoop/ZoeysBits
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

moon and stuff

Browse source
This commit is contained in:
Zoey 2024-01-14 12:05:03 +01:00
parent 8d262a40c0
commit 30f23d7242
6 changed files with 17 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/App.js
View file

@ -1,4 +1,4 @@
import logo from './logo.svg'; //import logo from './logo.svg';
import './App.css'; import './App.css';
import TopBar from './TopBar'; import TopBar from './TopBar';
@ -9,7 +9,7 @@ import Home from './Home';
function App() { function App() {
return ( return (
<div className="flex"> <div className="body">
<Home /> <Home />
<TopBar /> <TopBar />
<BottomBar /> <BottomBar />

8
src/Home.js
View file

@ -1,11 +1,11 @@
const Home = () => { const Home = () => {
return ( return (
<div className="fixed flex bg-black text-secondary top-16 bottom-8 w-screen h-screen"> <div className="flex bg-black text-secondary top-14 bottom-8 w-screen h-screen">
<div className="fixed flex justify-center"> <div className="flex items-center justify-center text-4xl mx-auto">
<p>fuuuuuuuuuuuuuuuck</p> <h1 className="text-center">Welcome fellow traveller!</h1>
</div> </div>
</div> </div>
); );
}; };
export default Home; export default Home;

3
src/Moon.svg Normal file
View file

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<path d="M50 0 A50 50 0 0 0 50 100 Z" fill="yellow" stroke="black"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 140 B

8
src/TopBar.js
View file

@ -1,6 +1,6 @@
const TopBar = () => { const TopBar = () => {
return ( return (
<div className="fixed top-0 left-0 h-16 w-screen flex flex-row bg-primary text-secondary <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-sm justify-center items-center space-x-2">
<div className="topbar-clickables"> <div className="topbar-clickables">
<div className="center left-0 flex justify-center items-center"> <div className="center left-0 flex justify-center items-center">
@ -22,10 +22,9 @@ const TopBar = () => {
</div> </div>
<div className="fixed right-0 mr-6"> <div className="fixed right-0 mr-6">
<div className="DarkModeButton"> <div className="DarkModeButton">
<svg className="ml-4 flex items-center" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="half-crescent-moon">
<path d="M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2Z"></path> <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
</svg> </svg>
<span className="ml-2">123</span>
</div> </div>
</div> </div>
</div> </div>
@ -34,5 +33,4 @@ const TopBar = () => {
); );
}; };
export default TopBar; export default TopBar;

0
src/logo.svg → src/bunny.svg
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 743 B

After

Width:  |  Height:  |  Size: 742 B

5
src/index.css
View file

@ -2,6 +2,7 @@
@tailwind components; @tailwind components;
@tailwind utilities; @tailwind utilities;
@tailwind variants; @tailwind variants;
@import url(https://fonts.googleapis.com/css2?family=Sarabun);
@layer components { @layer components {
.TopButton { .TopButton {
@ -14,9 +15,7 @@
body { body {
margin: 0; margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', font-family: 'Sarabun', sans-serif;
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }