styles as its own css file

Signed-off-by: Tyler M. Neher <tyler@neherdata.com>
tylermneher · Feb 2, 2024 · 1a81556 · 1a81556
1 parent f14695e
commit 1a81556
Show file tree

Hide file tree

Showing 2 changed files with 95 additions and 99 deletions.
diff --git a/index.html b/index.html
@@ -3,20 +3,20 @@
 
 <head>
  <!-- Matomo -->
-<script>
- var _paq = window._paq = window._paq || [];
- /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
- _paq.push(['trackPageView']);
- _paq.push(['enableLinkTracking']);
- (function() {
- var u="//matomo.neher.casa/";
- _paq.push(['setTrackerUrl', u+'matomo.php']);
- _paq.push(['setSiteId', '4']);
- var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
- g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
- })();
-</script>
-<!-- End Matomo Code -->
+ <script>
+ var _paq = window._paq = window._paq || [];
+ /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+ _paq.push(['trackPageView']);
+ _paq.push(['enableLinkTracking']);
+ (function () {
+ var u = "//matomo.neher.casa/";
+ _paq.push(['setTrackerUrl', u + 'matomo.php']);
+ _paq.push(['setSiteId', '4']);
+ var d = document, g = d.createElement('script'), s = d.getElementsByTagName('script')[0];
+ g.async = true; g.src = u + 'matomo.js'; s.parentNode.insertBefore(g, s);
+ })();
+ </script>
+ <!-- End Matomo Code -->
 
  <meta charset="utf-8" />
 
@@ -25,85 +25,15 @@
  <meta property="og:type" content="website" />
  <meta property="og:url" content="https://skn-un.tylermneher.me/" />
  <meta property="og:description" content="Saint Kitts and Nevis at the United Nations General Assembly" />
- <meta property="og:image" content="https://raw.githubusercontent.com/tylermneher/skn-un.tylermneher.me/main/og-image-sknun.png" />
+ <meta property="og:image"
+ content="https://raw.githubusercontent.com/tylermneher/skn-un.tylermneher.me/main/og-image-sknun.png" />
  <meta property="og:image:type" content="image/png" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
 
  <!-- Load an icon library to show a hamburger menu (bars) on small screens -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
 
- <style>
- * {
- box-sizing: border-box;
- font-family: monospace;
- }
-
-
- /* Hide the links inside the navigation menu (except for logo/home) */
- .topnav #myLinks {
- display: none;
- }
-
-
- body {
- margin: 0;
- font-family: monospace;
- }
-
- /* Style the top navigation bar */
- .topnav {
- overflow: hidden;
- background-color: #333;
- }
-
- /* Style the topnav links */
- .topnav a {
- float: left;
- display: block;
- color: #f2f2f2;
- text-align: center;
- padding: 14px 16px;
- text-decoration: none;
- }
-
- /* Change color on hover */
- .topnav a:hover {
- background-color: #ddd;
- color: black;
- }
-
- /* Style the content */
- .content {
- background-color: #ddd;
- padding: 10px;
- text-align: center;
- -webkit-text-size-adjust: auto;
- -moz-text-size-adjust: auto;
- -ms-text-size-adjust: auto;
- text-size-adjust: auto;
- /* Should be removed. Only for demonstration */
- }
-
- /* Style the footer */
- .footer {
- background-color: #f1f1f1;
- padding: 10px;
- text-align: left;
- }
-
- img {
- width: 80%;
- height: auto;
- padding: 5px;
- }
-
- /* Style the hamburger menu */
- .topnav a.icon {
- position: absolute;
- right: 0;
- top: 0;
- }
- </style>
+ <link rel="stylesheet" type="text/css" href="styles.css" />
 
  <!-- <script>
  function myFunction() {
@@ -118,11 +48,11 @@
  <!-- Top Navigation Menu -->
 
  <div class="topnav">
- <a><b>| Tyler M. Neher |</b></a>
- <a href="https://www.github.com/tylermneher">GitHub</a>
- <a href="https://www.linkedin.com/in/tylermneher">Linkedin</a>
- <a href="https://resume.tylermneher.me">Resume</a>
- </div>
+ <a><b>| Tyler M. Neher |</b></a>
+ <a href="https://www.github.com/tylermneher">GitHub</a>
+ <a href="https://www.linkedin.com/in/tylermneher">Linkedin</a>
+ <a href="https://resume.tylermneher.me">Resume</a>
+ </div>
 
 </head>
 
@@ -140,11 +70,7 @@ <h2>Saint Kitts and Nevis at the United Nations General Assembly</h2>
 </div>
 
 <div class="footer">
- <p> | Tyler M. Neher © 2024 | <a href="mailto:tyler@neherdata.com">Contact Me</a> </p>
- </div>
-
-</html>
-
-
-
+ <p> | Tyler M. Neher © 2024 | <a href="mailto:tyler@neherdata.com">Contact Me</a> </p>
+</div>
 
+</html>
diff --git a/styles.css b/styles.css
@@ -0,0 +1,70 @@
+* {
+ box-sizing: border-box;
+ font-family: monospace;
+}
+
+
+/* Hide the links inside the navigation menu (except for logo/home) */
+.topnav #myLinks {
+ display: none;
+}
+
+
+body {
+ margin: 0;
+ font-family: monospace;
+}
+
+/* Style the top navigation bar */
+.topnav {
+ overflow: hidden;
+ background-color: #333;
+}
+
+/* Style the topnav links */
+.topnav a {
+ float: left;
+ display: block;
+ color: #f2f2f2;
+ text-align: center;
+ padding: 14px 16px;
+ text-decoration: none;
+}
+
+/* Change color on hover */
+.topnav a:hover {
+ background-color: #ddd;
+ color: black;
+}
+
+/* Style the content */
+.content {
+ background-color: #ddd;
+ padding: 10px;
+ text-align: center;
+ -webkit-text-size-adjust: auto;
+ -moz-text-size-adjust: auto;
+ -ms-text-size-adjust: auto;
+ text-size-adjust: auto;
+ /* Should be removed. Only for demonstration */
+}
+
+/* Style the footer */
+.footer {
+ background-color: #f1f1f1;
+ padding: 10px;
+ text-align: left;
+}
+
+img {
+ width: 80%;
+ height: auto;
+ padding: 5px;
+}
+
+/* Style the hamburger menu */
+.topnav a.icon {
+ position: absolute;
+ right: 0;
+ top: 0;
+}