Commit Diff


commit - /dev/null
commit + 523b56200298912d789d3e3b858b43bc4135b023
blob - /dev/null
blob + c6cdcb75b52ee179f6c23b1acc989169b6408d72 (mode 644)
--- /dev/null
+++ index.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html lang="en">
+<meta charset="UTF-8">
+<title>Kyle Ackerman</title>
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/comic-mono@0.0.1/index.min.css">
+<link rel="stylesheet" href="./style.css">
+<section class="container">
+  <div class="name">
+    <h1>Kyle</h1>
+  </div>
+  <div class="name">
+    <h1> Ackerman</h1>
+  </div>
+</section> 
+<body>
+  <section class="links">
+  <ul>
+    <li><a href="https://mastodon.social/@kack">Mastodon</a></li>
+    <li><a href="https://github.com/kack1">Github</a></li>
+    <li><a href="https://git.kyleackerman.net">Projects</a></li>
+    <li><a href="https://kyleackerman.net/aboutme">About Me</a></li>
+  </ul>
+  </section>
+</body>
+</html> 
blob - /dev/null
blob + 5d55eabe1df94e6791795c1e0caa93f3a6a25b04 (mode 644)
--- /dev/null
+++ index.html~
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<meta charset="UTF-8">
+<title>Kyle Ackerman</title>
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/comic-mono@0.0.1/index.min.css">
+<link rel="stylesheet" href="./style.css">
+<section class="container">
+  <div class="name">
+    <h1>Kyle</h1>
+  </div>
+  <div class="name">
+    <h1> Ackerman</h1>
+  </div>
+</section> 
+<body>
+  <p> This is a test paragraph.</p> 
+</body>
+</html> 
blob - /dev/null
blob + 2899316a28847323b4cbd4403eb7a2335ccb3366 (mode 644)
--- /dev/null
+++ style.css
@@ -0,0 +1,77 @@
+:root {
+    --theme-purple: #bf00ff;
+    --theme-gray: #b4a7b7;
+    --theme-black: #b4e4351;
+    font-family: Comic Mono;
+    font-size: 40px;
+    width: 100%;
+}
+ /* unvisited link */
+a:link , a:visited {
+    color:  var(--theme-gray);
+}
+
+
+/* mouse over link */
+a:hover {
+    color: var(--theme-purple);
+}
+
+.name h1 {
+    text-align: center;
+    padding:auto;
+    margin: auto;
+}
+
+.name{
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+    color: var(--theme-purple);
+    max-width: 450px;
+    margin: auto;
+    
+}
+
+.container{
+    margin: auto;
+    padding: 10px 10px;
+    width: 100%;
+    max-width: 450px;
+}
+
+.links {
+    margin: auto;
+    padding: 0 10px;
+    max-width: 450px;
+    width: 100% 
+}
+.links ul {
+    list-style-type: none; /* Remove bullets */
+    white-space:nowrap;
+    text-align: center;
+    padding: 0;
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+}
+
+@media only screen and (min-width: 768px){
+    
+    .links {
+	max-width: 768px;
+    }
+    .links ul {
+	flex-direction: row;
+	text-align: space-between;
+    }
+    .links li{
+	padding: 0 10px;
+    }
+}
+
+@media (prefers-color-scheme: dark) {
+    
+    body{
+	background-color: black;
+}
blob - /dev/null
blob + 01b6d13693582ff8bd59412b053dde9c20504fcd (mode 644)
--- /dev/null
+++ style.css~
@@ -0,0 +1,24 @@
+:root {
+    --theme-purple: #bf00ff;
+    font-family: Comic Mono;
+    font-size: 40px;
+    width: 100%;
+}
+
+h1 {
+    padding: 0;
+    margin: 0;
+}
+
+.name{
+    display: flex;
+    justify-content: center;
+    align-items: columns;
+    color: var(--theme-purple);
+}
+
+.container{
+    margin: auto;
+    padding: 10px 10px;
+    
+}