-
Notifications
You must be signed in to change notification settings - Fork 0
/
landing-page-sandbox.html
100 lines (89 loc) · 4.42 KB
/
landing-page-sandbox.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>TITLE</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3" crossorigin="anonymous" defer></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-IDwe1+LCz02ROU9k972gdyvl+AESN10+x7tBKgc9I5HFtuNz0wWnPclzo6p9vxnk" crossorigin="anonymous" defer></script>
<!-- <link href="./css/contact-sandbox-style.css" rel="stylesheet"> -->
</head>
<body>
<div class="card text-bg-dark">
<img src="./img/tw-cropped-horizontal.png" class="card-img" alt="Horizontal Image - Typewriter on a Desk">
<div class="card-img-overlay">
<h5 class="card-title display-6">Roger's Programming Shoppe</h5>
<p class="card-text">Pragmatic Programmatic Solutions</p>
<p class="card-text" style="height:5vh"></p>
<div class="card text-bg-warning opacity-75 p-2" style="max-width: 35vw">
<!-- <img src="./img/tw-cropped-horizontal.png" class="card-img" alt="Horizontal Image - Typewriter on a Desk"> -->
<!-- <div class="card-img-overlay"> -->
<h5 class="card-title display-6">Latest Blog Entries</h5>
<div class="row row-cols-1 row-cols-md-2 g-4">
<div class="col">
<div class="card">
<img src="./img/pexels-luis-gomes-546819.jpg" class="card-img-top" alt="Screen of Code">
<div class="card-body">
<h5 class="card-title">Exploring the Development Process</h5>
<p class="card-text">Concepts from bootcamp for use in the bigger task of software development.</p>
<a href="#" class="btn btn-dark">Read More...</a>
</div>
</div>
</div>
<div class="col">
<div class="card">
<img src="./img/pexels-andrea-piacquadio-3777572.jpg" class="card-img-top" alt="Frustrated Programmer">
<div class="card-body">
<h5 class="card-title">What is the One Thing Developers Hate Doing?</h5>
<p class="card-text">A short examination of one of the software writer's biggest pitfalls.</p>
<a href="#" class="btn btn-dark">Read More...</a>
</div>
</div>
</div>
<!-- <div class="col">
<div class="card">
<img src="..." class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content.</p>
</div>
</div>
</div>
<div class="col">
<div class="card">
<img src="..." class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
</div>
</div> -->
</div>
</div>
</div>
</div>
</div>
<div class="card text-bg-warning p-5">
<!-- <img src="./img/tw-cropped-horizontal.png" class="card-img" alt="Horizontal Image - Typewriter on a Desk"> -->
<!-- <div class="card-img-overlay"> -->
<h5 class="card-title display-6">Links</h5>
<ul>
<li>Blog</li>
<li>My Portfolio</li>
<li>Education/CV</li>
<li>About Me</li>
</ul>
</div>
</div>
<!-- <div class="container-fluid text-bg-dark text-center text-white bg-dark">
<img src="./img/tw-cropped-horizontal.png" class="img-fluid" alt="Typewriter Vertical Background">
<div class="img-overlay">
<h5 class="display-6 pt-2 pb-2 fw-bolder bg-white text-dark opacity-75">Roger Mullins</h5>
<div class="row d-flex align-items-center"></div>
</div> -->
</div>
</div>
</div>
</body>
</html>