1
1
<!DOCTYPE html>
2
2
< html lang ="en ">
3
- < head >
4
- < meta charset ="UTF-8 ">
5
- < meta name ="viewport " content ="width=device-width, initial-scale=1.0 ">
6
- < meta http-equiv ="X-UA-Compatible " content ="ie=edge ">
7
- < script src ="https://kit.fontawesome.com/64d58efce2.js "crossorigin ="anonymous "> </ script >
8
- < link rel ="stylesheet " href ="style.css ">
9
- < title > Surpath</ title >
10
- </ head >
11
- < body >
12
- < header >
13
- < div class ="container ">
14
- < div class ="logo-container ">
15
- < div class ="logo "> Sur< span > path</ span > </ div >
16
- </ div >
17
- < div class ="nav-btn ">
18
- < div class ="nav-links ">
3
+ < head >
4
+ < meta charset ="UTF-8 ">
5
+ < meta name ="viewport " content ="width=device-width, initial-scale=1.0 ">
6
+ <!-- =====BOX ICONS===== -->
7
+ < link href ='
https://cdn.jsdelivr.net/npm/[email protected] /css/boxicons.min.css '
rel ='
stylesheet '
>
8
+
9
+ <!-- ===== CSS ===== -->
10
+ < link rel ="stylesheet " href ="assets/css/styles.css ">
11
+
12
+ < title > Responsive landing page Surpath Community</ title >
13
+ </ head >
14
+ < body >
15
+ <!--===== HEADER =====-->
16
+ < header class ="l-header ">
17
+ < nav class ="nav bd-grid ">
18
+ < div >
19
+ < a href ="# " class ="nav__logo "> Surpath Community</ a >
20
+ </ div >
19
21
20
- </ div >
21
- < div class ="log-signs ">
22
- < a href ="# " class ="btn transparent "> Login</ a >
23
- < a href ="# " class ="btn solid "> Sign Up</ a >
24
- </ div >
25
- </ div >
26
-
27
- </ div >
28
-
29
- </ header >
30
- < main >
31
- < section >
32
-
33
- < div class ="overlay "> </ div >
34
- </ section >
35
- </ main >
36
- </ body >
37
- </ html >
22
+ < div class ="nav__toggle " id ="nav-toggle ">
23
+ < i class ='bx bx-menu '> </ i >
24
+ </ div >
25
+
26
+ < div class ="nav__menu " id ="nav-menu ">
27
+ < div class ="nav__close " id ="nav-close ">
28
+ < i class ='bx bx-x '> </ i >
29
+ </ div >
30
+
31
+ < ul class ="nav__list ">
32
+ < li class ="nav__item "> < a href ="#home " class ="nav__link active "> Home</ a > </ li >
33
+ < li class ="nav__item "> < a href ="#about " class ="nav__link "> About</ a > </ li >
34
+ < li class ="nav__item "> < a href ="#skills " class ="nav__link "> Blog</ a > </ li >
35
+ < li class ="nav__item "> < a href ="#contact " class ="nav__link "> Contact</ a > </ li >
36
+ </ ul >
37
+ </ div >
38
+ </ nav >
39
+ </ header >
40
+
41
+ < main class ="l-main ">
42
+ <!--===== HOME =====-->
43
+ < section class ="home " id ="home ">
44
+ < div class ="home__container bd-grid ">
45
+ < div class ="home__img ">
46
+ < img src ="assets/img/undraw_open_source_1qxw.svg " alt ="" data-speed ="-2 " class ="move ">
47
+ </ div >
48
+
49
+ < div class ="home__data ">
50
+ < h1 class ="home__title "> Surpath< br > Community</ h1 >
51
+ < p class ="home__description "> Let's help discover the best more < br > open source projects.</ p >
52
+ < a href ="# " class ="home__button "> Get Started</ a >
53
+ </ div >
54
+ </ div >
55
+ </ section >
56
+ </ main >
57
+
58
+ <!--===== GSAP =====-->
59
+ < script src ="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.5.1/gsap.min.js "> </ script >
60
+
61
+ <!--===== MAIN JS =====-->
62
+ < script src ="assets/js/main.js "> </ script >
63
+ </ body >
64
+ </ html >
0 commit comments