restores previous styling and fixes base lint errors

eslint.config.mjs

@@ -53,14 +53,24 @@ export default [{
             allowConstantExport: true,
         }],
 
-        semi: ["warn", "always"],
-        "comma-dangle": ["warn", "only-multiline"],
 
+        "max-len": [1, 120, 2, { "ignoreComments": true }],
+        "no-console": "off",
         quotes: ["error", "single", {
             allowTemplateLiterals: true,
             avoidEscape: true,
         }],
-
-        camelcase: "error",
-    },
+        "camelcase": ["error", {"properties": "always"}],
+        "semi": ["warn", "always"],
+        "comma-dangle": ["warn", "only-multiline"],
+        "dot-notation": "warn",
+        "space-before-function-paren": "off",
+        "indent": ["warn", 2],
+        "padded-blocks": "warn",
+        "no-trailing-spaces": "warn",
+        "array-bracket-spacing": "warn",
+        "no-multi-spaces": ["error", { "ignoreEOLComments": true }],
+        "padded-blocks": ["error", "never"],
+        "no-var": "error",
+      },
 }];

src/App.jsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import TaskList from './components/TaskList.jsx';
 import './App.css';
 

src/App.test.jsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { render, screen } from '@testing-library/react';
 import App from './App';
 

src/components/Task.jsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
 import PropTypes from 'prop-types';
 
 import './Task.css';

src/components/Task.test.jsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { render, screen } from '@testing-library/react';
+import { vi } from 'vitest';
 import Task from './Task';
 
 describe('Task', () => {
@@ -10,8 +10,8 @@ describe('Task', () => {
         id={1}
         title={'Test Title'}
         isComplete={true}
-        onClickCallback={() => {}}
-        onDeleteCallback={() => {}}
+        onClickCallback={() => { }}
+        onDeleteCallback={() => { }}
       />
     );
 
@@ -21,8 +21,8 @@ describe('Task', () => {
 
   test.skip('Runs callbacks when buttons clicked', () => {
     // Arrange
-    const clickCallback = jest.fn();
-    const deleteCallback = jest.fn();
+    const clickCallback = vi.fn();
+    const deleteCallback = vi.fn();
 
     // Act
     render(
@@ -53,8 +53,8 @@ describe('Task', () => {
         id={1}
         title={'Test Title'}
         isComplete={true}
-        onClickCallback={() => {}}
-        onDeleteCallback={() => {}}
+        onClickCallback={() => { }}
+        onDeleteCallback={() => { }}
       />
     );
 
@@ -70,8 +70,8 @@ describe('Task', () => {
         id={1}
         title={'Test Title'}
         isComplete={false}
-        onClickCallback={() => {}}
-        onDeleteCallback={() => {}}
+        onClickCallback={() => { }}
+        onDeleteCallback={() => { }}
       />
     );
 

src/components/TaskList.jsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import PropTypes from 'prop-types';
 import Task from './Task.jsx';
 import './TaskList.css';

src/components/TaskList.test.jsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { render, screen } from '@testing-library/react';
 import TaskList from './TaskList';
 

src/index.css

@@ -1,3 +1,5 @@
+@import url('./legacy/foundation.css');
+
 body {
   margin: 0;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',

src/legacy/foundation.css

@@ -0,0 +1,67 @@
+blockquote, dd, div, dl, dt, form, h1, h2, h3, h4, h5, h6, li, ol, p, pre, td, th, ul {
+  margin: 0;
+  padding: 0;
+}
+
+dl, ol, ul {
+  margin-bottom: 1rem;
+  list-style-position: outside;
+  line-height: 1.6;
+}
+
+button, input, optgroup, select, textarea {
+  font-family: inherit;
+  font-size: 100%;
+  line-height: 1.15;
+  margin: 0;
+}
+
+button {
+  padding: 0;
+  appearance: none;
+  border: 0;
+  border-radius: 0;
+  background: 0 0;
+  line-height: 1;
+  cursor: auto;
+}
+
+.button {
+  display: inline-block;
+  vertical-align: middle;
+  margin: 0 0 1rem 0;
+  padding: .85em 1em;
+  border: 1px solid transparent;
+  border-radius: 0;
+  transition: background-color .25s ease-out,color .25s ease-out;
+  font-family: inherit;
+  font-size: .9rem;
+  line-height: 1;
+  text-align: center;
+  cursor: pointer;
+}
+
+.button, .button.disabled, .button.disabled:focus, .button.disabled:hover, .button[disabled], .button[disabled]:focus, .button[disabled]:hover {
+  background-color: #1779ba;
+  color: #fefefe;
+}
+
+.button:focus, .button:hover {
+  background-color: #14679e;
+  color: #fefefe;
+}
+
+.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
+  font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif;
+  font-style: normal;
+  font-weight: 400;
+  color: inherit;
+  text-rendering: optimizeLegibility;
+}
+
+.h1, h1 {
+  font-size: 1.5rem;
+  line-height: 1.4;
+  margin-top: 0;
+  margin-bottom: .5rem;
+}