forked from JaydaJ1/KAJJ
-
Notifications
You must be signed in to change notification settings - Fork 0
/
detail.html
150 lines (139 loc) · 6.31 KB
/
detail.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>KAJJ Tutoring Center</title>
<link rel="stylesheet" href="style.css">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<script src="https://kit.fontawesome.com/1245c478a4.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>
</head>
<!-- the body start here -->
<body>
<!-- create the header tag with class name -->
<header class="header">
<!-- create nav-bar by create the nav tag. -->
<nav class="menu container-fluid navbar navbar-style">
<a href="index.html"><img class="logo" src="logo.png" alt="logo"></a>
<h2>KAJJ Academy</h2>
<div class=" menubar">
<div class="nav">
<ul class="nav justify-content-center ms-auto ">
<li class="nav-item">
<a class="nav-link active" href="./Aboutus.html">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./course.html">Course</a>
</li>
<li class="nav-item">
<a class="nav-link" href="price.html">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="portalindex.html">Sign In </a>
</li>
</ul>
</div>
</div>
</nav>
<div class="catalog container-fluid">
<div class="row min-vh-100 flex-column flex-md-row">
<aside class="side-catalog col-xl-8 col-md-12 col-sm-12 p-0">
<img class="course-img" src="Web.jpg" alt="">
<div class="course-head">
<h2>Introduction to Computer Science</h2>
<div class="star">
<i class=" icon fas fa-star"></i>
<i class=" icon fas fa-star"></i>
<i class=" icon fas fa-star"></i>
<i class=" icon fas fa-star"></i>
<i class=" icon fas fa-star"></i>
</div>
<p>Learning the introduction of computer to help us understand how computer work. It is the foundation for every higher study in computer science</p>
</div>
<div class="instructor">
<h3>Instructor</h3>
<div class="tutor">
<img src="homeschool.jpg" alt="">
<div class=" tutor-det">
<h5>Khoa Nguyen</h5>
<p>Web Developer at Google</p>
</div>
</div>
<hr>
<div class="overview">
<h3>Course OverView</h3>
<p class="c-overview"> No matter what your coding goals are, the best place to start is by building a strong foundation. Similar to a college course, this Path will teach you how to think and code like a professional. You’ll
learn Computer Science fundamentals, build a professional portfolio, and prepare for an entry-level role in tech.</p>
</div>
<hr>
<div class="learn-content">
<h3>What you'll Learn</h3>
<div class="learn">
<p><i class=" icon fas fa-check"></i>Varaible</p>
<p><i class=" icon fas fa-check"></i>Array</p>
<p><i class=" icon fas fa-check"></i>String</p>
<p><i class=" icon fas fa-check"></i>Loop</p>
<p><i class=" icon fas fa-check"></i>Function</p>
</div>
</div>
</aside>
<main class=" brief-course col-xl-4">
<div class="enroll">
<h3 class>This Course includes</h3>
<p><i class=" icon fas fa-video mx-3"></i>52 hours video</p>
<p><i class=" icon fas fa-newspaper mx-3"></i>72 articles</p>
<p><i class=" icon fas fa-gamepad mx-3"></i>Game Practice</p>
<p><i class=" icon fas fa-graduation-cap mx-3"></i>Cetification</p>
<p><i class=" icon fas fa-download mx-3"></i>Resources</p>
<div class="enroll-btn">
<a href="./intro.html"><button class=" enroll-btn btn-intro btn-signin btn btn-light px-5 my-2 bg-primary">Enroll now</button></a>
</div>
</div>
</main>
</div>
</div>
<footer class="footer">
<div class="container-fluid p-0">
<div class="row text-left">
<div class="col-md-5 col-md-5">
<h1>KAJJ Academy</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p class="pt-4 text-mute">Copyright @2022
<span>Rowdyhackers-Hackathon</span>
</p>
</div>
<div class="col-md-5">
<h4>Any Questions:</h4>
<p>Send us an email:</p>
<form class= "form-inline">
<div class="col-pl">
<div class="input-group pr-5">
<input type="text" class= "form-control bg-dark text-white" placeholder="Email">
<div class="input-group-prepend">
<div class="input-group-text">
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
</form>
</div>
<div class="col-md-2 col-sm-12">
<h4>Follow us</h4>
<p>Help us go viral</p>
<!-- use collum class to keep all the icon stay in a row -->
<div class="collumn">
<i class="fa fa-facebook-f"></i>
<i class="fa fa-instagram"></i>
<i class="fa fa-twitter"></i>
<i class="fa fa-youtube"></i>
</div>
</div>
</div>
</div>
</footer>
</body>
</html>