rfront/public/style.css

@@ -0,0 +1,14 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}
+

rfront/src/components/App.js

@@ -1,6 +1,6 @@
-import "./styles/App.css";
+import "./App.css";
-import Messages from "./components/Messages";
+import Messages from "./Messages";
-import TextField from "./components/TextField";
+import TextField from "./TextField";
 import { useEffect, useState } from "react";
 import { io } from "socket.io-client";
 

rfront/src/index.js

@@ -1,8 +1,6 @@
-import React from 'react';
+import React from "react";
-import ReactDOM from 'react-dom/client';
+import ReactDOM from "react-dom/client";
+import App from './components/App';
 
-import './styles/index.css';
+const root = ReactDOM.createRoot(document.getElementById("root"));
-import App from './App';
+root.render(<App />);
-
-const root = ReactDOM.createRoot(document.getElementById('root'));
-root.render(<App />);

rfront/src/styles/index.css

@@ -1,65 +0,0 @@
-* {
-  box-sizing: border-box;
-}
-
-html {
-  font-family: sans-serif;
-}
-
-body {
-  margin: 0;
-  background-color: #383838;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-label {
-  font-weight: bold;
-  margin-bottom: 0.5rem;
-  display: block;
-  font-size: 1.25rem;
-}
-
-input {
-  font: inherit;
-  padding: 1rem;
-  border: 1px solid #ccc;
-  font-size: 1.5rem;
-  display: block;
-  width: 100%;
-  margin-bottom: 1rem;
-  border-radius: 30px;
-  text-align: center;
-  color: #242424;
-}
-
-input:focus {
-  outline: none;
-  border-color: #6e0040;
-  background-color: #ffdff2;
-}
-
-button {
-  font: inherit;
-  background-color: #6e0040;
-  color: white;
-  border: 1px solid #6e0040;
-  border-radius: 30px;
-  padding: 0.5rem 1.5rem;
-  cursor: pointer;
-  font-size: 2rem;
-}
-
-button:hover,
-button:active {
-  background-color: #b80e71;
-  border-color: #b80e71;
-}
-
-code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
-    monospace;
-}