diff --git a/resources/styles/main.scss b/resources/styles/main.scss
index ded119f..9a550e7 100644
--- a/resources/styles/main.scss
+++ b/resources/styles/main.scss
@@ -38,6 +38,33 @@ body {
main {
flex: 1 1 auto;
+ position: relative;
+
+ > * {
+ transition: opacity .3s ease-in-out;
+ }
+ }
+
+ main::after {
+ transition: opacity .3s ease-in-out;
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ right: 0;
+ left: 0;
+ content: "";
+ opacity: 0;
+ background: url("../images/logo.png") center center no-repeat;
+ }
+
+ main.not-ready {
+ > * {
+ opacity: 0;
+ }
+
+ &::after {
+ opacity: 1 !important;
+ }
}
.attribution {
@@ -71,7 +98,7 @@ body {
@include media-breakpoint-up('md') {
#app {
- margin-top: 4rem;
+ padding-top: 4rem;
}
}
diff --git a/resources/ts/app.ts b/resources/ts/app.ts
index 6539bb2..3cc64e6 100644
--- a/resources/ts/app.ts
+++ b/resources/ts/app.ts
@@ -65,6 +65,9 @@ Vue.use(Vuex);
updateMessages: 'messages/update',
updateDepartures: 'departures/update'
})
+ },
+ mounted() {
+ this.$el.classList.remove('not-ready');
}
});
})();
diff --git a/templates/base.html.twig b/templates/base.html.twig
index df2ce10..9bf075c 100644
--- a/templates/base.html.twig
+++ b/templates/base.html.twig
@@ -21,7 +21,7 @@
{% block title %}Czy dojadę?{% endblock %}
-
+
{% block body %}{% endblock %}