-
Notifications
You must be signed in to change notification settings - Fork 0
/
work.html
122 lines (99 loc) · 5.64 KB
/
work.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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="author" content="RobSm!th">
<meta name="description" content="A basic responsive web page using Bootstrap">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous">
<!-- Other Styles and CSS -->
<link rel="stylesheet" href="css/styles.css">
<!-- Favicons -->
<link rel="icon" href="favicon.ico" type="image">
<link rel="apple-touch-icon" sizes="180x180" href="img/favicon_smile_monocle/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon_smile_monocle/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon_smile_monocle/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css">
<title>Work/Portfolio</title>
</head>
<body>
<!-- Header Section for logo and Navigation -->
<header class="">
<!-- Start of Navigation -->
<nav id="my-nav" class="navbar navbar-expand-sm navbar-dark">
<div class="container">
<a href="index.html"><i class=" bi-bootstrap" style="font-size: 2rem; color: #fff;"></i></a>
<!-- <a class="navbar-brand" href="#">Bootstrap</a> -->
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse text-center" id="navbarNavAltMarkup">
<nav class="navbar-nav ms-auto">
<a class="nav-link" aria-current="page" href="index.html">Home</a>
<a class="nav-link active" href="work.html">Work</a>
<a class="nav-link" href="services.html">Services</a>
<a class="nav-link" href="about.html">About</a>
<a class="nav-link" href="contact.html">Contact</a>
</nav>
</div>
</div>
</nav>
</header>
<section class="px-4 py-5 my-5 text-center">
<img class="d-block mx-auto mb-4" src="img/icons/bootstrap-fill.svg" alt="" width="72" height="57">
<h1 class="display-5 fw-bold">Hello World</h1>
<p class="lead mb-4">Welcome to the Work/Portfolio page.</p>
<div class="col-lg-6 mx-auto">
<p class="lead mb-4">Quickly design and customize responsive mobile-first sites with Bootstrap, the world’s
most popular front-end open source toolkit, featuring Sass variables and mixins, responsive grid system,
extensive prebuilt components, and powerful JavaScript plugins.</p>
<div class="d-grid gap-2 d-sm-flex justify-content-sm-center">
<button type="button" class="btn btn-primary btn-lg px-4 gap-3">Primary button</button>
<button type="button" class="btn btn-outline-secondary btn-lg px-4">Secondary</button>
</div>
</div>
</section>
<div class="s-divider"></div>
<!-- Footer Section -->
<div class="divider"></div>
<div class="container">
<footer class="d-flex flex-wrap justify-content-between align-items-center py-3 my-4 border-top">
<div class="col-md-4 d-flex align-items-center">
<a href="/" class="mb-3 me-2 mb-md-0 text-muted text-decoration-none lh-1">
<svg class="bi" width="30" height="24">
<use xlink:href="#bootstrap" /></svg>
</a>
<span class="text-muted">
<p class="copy">© 2020 RobSm!th</p>
</span>
</div>
<nav class="nav col-md-4 justify-content-end list-unstyled d-flex">
<li class="ms-3"><a class="text-muted" href="#"><i class="bi bi-facebook"></i></a></li>
<li class="ms-3"><a class="text-muted" href="#"><i class="bi bi-instagram"></i></a></li>
<li class="ms-3"><a class="text-muted" href="#"><i class="bi bi-twitter"></i></a></li>
</nav>
</footer>
</div>
<!-- /Footer Section -->
<!-- My Scripts -->
<!-- <script src="js/main.js"></script> -->
<!-- Fontawesome -->
<script src="https://kit.fontawesome.com/6d0ef8f08a.js" crossorigin="anonymous"></script>
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"
integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ" crossorigin="anonymous">
</script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.3/dist/umd/popper.min.js" integrity="sha384-W8fXfP3gkOKtndU4JGtKDvXbO53Wy8SZCQHczT5FMiiqmQfUpWbYdTil/SxwZgAN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.min.js" integrity="sha384-skAcpIdS7UcVUC05LJ9Dxay8AXcDYfBJqt1CJ85S/CFujBsIzCIv+l9liuYLaMQ/" crossorigin="anonymous"></script>
-->
</body>
</html>