🔨

3 years ago · 0185aa5eec
parent a891fa6a50
commit 0185aa5eec
10 changed files with 22 additions and 48 deletions
--- a/docker-compose.yml
+++ b/docker-compose.yml
@ -6,6 +6,7 @@ services:
      context: ./frontend
    volumes:
      - ./frontend/src:/usr/src/frontend/src
+      - ./frontend/public:/usr/src/frontend/public
    ports:
      - 3000:3000
    environment:
--- a/frontend/public/index.html
+++ b/frontend/public/index.html
@ -2,11 +2,14 @@
 <html lang="en">
  <head>
    <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <link
+      rel="icon"
+      href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>💎</text></svg>"
+    />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta name="description" content="The emmest of vee pees" />
-    <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/
--- a/frontend/public/manifest.json
+++ b/frontend/public/manifest.json
@ -1,23 +1,6 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
-  "icons": [
-    {
-      "src": "favicon.ico",
-      "sizes": "64x64 32x32 24x24 16x16",
-      "type": "image/x-icon"
-    },
-    {
-      "src": "logo192.png",
-      "type": "image/png",
-      "sizes": "192x192"
-    },
-    {
-      "src": "logo512.png",
-      "type": "image/png",
-      "sizes": "512x512"
-    }
-  ],
+  "short_name": "EZ MVP",
+  "name": "MVP Django React",
  "start_url": ".",
  "display": "standalone",
  "theme_color": "#000000",
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@ -1,10 +1,9 @@
-import React from 'react'
 import { BrowserRouter } from 'react-router-dom'
 import { UserContextProvider } from './contexts/UserContext'
 import { CoreLayout } from './layout/CoreLayout'
-import './scss/App.scss'
+import './scss/app.scss'

-function App() {
+const App = () => {
  return (
    <BrowserRouter>
      <UserContextProvider>
--- a/frontend/src/api/data/index.ts
+++ b/frontend/src/api/data/index.ts
@ -1,4 +1,4 @@
-import { User } from '../types'
+import { User } from '../../types'

 export const mockUser: User = {
  username: 'TestUser42',
--- a/frontend/src/api/index.ts
+++ b/frontend/src/api/index.ts
@ -1,7 +1,7 @@
 import { message } from 'antd'
 import axios from 'axios'
 import { User } from '../types'
-import { mockUser } from '../data'
+import { mockUser } from './data'
 import { JWT, getJWT, setHeaders, setJWT, wipeJWT } from '../utils/jwt'

 const dev = process.env.NODE_ENV === 'development'
--- a/frontend/src/pages/Dashboard.tsx
+++ b/frontend/src/pages/Dashboard.tsx
@ -1,8 +1,3 @@
-import React from 'react'
-import { RouteChildrenProps } from 'react-router'
-
-type Props = RouteChildrenProps & {}
-
-export const Dashboard = (_: Props) => {
+export const Dashboard = () => {
  return <p>a dashboard</p>
 }
--- a/frontend/src/pages/Login.tsx
+++ b/frontend/src/pages/Login.tsx
@ -1,4 +1,4 @@
-import React, { FormEvent, useState } from 'react'
+import { FormEvent, useState } from 'react'
 import { useUserContext } from '../contexts/UserContext'

 export const Login = () => {
--- a/frontend/src/pages/Profile.tsx
+++ b/frontend/src/pages/Profile.tsx
@ -1,7 +1,3 @@
-import React from 'react'
-
-type Props = {}
-
-export const Profile = (props: Props) => {
+export const Profile = () => {
  return <p>Look, A user profile!</p>
 }
--- a/frontend/src/scss/app.scss
+++ b/frontend/src/scss/app.scss
@ -1,29 +1,26 @@
-
 .ant-layout-header.app-header {
-  display: flex; 
+  display: flex;
  flex-direction: row;
  justify-content: space-between;
  vertical-align: middle;
  padding: 0 1rem;

- a {
-   font-size: 1.2rem;
-   font-weight: bold;
- }
+  a {
+    font-size: 1.2rem;
+    font-weight: bold;
+  }

  div {
    display: flex;
    vertical-align: middle;
    height: 100%;

-    * { 
+    * {
      margin: auto 0.5rem;
    }
-
  }

  h3.ant-typography {
-    
    margin: auto 0 !important;
  }

@ -36,4 +33,4 @@
  min-height: 100vh;
  // background-color: #444;
  // color: white;
-}
+}