Skip to content

Commit 8e4ae37

Browse files
committed
add main page
1 parent 217bbb7 commit 8e4ae37

File tree

2 files changed

+138
-0
lines changed

2 files changed

+138
-0
lines changed

html/index.html

+138
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,138 @@
1+
<html>
2+
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="description" content="Generate random colors">
6+
<meta name="keywords" content="HTML, CSS, JavaScript, Colors">
7+
<meta name="author" content="Jee Vang, Ph.D.">
8+
<meta name="organization" content="One-Off Coder">
9+
<title>Web Programming Demos</title>
10+
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
11+
integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
12+
<style>
13+
* {
14+
font-family: monospace;
15+
}
16+
17+
body {
18+
margin: 10px;
19+
}
20+
21+
.center {
22+
text-align: center;
23+
}
24+
25+
.color-table {
26+
margin: auto;
27+
width: calc(100vw - 17px);
28+
}
29+
</style>
30+
</head>
31+
32+
<body onload="init()">
33+
<div class="jumbotron jumbotron-fluid">
34+
<div class="container">
35+
<h1 class="display-4">Web Programming Demos</h1>
36+
<h4>
37+
<a href="https://www.oneoffcoder.com" target="_blank">
38+
One-Off Coder
39+
</a>
40+
</h4>
41+
<p>
42+
<b><i>"The best way to predict the future is to create it," President Abraham Lincoln.</i></b>
43+
</p>
44+
<hr class="my-4">
45+
<p>
46+
<a href="https://github.com/oneoffcoder/lightning-projects/tree/master/html/" target="_blank">
47+
Source Code on GitHub
48+
</a>
49+
</p>
50+
<img src="logo.png" />
51+
</div>
52+
</div>
53+
54+
<div class="alert alert-primary" role="alert">
55+
The following are fun coding projects to learn. They test your skills from begginer, intermediate to
56+
advanced. Some of the projects involve artificial intelligence and access to your multimedia devices
57+
(e.g. web camera and speakers).
58+
</div>
59+
60+
<div>
61+
<ul class="list-group">
62+
<li class="list-group-item">
63+
<a href="checkers">Checkers</a>: Learn how to code checkers with HTML 5's drag and drop features.
64+
</li>
65+
<li class="list-group-item">
66+
<a href="colors">Colors</a>: Have fun making colors out of tables.
67+
</li>
68+
<li class="list-group-item">
69+
<a href="game-of-life">Game of Life</a>: Create artificial life according to Conway's Game of Life.
70+
</li>
71+
<li class="list-group-item">
72+
<a href="guessing-game">Guessing Game</a>: Test your guessing skills by guessing numbers generated by
73+
the computer.
74+
</li>
75+
<li class="list-group-item">
76+
<a href="morse-code">Morse Code</a>: Master sound manipulation with web technologies and learn about
77+
morse code.
78+
</li>
79+
<li class="list-group-item">
80+
<a href="rps-game">Rock, Paper, Scissor</a>: Code the classic Rock, Paper, Scissor game.
81+
</li>
82+
<li class="list-group-item">
83+
<a href="rps++">Rock, Paper, Scissor (Re-imagined)</a>: Use a double-dose of artificial intelligence to
84+
challenge
85+
the computer in an interactive game of Rock, Paper, Scissor.
86+
</li>
87+
<li class="list-group-item">
88+
<a href="sign-language">Sign Language</a>: A fun and neat program to test your knowledge of sign
89+
language
90+
alphabets.
91+
</li>
92+
<li class="list-group-item">
93+
<a href="slot-machine-game">Slot Machine</a>: Emulate a slot machine game.
94+
</li>
95+
<li class="list-group-item">
96+
<a href="solar-system">Solar System</a>: Bring the solar system to life by coding it!
97+
</li>
98+
<li class="list-group-item">
99+
<a href="tic-tac-toe">Tic-Tac-Toe</a>: Play tic-tac-toe against the computer.
100+
</li>
101+
</ul>
102+
</div>
103+
104+
<br />
105+
<div class="alert alert-success" role="alert">
106+
One-Off Coder help you achieve a life-long journey of continous success in computer science and
107+
coding.
108+
109+
<ul>
110+
<li>
111+
<a href="https://www.oneoffcoder.com">Website</a>
112+
</li>
113+
<li>
114+
<a href="https://twitter.com/oneoffcoder">Twitter</a>
115+
</li>
116+
<li>
117+
<a href="https://www.facebook.com/oneoffcoder">Facebook</a>
118+
</li>
119+
<li>
120+
<a href="https://www.youtube.com/channel/UCCCv8Glpb2dq2mhUj5mcHCQ">YouTube</a>
121+
</li>
122+
</ul>
123+
124+
<b><i>"The best way to create the future is to code it," One-Off Coder.</i></b>
125+
</div>
126+
127+
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
128+
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
129+
crossorigin="anonymous"></script>
130+
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"
131+
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
132+
crossorigin="anonymous"></script>
133+
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
134+
integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
135+
crossorigin="anonymous"></script>
136+
</body>
137+
138+
</html>

html/logo.png

6.8 KB
Loading

0 commit comments

Comments
 (0)