update: buttons creations and put a background
This commit is contained in:
parent
7a1c302d5a
commit
76ec198868
Before Width: | Height: | Size: 9.1 KiB After Width: | Height: | Size: 9.1 KiB |
BIN
src/assets/img_site.jpg
Normal file
BIN
src/assets/img_site.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 882 KiB |
@ -1,3 +1,18 @@
|
||||
import chat from ".././assets/chat.jpg";
|
||||
|
||||
function Button(argv, clicked) {
|
||||
return (
|
||||
<button
|
||||
onClick={() => {
|
||||
alert(argv);
|
||||
}}
|
||||
style={{ margin: "0 8px", alignItems: "left" }}
|
||||
>
|
||||
{argv}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
|
||||
export function Header() {
|
||||
return (
|
||||
<div
|
||||
@ -6,10 +21,19 @@ export function Header() {
|
||||
justifyContent: "space-between",
|
||||
}}
|
||||
>
|
||||
<h1 style={{ textAlign: "left" }}>
|
||||
Aceuil About Product Blog Serveurs Dowloads Help
|
||||
</h1>
|
||||
<h1 style={{ textAlign: "right" }}>Acount Get started</h1>
|
||||
<h2 style={{ textAlign: "left" }}>
|
||||
{Button("Aceuil")}
|
||||
{Button("About")}
|
||||
{Button("Product")}
|
||||
{Button("Blog")}
|
||||
{Button("Serveurs")}
|
||||
{Button("Dowloads")}
|
||||
{Button("Help")}
|
||||
</h2>
|
||||
<h2 style={{ textAlign: "right" }}>
|
||||
{Button("Acount")}
|
||||
{Button("Get started")}
|
||||
</h2>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
32
src/main.jsx
32
src/main.jsx
@ -7,7 +7,8 @@ import { Footer } from "./component/Footer.jsx";
|
||||
import { Postcard } from "./component/Card.jsx";
|
||||
import { Button } from "./component/Button.jsx";
|
||||
import { Header } from "./component/Head.jsx";
|
||||
import chat from "./assets/chat_sex.jpg";
|
||||
import back_img from "./assets/img_site.jpg";
|
||||
import chat from "./assets/chat.jpg";
|
||||
|
||||
function buttoncaller(argv) {
|
||||
console.log(argv);
|
||||
@ -16,17 +17,26 @@ function buttoncaller(argv) {
|
||||
|
||||
ReactDOM.createRoot(document.getElementById("root")).render(
|
||||
<>
|
||||
<Navbar />
|
||||
<Header />
|
||||
<App />
|
||||
<Body />
|
||||
<Button
|
||||
title="click"
|
||||
clicked={() => {
|
||||
buttoncaller("coucou");
|
||||
<div
|
||||
style={{
|
||||
backgroundImage: `url(${back_img})`,
|
||||
minHeight: "100vh",
|
||||
backgroundSize: "cover",
|
||||
backgroundPosition: "center",
|
||||
}}
|
||||
/>
|
||||
<Footer />
|
||||
>
|
||||
<Navbar />
|
||||
<Header />
|
||||
<App />
|
||||
<Body />
|
||||
<Button
|
||||
title="click"
|
||||
clicked={() => {
|
||||
buttoncaller("coucou");
|
||||
}}
|
||||
/>
|
||||
<Footer />
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user