Skip to content

Commit 25b4fca

Browse files
jeffradejeffrade
committedMay 31, 2022
First design interation with Bootstrap5
1 parent e443013 commit 25b4fca

File tree

6 files changed

+240
-4
lines changed

6 files changed

+240
-4
lines changed
 

‎404.html

+53-1
Original file line numberDiff line numberDiff line change
@@ -1 +1,53 @@
1-
Oops!
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
5+
<meta charset="utf-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
7+
<meta name="description" content="" />
8+
<meta name="author" content="Devix Labs, Inc." />
9+
<title>devixlabs.com</title>
10+
<!--[if lt IE 9]>
11+
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
12+
<![endif]-->
13+
<link rel="shortcut icon" href="/img/favicon.png" type="image/png">
14+
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.3/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />
15+
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" />
16+
<link href="/css/styles.css" rel="stylesheet" type="text/css" />
17+
</head>
18+
<body>
19+
<nav class="navbar navbar-light bg-light static-top">
20+
<div class="container-fluid">
21+
<div class="row align-items-center">
22+
<div class="col">
23+
<a class="navbar-brand" href="/"><img src="/img/devixlabs.png"></a>
24+
</div>
25+
<div class="col">
26+
<ul class="nav justify-content-end align-items-center">
27+
<li class="nav-item"><a class="nav-link" href="/products">Products</a></li>
28+
<li class="nav-item"><a class="nav-link" href="/careers">Careers</a></li>
29+
<li class="nav-item"><a class="nav-link" href="https://github.com/devixlabs"><i class="bi-github fs-3"></i></a></li>
30+
<li class="nav-item"><a class="nav-link" href="mailto:contact@devixlabs.com"><i class="bi-envelope-paper fs-3"></i></a></li>
31+
</ul>
32+
</div>
33+
</div>
34+
</div>
35+
</nav>
36+
<div class="main container position-relative">
37+
<div class="row justify-content-center">
38+
<div class="col-xl">
39+
<div class="row align-items-center text-center">
40+
<h3>Oops, wrong turn!</h3>
41+
</div>
42+
</div>
43+
</div>
44+
</div>
45+
<footer class="py-2">
46+
<div class="container px-2">
47+
<p class="m-0 text-center">&copy; Devix Labs, Inc 2022. All Rights Reserved.</p>
48+
</div>
49+
</footer>
50+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
51+
<script src="/scripts/app.js"></script>
52+
</body>
53+
</html>

‎careers/index.html

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
5+
<meta charset="utf-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
7+
<meta name="description" content="" />
8+
<meta name="author" content="Devix Labs, Inc." />
9+
<title>devixlabs.com</title>
10+
<!--[if lt IE 9]>
11+
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
12+
<![endif]-->
13+
<link rel="shortcut icon" href="/img/favicon.png" type="image/png">
14+
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.3/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />
15+
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" />
16+
<link href="/css/styles.css" rel="stylesheet" type="text/css" />
17+
</head>
18+
<body>
19+
<nav class="navbar navbar-light bg-light static-top">
20+
<div class="container-fluid">
21+
<div class="row align-items-center">
22+
<div class="col">
23+
<a class="navbar-brand" href="/"><img src="/img/devixlabs.png"></a>
24+
</div>
25+
<div class="col">
26+
<ul class="nav justify-content-end align-items-center">
27+
<li class="nav-item"><a class="nav-link" href="/products">Products</a></li>
28+
<li class="nav-item"><a class="nav-link" href="/careers">Careers</a></li>
29+
<li class="nav-item"><a class="nav-link" href="https://github.com/devixlabs"><i class="bi-github fs-3"></i></a></li>
30+
<li class="nav-item"><a class="nav-link" href="mailto:contact@devixlabs.com"><i class="bi-envelope-paper fs-3"></i></a></li>
31+
</ul>
32+
</div>
33+
</div>
34+
</div>
35+
</nav>
36+
<div class="main container position-relative">
37+
<div class="row justify-content-center">
38+
<div class="col-xl">
39+
<div class="row align-items-center text-center">
40+
<h3>Coming soon!</h3>
41+
</div>
42+
</div>
43+
</div>
44+
</div>
45+
<footer class="py-2">
46+
<div class="container px-2">
47+
<p class="m-0 text-center">&copy; Devix Labs, Inc 2022. All Rights Reserved.</p>
48+
</div>
49+
</footer>
50+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
51+
<script src="/scripts/app.js"></script>
52+
</body>
53+
</html>

‎css/styles.css

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
body {
2+
background-color: var(--bs-body-color);
3+
color: rgb(var(--bs-light-rgb));
4+
}
5+
6+
footer {
7+
width: 100%;
8+
font-size: small;
9+
}
10+
11+
div.main {
12+
color: rgb(var(--bs-light-rgb));
13+
margin-top: 10%;
14+
margin-bottom: 25%;
15+
}
16+
17+
div.main a {
18+
color: rgb(var(--bs-light-rgb));
19+
}
20+
21+
a.navbar-brand img {
22+
margin-left: 2%;
23+
margin-top: 2%;
24+
margin-bottom: 2%;
25+
width: 50%;
26+
min-width: 200px;
27+
}
28+
29+
a.nav-link {
30+
color: var(--bs-body-color);
31+
}

‎index.html

+44-3
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,55 @@
33
<head>
44
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
55
<meta charset="utf-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
7+
<meta name="description" content="" />
8+
<meta name="author" content="Devix Labs, Inc." />
69
<title>devixlabs.com</title>
710
<!--[if lt IE 9]>
811
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
912
<![endif]-->
1013
<link rel="shortcut icon" href="/img/favicon.png" type="image/png">
11-
<!-- Bootstrap Core CSS -->
12-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
14+
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.3/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />
15+
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" />
16+
<link href="/css/styles.css" rel="stylesheet" type="text/css" />
1317
</head>
14-
<body style="background-image:url('img/devixlabs.png'); background-color: rgb(255,255,255); background-repeat: no-repeat; background-position: center center; background-attachment:fixed; background-size: contain;">
18+
<body>
19+
<nav class="navbar navbar-light bg-light static-top">
20+
<div class="container-fluid">
21+
<div class="row align-items-center">
22+
<div class="col">
23+
<a class="navbar-brand" href="/"><img src="/img/devixlabs.png"></a>
24+
</div>
25+
<div class="col">
26+
<ul class="nav justify-content-end align-items-center">
27+
<li class="nav-item"><a class="nav-link" href="/products">Products</a></li>
28+
<li class="nav-item"><a class="nav-link" href="/careers">Careers</a></li>
29+
<li class="nav-item"><a class="nav-link" href="https://github.com/devixlabs"><i class="bi-github fs-3"></i></a></li>
30+
<li class="nav-item"><a class="nav-link" href="mailto:contact@devixlabs.com"><i class="bi-envelope-paper fs-3"></i></a></li>
31+
</ul>
32+
</div>
33+
</div>
34+
</div>
35+
</nav>
36+
<div class="main container position-relative">
37+
<div class="row justify-content-center">
38+
<div class="col-xl">
39+
<div class="row align-items-center text-center">
40+
<div class="col fs-2 mb-3"><i data-bs-toggle="tooltip" data-bs-original-title="Development & Infrastructure" class="bi bi-cloud"></i></div>
41+
<div class="col fs-2 mb-3"><i data-bs-toggle="tooltip" data-bs-original-title="Automation & Integrations" class="bi bi-robot"></i></div>
42+
<div class="col fs-2 mb-3"><i data-bs-toggle="tooltip" data-bs-original-title="Security" class="bi bi-file-lock"></i></div>
43+
<div class="col fs-2 mb-3"><i data-bs-toggle="tooltip" data-bs-original-title="Cryptography" class="bi bi-key"></i></div>
44+
<!-- <div class="col fs-2 mb-3"><i data-bs-toggle="tooltip" data-bs-original-title="Bitcoin" class="bi bi-currency-bitcoin"></i></div> -->
45+
</div>
46+
</div>
47+
</div>
48+
</div>
49+
<footer class="py-2">
50+
<div class="container px-2">
51+
<p class="m-0 text-center">&copy; Devix Labs, Inc 2022. All Rights Reserved.</p>
52+
</div>
53+
</footer>
54+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
55+
<script src="/scripts/app.js"></script>
1556
</body>
1657
</html>

‎products/index.html

+54
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
5+
<meta charset="utf-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
7+
<meta name="description" content="" />
8+
<meta name="author" content="Devix Labs, Inc." />
9+
<title>devixlabs.com</title>
10+
<!--[if lt IE 9]>
11+
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
12+
<![endif]-->
13+
<link rel="shortcut icon" href="/img/favicon.png" type="image/png">
14+
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.3/font/bootstrap-icons.css" rel="stylesheet" type="text/css" />
15+
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" />
16+
<link href="/css/styles.css" rel="stylesheet" type="text/css" />
17+
</head>
18+
<body>
19+
<nav class="navbar navbar-light bg-light static-top">
20+
<div class="container-fluid">
21+
<div class="row align-items-center">
22+
<div class="col">
23+
<a class="navbar-brand" href="/"><img src="/img/devixlabs.png"></a>
24+
</div>
25+
<div class="col">
26+
<ul class="nav justify-content-end align-items-center">
27+
<li class="nav-item"><a class="nav-link" href="/products">Products</a></li>
28+
<li class="nav-item"><a class="nav-link" href="/careers">Careers</a></li>
29+
<li class="nav-item"><a class="nav-link" href="https://github.com/devixlabs"><i class="bi-github fs-3"></i></a></li>
30+
<li class="nav-item"><a class="nav-link" href="mailto:contact@devixlabs.com"><i class="bi-envelope-paper fs-3"></i></a></li>
31+
</ul>
32+
</div>
33+
</div>
34+
</div>
35+
</nav>
36+
<div class="main container position-relative">
37+
<div class="row justify-content-center">
38+
<div class="col-xl">
39+
<div class="row align-items-center text-center">
40+
<div class="col fs-2 mb-3"><a href="https://flashpaper.dev"><i class="bi bi-link"></i></a></div>
41+
<div class="col fs-2 mb-3"><a href="https://keypost.io"><i class="bi bi-filetype-key"></i></a></div>
42+
</div>
43+
</div>
44+
</div>
45+
</div>
46+
<footer class="py-2">
47+
<div class="container px-2">
48+
<p class="m-0 text-center">&copy; Devix Labs, Inc 2022. All Rights Reserved.</p>
49+
</div>
50+
</footer>
51+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
52+
<script src="/scripts/app.js"></script>
53+
</body>
54+
</html>

‎scripts/app.js

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
// https://getbootstrap.com/docs/5.1/components/tooltips/#example-enable-tooltips-everywhere
2+
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
3+
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
4+
return new bootstrap.Tooltip(tooltipTriggerEl)
5+
})

0 commit comments

Comments
 (0)
Please sign in to comment.