-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
116 lines (114 loc) · 4.23 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
<!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" />
<!-- Latest compiled and minified CSS -->
<link
rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
/>
<link rel="stylesheet" href="menu.css" />
<title>Document</title>
</head>
<body>
<div>
<div>
<p class="row p-0 m-0 headline">Widgets</p>
</div>
<div class="main-page">
<div class="row p-0 m-0">
<div class="col-sm-4 p-4 m-0">
<div class="card" style="width: 400px;">
<img
class="card-img-top"
src="./assets/widgetThumbnail/hoverCard.jpg"
alt="Card image"
/>
<div class="card-body">
<h4 class="card-title">Hover Card</h4>
<p class="card-text">
A hover card with image, text and read more button. While you
place the mouse on the card you the card will slide the image
up and show the content in that card with read more button.
</p>
<a href="./Hover card/index.html">Demo</a>
</div>
</div>
</div>
<div class="col-sm-4 p-4 m-0">
<div class="card" style="width: 400px;">
<img
class="card-img-top"
src="./assets/widgetThumbnail/neonButton.jpg"
alt="Card image"
/>
<div class="card-body">
<h4 class="card-title">Hover Button</h4>
<p class="card-text">
The button border are have linear gradient color with
transaction delay for each span and this for this transaction
.scss file is used.
</p>
<a href="./Neon button/index.html">Demo</a>
</div>
</div>
</div>
<div class="col-sm-4 p-4 m-0">
<div class="card" style="width: 400px;">
<img
class="card-img-top"
src="./assets/widgetThumbnail/smokyText.jpg"
alt="Card image"
/>
<div class="card-body">
<h4 class="card-title">Smoke Text</h4>
<p class="card-text">
The button border are have linear gradient color with
transaction delay for each span and this for this transaction
.scss file is used.
</p>
<a href="./smoke text/index.html">Demo</a>
</div>
</div>
</div>
<!-- <div class="col-sm-4 p-4 m-0">
<div class="card" style="width:400px">
<img
class="card-img-top"
src="./assets/begin-in-coffeeMug.jpg"
alt="Card image"
/>
<div class="card-body">
<h4 class="card-title">John Doe</h4>
<p class="card-text">Some example text.</p>
<a href="#" class="btn btn-primary">See Profile</a>
</div>
</div>
</div>
<div class="col-sm-4 p-4 m-0">
<div class="card" style="width:400px">
<img
class="card-img-top"
src="./assets/begin-in-coffeeMug.jpg"
alt="Card image"
/>
<div class="card-body">
<h4 class="card-title">John Doe</h4>
<p class="card-text">Some example text.</p>
<a href="#" class="btn btn-primary">See Profile</a>
</div>
</div>
</div> -->
</div>
</div>
</div>
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
</body>
</html>