mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2024-12-23 01:20:24 +03:00
Reformated code to use 2-space indents
This commit is contained in:
parent
07049261e3
commit
39a78414eb
5 changed files with 78 additions and 78 deletions
22
src/App.js
22
src/App.js
|
@ -3,15 +3,15 @@ import './App.scss';
|
||||||
import MainHeader from './common/MainHeader';
|
import MainHeader from './common/MainHeader';
|
||||||
|
|
||||||
export default class App extends React.Component {
|
export default class App extends React.Component {
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<MainHeader/>
|
<MainHeader/>
|
||||||
<div className="app">
|
<div className="app">
|
||||||
<h1 className="app__title">Welcome to Shlink</h1>
|
<h1 className="app__title">Welcome to Shlink</h1>
|
||||||
<h5 className="App__intro">Please, select a server.</h5>
|
<h5 className="App__intro">Please, select a server.</h5>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
14
src/App.scss
14
src/App.scss
|
@ -1,12 +1,12 @@
|
||||||
.app {
|
.app {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
flex-flow: column;
|
flex-flow: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.app__title {
|
.app__title {
|
||||||
font-size: 36px;
|
font-size: 36px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -2,65 +2,65 @@ import plusIcon from '@fortawesome/fontawesome-free-solid/faPlus';
|
||||||
import FontAwesomeIcon from '@fortawesome/react-fontawesome';
|
import FontAwesomeIcon from '@fortawesome/react-fontawesome';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {
|
import {
|
||||||
Collapse, DropdownItem, DropdownMenu,
|
Collapse, DropdownItem, DropdownMenu,
|
||||||
DropdownToggle,
|
DropdownToggle,
|
||||||
Nav,
|
Nav,
|
||||||
Navbar,
|
Navbar,
|
||||||
NavbarBrand,
|
NavbarBrand,
|
||||||
NavbarToggler,
|
NavbarToggler,
|
||||||
NavItem,
|
NavItem,
|
||||||
NavLink,
|
NavLink,
|
||||||
UncontrolledDropdown
|
UncontrolledDropdown
|
||||||
} from 'reactstrap';
|
} from 'reactstrap';
|
||||||
import './MainHeader.scss';
|
import './MainHeader.scss';
|
||||||
import shlinkLogo from './shlink-logo-white.png';
|
import shlinkLogo from './shlink-logo-white.png';
|
||||||
|
|
||||||
export default class MainHeader extends React.Component {
|
export default class MainHeader extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
|
|
||||||
this.state = {
|
this.state = {
|
||||||
isOpen: false
|
isOpen: false
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
toggle() {
|
toggle() {
|
||||||
this.setState({
|
this.setState({
|
||||||
isOpen: ! this.state.isOpen
|
isOpen: !this.state.isOpen
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<Navbar color="primary" dark fixed="top" className="main-header" expand="md">
|
<Navbar color="primary" dark fixed="top" className="main-header" expand="md">
|
||||||
<NavbarBrand href="https://shlink.io" target="_blank">
|
<NavbarBrand href="https://shlink.io" target="_blank">
|
||||||
<img src={shlinkLogo} alt="Shlink" className="main-header__brand-logo"/> Shlink
|
<img src={shlinkLogo} alt="Shlink" className="main-header__brand-logo"/> Shlink
|
||||||
</NavbarBrand>
|
</NavbarBrand>
|
||||||
<NavbarToggler onClick={() => this.toggle()} />
|
<NavbarToggler onClick={() => this.toggle()}/>
|
||||||
<Collapse navbar isOpen={this.state.isOpen}>
|
<Collapse navbar isOpen={this.state.isOpen}>
|
||||||
<Nav navbar className="ml-auto">
|
<Nav navbar className="ml-auto">
|
||||||
<NavItem>
|
<NavItem>
|
||||||
<NavLink href="#">
|
<NavLink href="#">
|
||||||
<FontAwesomeIcon icon={plusIcon} /> Add server
|
<FontAwesomeIcon icon={plusIcon}/> Add server
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</NavItem>
|
</NavItem>
|
||||||
<UncontrolledDropdown nav>
|
<UncontrolledDropdown nav>
|
||||||
<DropdownToggle nav caret>
|
<DropdownToggle nav caret>
|
||||||
Servers
|
Servers
|
||||||
</DropdownToggle>
|
</DropdownToggle>
|
||||||
|
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
<DropdownItem>
|
<DropdownItem>
|
||||||
Server 1
|
Server 1
|
||||||
</DropdownItem>
|
</DropdownItem>
|
||||||
<DropdownItem>
|
<DropdownItem>
|
||||||
Server 2
|
Server 2
|
||||||
</DropdownItem>
|
</DropdownItem>
|
||||||
</DropdownMenu>
|
</DropdownMenu>
|
||||||
</UncontrolledDropdown>
|
</UncontrolledDropdown>
|
||||||
</Nav>
|
</Nav>
|
||||||
</Collapse>
|
</Collapse>
|
||||||
</Navbar>
|
</Navbar>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,15 +1,15 @@
|
||||||
@import "../utils/base";
|
@import "../utils/base";
|
||||||
|
|
||||||
.main-header.main-header {
|
.main-header.main-header {
|
||||||
background-color: $mainColor !important;
|
background-color: $mainColor !important;
|
||||||
color: white;
|
color: white;
|
||||||
|
|
||||||
.navbar-brand {
|
.navbar-brand {
|
||||||
color: inherit !important;
|
color: inherit !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.main-header__brand-logo {
|
.main-header__brand-logo {
|
||||||
width: 26px;
|
width: 26px;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,3 +1,3 @@
|
||||||
* {
|
* {
|
||||||
outline: none !important;
|
outline: none !important;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue