-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathfront.html
More file actions
141 lines (138 loc) · 13.4 KB
/
front.html
File metadata and controls
141 lines (138 loc) · 13.4 KB
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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Front-End Resources</title>
<meta name="" content="">
<link rel="icon" type="image/png" sizes="973x973" href="assets/img/logo.png">
<link rel="icon" type="image/png" sizes="973x973" href="assets/img/logo.png">
<link rel="icon" type="image/png" sizes="973x973" href="assets/img/logo.png">
<link rel="icon" type="image/png" sizes="973x973" href="assets/img/logo.png">
<link rel="icon" type="image/png" sizes="973x973" href="assets/img/logo.png">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Berkshire+Swash|Kaushan+Script">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Nunito+Sans">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium+Web:400,600,700">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
<link rel="stylesheet" href="assets/css/styles.min.css">
</head>
<body style="background-image: url("assets/img/header.jpg");">
<div></div>
<div class="projects-horizontal" style="font-family: Poppins, sans-serif;">
<div class="container">
<div class="intro">
<h1 class="text-break text-center border rounded shadow" style="font-family: Poppins, sans-serif;margin-top: 42px;"><strong>Front-end</strong><br></h1>
<p class="text-center shadow-none" style="margin-top: 18px;font-family: Poppins, sans-serif;"><br>If you're already a front-end developer, well<br>pretend you're also wearing a pirate hat.<br><br></p>
</div>
<div class="row projects">
<div class="col d-block item">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid shadow" data-bs-hover-animate="pulse" src="assets/img/html.jpg"></a></div>
<div class="col">
<h3 class="name">HTML</h3>
<p class="description" style="font-family: Poppins, sans-serif;"><strong>HTML</strong> was developed with the intent of defining the structure of documents like headings, paragraphs, lists, and so forth to facilitate the sharing of scientific information between researchers. Now, HTML
is being widely used to format web pages with the help of different tags available in HTML language.<br></p>
</div>
</div><button class="button" type="button" onclick="window.location.href='html.html';" data-hover="SURE!"><span>WANNA LEARN?</span></button></div>
</div>
<div class="col d-block item">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid shadow" data-bs-hover-animate="pulse" src="assets/img/css.jpg"></a></div>
<div class="col">
<h3 class="name">CSS</h3>
<p class="description" style="font-family: Poppins, sans-serif;"><strong>C</strong>ascading <strong>S</strong>tyle <strong>S</strong>heets, fondly referred to as CSS, is a simple design language intended to simplify the process of making web pages presentable.CSS handles the look and
feel part of a web page. Using CSS, you can control the color of the text, the style of fonts, the spacing between paragraphs, how columns are sized and laid out, what background images or colors are used, layout designs,variations
in display for different devices and screen sizes as well as a variety of other effects.<br></p>
</div>
</div><button class="button" type="button" onclick="window.location.href='css.html';" data-hover="SURE!"><span>WANNA LEARN?</span></button></div>
<div class="col d-block item">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid shadow" data-bs-hover-animate="pulse" src="assets/img/repo.jpg"></a></div>
<div class="col">
<h3 class="name">Responsive Design</h3>
<p class="description" style="font-family: Poppins, sans-serif;">Responsive Web Design is about using HTML and CSS to automatically resize a website. Responsive Web Design is about making a website look good on all devices (desktops, tablets, and phones).<br></p>
</div>
</div><button class="button" type="button" onclick="window.location.href='responsive.html';" data-hover="SURE!"><span>WANNA LEARN?</span></button></div>
<div class="col d-block item">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid shadow" data-bs-hover-animate="pulse" src="assets/img/js.jpg"></a></div>
<div class="col">
<h3 class="name">JavaScript</h3>
<p class="description" style="font-family: Poppins, sans-serif;"><strong>JavaScript</strong> is a lightweight, interpreted <strong>programming</strong> language. It is designed for creating network-centric applications. It is complimentary to and integrated with Java. <strong>JavaScript</strong> is
very easy to implement because it is integrated with HTML. It is open and cross-platform.<br></p>
</div>
</div><button class="button" type="button" onclick="window.location.href='javascript.html';" data-hover="SURE!"><span>WANNA LEARN?</span></button></div>
<div class="col d-block item">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid shadow" data-bs-hover-animate="pulse" src="assets/img/git.jpg"></a></div>
<div class="col">
<h3 class="name">Git</h3>
<p class="description" style="font-family: Poppins, sans-serif;"><br>Git is a distributed revision control and source code management system with an emphasis on speed. Git was initially designed and developed by Linus Torvalds for Linux kernel development. <br></p>
</div>
</div><button class="button" type="button" onclick="window.location.href='git.html';" data-hover="SURE!"><span>WANNA LEARN?</span></button></div>
<div class="col d-block item">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid shadow" data-bs-hover-animate="pulse" src="assets/img/sass.jpg"></a></div>
<div class="col">
<h3 class="name">CSS Preprocessors</h3>
<p class="description" style="font-family: Poppins, sans-serif;">Lets you generate <strong>CSS</strong> from the preprocessor's own unique syntax. <strong>CSS preprocessors</strong> will add some features that don't exist in pure <strong>CSS.</strong><br></p>
</div>
</div><button class="button" type="button" onclick="window.location.href='prepro.html';" data-hover="SURE!"><span>WANNA LEARN?</span></button></div>
<div class="col d-block item">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid shadow" data-bs-hover-animate="pulse" src="assets/img/rea.jpg"></a></div>
<div class="col">
<h3 class="name">React JS</h3>
<p class="description" style="font-family: Poppins, sans-serif;">React is a library for building composable user interfaces. It encourages the creation of reusable UI components, which present data that changes over time. Lots of people use React as the V in MVC. React abstracts away the DOM
from you, offering a simpler programming model and better performance. React can also render on the server using Node, and it can power native apps using React Native.<br></p>
</div>
</div><button class="button" type="button" onclick="window.location.href='reactjs.html';" data-hover="SURE!"><span>WANNA LEARN?</span></button></div>
<div class="col d-block item">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid shadow" data-bs-hover-animate="pulse" src="assets/img/ang.jpg"></a></div>
<div class="col">
<h3 class="name">Angular JS</h3>
<p class="description" style="font-family: Poppins, sans-serif;"><strong>AngularJS</strong> is a very powerful JavaScript Framework. It is used in Single Page Application (SPA) projects. It extends HTML DOM with additional attributes and makes it more responsive to user actions. AngularJS
is open source, completely free, and used by thousands of developers around the world.<br></p>
</div>
</div><button class="button" type="button" onclick="window.location.href='angularjs.html';" data-hover="SURE!"><span>WANNA LEARN?</span></button></div>
<div class="col d-block item">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid shadow" data-bs-hover-animate="pulse" src="assets/img/runner.jpg"></a></div>
<div class="col">
<h3 class="name">Task Runners</h3>
<p class="description" style="font-family: Poppins, sans-serif;"><strong>Task runners</strong> are the heroes (or villains, depending on your point of view) that quietly toil behind most web and mobile applications. <strong>Task runners</strong> provide value through the automation
of numerous development <strong>tasks</strong> such as concatenating files, spinning up development servers and compiling code<br></p>
</div>
</div><button class="button" type="button" onclick="window.location.href='taskrun.html';" data-hover="SURE!"><span>WANNA LEARN?</span></button></div>
<div class="col d-block item">
<div class="row">
<div class="col-md-12 col-lg-5"><a href="#"><img class="img-fluid shadow" data-bs-hover-animate="pulse" src="assets/img/tools.jpg"></a></div>
<div class="col">
<h3 class="name">Tools</h3>
<p class="description" style="font-family: Poppins, sans-serif;">Web Developers use tools and resources for front-end developers which falls into several <strong>categories</strong>: <em>Colors, CSS Generators, Calculators & Converters, Typography & Fonts, Icons, Analyze Website Style, Editors, Developer Tools, Testing, Performance, Optimization, Feedback, Inspiration, MOOC, Wireframes, Mockups & Prototypes, Design News & Community, Portfolio, Resources.</em><br></p>
</div>
</div><button class="button" type="button" onclick="window.location.href='tool.html';" data-hover="SURE!"><span>WANNA LEARN?</span></button></div>
</div>
<footer id="footerpad">
<div class="container">
<div class="row">
<div class="col-md-6 col-lg-8 mx-auto">
<ul class="list-inline text-center">
<li class="list-inline-item"><a href="https://www.facebook.com/shyam.vicky15" target="_blank"><span class="fa-stack fa-lg"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-facebook fa-stack-1x fa-inverse"></i></span></a></li>
<li class="list-inline-item"><a href="https://twitter.com/ShyamGeorge7" target="_blank"><span class="fa-stack fa-lg"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-twitter fa-stack-1x fa-inverse"></i></span></a></li>
<li class="list-inline-item"><a href="https://www.instagram.com/_smiling_storm_/" target="_blank"><span class="fa-stack fa-lg"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-instagram fa-stack-1x fa-inverse"></i></span></a></li>
<li class="list-inline-item"><a href="https://github.com/ShyamKumar1" target="_blank"><span class="fa-stack fa-lg"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-github fa-stack-1x fa-inverse"></i></span></a></li>
</ul><p class="copyright text-muted text-center"> Web Design by <a href="http://shyamgeorge.rf.gd/" target="_blank">SHYAM KUMAR</a></p></div>
</div>
</div>
</footer>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/script.min.js"></script>
</body>
</html>