-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
176 lines (170 loc) · 8.94 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
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
<!DOCTYPE html>
<html lang="en">
<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">
<script src="https://kit.fontawesome.com/1b3f199c8f.js" crossorigin="anonymous"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
<link rel="stylesheet" href="css/styles.css">
<link rel="stylesheet" href="css/med-quer.css">
<title>Mind Compilator</title>
</head>
<body>
<nav>
<h1 class="logo"><a href="../index.html"><i class="fab fa-codiepie d-inline"></i>
mindCompilator</a></h1>
<ul class="menu-list">
<li class="menu-list-item"><a class="mli-link" href="pages/results.html"><i class="fas fa-search"></i><span
class="nav-describers">
COURSES</span></a></li>
<li class="menu-list-item"><a class="mli-link" href="#"><i class="fas fa-user"></i><span
class="nav-describers">
ABOUT</span></a></li>
<li class="menu-list-item"><a class="mli-link" href="#"><i class="fas fa-rss"></i><span
class="nav-describers">
BLOG</span></a></li>
<li class="menu-list-item"><a class="mli-link" href="#"><i class="fas fa-bars"></i><span
class="nav-describers">
MORE..</span></a></li>
</ul>
</nav>
<main>
<section class="top-searching-section">
<h2 class="search-heading">
MIND COMPILATOR.. YOUR GATEWAY TO UPGRADED MIND
</h2>
<section class="search-section">
<h3 class="search-section-header">SEARCH BY KEY WORD:</h3>
<form class="form" action="./pages/results.html">
<label for="tf-1"></label>
<input id="tf-1" class="form-control" type="text" placeholder="E.x.: JavaScript DOM">
<input class="form-btn btn" type="submit" value="SEARCH">
</form>
</section>
<button class="btn how-btn" type="button">How it works</button>
</section>
<section class="about-section">
<h3 class="about-section-heading">Best courses of the best programming languages</h3>
<div class="courses-div">
<article class="about-sec-article"><i class="fab fa-js fa-3x"></i>
<h3>JavaScript</h3>
<p>The most popular programming language for building interactive websites</p>
</article>
<article class="about-sec-article"><i class="fas fa-gem fa-3x"></i>
<h3>Ruby</h3>
<p>Incredibly productive, flexible and expressive language. It has one of the most powerful
frameworks -
Ruby on Rails.</p>
</article>
<article class="about-sec-article"><i class="fab fa-java fa-3x"></i>
<h3>Java</h3>
<p>The most commonly associated with the development of client-server
applications, which are used by large businesses around the world.</p>
</article>
<article class="about-sec-article"><i class="fab fa-python fa-3x"></i>
<h3>Python</h3>
<p>Widely regarded as a programming language that’s easy to learn, due to its simple syntax, a
large library of standards and toolkits</p>
</article>
</div>
</section>
<div class="details-section">
<article id="ds-art-1" class="ds-article">
<img class="ds-article-img" src="./assets/images/4.jpg" alt="">
<div class="ds-art-div">
<h3>We offer the best support throughout your journey</h3>
<p>At the Mind Compilator, you'll find services and support networks to help you get ahead in
your studies and social life.
We offer a friendly and supportive environment for all. Our Student Support services will be
there
for you when you need them – from practical advice to more intensive support – to help make your
time here at Huddersfield run as smoothly as possible.</p>
<button class="btn how-btn">Details</button>
</div>
</article>
<article id="ds-art-2" class="ds-article">
<img class="ds-article-img" src="./assets/images/7.jpg" alt="">
<div class="ds-art-div">
<h3>Project based learning</h3>
<p>Students work on a project over an extended period of time – from a week up to a semester – that
engages them in solving a real-world problem or answering a complex question. They demonstrate
their
knowledge and skills by creating a public product or presentation for a real audience.</p>
<button class="btn how-btn">Details</button>
</div>
</article>
<article id="ds-art-3" class="ds-article">
<img class="ds-article-img" src="./assets/images/6.jpg" alt="">
<div class="ds-art-div">
<h3>GLOBAL OPPORTUNITIES</h3>
<p>Connect with global and remote jobs after gaining experience working on a distributed team.
Study, work or volunteer abroad as part of your degree for a life-changing experience. Discover
other cultures, learn a new language and forge friendships to last a lifetime.</p>
<button class="btn how-btn">Details</button>
</div>
</article>
</div>
</main>
<footer>
<div class="top-part-wrap">
<div class="top-part">
<ul class="top-part-ul">
<li>
<ul class="inner-tp-ul">
<li><a class="tp-link" href="#">HOME</a></li>
<li><a class="tp-link" href="#">SEARCH</a></li>
<li><a class="tp-link" href="#">ABOUT US</a></li>
<li><a class="tp-link" href="#">ADVERTISE</a></li>
</ul>
</li>
<li><a href="#">
<p class="bottom-logo"><i class="fab fa-codiepie fa-3x"></i></p>
</a>
</li>
<li>
<ul class="inner-tp-ul">
<li><a class="tp-link" href="#">FACEBOOK</a></li>
<li><a class="tp-link" href="#">WITTER</a></li>
<li><a class="tp-link" href="#">BLOG</a></li>
<li><a class="tp-link" href="#">GOOGLE+</a></li>
</ul>
</li>
</ul>
<div class="top-part-div">
<form class="form-inline" action="#">
<div class="input-group">
<label for="tf-2"></label>
<input id="tf-2" class="form-control" type="text" placeholder="you@example.com">
<input class="form-btn btn form-control" type="submit" value="Send">
</div>
</form>
<section class="footer-contact-section">
<h3>CONTACT</h3>
<p>Have any questions? <a href="#">help@compilator.com</a></p>
</section>
<section class="footer-about-section">
<h3>ABOUT</h3>
<p>
Mind Compilator is here to help you find a way of using magic :) <a href="#">Learn more.</a>
</p>
</section>
</div>
</div>
</div>
<div class="bottom-part-wrap">
<div class="bottom-part">
<div class="social-div">
<a href="#"><i class="fab fa-facebook-f"></i></a>
<a href="#"><i class="fab fa-twitter"></i></a>
<a href="#"><i class="fab fa-google-plus-g"></i></a>
<a href="#"><i class="fab fa-linkedin-in"></i></a>
<a href="#"><i class="fab fa-instagram"></i></a>
</div>
<div class="copyr-div">© Mind Compilator 2021 All rights reserved.</div>
</div>
</div>
</footer>
</body>
</html>