commit c21280443429dddb9ed0f22bd55fd6905260f3fe
parent 1086f53acbd7f5dece5c3d2082974f5cec73b26f
Author: minerva-jupitr <ryouturn@gmail.com>
Date: Wed, 6 Nov 2024 18:49:54 +0900
add some pages
Diffstat:
8 files changed, 95 insertions(+), 32 deletions(-)
diff --git a/index.html b/index.html
@@ -1,13 +1,13 @@
<!doctype html>
<html lang="jp">
- <head data-bs-theme="dark">
+ <head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Minerva-Juppiter-Home</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
</head>
- <body>
+ <body style="background-color: #2b3035;">
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous"></script>
diff --git a/src/AppRoutes.tsx b/src/AppRoutes.tsx
@@ -5,18 +5,22 @@ import {
} from "react-router-dom";
import Home from './Home';
import Navbars from "./Navbar";
+import Schedule from "./Schedule";
+import Works from "./Works";
+import Blog from "./Blog";
const AppRoutes = () => {
return (
- <div style={{backgroundColor:"black"}}>
- <BrowserRouter>
- <Navbars/>
- <Routes>
- <Route path='/' element={<Home />} />
- </Routes>
- </BrowserRouter>
- </div>
+ <BrowserRouter>
+ <Navbars />
+ <Routes>
+ <Route path='/' element={<Home />} />
+ <Route path='/Schedule' element={<Schedule/>} />
+ <Route path="/Works" element={<Works />} />
+ <Route path="/Blog" element={<Blog />} />
+ </Routes>
+ </BrowserRouter>
)
- }
+ };
export default AppRoutes;
\ No newline at end of file
diff --git a/src/Blog.tsx b/src/Blog.tsx
@@ -0,0 +1,12 @@
+import 'bootstrap/dist/css/bootstrap.min.css';
+import { Container } from 'react-bootstrap';
+
+const Blog = () => {
+ return(
+ <Container className='text-center'>
+ <h1 style={{color:"white"}}>Blog</h1>
+ </Container>
+ )
+};
+
+export default Blog;+
\ No newline at end of file
diff --git a/src/Home.tsx b/src/Home.tsx
@@ -1,11 +1,32 @@
-
+import 'bootstrap/dist/css/bootstrap.min.css';
+import { Card, Container } from 'react-bootstrap';
const Home = () => {
return (
- <div>
- <div>Home</div>
- </div>
+ <Container data-bs-theme="dark">
+ <br />
+ <Container className="text-center">
+ <h1 style={{color:"white"}}>Minerva_Juppiter</h1>
+ <h4 style={{color:"white"}}>哲</h4>
+ </Container>
+ <br />
+ <br />
+ <Card className='text-center'>
+ <br />
+ <Card.Title>
+ <h3 className="text-center">自己の紹介です</h3>
+ <h6 className="text-center">About me</h6>
+ </Card.Title>
+ <Card.Body>
+ おはようございます、Minerva_Juppiterです。<br />
+ しがない侏儒の者です。<br />
+ このページは自己紹介がてら作ったものです。<br />
+ 良ければ見ていってください。<br />
+ </Card.Body>
+ <br />
+ </Card>
+ </Container>
)
-}
+};
export default Home;
\ No newline at end of file
diff --git a/src/Navbar.tsx b/src/Navbar.tsx
@@ -9,23 +9,19 @@ function Navbars() {
return (
<Navbar expand="lg" className="bg-body-tertiary" data-bs-theme="dark">
<Container>
- <Navbar.Brand href="#home">Minerva-Juppiter</Navbar.Brand>
+ <Navbar.Brand href="/">Minerva-Juppiter</Navbar.Brand>
<Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="me-auto">
- <Nav.Link href="#home">Home</Nav.Link>
- <Nav.Link href="#link">Link</Nav.Link>
- <NavDropdown title="Dropdown" id="basic-nav-dropdown">
- <NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item>
- <NavDropdown.Item href="#action/3.2">
- Another action
- </NavDropdown.Item>
- <NavDropdown.Item href="#action/3.3">Something</NavDropdown.Item>
- <NavDropdown.Divider />
- <NavDropdown.Item href="#action/3.4">
- Separated link
- </NavDropdown.Item>
+ <Nav.Link href="/">Home</Nav.Link>
+ <Nav.Link href="/Schedule">Schedule</Nav.Link>
+ <Nav.Link href="/Works">Works</Nav.Link>
+ <NavDropdown title="SNS" id="basic-nav-dropdown">
+ <NavDropdown.Item href="https://www.twitter.com/mjuppiter">Twitter</NavDropdown.Item>
+ <NavDropdown.Item href="https://instagram.com/minerva_juppiter">Instagram</NavDropdown.Item>
+ <NavDropdown.Item href="https://bsky.app/profile/minerva-juppiter.bsky.social">BlueSky</NavDropdown.Item>
</NavDropdown>
+ <Nav.Link href='/Blog'>Blog</Nav.Link>
</Nav>
</Navbar.Collapse>
</Container>
diff --git a/src/Schedule.tsx b/src/Schedule.tsx
@@ -0,0 +1,13 @@
+import 'bootstrap/dist/css/bootstrap.min.css';
+import { Container } from 'react-bootstrap';
+
+const Schedule = () => {
+ return(
+ <Container className='text-center'>
+ <h1 style={{color:"white"}}>Schedule</h1>
+ <p>here will be calendar</p>
+ </Container>
+ )
+}
+
+export default Schedule+
\ No newline at end of file
diff --git a/src/Works.tsx b/src/Works.tsx
@@ -0,0 +1,12 @@
+import 'bootstrap/dist/css/bootstrap.min.css';
+import { Container } from 'react-bootstrap';
+
+const Works = () => {
+ return(
+ <Container className='text-center'>
+ <h1 style={{color:"white"}}>Works</h1>
+ </Container>
+ )
+};
+
+export default Works;+
\ No newline at end of file
diff --git a/src/main.tsx b/src/main.tsx
@@ -3,7 +3,9 @@ import { createRoot } from 'react-dom/client'
import AppRoutes from './AppRoutes.tsx'
createRoot(document.getElementById('root')!).render(
- <StrictMode>
- <AppRoutes />
- </StrictMode>,
+ <div>
+ <StrictMode>
+ <AppRoutes />
+ </StrictMode>,
+ </div>
);
\ No newline at end of file
