diff --git a/frontend/public/favicon.ico b/frontend/public/favicon.ico
index a11777c..02010c7 100644
Binary files a/frontend/public/favicon.ico and b/frontend/public/favicon.ico differ
diff --git a/frontend/public/index.html b/frontend/public/index.html
index aa069f2..962e547 100644
--- a/frontend/public/index.html
+++ b/frontend/public/index.html
@@ -7,7 +7,7 @@
-
React App
+ Leaky Ships
diff --git a/frontend/public/logo.svg b/frontend/public/logo.svg
deleted file mode 100644
index 9dfc1c0..0000000
--- a/frontend/public/logo.svg
+++ /dev/null
@@ -1 +0,0 @@
-
\ No newline at end of file
diff --git a/frontend/public/logo192.png b/frontend/public/logo192.png
index fc44b0a..3d63d11 100644
Binary files a/frontend/public/logo192.png and b/frontend/public/logo192.png differ
diff --git a/frontend/public/logo512.png b/frontend/public/logo512.png
index a4e47a6..1962360 100644
Binary files a/frontend/public/logo512.png and b/frontend/public/logo512.png differ
diff --git a/frontend/public/svgs/1.svg b/frontend/public/svgs/1.svg
new file mode 100644
index 0000000..1f99254
--- /dev/null
+++ b/frontend/public/svgs/1.svg
@@ -0,0 +1,888 @@
+
+
+
+
diff --git a/frontend/public/svgs/11.svg b/frontend/public/svgs/11.svg
new file mode 100644
index 0000000..926541a
--- /dev/null
+++ b/frontend/public/svgs/11.svg
@@ -0,0 +1,84 @@
+
+
+
+
diff --git a/frontend/public/svgs/12.svg b/frontend/public/svgs/12.svg
new file mode 100644
index 0000000..b33a51e
--- /dev/null
+++ b/frontend/public/svgs/12.svg
@@ -0,0 +1,76 @@
+
+
+
+
diff --git a/frontend/public/svgs/13.svg b/frontend/public/svgs/13.svg
new file mode 100644
index 0000000..28c29d0
--- /dev/null
+++ b/frontend/public/svgs/13.svg
@@ -0,0 +1,76 @@
+
+
+
+
diff --git a/frontend/public/svgs/14.svg b/frontend/public/svgs/14.svg
new file mode 100644
index 0000000..8dc9598
--- /dev/null
+++ b/frontend/public/svgs/14.svg
@@ -0,0 +1,84 @@
+
+
+
+
diff --git a/frontend/public/svgs/2.svg b/frontend/public/svgs/2.svg
new file mode 100644
index 0000000..bbd45c0
--- /dev/null
+++ b/frontend/public/svgs/2.svg
@@ -0,0 +1,252 @@
+
+
+
+
diff --git a/frontend/public/svgs/3.svg b/frontend/public/svgs/3.svg
new file mode 100644
index 0000000..657beb5
--- /dev/null
+++ b/frontend/public/svgs/3.svg
@@ -0,0 +1,528 @@
+
+
+
+
diff --git a/frontend/public/svgs/4.svg b/frontend/public/svgs/4.svg
new file mode 100644
index 0000000..0d835e3
--- /dev/null
+++ b/frontend/public/svgs/4.svg
@@ -0,0 +1,772 @@
+
+
+
+
diff --git a/frontend/public/svgs/5.svg b/frontend/public/svgs/5.svg
new file mode 100644
index 0000000..59ec4f1
--- /dev/null
+++ b/frontend/public/svgs/5.svg
@@ -0,0 +1,272 @@
+
+
+
+
diff --git a/frontend/public/svgs/6.svg b/frontend/public/svgs/6.svg
new file mode 100644
index 0000000..cad6c30
--- /dev/null
+++ b/frontend/public/svgs/6.svg
@@ -0,0 +1,344 @@
+
+
+
+
diff --git a/frontend/src/App.scss b/frontend/src/App.scss
index 74b5e05..29d20de 100644
--- a/frontend/src/App.scss
+++ b/frontend/src/App.scss
@@ -36,3 +36,42 @@
transform: rotate(360deg);
}
}
+
+#game {
+ border: 5px solid orange;
+ position: relative;
+ height: 1200px;
+ width: 1200px;
+ display: grid;
+ grid-template-rows: repeat(12, 1fr);
+ grid-template-columns: repeat(12, 1fr);
+ grid-gap: 1px solid blue;
+
+ .missle {
+ height: 50px;
+ width: 50px;
+ position: absolute;
+ border: 1px solid red;
+ top: calc(50px + 100px * var(--y));
+ left: calc(50px + 100px* var(--x));
+ transform: translateX(-50%) translateY(-50%);
+ }
+
+ svg {
+ height: 50px;
+ width: 50px;
+ align-self: center;
+ justify-self: center;
+ grid-column: var(--x);
+ grid-row: var(--y);
+ }
+ .r1 {
+ border: 2px solid blue;
+ }
+ .r2 {
+ border: 2px solid green;
+ }
+ .r3 {
+ border: 2px solid yellowgreen;
+ }
+}
\ No newline at end of file
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index bbf9332..f0a82af 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,20 +1,38 @@
+import { faXmark } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { CSSProperties } from 'react';
import './App.scss';
function App() {
+
+ let elems: {
+ field: string,
+ x: number,
+ y: number,
+ }[] = [],
+ count = 12;
+ for (let x = 1; x <= count; x++) {
+ for (let y = 1; y <= count; y++) {
+ elems.push({field: String.fromCharCode(64+x)+(y), x, y})
+ }
+ }
return (