khivy · bytewife · Sep 9, 2022 · Sep 6, 2022 · Sep 6, 2022 · Sep 6, 2022
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/index.html b/public/index.html
@@ -2,19 +2,19 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="icon" href="favicon.ico" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta
-      name="description"
-      content="Web site created using create-react-app"
+      name="Wordtris"
+      content="A game of Tetris + words!"
     />
-    <link rel="apple-touch-icon" href="/logo192.png" />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
     -->
-    <link rel="manifest" href="/manifest.json" />
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
     <!--
       Notice the use of %PUBLIC_URL% in the tags above.
       It will be replaced with the URL of the `public` folder during the build.
@@ -24,7 +24,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>React App</title>
+    <title>Wordtris</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

diff --git a/public/logo192.png b/public/logo192.png
diff --git a/public/logo512.png b/public/logo512.png
diff --git a/public/manifest.json b/public/manifest.json
@@ -1,6 +1,6 @@
 {
-    "short_name": "React App",
-    "name": "Create React App Sample",
+    "short_name": "Wordtris",
+    "name": "Wordtris",
     "icons": [
         {
             "src": "favicon.ico",

diff --git a/src/App.css b/src/App.css
@@ -1,38 +1,25 @@
-.App {
+.cell {
+  display: flex;
+  border-radius: 0.4vmin;
+  justify-content: center;
+  justify-items: center;
+  align-content: center;
+  align-items: center;
   text-align: center;
+  line-height: normal;
 }
 
-.App-logo {
-  height: 40vmin;
-  pointer-events: none;
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .App-logo {
-    animation: App-logo-spin infinite 20s linear;
-  }
-}
-
-.App-header {
-  background-color: #282c34;
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
-  color: white;
+.cell.with-margin {
+  margin: 0.4vmin;
 }
 
-.App-link {
-  color: #61dafb;
+.with-text-style {
+  font-family: "Arial", "Courier New", "Lucida Console", monospace;
+  font-weight: bold;
+  text-transform: uppercase;
 }
 
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
+@font-face {
+  font-family: 'Press Start 2P';
+  src: local('Press Start 2P'), url(./fonts/PressStart2P-Regular.ttf) format('truetype');
 }