From 4cb7240f9a01e3ac76be2bc16cef6752d23ef43d Mon Sep 17 00:00:00 2001 From: Jeremy Letto Date: Sun, 31 Oct 2021 21:21:24 -0500 Subject: [PATCH] small improvements (#4452) Co-authored-by: Jeremy Letto --- webclient/src/components/Header/Header.tsx | 4 +- .../src/components/KnownHosts/KnownHosts.css | 17 ++++ .../src/components/KnownHosts/KnownHosts.tsx | 15 ++- .../ThreePaneLayout/ThreePaneLayout.tsx | 2 + .../src/containers/App/AppShellRoutes.tsx | 3 +- webclient/src/containers/Login/Login.css | 70 +++++++++---- webclient/src/containers/Login/Login.tsx | 95 +++++++++++++----- webclient/src/containers/Server/Server.tsx | 4 +- webclient/src/forms/LoginForm/LoginForm.tsx | 6 +- webclient/src/images/Images.ts | 9 ++ webclient/src/images/Images.tsx | 7 -- webclient/src/images/countries/.gitignore | 2 +- .../{_Countries.tsx => _Countries.ts} | 4 +- webclient/src/images/faces/_Faces.ts | 9 ++ webclient/src/images/faces/face1.jpg | Bin 0 -> 9052 bytes webclient/src/images/faces/face2.jpg | Bin 0 -> 9681 bytes webclient/src/images/faces/face3.jpg | Bin 0 -> 7840 bytes webclient/src/images/index.ts | 1 + webclient/src/index.css | 2 + webclient/src/material-theme.ts | 17 ++-- webclient/src/types/routes.tsx | 4 +- 21 files changed, 197 insertions(+), 74 deletions(-) create mode 100644 webclient/src/images/Images.ts delete mode 100644 webclient/src/images/Images.tsx rename webclient/src/images/countries/{_Countries.tsx => _Countries.ts} (99%) create mode 100644 webclient/src/images/faces/_Faces.ts create mode 100644 webclient/src/images/faces/face1.jpg create mode 100644 webclient/src/images/faces/face2.jpg create mode 100644 webclient/src/images/faces/face3.jpg create mode 100644 webclient/src/images/index.ts diff --git a/webclient/src/components/Header/Header.tsx b/webclient/src/components/Header/Header.tsx index 84e2ce81..9e5a131d 100644 --- a/webclient/src/components/Header/Header.tsx +++ b/webclient/src/components/Header/Header.tsx @@ -13,11 +13,11 @@ import MenuRoundedIcon from '@material-ui/icons/MenuRounded'; import * as _ from "lodash"; import { AuthenticationService, RoomsService } from "api"; +import { Images } from 'images'; import { RoomsSelectors, ServerSelectors } from "store"; import { Room, RouteEnum, User } from "types"; import "./Header.css"; -import logo from "./logo.png"; import CardImportDialog from '../CardImportDialog/CardImportDialog'; @@ -100,7 +100,7 @@ class Header extends Component {
- logo + logo { AuthenticationService.isConnected(state) && ( diff --git a/webclient/src/components/KnownHosts/KnownHosts.css b/webclient/src/components/KnownHosts/KnownHosts.css index 4b499b52..f9e192b8 100644 --- a/webclient/src/components/KnownHosts/KnownHosts.css +++ b/webclient/src/components/KnownHosts/KnownHosts.css @@ -1,3 +1,20 @@ .KnownHosts { width: 100%; } + +.KnownHosts-item__label { + position: relative; +} + +.KnownHosts-item__label svg { + display: none; + position: absolute; + left: -.1em; + top: 50%; + transform: translate(-100%, -50%); + font-size: .9em; +} + +.Mui-selected .KnownHosts-item__label svg { + display: block; +} diff --git a/webclient/src/components/KnownHosts/KnownHosts.tsx b/webclient/src/components/KnownHosts/KnownHosts.tsx index 3783564f..d4cbe4e9 100644 --- a/webclient/src/components/KnownHosts/KnownHosts.tsx +++ b/webclient/src/components/KnownHosts/KnownHosts.tsx @@ -5,6 +5,7 @@ import Button from '@material-ui/core/Button'; import FormControl from '@material-ui/core/FormControl'; import IconButton from '@material-ui/core/IconButton'; import InputLabel from '@material-ui/core/InputLabel'; +import Check from '@material-ui/icons/Check'; import EditRoundedIcon from '@material-ui/icons/Edit'; import { HostDTO } from 'services'; @@ -64,10 +65,16 @@ const KnownHosts = ({ onChange }) => { { state.hosts.map((host, index) => ( - {host.name} ({ getHostPort(state.hosts[index]).host }:{getHostPort(state.hosts[index]).port}) - editKnownHost(index)}> - - +
+ + {host.name} ({ getHostPort(state.hosts[index]).host }:{getHostPort(state.hosts[index]).port}) +
+ + { host.editable && ( + editKnownHost(index)}> + + + ) }
)) } diff --git a/webclient/src/components/ThreePaneLayout/ThreePaneLayout.tsx b/webclient/src/components/ThreePaneLayout/ThreePaneLayout.tsx index 59e37fb3..de8cadf8 100644 --- a/webclient/src/components/ThreePaneLayout/ThreePaneLayout.tsx +++ b/webclient/src/components/ThreePaneLayout/ThreePaneLayout.tsx @@ -6,6 +6,8 @@ import Hidden from "@material-ui/core/Hidden"; import "./ThreePaneLayout.css"; +// @DEPRECATED +// This component sucks balls, dont use it. It will be removed sooner than later. class ThreePaneLayout extends Component { render() { return ( diff --git a/webclient/src/containers/App/AppShellRoutes.tsx b/webclient/src/containers/App/AppShellRoutes.tsx index 414dfc6a..45e59b24 100644 --- a/webclient/src/containers/App/AppShellRoutes.tsx +++ b/webclient/src/containers/App/AppShellRoutes.tsx @@ -24,7 +24,8 @@ const Routes = () => ( { } />} } /> } /> - + +
); diff --git a/webclient/src/containers/Login/Login.css b/webclient/src/containers/Login/Login.css index 3300197c..3bb97690 100644 --- a/webclient/src/containers/Login/Login.css +++ b/webclient/src/containers/Login/Login.css @@ -11,32 +11,28 @@ .login-content { width: 100%; - max-width: 1000px; + max-width: 500px; display: flex; border-radius: 8px; overflow: hidden; } .login-content__header { - font-family: Teko, sans-serif; + font-family: 'Teko', sans-serif; font-size: 34px; font-weight: bold; display: flex; align-items: center; + margin-bottom: 20px; } .login-content__header img { height: 60px; margin-right: 15px; - margin-bottom: 20px; -} - -.login-content__form, -.login-content__description { - width: 50%; } .login-content__form { + width: 100%; padding: 50px 50px 33px; } @@ -49,8 +45,8 @@ } .login-content__description { + display: none; position: relative; - display: flex; justify-content: center; align-items: center; text-align: center; @@ -67,14 +63,54 @@ align-items: center; } -.login-content__description-image { - width: 100%; -} -.login-content__description-placeholder { +.login-content__description-cards { width: 100%; - height: 207px; - border: 1px solid; + position: relative; + display: flex; + justify-content: space-between; } + +.login-content__description-cards__card { + position: relative; + width: 34%; + padding-bottom: 46%; + border-radius: 8px; + box-shadow: 0 5px 10px 2px rgba(0,0,0,0.20); + font-weight: bold; + font-size: 16px; +} + +.login-content__description-cards__card-wrapper { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} + +.login-content__description-cards__card img { + width: 70%; + border-radius: 50%; + margin: 21% 0 9%; +} + +.login-content__description-cards__card.leftCard { + transform: rotate(-12deg); +} + +.login-content__description-cards__card.rightCard { + transform: rotate(12deg); +} + +.login-content__description-cards__card.topCard { + width: 44%; + padding-bottom: 59%; + position: absolute; + top: 45%; + left: 50%; + transform: translate(-50%, -50%); +} + .login-content__description-subtitle1 { margin: 40px 0 20px; font-size: 28px; @@ -91,8 +127,7 @@ } .login-content__description-bar { position: absolute; - opacity: .2; - background-color: #401C7F; + opacity: .1; border-radius: 8px; } @@ -159,4 +194,5 @@ text-align: center; margin: 20px 0; padding: 20px; + font-weight: bold; } diff --git a/webclient/src/containers/Login/Login.tsx b/webclient/src/containers/Login/Login.tsx index 7bbcfd6d..719e5980 100644 --- a/webclient/src/containers/Login/Login.tsx +++ b/webclient/src/containers/Login/Login.tsx @@ -2,21 +2,58 @@ import React from "react"; import { connect } from "react-redux"; import { Redirect } from "react-router-dom"; -import { styled } from '@material-ui/core/styles'; +import { makeStyles } from '@material-ui/core/styles'; import Button from '@material-ui/core/Button'; import Paper from '@material-ui/core/Paper'; import Typography from '@material-ui/core/Typography'; import { AuthenticationService } from "api"; import { LoginForm } from "forms"; +import { Images } from "images"; import { RouteEnum } from "types"; import { /* ServerDispatch, */ ServerSelectors } from "store"; import "./Login.css"; -import logo from "images/logo.png"; -/*import loginGraphic from "images/login-graphic.png"*/ + +const useStyles = makeStyles(theme => ({ + root: { + '& .login-content__header': { + color: theme.palette.success.light + }, + + '& .login-content__description': { + backgroundColor: theme.palette.primary.main, + color: theme.palette.primary.contrastText, + }, + + '& .login-content__description-bar': { + backgroundColor: theme.palette.primary.dark, + }, + + '& .login-content__description-cards__card': { + backgroundColor: theme.palette.background.paper, + color: theme.palette.primary.main, + }, + + [theme.breakpoints.up('lg')]: { + '& .login-content': { + maxWidth: '1000px', + }, + + '& .login-content__form': { + width: '50%', + }, + + '& .login-content__description': { + width: '50%', + display: 'flex', + }, + }, + }, +})); const Login = ({ state, description }: LoginProps) => { + const classes = useStyles(); const isConnected = AuthenticationService.isConnected(state); const showDescription = () => { @@ -28,16 +65,16 @@ const Login = ({ state, description }: LoginProps) => { }; return ( -
+
{ isConnected && }
- +
- - logo +
+ logo COCKATRICE - +
Login A cross-platform virtual tabletop for multiplayer card games.
@@ -58,11 +95,11 @@ const Login = ({ state, description }: LoginProps) => {
- Cockatrice is an open source project @{ new Date().getUTCFullYear() } + Cockatrice is an open source project. { new Date().getUTCFullYear() }
- +
@@ -72,31 +109,37 @@ const Login = ({ state, description }: LoginProps) => {
+
+
+
+ Stock Player + 1mrlee +
+
+
+
+ Stock Player + CyberX +
+
+
+
+ Stock Player + Gamer69 +
+
+
{ /**/} -

Play multiplayer card games online.

Cross-platform virtual tabletop for multiplayer card games. Forever free.

- - +
+
); } -const ThemedLoginContent = styled('div')(({ theme }) => ({ - backgroundColor: theme.palette.background.paper -})); - -const ThemedLoginDescription = styled('div')(({ theme }) => ({ - backgroundColor: theme.palette.primary.main, - color: theme.palette.primary.contrastText, -})); - -const ThemedLoginHeader = styled('div')(({ theme }) => ({ - color: theme.palette.success.light -})); - interface LoginProps { state: number; description: string; diff --git a/webclient/src/containers/Server/Server.tsx b/webclient/src/containers/Server/Server.tsx index 4ced89ed..4403b286 100644 --- a/webclient/src/containers/Server/Server.tsx +++ b/webclient/src/containers/Server/Server.tsx @@ -8,7 +8,7 @@ import Paper from "@material-ui/core/Paper"; import { RoomsSelectors, ServerSelectors } from "store"; -import { ThreePaneLayout, UserDisplay, VirtualList } from "components"; +import { AuthGuard, ThreePaneLayout, UserDisplay, VirtualList } from "components"; import { Room, User } from "types"; import Rooms from './Rooms'; @@ -20,6 +20,8 @@ class Server extends Component { return (
+ + diff --git a/webclient/src/forms/LoginForm/LoginForm.tsx b/webclient/src/forms/LoginForm/LoginForm.tsx index c32cd5b0..900fe4bd 100644 --- a/webclient/src/forms/LoginForm/LoginForm.tsx +++ b/webclient/src/forms/LoginForm/LoginForm.tsx @@ -27,13 +27,13 @@ const LoginForm = (props) => {
- +
- +
- Auto Connect + Remember Me
diff --git a/webclient/src/images/Images.ts b/webclient/src/images/Images.ts new file mode 100644 index 00000000..6d5f1e2f --- /dev/null +++ b/webclient/src/images/Images.ts @@ -0,0 +1,9 @@ +import { Countries } from "./countries/_Countries"; +import { Faces } from "./faces/_Faces"; +import Logo from './logo.png'; + +export class Images { + static Countries = Countries; + static Faces = Faces; + static Logo = Logo; +} diff --git a/webclient/src/images/Images.tsx b/webclient/src/images/Images.tsx deleted file mode 100644 index c36f5a90..00000000 --- a/webclient/src/images/Images.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import Countries from "./countries/_Countries"; - -export class Images { - static Countries = { - ...Countries - }; -} diff --git a/webclient/src/images/countries/.gitignore b/webclient/src/images/countries/.gitignore index 6e1c6aed..1337edaa 100644 --- a/webclient/src/images/countries/.gitignore +++ b/webclient/src/images/countries/.gitignore @@ -3,4 +3,4 @@ # Except gitignore !.gitignore -!_Countries.tsx \ No newline at end of file +!_Countries.ts diff --git a/webclient/src/images/countries/_Countries.tsx b/webclient/src/images/countries/_Countries.ts similarity index 99% rename from webclient/src/images/countries/_Countries.tsx rename to webclient/src/images/countries/_Countries.ts index f1e3f6b4..c10e87fe 100644 --- a/webclient/src/images/countries/_Countries.tsx +++ b/webclient/src/images/countries/_Countries.ts @@ -247,7 +247,7 @@ import za from "./za.svg"; import zm from "./zm.svg"; import zw from "./zw.svg"; -const Countries = { +export const Countries = { ad, ae, af, @@ -497,5 +497,3 @@ const Countries = { zm, zw, }; - -export default Countries; diff --git a/webclient/src/images/faces/_Faces.ts b/webclient/src/images/faces/_Faces.ts new file mode 100644 index 00000000..73a8c361 --- /dev/null +++ b/webclient/src/images/faces/_Faces.ts @@ -0,0 +1,9 @@ +import face1 from './face1.jpg'; +import face2 from './face2.jpg'; +import face3 from './face3.jpg'; + +export const Faces = { + face1, + face2, + face3, +} diff --git a/webclient/src/images/faces/face1.jpg b/webclient/src/images/faces/face1.jpg new file mode 100644 index 0000000000000000000000000000000000000000..931c5822de492621c6874778085cb00dedf638ba GIT binary patch literal 9052 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 literal 0 HcmV?d00001 diff --git a/webclient/src/images/faces/face2.jpg b/webclient/src/images/faces/face2.jpg new file mode 100644 index 0000000000000000000000000000000000000000..8b5bea967e2d47a354112b250723e72e4ab7fd59 GIT binary patch literal 9681 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 literal 0 HcmV?d00001 diff --git a/webclient/src/images/faces/face3.jpg b/webclient/src/images/faces/face3.jpg new file mode 100644 index 0000000000000000000000000000000000000000..ace651dc0e6295523cae3ab40603b69436d93c74 GIT binary patch literal 7840 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 SJ%wJy?8lPw#4zZ7;r{`wB{$sw literal 0 HcmV?d00001 diff --git a/webclient/src/images/index.ts b/webclient/src/images/index.ts new file mode 100644 index 00000000..e9607291 --- /dev/null +++ b/webclient/src/images/index.ts @@ -0,0 +1 @@ +export * from './Images'; diff --git a/webclient/src/index.css b/webclient/src/index.css index 015c037c..c5f9b923 100644 --- a/webclient/src/index.css +++ b/webclient/src/index.css @@ -1,4 +1,5 @@ @import url('https://fonts.googleapis.com/css2?family=Teko&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap'); :root { @@ -19,6 +20,7 @@ body { font-family: -apple-system, BlinkMacSystemFont, + "Open Sans", "Segoe UI", "Roboto", "Oxygen", diff --git a/webclient/src/material-theme.ts b/webclient/src/material-theme.ts index d2a37345..1bd42244 100644 --- a/webclient/src/material-theme.ts +++ b/webclient/src/material-theme.ts @@ -2,7 +2,7 @@ import { createMuiTheme } from '@material-ui/core'; const palette = { background: { - default: 'dimgrey', + default: 'rgb(35, 35, 35)', paper: '#FFFFFF', }, primary: { @@ -86,15 +86,15 @@ export const materialTheme = createMuiTheme({ justifyContent: 'space-between', }, - '& .MuiButtonBase-root.Mui-selected, & .MuiButtonBase-root.Mui-selected:hover, & .MuiButtonBase-root:hover': { - background: palette.primary.light + '& .MuiButtonBase-root.Mui-selected': { + background: 'none', + fontWeight: 'bold', }, - [[ - '& .MuiButtonBase-root.Mui-selected', - '& .MuiButtonBase-root.Mui-selected:hover', - '& .MuiButtonBase-root:hover' - ].join(', ')]: { + [ + '& .MuiButtonBase-root:hover,' + + '& .MuiButtonBase-root.Mui-selected:hover' + ]: { background: palette.primary.light }, }, @@ -132,6 +132,7 @@ export const materialTheme = createMuiTheme({ typography: { fontSize: 12, + fontFamily: 'Open Sans, sans-serif', h1: { fontSize: 28, diff --git a/webclient/src/types/routes.tsx b/webclient/src/types/routes.tsx index 0dd3bba6..386471a7 100644 --- a/webclient/src/types/routes.tsx +++ b/webclient/src/types/routes.tsx @@ -2,10 +2,12 @@ export enum RouteEnum { PLAYER = '/player/:name', SERVER = '/server', ROOM = '/room/:roomId', - LOGIN = '/', + LOGIN = '/login', LOGS = '/logs', GAME = '/game', DECKS = '/decks', DECK = '/deck', ACCOUNT = '/account', + ADMINISTRATION = '/administration', + REPLAYS = '/replays', }