diff --git a/src/common/Home.js b/src/common/Home.js index 49ed8dde..3455cda4 100644 --- a/src/common/Home.js +++ b/src/common/Home.js @@ -18,19 +18,19 @@ export class Home extends React.Component { const hasServers = !isEmpty(servers); return ( -
-

Welcome to Shlink

-
+
+

Welcome to Shlink

+
{hasServers && Please, select a server.} {!hasServers && Please, add a server.}
{hasServers && ( - + {servers.map(({ name, id }) => ( - + {name} - + ))} diff --git a/src/common/Home.scss b/src/common/Home.scss index 8fd117b1..0333f63c 100644 --- a/src/common/Home.scss +++ b/src/common/Home.scss @@ -1,7 +1,7 @@ @import '../utils/base'; @import '../utils/mixins/vertical-align'; -.home-container { +.home { text-align: center; height: calc(100vh - #{$headerHeight}); display: flex; @@ -10,23 +10,23 @@ flex-flow: column; } -.home-container__title { +.home__title { font-size: 36px; } -.home-container__servers-list { +.home__servers-list { margin-top: 1rem; width: 100%; max-width: 400px; } -.home-container__servers-item.home-container__servers-item { +.home__servers-item.home__servers-item { text-align: left; position: relative; padding: .75rem 2.5rem 0.75rem 1rem; } -.home-container__servers-item-icon { +.home__servers-item-icon { @include vertical-align(); right: 1rem; }