initial commit

css/index.css

@@ -0,0 +1,236 @@
+/*
+    Atari Color Schemes
+
+    Atari 800
+    --------
+    Chassis (dark):  #d5cdb4
+    Chassis (light): #fcf4dd
+    
+    Start Button:    #fed700
+    Select Button:   #fab700
+    Option Button:   #e99e23
+    Reset Button:    #ae7900
+
+    Keycaps (dark):  #322918
+    Keycaps (light): #766e5a
+
+    Atari 130XE
+    -----------
+    Chassis (dark):  #9a9c9b
+    Chassis (light): #babebd
+
+    Logo:            #d0625c
+
+    Keycaps (bkgd):  #d5d5d3
+    Keycaps (ltrs):  #868581
+*/
+
+* {
+	margin: 0;
+	padding: 10;
+	box-sizing: border-box;
+}
+
+HTML
+{
+	background-color: #0a4984;
+	font-size: 2.5vw;
+	#background-image: url('../assets/Atari_Wallpaper.jpg');
+	#background-position: 80% 80%;
+    #background-repeat: no-repeat;
+    #background-size: 100%;
+}
+
+@font-face {
+  font-family: 'Atari Classic Extrasmooth';
+  src: url('../fonts/ATARCE__.TTF') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'Atari Classic Smooth';
+  src: url('../fonts/ATARCS__.TTF') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'Atari Full';
+  src: url('../fonts/ATARI_FULL.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'Atari Classic Chunky';
+  src: url('../fonts/ATARCC__.TTF') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'Atari Tiny';
+  src: url('../fonts/atari-small-font.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'Atarian System Regular';
+  src: url('../fonts/sf-atarian-system.regular.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+body {
+  font-family: 'Atari Classic Chunky';
+  justify-content: center;
+  margin: 0.5em;
+  padding: 0.5em;
+  color: #afcde9;
+  #background-color: #0a4984;
+  background-color: #003366;
+}
+
+p {
+    font-family: 'Atari Classic Smooth';
+    font-size: 0.595em;
+    color: #f2f2f2;
+}
+
+.p2 {
+    font-family: 'Atari Classic Smooth';
+    font-size: 0.485em;
+    color: #f2f2f2;
+}
+
+.p3 {
+    font-family: 'Atari Classic Extrasmooth';
+    font-size: 0.365em;
+    color: #f2f2f2;
+}
+
+pre {
+    width: 60%;
+    border: solid gray 2px;
+    padding-top: 10px;
+    padding-bottom: 0px;
+    padding-left:5px;
+    margin-left: 30px;
+    background-color: #004d80;
+    font-family: 'Atari Classic Chunky';
+    font-size: 0.450em;
+    line-height: 1.2;
+    color: #f2f2f2;
+}
+
+.title {
+    width: 100%;
+    text-align: center;
+    font-family: 'Atarian System Regular';
+    font-size: 3.0em;
+    line-height: 1.1;
+    #color: #f0e6da;
+    color: #fcf4dd;
+}
+
+.subtitle {
+    width: 80%;
+    margin: auto;
+    text-align: center;
+    font-family: 'Atarian System Regular';
+    font-size: 1.0em;
+    line-height: 1.1;
+    color: #afcde9;
+    #color: #dd504a;
+    #color: #ffb600;
+}
+
+.start {
+  font-family: 'Atarian System Regular';
+  font-size: 1.2em;
+  color: #322918;
+  text-align: center;
+  background-color: #fed700;
+  width: 150px;
+  border: 2px solid #322918;
+  padding: 10px;
+  margin: 10px;
+}
+
+.select {
+  font-family: 'Atarian System Regular';
+  font-size: 1.2em;
+  color: #322918;
+  text-align: center;
+  background-color: #fab700;
+  width: 150px;
+  border: 2px solid #322918;
+  padding: 10px;
+  margin: 10px;
+}
+
+.option {
+  font-family: 'Atarian System Regular';
+  font-size: 1.2em;
+  color: #322918;
+  text-align: center;
+  background-color: #e99e23;
+  width: 150px;
+  border: 2px solid #322918;
+  padding: 10px;
+  margin: 10px;
+}
+
+.button-row {
+    display: flex;
+    align-content: center;
+    justify-content: center;
+}
+
+/* unvisited link */
+a:link {
+  color: #5a97d0;
+}
+
+/* visited link */
+a:visited {
+  color: #5a97d0;
+}
+
+/* mouse over link */
+a:hover {
+  color: #5a97d0;
+}
+
+/* selected link */
+a:active {
+  color: #5a97d0;
+}
+
+H1 {
+    color: #f0e6da;
+    margin-left: auto;
+    margin-right: auto;
+    font-size: 3.2vw;
+    width: 100%;
+}
+
+H2 {
+    font-size: 2.8vw;
+}
+
+H3 {
+    font-size: 2.4vw;
+    color: #dd504a;
+}
+
+H4 {
+    font-size: 2.1vw;
+    color: #6c7063;
+}
+
+UL {
+    margin:1em;
+    padding:0;
+}
+
+LI {
+    padding-bottom: 0.2em;
+    color: #dd504a;
+}

index.html

@@ -0,0 +1,39 @@
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+<meta http-equiv="content-type" content="text/html; charset=utf-8" />
+<title>Atari High Scores</title>
+<meta name="keywords" content="" />
+<meta name="description" content="" />
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<link rel="stylesheet" type="text/css" href="css/index.css" media="screen" />
+<link rel="icon" type="image/png" href="assets/AtariLogo.png" />
+</head>
+<body>
+  <p class="title">Atari Code</p>
+  <p class="subtitle">A site devoted to learning to code on the Atari 8-Bit line of computers</p>
+
+  <div class="button-row"><div class="start">Start</div> <div class="select">Select</div> <div class="option">Option</div></div>
+
+  <h1>H1 Test Text</h1>
+  <p>Some standard text.</p>
+  <p class="p2">Some small text</p>
+  <p class="p3">Some very tiny text</p>
+
+  <h2>H2 Test Text</h2>
+  <p>Some standard text.</p>
+  <p class="p2">Some small text</p>
+  <p class="p3">Some very tiny text</p>
+
+  <h3>H3 Test Text</h3>
+  <p>Some standard text.</p>
+  <p class="p2">Some small text</p>
+  <p class="p3">Some very tiny text</p>
+
+  <h4>H4 Test Text</h4>
+  <p class="p2">Here is a code block:</p>
+  <pre>
+ 10 PRINT "Hello"
+ 20 GOTO 10
+  </pre>
+</body>
+</html>