stepus53/writer
1
0
Fork 0
mirror of https://github.com/usatiuk/writer.git synced 2025-10-29 00:17:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

animate login/signup screens

Browse Source
This commit is contained in:
Stepan Usatiuk
2019-01-03 00:34:06 +03:00
parent 3bebc24684
commit 40a8cf1885
7 changed files with 79 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
frontend/package-lock.json generated
View File

@@ -3231,14 +3231,12 @@
"balanced-match": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
@@ -3253,20 +3251,17 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"core-util-is": {
"version": "1.0.2",
@@ -3383,8 +3378,7 @@
"inherits": {
"version": "2.0.3",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"ini": {
"version": "1.3.5",
@@ -3396,7 +3390,6 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@@ -3411,7 +3404,6 @@
"version": "3.0.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
@@ -3419,14 +3411,12 @@
"minimist": {
"version": "0.0.8",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"minipass": {
"version": "2.2.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.1",
"yallist": "^3.0.0"
@@ -3445,7 +3435,6 @@
"version": "0.5.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
@@ -3526,8 +3515,7 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"object-assign": {
"version": "4.1.1",
@@ -3539,7 +3527,6 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1"
}
@@ -3661,7 +3648,6 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@@ -7295,6 +7281,14 @@
"warning": "^4.0.1"
}
},
"react-spring": {
"version": "7.2.7",
"resolved": "https://registry.npmjs.org/react-spring/-/react-spring-7.2.7.tgz",
"integrity": "sha512-UFPkQzPQMOf9E9GFprcGVfa+1EdnffQV6tvFGY+kck32orqgqKrfP54y8da3qP3T6hLnLkU77seVZOD7GYPNEg==",
"requires": {
"@babel/runtime": "^7.0.0"
}
},
"react-transition-group": {
"version": "2.5.2",
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.5.2.tgz",

1
frontend/package.json
View File

@@ -24,6 +24,7 @@
"react-redux": "^6.0.0",
"react-router": "^4.3.1",
"react-router-dom": "^4.3.1",
"react-spring": "^7.2.7",
"redux": "^4.0.1",
"redux-saga": "^0.16.2"
}

17
frontend/src/App.tsx
View File

@@ -1,17 +1,16 @@
import * as React from "react";
import { Route, Switch } from "react-router";
import { Login } from "~Auth/Login";
import { Signup } from "~Auth/Signup";
import { Route, RouteComponentProps, withRouter } from "react-router";
import { AuthScreen } from "~Auth/AuthScreen";
import { Home } from "~Home";
export function App() {
export function AppComponent(props: RouteComponentProps) {
const { location } = props.history;
return (
<>
<Switch>
<Route exact={true} path="/" component={Home} />
<Route path="/login" component={Login} />
<Route path="/signup" component={Signup} />
</Switch>
<Route exact={true} path="/" component={Home} />
<Route path="/(login|signup)/" component={AuthScreen} />
</>
);
}
export const App = withRouter(AppComponent);

3
frontend/src/Auth/Auth.scss
View File

@@ -3,6 +3,9 @@
margin: auto;
margin-top: 10rem;
width: 20rem;
left: 0;
right: 0;
position: absolute;
form {
display: flex;
flex-direction: column;

50
frontend/src/Auth/AuthScreen.tsx Normal file
View File

@@ -0,0 +1,50 @@
import * as React from "react";
import { Route, RouteComponentProps, Switch, withRouter } from "react-router";
import { Transition } from "react-spring";
import { Login } from "./Login";
import { Signup } from "./Signup";
export function AuthScreenComponent(props: RouteComponentProps) {
const { location } = props.history;
return (
<div
style={{
position: "absolute",
top: 0,
bottom: 0,
left: 0,
right: 0,
overflow: "hidden",
}}
>
<Transition
items={location}
keys={location.pathname}
from={{
opacity: 0,
transform: "translate3d(-400px,0,0)",
}}
enter={{
opacity: 1,
transform: "translate3d(0,0,0)",
}}
leave={{
opacity: 0,
transform: "translate3d(400px,0,0)",
}}
>
{_location => style => (
<div style={style}>
<Switch location={_location}>
<Route path="/login" component={Login} />
<Route path="/signup" component={Signup} />
</Switch>
</div>
)}
</Transition>
</div>
);
}
export const AuthScreen = withRouter(AuthScreenComponent);

1
frontend/src/Home.tsx
View File

@@ -4,7 +4,6 @@ import * as React from "react";
export function Home() {
return (
<>
{" "}
<Navbar>
<Navbar.Group align={Alignment.LEFT}>
<Navbar.Heading>Writer</Navbar.Heading>

3
tslint.json
View File

@@ -11,6 +11,7 @@
"no-implicit-dependencies": false,
"no-submodule-imports": false,
"no-this-assignment": false,
"max-classes-per-file": false
"max-classes-per-file": false,
"jsx-no-lambda": false
}
}