-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
151 lines (139 loc) · 7.05 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!DOCTYPE html>
<html lang="ko_kr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Codenager</title>
<meta property="og:url" content="https://codenager.github.io" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Codenager" />
<meta property="og:description" content="Korean web dev Team" />
<meta property="og:image" content="https://codenager.github.io/asset/og2.png" />
<meta property="og:site_name" content="Codenager">
<meta property="og:locale" content="ko_KR">
<meta property="og:title" content="Codenager" />
<meta property="og:url" content="https://codenager.github.io" />
<meta property="og:type" content="website" />
<meta property="og:image" content="https://codenager.github.io/asset/og2.png" />
<meta property="og:title" content="Codenager" />
<meta property="og:description" content="Korean web dev Team" />
<meta name="twitter:card" content="summary_large_image"/>
<meta name="twitter:title" content="Codenager" />
<meta name="twitter:description" content="Korean web dev Team" />
<meta name="twitter:image" content="https://codenager.github.io/asset/og2.png" />
<meta name="theme-color" content="#0CCD64">
<!-- BootStrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
<!-- 로컬 CSS -->
<link rel="stylesheet" href="src/css/style.css">
<link rel="stylesheet" href="src/css/header.css">
<link rel="stylesheet" href="src/css/crew-mediaquery.css">
<!-- footer CSS -->
<link rel="stylesheet" href="src/css/footer.css">
<link rel="stylesheet" href="src/css/footer-mediaquery.css">
<!-- 구글 폰트 Noto Sans Korean (400,700) Poppins (400) -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;700&family=Poppins&display=swap"
rel="stylesheet">
<!-- 눈누 폰트 주아체 -->
<style>
@font-face {
font-family: 'BMJUA';
src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/[email protected]/BMJUA.woff') format('woff');
font-weight: normal;
font-style: normal;
}
</style>
</head>
<body>
<!-- BootStrap JS -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-pprn3073KE6tl6bjs2QrFaJGz5/SUsLqktiwsUTF55Jfv3qYSDhgCecCxMW52nD2"
crossorigin="anonymous"></script>
<!-- Navbar -->
<nav class="navbar navbar-expand-lg bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="#">
<img src="asset/icon.png" alt="Codenager" width="30" radius="5" class="d-inline-block align-text-top">
Codenager
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-link active" aria-current="page" href="#">홈</a>
<a class="nav-link" onclick="locationTo('#about')">소개</a>
<a class="nav-link" onclick="locationTo('#crew')">크루원</a>
<a class="nav-link" onclick="locationTo('#service')">서비스</a>
</div>
</div>
</div>
</nav>
<!-- about -->
<section id="about">
<p class="our_name">Codenager</p>
<p class="section_description">Korean Youth Development Team Creating Value</p>
</section>
<!-- crew -->
<section id="crew">
<p class="section_title">크루원 😀</p>
<span class="section_description">Codenager의 실력있는 크루원들입니다!</span>
<div class="crew_data_wrap">
<div class="crew_data">
<img src="https://avatars.githubusercontent.com/u/77488170?v=4" width="150" height="150" alt="">
<span class="crew_name">froggal(KeySpace)</span>
<span class="crew_description">웹 개발 1년차, 학생 개발자 키페라고 합니다!</span>
<span class="crew_role">Git 관리, 팀 리더.</span>
</div>
<div class="crew_data">
<img src="https://avatars.githubusercontent.com/u/72495729?v=4" width="150" height="150" alt="">
<span class="crew_name">anojds</span>
<span class="crew_description">프론트 개발 4년차 중학생 anojds라고 합니다</span>
<span class="crew_role">개발자</span>
</div>
<div class="crew_data">
<img src="https://avatars.githubusercontent.com/u/100451964?v=4" width="150" height="150" alt="">
<span class="crew_name">middlescholl</span>
<span class="crew_description">프론트 개발 1년차 중학생 개발자 middlescholl 입니다.</span>
<span class="crew_role">개발자</span>
</div>
</div>
</section>
<!-- service -->
<section id="service">
<p class="section_title">서비스 😀</p>
<span class="section_description">설명이 들어갈 자리입니다.</span>
<div class="service_list_wrap">
<div class="service_data">
<img src="asset/sample_header.jpg">
<span class="service_name">서비스 이름</span>
<span class="service_description">이 설명은 서비스의 예시 설명입니다. 나중에 다른 설며ㅕㅇ으로 대체 해주세요.</span>
</div>
<div class="service_data">
<img src="asset/sample_header.jpg">
<span class="service_name">서비스 이름</span>
<span class="service_description">이 설명은 서비스의 예시 설명입니다. 나중에 다른 설며ㅕㅇ으로 대체 해주세요.</span>
</div>
</div>
</section>
<!-- Footer -->
<footer>
<div class="footer-wrap">
<h2>Codenager</h2>
<div>
<span>Links</span>
<a class="nav-link" onclick="locationTo('#about')">소개</a>
<a class="nav-link" onclick="locationTo('#crew')">크루원</a>
<a class="nav-link" onclick="locationTo('#service')">서비스</a>
</div>
</div>
<div class="copyright">© Codenager 2022, All Rights Reserved.</div>
</footer>
<script src="src/js/href.js"></script>
</body>
</html>