diff --git a/LICENSE b/LICENSE new file mode 100644 index 00000000..0993fbf0 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2018 shlinkio + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/package.json b/package.json index 6ea9136b..f1553495 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "babel-loader": "7.1.2", "babel-preset-react-app": "^3.1.1", "babel-runtime": "6.26.0", + "bootstrap": "^4.1.1", "case-sensitive-paths-webpack-plugin": "2.1.1", "chalk": "1.1.3", "css-loader": "0.28.7", @@ -34,6 +35,7 @@ "react": "^16.3.2", "react-dev-utils": "^5.0.1", "react-dom": "^16.3.2", + "reactstrap": "^6.0.1", "resolve": "1.6.0", "style-loader": "0.19.0", "sw-precache-webpack-plugin": "0.11.4", diff --git a/public/favicon.ico b/public/favicon.ico index a11777cc..97a67730 100644 Binary files a/public/favicon.ico and b/public/favicon.ico differ diff --git a/src/App.js b/src/App.js index 91a784ab..4a326e22 100644 --- a/src/App.js +++ b/src/App.js @@ -1,18 +1,16 @@ import React from 'react'; -import logo from './logo.svg'; import './App.scss'; +import MainHeader from './common/MainHeader'; export default class App extends React.Component { render() { return ( -
-
- logo -

Welcome to React

-
-

- To get started, edit src/App.js and save to reload. -

+
+ +
+

Welcome to Shlink

+
Please, select a server.
+
); } diff --git a/src/App.scss b/src/App.scss index 14eaa618..2afa33e9 100644 --- a/src/App.scss +++ b/src/App.scss @@ -1,32 +1,12 @@ -.App { +.app { text-align: center; + height: 100vh; + display: flex; + align-items: center; + justify-content: center; + flex-flow: column; } -.App-logo { - animation: App-logo-spin infinite 20s linear; - height: 80px; -} - -.App-header { - background-color: #222; - height: 150px; - padding: 20px; - color: white; -} - -.App-title { - font-size: 1.5em; -} - -.App-intro { - font-size: large; -} - -@keyframes App-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } +.app__title { + font-size: 36px; } diff --git a/src/common/MainHeader.js b/src/common/MainHeader.js new file mode 100644 index 00000000..c3d841d3 --- /dev/null +++ b/src/common/MainHeader.js @@ -0,0 +1,16 @@ +import React from 'react'; +import './MainHeader.scss'; +import {Navbar, NavbarBrand} from 'reactstrap'; +import shlinkLogo from './shlink-logo-white.png'; + +export default class MainHeader extends React.Component { + render() { + return ( + + + Shlink Shlink + + + ); + } +} diff --git a/src/common/MainHeader.scss b/src/common/MainHeader.scss new file mode 100644 index 00000000..00f9da6a --- /dev/null +++ b/src/common/MainHeader.scss @@ -0,0 +1,15 @@ +@import "../utils/base"; + +.main-header { + background-color: $mainColor; + color: white; + + .navbar-brand { + color: inherit !important; + } +} + +.main-header__brand-logo { + width: 26px; + margin-right: 5px; +} diff --git a/src/common/shlink-logo-white.png b/src/common/shlink-logo-white.png new file mode 100644 index 00000000..5590667b Binary files /dev/null and b/src/common/shlink-logo-white.png differ diff --git a/src/index.js b/src/index.js index 3d60bd62..c4f749eb 100644 --- a/src/index.js +++ b/src/index.js @@ -1,6 +1,6 @@ import React from 'react'; import ReactDOM from 'react-dom'; -import './index.scss'; +import 'bootstrap/dist/css/bootstrap.min.css'; import App from './App'; import registerServiceWorker from './registerServiceWorker'; diff --git a/src/index.scss b/src/index.scss deleted file mode 100644 index 22f8f189..00000000 --- a/src/index.scss +++ /dev/null @@ -1,5 +0,0 @@ -body { - margin: 0; - padding: 0; - font-family: sans-serif; -} diff --git a/src/logo.svg b/src/logo.svg deleted file mode 100644 index 6b60c104..00000000 --- a/src/logo.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/utils/base.scss b/src/utils/base.scss new file mode 100644 index 00000000..cceec7eb --- /dev/null +++ b/src/utils/base.scss @@ -0,0 +1 @@ +$mainColor: #4696e5;