Skip to content

Commit fd2704b

Browse files
adamrockeradamrocker
committed
feat: #4 basic web ui
1 parent 52e683f commit fd2704b

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

47 files changed

+3986
-173
lines changed

‎.eslintrc.json

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"env": {
3+
"es6": true,
4+
"node": true,
5+
"jest": true
6+
},
7+
"parser": "@typescript-eslint/parser",
8+
"plugins": ["react", "prettier"],
9+
"parserOptions": {
10+
"version": 2018,
11+
"sourceType": "module",
12+
"ecmaFeatures": {
13+
"jsx": true
14+
}
15+
},
16+
"extends": [
17+
"eslint:recommended",
18+
"plugin:react/recommended",
19+
"plugin:prettier/recommended",
20+
"prettier/react"
21+
],
22+
"rules": {
23+
"prettier/prettier": "error",
24+
"no-unused-vars": "warn"
25+
}
26+
}

‎.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,8 @@
1717
.env.development.local
1818
.env.test.local
1919
.env.production.local
20+
.vscode
21+
.eslintcache
2022

2123
npm-debug.log*
2224
yarn-debug.log*

‎.prettierrc

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"bracketSpacing": true,
3+
"jsxBracketSameLine": false,
4+
"semi": true,
5+
"singleQuote": true,
6+
"trailingComma": "es5",
7+
"tabWidth": 2,
8+
"useTabs": false
9+
}

‎package.json

+30-1
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@
33
"version": "0.1.0",
44
"private": true,
55
"dependencies": {
6+
"@material-ui/core": "^4.11.2",
7+
"@material-ui/icons": "^4.11.2",
68
"@testing-library/jest-dom": "^5.11.4",
79
"@testing-library/react": "^11.1.0",
810
"@testing-library/user-event": "^12.1.10",
@@ -23,7 +25,8 @@
2325
"start": "react-scripts start",
2426
"build": "react-scripts build",
2527
"test": "react-scripts test",
26-
"eject": "react-scripts eject"
28+
"eject": "react-scripts eject",
29+
"format": "prettier --write ./src/**/*.{ts,tsx}"
2730
},
2831
"eslintConfig": {
2932
"extends": [
@@ -42,5 +45,31 @@
4245
"last 1 firefox version",
4346
"last 1 safari version"
4447
]
48+
},
49+
"devDependencies": {
50+
"@typescript-eslint/eslint-plugin": "^4.10.0",
51+
"@typescript-eslint/parser": "^4.10.0",
52+
"babel-eslint": "^10.1.0",
53+
"eslint-config-prettier": "^7.0.0",
54+
"eslint-plugin-prettier": "^3.3.0",
55+
"eslint-plugin-react": "^7.21.5",
56+
"husky": "^4.3.6",
57+
"lint-staged": "^10.5.3",
58+
"prettier": "^2.2.1"
59+
},
60+
"husky": {
61+
"hooks": {
62+
"pre-commit": "lint-staged"
63+
}
64+
},
65+
"lint-staged": {
66+
"*.{html,css,scss,md,json,yaml}": [
67+
"prettier --write",
68+
"git add"
69+
],
70+
"*.{js,jsx}": [
71+
"prettier --write",
72+
"git add"
73+
]
4574
}
4675
}

‎public/index.html

+14-1
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,27 @@
33
<head>
44
<meta charset="utf-8" />
55
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
6+
<link
7+
rel="stylesheet"
8+
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
9+
/>
10+
<link
11+
rel="stylesheet"
12+
href="https://fonts.googleapis.com/icon?family=Material+Icons"
13+
/>
14+
615
<meta name="viewport" content="width=device-width, initial-scale=1" />
16+
717
<meta name="theme-color" content="#000000" />
818
<meta
919
name="description"
1020
content="Web site created using create-react-app"
1121
/>
1222
<!-- Origin Trials Token for WebHID API (http://localhost:3000) -->
13-
<meta http-equiv="origin-trial" content="AtVj7tyZiBCnbT3+8BJ4LQ6vEiAm4gIoUNDIdCvRFhntI3I3dSfPriO3+ALi/+L9ePE3NLyqDzJ31p46MYaEhg8AAABJeyJvcmlnaW4iOiJodHRwOi8vbG9jYWxob3N0OjMwMDAiLCJmZWF0dXJlIjoiV2ViSElEIiwiZXhwaXJ5IjoxNjExNTczMDM1fQ==">
23+
<meta
24+
http-equiv="origin-trial"
25+
content="AtVj7tyZiBCnbT3+8BJ4LQ6vEiAm4gIoUNDIdCvRFhntI3I3dSfPriO3+ALi/+L9ePE3NLyqDzJ31p46MYaEhg8AAABJeyJvcmlnaW4iOiJodHRwOi8vbG9jYWxob3N0OjMwMDAiLCJmZWF0dXJlIjoiV2ViSElEIiwiZXhwaXJ5IjoxNjExNTczMDM1fQ=="
26+
/>
1427
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
1528
<!--
1629
manifest.json provides metadata used when your web app is installed on a

‎src/App.tsx

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,17 @@
11
import React from 'react';
22
import './App.css';
33
import { BrowserRouter, Switch, Route } from 'react-router-dom';
4-
import Configure from './configure/Configure';
4+
5+
import Configure from './components/configure/Configure';
56
import Hid from './hid/ui/Hid';
67
import Top from './Top';
78

89
const App = () => {
910
return (
1011
<BrowserRouter>
1112
<Switch>
12-
<Route exact path='/hid' component={Hid} />
13-
<Route exact path='/configure' component={Configure} />
13+
<Route exact path="/hid" component={Hid} />
14+
<Route exact path="/configure" component={Configure} />
1415
<Route component={Top} />
1516
</Switch>
1617
</BrowserRouter>

‎src/Top.tsx

+2-4
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
1+
import React from 'react';
12
const Top = () => {
2-
return (
3-
<div>Top</div>
4-
);
3+
return <div>Top</div>;
54
};
65

76
export default Top;
8-

‎src/_variables.scss

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
:root {
2+
--key-height: 54px;
3+
--key-width: 54px;
4+
}
5+
6+
$font-xl: 140%;
7+
$font-l: 100%;
8+
$font-m: 62.5%;
9+
$font-s: 58%;
10+
$font-xs: 40%;
11+
12+
$color-gray: gray;
13+
$color-gray-100: #f5f5f5;
14+
$color-gray-200: #eeeeee;
15+
$color-gray-300: #e0e0e0;
16+
$color-gray-400: #dbdbdb;
17+
$primary: #3f51b5;
18+
$primary-light: #7986cb;
19+
$primary-pale: #c5cae9;
20+
$warning: #f44336;
21+
22+
$space-xl: 32px;
23+
$space-l: 16px;
24+
$space-m: 8px;
25+
$space-s: 4px;
26+
$space-xs: 2px;

0 commit comments

Comments
 (0)