From 067b447b98a01fbfd4338c29ae5affc7edf5f9f7 Mon Sep 17 00:00:00 2001
From: TinWoodman92 <chrhodgden@gmail.com>
Date: Mon, 15 Jan 2024 20:31:20 -0600
Subject: adding X & O vectors

---
 app.js          |  8 ++++++++
 img/favicon.svg | 38 --------------------------------------
 style.css       | 15 ++++++++++++++-
 svg/favicon.svg | 38 ++++++++++++++++++++++++++++++++++++++
 svg/o.svg       |  3 +++
 svg/x.svg       |  4 ++++
 6 files changed, 67 insertions(+), 39 deletions(-)
 delete mode 100644 img/favicon.svg
 create mode 100644 svg/favicon.svg
 create mode 100644 svg/o.svg
 create mode 100644 svg/x.svg

diff --git a/app.js b/app.js
index 158168b..3007f69 100644
--- a/app.js
+++ b/app.js
@@ -1,5 +1,13 @@
 console.log('Hello from app.js');
 
+fetch('svg/x.svg')
+	.then(response => response.text())
+	.then(fileContents => {
+		console.log(fileContents);
+	})
+	.catch(error => console.error('Error reading the file:', error));
+
+
 const turns = {true: 'X', false: 'O'};
 
 const getXBoard = function() {
diff --git a/img/favicon.svg b/img/favicon.svg
deleted file mode 100644
index 96b4eab..0000000
--- a/img/favicon.svg
+++ /dev/null
@@ -1,38 +0,0 @@
-<svg width='100' height='100' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'>
-	<style>
-		:root {
-			--dark-stroke: 1;
-			--stroke-lightness: calc(100% - calc(var(--dark-stroke) * 100%));
-			--x-color: hsl(300, 100%, 50%);
-			--o-color: hsl(180, 100%, 50%);
-			--stroke-color: hsl(0, 0%, var(--stroke-lightness));
-			--stroke-width: 6;
-		}
-
-		.board {
-			stroke-width: var(--stroke-width);
-			stroke: var(--stroke-color);
-		}
-
-		.x {
-			stroke-width: var(--stroke-width);
-			stroke: var(--x-color);
-		}
-
-		.o {
-			stroke-width: var(--stroke-width);
-			stroke: var(--o-color);
-			fill-opacity: 0;
-		}
-	</style>
-	
-	<path class='board' d='M33 0, 33 100'/>
-	<path class='board' d='M66 0, 66 100'/>
-	<path class='board' d='M0 33, 100 33'/>
-	<path class='board' d='M0 66, 100 66'/>
-	
-	<path class='x' d='M3 3, 27 27'/>
-	<path class='x' d='M27 3, 3 27'/>
-
-	<circle class='o' cx='85' cy='85' r='12'/>
-</svg>
\ No newline at end of file
diff --git a/style.css b/style.css
index 97ed162..5ade367 100644
--- a/style.css
+++ b/style.css
@@ -1,6 +1,8 @@
 :root{
 	--foreground-color: hsl(180, 50%, 50%);
 	--background-color: hsl(0, 0%, 0%);
+	--x-color: hsl(300, 100%, 50%);
+	--o-color: hsl(180, 100%, 50%);
 }
 
 @media (max-width: 600px) {
@@ -62,4 +64,15 @@ nav {
 
 .square:nth-child(n+6) {
 	border-bottom: 0;
-}
\ No newline at end of file
+}
+
+.x {
+	stroke-width: var(--stroke-width);
+	stroke: var(--x-color);
+}
+
+.o {
+	stroke-width: var(--stroke-width);
+	stroke: var(--o-color);
+	fill-opacity: 0;
+}
diff --git a/svg/favicon.svg b/svg/favicon.svg
new file mode 100644
index 0000000..96b4eab
--- /dev/null
+++ b/svg/favicon.svg
@@ -0,0 +1,38 @@
+<svg width='100' height='100' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'>
+	<style>
+		:root {
+			--dark-stroke: 1;
+			--stroke-lightness: calc(100% - calc(var(--dark-stroke) * 100%));
+			--x-color: hsl(300, 100%, 50%);
+			--o-color: hsl(180, 100%, 50%);
+			--stroke-color: hsl(0, 0%, var(--stroke-lightness));
+			--stroke-width: 6;
+		}
+
+		.board {
+			stroke-width: var(--stroke-width);
+			stroke: var(--stroke-color);
+		}
+
+		.x {
+			stroke-width: var(--stroke-width);
+			stroke: var(--x-color);
+		}
+
+		.o {
+			stroke-width: var(--stroke-width);
+			stroke: var(--o-color);
+			fill-opacity: 0;
+		}
+	</style>
+	
+	<path class='board' d='M33 0, 33 100'/>
+	<path class='board' d='M66 0, 66 100'/>
+	<path class='board' d='M0 33, 100 33'/>
+	<path class='board' d='M0 66, 100 66'/>
+	
+	<path class='x' d='M3 3, 27 27'/>
+	<path class='x' d='M27 3, 3 27'/>
+
+	<circle class='o' cx='85' cy='85' r='12'/>
+</svg>
\ No newline at end of file
diff --git a/svg/o.svg b/svg/o.svg
new file mode 100644
index 0000000..60d3c75
--- /dev/null
+++ b/svg/o.svg
@@ -0,0 +1,3 @@
+<svg width='100' height='100' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'>
+	<circle class='o' cx='85' cy='85' r='12'/>
+</svg>
\ No newline at end of file
diff --git a/svg/x.svg b/svg/x.svg
new file mode 100644
index 0000000..f572665
--- /dev/null
+++ b/svg/x.svg
@@ -0,0 +1,4 @@
+<svg width='100' height='100' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'>
+	<path class='x' d='M3 3, 27 27'/>
+	<path class='x' d='M27 3, 3 27'/>
+</svg>
\ No newline at end of file
-- 
cgit v1.2.3