Skip to content

Commit 8ab1926

Browse files
logustralogustra
committed
add project 4
1 parent cdb4e91 commit 8ab1926

13 files changed

+346
-116
lines changed

‎card-slider-widget.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
<meta charset="utf-8">
66
<meta http-equiv="X-UA-Compatible" content="IE=edge">
77
<meta name="viewport" content="width=device-width, initial-scale=1">
8-
<title>Simple Jquery Project</title>
9-
<link rel="shortcut icon" href="assets/public/images/logo.png" type="image/png">
8+
<title>Card Slider Widget</title>
9+
<link rel="shortcut icon" href="public/images/logo.png" type="image/png">
1010

1111
<!-- Bootstrap -->
1212
<link rel="stylesheet" href="public/css/bootstrap.min.css">

‎images-slider-widget.html

+3-2
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
<meta charset="utf-8">
66
<meta http-equiv="X-UA-Compatible" content="IE=edge">
77
<meta name="viewport" content="width=device-width, initial-scale=1">
8-
<title>Simple Jquery Project</title>
9-
<link rel="shortcut icon" href="assets/public/images/logo.png" type="image/png">
8+
<title>Images Slider Widget</title>
9+
<link rel="shortcut icon" href="public/images/logo.png" type="image/png">
1010

1111
<!-- Bootstrap -->
1212
<link rel="stylesheet" href="public/css/bootstrap.min.css">
@@ -58,6 +58,7 @@ <h1>Images Slider Widget</h1>
5858
<i class="fa fa-chevron-right"></i>
5959
</button>
6060
</div>
61+
<!-- .btn-images-slider -->
6162
</div>
6263
<!-- .slide-wrapper -->
6364

‎index.html

+71-89
Original file line numberDiff line numberDiff line change
@@ -2,109 +2,91 @@
22
<html lang="en">
33

44
<head>
5-
<meta charset="utf-8">
6-
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7-
<meta name="viewport" content="width=device-width, initial-scale=1">
8-
<title>Simple Jquery Project</title>
9-
<link rel="shortcut icon" href="assets/public/images/logo.png" type="image/png">
5+
<meta charset="utf-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
<title>Simple Jquery Project</title>
9+
<link rel="shortcut icon" href="public/images/logo.png" type="image/png">
1010

11-
<!-- Jquery UI -->
12-
<link rel="stylesheet" href="public/css/jquery-ui.min.css">
11+
<!-- Bootstrap -->
12+
<link rel="stylesheet" href="public/css/bootstrap.min.css">
1313

14-
<!-- Bootstrap -->
15-
<link rel="stylesheet" href="public/css/bootstrap.min.css">
14+
<!-- Font Awesome -->
15+
<link rel="stylesheet" href="public/css/font-awesome.min.css">
1616

17-
<!-- Font Awesome -->
18-
<link rel="stylesheet" href="public/css/font-awesome.min.css">
17+
<!-- Style -->
18+
<link rel="stylesheet" href="public/css/main.css">
1919

20-
<!-- Style -->
21-
<link rel="stylesheet" href="public/css/main.css">
22-
23-
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
24-
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
25-
<!--[if lt IE 9]>
20+
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
21+
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
22+
<!--[if lt IE 9]>
2623
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
2724
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
2825
<![endif]-->
2926
</head>
3027

3128
<body class="list-projects">
3229

33-
<main>
34-
<div class="container">
35-
<div class="item col-sm-4">
36-
<div class="wrapper">
37-
<h1>Tabs Widget</h1>
38-
<a href="tabs-widget.html">
39-
<i class="fa fa-link"></i>
40-
</a>
41-
</div>
42-
</div>
43-
<!-- .columns -->
44-
45-
<div class="item col-sm-4">
46-
<div class="wrapper">
47-
<h1>Card Slider Widget</h1>
48-
<a href="card-slider-widget.html">
49-
<i class="fa fa-link"></i>
50-
</a>
51-
</div>
52-
</div>
53-
<!-- .columns -->
54-
55-
<div class="item col-sm-4">
56-
<div class="wrapper">
57-
<h1>Images Slider Widget</h1>
58-
<a href="images-slider-widget.html">
59-
<i class="fa fa-link"></i>
60-
</a>
61-
</div>
62-
</div>
63-
<!-- .columns -->
64-
65-
<div class="item col-sm-4">
66-
<div class="wrapper">
67-
<h1>Overlay Widget</h1>
68-
<a href="">
69-
<i class="fa fa-link"></i>
70-
</a>
71-
</div>
72-
</div>
73-
<!-- .columns -->
74-
75-
<div class="item col-sm-4">
76-
<div class="wrapper">
77-
<h1>Simple Quiz App</h1>
78-
<a href="">
79-
<i class="fa fa-link"></i>
80-
</a>
30+
<main>
31+
<div class="container">
32+
<div class="item col-sm-4">
33+
<div class="wrapper">
34+
<a href="tabs-widget.html" target="_blank">
35+
<h1>Tabs Widget</h1>
36+
</a>
37+
</div>
38+
</div>
39+
<!-- .columns -->
40+
41+
<div class="item col-sm-4">
42+
<div class="wrapper">
43+
<a href="card-slider-widget.html" target="_blank">
44+
<h1>Card Slider Widget</h1>
45+
</a>
46+
</div>
47+
</div>
48+
<!-- .columns -->
49+
50+
<div class="item col-sm-4">
51+
<div class="wrapper">
52+
<a href="images-slider-widget.html" target="_blank">
53+
<h1>Images Slider Widget</h1>
54+
</a>
55+
</div>
56+
</div>
57+
<!-- .columns -->
58+
59+
<div class="item col-sm-4">
60+
<div class="wrapper">
61+
<a href="overlay-widget.html" target="_blank">
62+
<h1>Overlay Widget</h1>
63+
</a>
64+
</div>
65+
</div>
66+
<!-- .columns -->
67+
68+
<div class="item col-sm-4">
69+
<div class="wrapper">
70+
<a href="simple-quiz-app.html" target="_blank">
71+
<h1>Simple Quiz App</h1>
72+
</a>
73+
</div>
74+
</div>
75+
<!-- .columns -->
76+
77+
<div class="item col-sm-4">
78+
<div class="wrapper">
79+
<a href="" target="_blank">
80+
<h1>Simple Gallery App</h1>
81+
</a>
82+
</div>
83+
</div>
84+
<!-- .columns -->
8185
</div>
82-
</div>
83-
<!-- .columns -->
84-
85-
<div class="item col-sm-4">
86-
<div class="wrapper">
87-
<h1>Simple Gallery App</h1>
88-
<a href="">
89-
<i class="fa fa-link"></i>
90-
</a>
91-
</div>
92-
</div>
93-
<!-- .columns -->
94-
</div>
95-
<!-- .container -->
96-
</main>
97-
98-
<!-- Jquery -->
99-
<script src="public/js/jquery-3.2.1.min.js"></script>
86+
<!-- .container -->
10087

101-
<!-- Jquery UI -->
102-
<script src="public/js/jquery-ui.min.js"></script>
88+
</main>
10389

104-
<!-- Main -->
105-
<script src="public/js/tabs-widget.js"></script>
106-
<script src="public/js/card-slider-widget.js"></script>
107-
<script src="public/js/images-slider-widget.js"></script>
10890
</body>
10991

11092
</html>

‎overlay-widget.html

+102
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="utf-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
<title>Overlay Widget</title>
9+
<link rel="shortcut icon" href="public/images/logo.png" type="image/png">
10+
11+
<!-- Bootstrap -->
12+
<link rel="stylesheet" href="public/css/bootstrap.min.css">
13+
14+
<!-- Font Awesome -->
15+
<link rel="stylesheet" href="public/css/font-awesome.min.css">
16+
17+
<!-- Style -->
18+
<link rel="stylesheet" href="public/css/main.css">
19+
20+
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
21+
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
22+
<!--[if lt IE 9]>
23+
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
24+
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
25+
<![endif]-->
26+
</head>
27+
28+
<body class="overlay-widget">
29+
30+
<main>
31+
<div class="container">
32+
<h1>Overlay Widget</h1>
33+
34+
<div class="btn-overlay text-center">
35+
<button class="btn btn-success item" data-overlay="1">Overlay 1</button>
36+
<button class="btn btn-success item" data-overlay="2">Overlay 2</button>
37+
</div>
38+
<!-- .btn-overlay -->
39+
40+
<div class="overlay-wrapper" data-overlay-content="1">
41+
42+
<div class="overlay">
43+
<div class="overlay-dialog">
44+
<div class="overlay-header">
45+
<h3>Overlay 1</h3>
46+
47+
<div class="btn-close-overlay">
48+
<i class="fa fa-close"></i>
49+
</div>
50+
</div>
51+
<!-- .overlay-header -->
52+
53+
<div class="overlay-body">
54+
<p>Sit commodo Lorem mollit nostrud. Id eiusmod deserunt incididunt consectetur adipisicing velit
55+
magna ut exercitation elit ullamco labore. Excepteur elit id eiusmod fugiat ad do anim fugiat
56+
fugiat. Esse nostrud ea est minim elit duis in.</p>
57+
</div>
58+
<!-- .overlay-body -->
59+
</div>
60+
<!-- .overlay-dialog -->
61+
</div>
62+
<!-- .overlay -->
63+
</div>
64+
<!-- .overlay-wrapper -->
65+
66+
<div class="overlay-wrapper" data-overlay-content="2">
67+
68+
<div class="overlay">
69+
<div class="overlay-dialog">
70+
<div class="overlay-header">
71+
<h3>Overlay 2</h3>
72+
73+
<div class="btn-close-overlay">
74+
<i class="fa fa-close"></i>
75+
</div>
76+
</div>
77+
<!-- .overlay-header -->
78+
79+
<div class="overlay-body">
80+
<p>Sit commodo Lorem mollit nostrud. Id eiusmod deserunt incididunt consectetur adipisicing velit
81+
magna ut exercitation elit ullamco labore. Excepteur elit id eiusmod fugiat ad do anim fugiat
82+
fugiat. Esse nostrud ea est minim elit duis in.</p>
83+
</div>
84+
<!-- .overlay-body -->
85+
</div>
86+
<!-- .overlay-dialog -->
87+
</div>
88+
<!-- .overlay -->
89+
</div>
90+
<!-- .overlay-wrapper -->
91+
</div>
92+
<!-- .container -->
93+
</main>
94+
95+
<!-- Jquery -->
96+
<script src="public/js/jquery-3.2.1.min.js"></script>
97+
98+
<!-- Tabs Widget -->
99+
<script src="public/js/overlay-widget.js"></script>
100+
</body>
101+
102+
</html>

‎public/css/components/overlay-widget.css

+2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)