diff --git a/gitdeco/public/gitdeco.svg b/gitdeco/public/gitdeco.svg
new file mode 100644
index 0000000..0f2cdc1
--- /dev/null
+++ b/gitdeco/public/gitdeco.svg
@@ -0,0 +1,17 @@
+
diff --git a/gitdeco/src/app/_components/common/Header/index.tsx b/gitdeco/src/app/_components/common/Header/index.tsx
index fccc802..f64d96d 100644
--- a/gitdeco/src/app/_components/common/Header/index.tsx
+++ b/gitdeco/src/app/_components/common/Header/index.tsx
@@ -1,9 +1,17 @@
import * as S from "./style";
+import Image from "next/image";
+import LogoIco from "/public/gitdeco.svg";
const Header = () => {
return (
- hello
+
+
+
+
+ GitDeco
+
+ Download
);
};
diff --git a/gitdeco/src/app/_components/common/Header/style.ts b/gitdeco/src/app/_components/common/Header/style.ts
index dc2d80c..dd54eb0 100644
--- a/gitdeco/src/app/_components/common/Header/style.ts
+++ b/gitdeco/src/app/_components/common/Header/style.ts
@@ -8,4 +8,49 @@ export const HeaderContainer = styled.div`
background-color: black;
box-sizing: border-box;
border-bottom: 1px solid #3d4145;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 3vw;
`;
+
+export const Logo = styled.div`
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+`;
+
+export const LogoTxt = styled.div`
+ color: white;
+ font-weight: 500;
+ font-size: 1.5vw;
+ margin-top: 0.5vw;
+ margin-left: 0.5vw;
+`;
+
+export const LogoImage = styled.div`
+ position: relative;
+ width: 50px;
+ height: 50px;
+`;
+
+export const DownloadBtn = styled.button`
+ width: 7vw;
+ height: 1vh;
+ padding: 15px;
+ background-color: #2B64E7;
+ color: #fff;
+ border: none;
+ border-radius: 5px;
+ cursor: pointer;
+ font-size:1vw;
+ margin-bottom: 0.5vw;
+
+ display:flex;
+ align-items: center;
+ justify-content: center;
+
+ &:hover {
+ background-color: #6062AA;
+ }
+`;
\ No newline at end of file
diff --git a/gitdeco/src/app/layout.tsx b/gitdeco/src/app/layout.tsx
index 89c7e76..cfbdce9 100644
--- a/gitdeco/src/app/layout.tsx
+++ b/gitdeco/src/app/layout.tsx
@@ -1,5 +1,4 @@
-import type { Metadata } from "next";
-import { Inter } from "next/font/google";
+import { Metadata } from "next";
import "./globals.css";
import Header from "./_components/common/Header";
import Sidebar from "./_components/common/Sidebar";
@@ -7,15 +6,21 @@ import Sidebar from "./_components/common/Sidebar";
export const metadata: Metadata = {
title: "GitDeco",
description: "GitHub Readme.md Editor Web Services",
+ icons: {
+ icon: "/gitdeco.svg",
+ },
};
export default function RootLayout({
children,
-}: Readonly<{
+}: {
children: React.ReactNode;
-}>) {
+}) {
return (
+
+
+