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;
}