minor fixes
This commit is contained in:
parent
94eed84eaa
commit
09e6deb019
@ -5,7 +5,7 @@ import {
|
|||||||
} from "react-router-dom";
|
} from "react-router-dom";
|
||||||
import { ThemeProvider } from "styled-components";
|
import { ThemeProvider } from "styled-components";
|
||||||
import {CreateUserWidget, RecentActivityWidget, SystemStatusWidget} from './components'
|
import {CreateUserWidget, RecentActivityWidget, SystemStatusWidget} from './components'
|
||||||
import {AccountManager, AdminUI, Logger} from './views'
|
import {AccountManager, AdminUI, Logs, System} from './views'
|
||||||
import theme from './theme';
|
import theme from './theme';
|
||||||
function App() {
|
function App() {
|
||||||
return (
|
return (
|
||||||
@ -21,6 +21,12 @@ function App() {
|
|||||||
<Route path="/accounts">
|
<Route path="/accounts">
|
||||||
<AccountManager/>
|
<AccountManager/>
|
||||||
</Route>
|
</Route>
|
||||||
|
<Route path="/log">
|
||||||
|
<Logs/>
|
||||||
|
</Route>
|
||||||
|
<Route path="/system">
|
||||||
|
<System/>
|
||||||
|
</Route>
|
||||||
</Switch>
|
</Switch>
|
||||||
</AdminUI>
|
</AdminUI>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
|
@ -22,7 +22,7 @@ export class TextInput extends Component {
|
|||||||
background: ${this.props.disabled===undefined ? this.props.theme.colours.color6 : this.props.theme.colours.color7};
|
background: ${this.props.disabled===undefined ? this.props.theme.colours.color6 : this.props.theme.colours.color7};
|
||||||
border-bottom: 0.3em solid ${this.props.disabled===undefined ? this.props.theme.colours.color5 : this.props.theme.colours.color8};
|
border-bottom: 0.3em solid ${this.props.disabled===undefined ? this.props.theme.colours.color5 : this.props.theme.colours.color8};
|
||||||
:hover {
|
:hover {
|
||||||
${this.props.disabled===undefined ? "outline: auto;\nborder-bottom: 0.3em solid" + this.props.theme.colours.color3 + ";" : null};
|
${this.props.disabled===undefined ? "outline: solid "+ this.props.theme.colours.color3 +";\nborder-bottom: 0.3em solid" + this.props.theme.colours.color3 + ";" : null};
|
||||||
button:hover{
|
button:hover{
|
||||||
${this.props.btndisabled===undefined ?"background: "+ this.props.theme.colours.color3:""};
|
${this.props.btndisabled===undefined ?"background: "+ this.props.theme.colours.color3:""};
|
||||||
&::before{
|
&::before{
|
||||||
|
@ -23,7 +23,7 @@ const colours2 = {
|
|||||||
color10: "#fff",
|
color10: "#fff",
|
||||||
}
|
}
|
||||||
const theme = {
|
const theme = {
|
||||||
colours: colours1
|
colours: colours2
|
||||||
}
|
}
|
||||||
export { theme, colours1 as colours }
|
export { theme, colours1 as colours }
|
||||||
export default theme
|
export default theme
|
@ -173,8 +173,8 @@ export class AdminUI extends Component {
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
color: ${this.props.theme.colours.color10};
|
color: ${this.props.theme.colours.color6};
|
||||||
text-shadow: 0 0 .3em ${this.props.theme.colours.color2};
|
text-shadow: 0 0 .5em ${this.props.theme.colours.color3};
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
background: ${this.props.theme.colours.color2};
|
background: ${this.props.theme.colours.color2};
|
||||||
&::after {
|
&::after {
|
||||||
@ -184,7 +184,8 @@ export class AdminUI extends Component {
|
|||||||
bottom: 0;
|
bottom: 0;
|
||||||
height: 2em;
|
height: 2em;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
background: linear-gradient(-10deg, ${this.props.theme.colours.color2} 0%, ${this.props.theme.colours.color9}, ${this.props.theme.colours.color6} 50%, ${this.props.theme.colours.color4} 65%, ${this.props.theme.colours.color1} 100%);
|
background: #000;
|
||||||
|
background: linear-gradient(-10deg, ${this.props.theme.colours.color2} 0%, ${this.props.theme.colours.color9}, ${this.props.theme.colours.color5} 50%, ${this.props.theme.colours.color4} 65%, ${this.props.theme.colours.color1} 100%);
|
||||||
content: '';
|
content: '';
|
||||||
}
|
}
|
||||||
&::before {
|
&::before {
|
||||||
@ -227,8 +228,7 @@ export class AdminUI extends Component {
|
|||||||
<li><NavLink activeClassName="menu__active" exact to="/">Status</NavLink></li>
|
<li><NavLink activeClassName="menu__active" exact to="/">Status</NavLink></li>
|
||||||
<li><NavLink activeClassName="menu__active" to="/accounts">Account</NavLink></li>
|
<li><NavLink activeClassName="menu__active" to="/accounts">Account</NavLink></li>
|
||||||
<li><NavLink activeClassName="menu__active" to="/log">Log</NavLink></li>
|
<li><NavLink activeClassName="menu__active" to="/log">Log</NavLink></li>
|
||||||
<li><NavLink activeClassName="menu__active" to="/backup">Backup</NavLink></li>
|
<li><NavLink activeClassName="menu__active" to="/system">System</NavLink></li>
|
||||||
<li><NavLink activeClassName="menu__active" to="/admin">Admin</NavLink></li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</Menu>
|
</Menu>
|
||||||
<Main>
|
<Main>
|
||||||
|
@ -1,15 +0,0 @@
|
|||||||
import React, { Component } from 'react'
|
|
||||||
|
|
||||||
export class Logger extends Component {
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<div className="main__card">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export default Logger
|
|
15
web/src/views/Logs.jsx
Normal file
15
web/src/views/Logs.jsx
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
import React, { Component } from 'react'
|
||||||
|
import Card from '../components/Card'
|
||||||
|
export class Logs extends Component {
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<Card>
|
||||||
|
<h4>Logs</h4>
|
||||||
|
<hr/>
|
||||||
|
Hello World
|
||||||
|
</Card>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Logs
|
26
web/src/views/System.jsx
Normal file
26
web/src/views/System.jsx
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
import React, { Component } from 'react'
|
||||||
|
import Card from '../components/Card'
|
||||||
|
import TextInput from '../components/TextInput'
|
||||||
|
export class System extends Component {
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Card>
|
||||||
|
<h4>System Settings</h4>
|
||||||
|
<hr />
|
||||||
|
Hello World
|
||||||
|
</Card>
|
||||||
|
<Card>
|
||||||
|
<h4>WiFi</h4>
|
||||||
|
<hr />
|
||||||
|
<TextInput label="SSID"/>
|
||||||
|
<TextInput label="Password" type="password"/>
|
||||||
|
<TextInput type="button" value="SAVE"/>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default System
|
@ -1,4 +1,5 @@
|
|||||||
import Logger from "./Logger";
|
|
||||||
import AdminUI from "./AdminUI";
|
import AdminUI from "./AdminUI";
|
||||||
import AccountManager from "./AccountManager";
|
import AccountManager from "./AccountManager";
|
||||||
export {AccountManager, AdminUI, Logger}
|
import Logs from "./Logs";
|
||||||
|
import System from "./System";
|
||||||
|
export {AccountManager, AdminUI, Logs, System}
|
Loading…
x
Reference in New Issue
Block a user