summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorSanto Cariotti <santo@dcariotti.me>2021-03-20 11:12:39 +0100
committerSanto Cariotti <santo@dcariotti.me>2021-03-20 11:12:39 +0100
commita9ece91610c7f33cbc6445b58cfd1a9b43a89a49 (patch)
tree85aa6c7c81573e23f52cb328039a14d902b0acb5
parent024560588a7afbfa1fa1dbaf0440beefb695108c (diff)
chore: isolated loadings
-rw-r--r--src/components/HeaderBlue.vue9
-rw-r--r--src/sass/_header.sass14
-rw-r--r--src/views/Home.vue6
3 files changed, 7 insertions, 22 deletions
diff --git a/src/components/HeaderBlue.vue b/src/components/HeaderBlue.vue
index d4ffa9f..fd6d731 100644
--- a/src/components/HeaderBlue.vue
+++ b/src/components/HeaderBlue.vue
@@ -1,7 +1,5 @@
<template lang="pug">
- header(:class="{active: loading}")
- #big-loading(v-if="loading")
- b-overlay(:show="true" spinner-large)
+ header
b-container
h1
a(href="/" rel="home") Gico
@@ -10,10 +8,5 @@
<script>
export default {
name: "HeaderBlue",
- computed: {
- loading: function() {
- return this.$store.getters.loading;
- },
- }
}
</script>
diff --git a/src/sass/_header.sass b/src/sass/_header.sass
index 21f11bb..e64a031 100644
--- a/src/sass/_header.sass
+++ b/src/sass/_header.sass
@@ -6,20 +6,6 @@ header
padding: 10px 0
box-shadow: rgba(0, 0, 0, 0.2) 0 2px 0px
margin-bottom: 30px
- &.active
- z-index: 1044
- #big-loading
- top: 0
- width: 100%
- height: 100%
- position: fixed
- z-index: 1045
- .b-overlay-wrap
- height: 100%
- background-color: rgba(0, 0, 0, .8)
- .spinner-border
- border-color: $primary
- border-right-color: transparent
h1
font-size: 3em
margin: 0
diff --git a/src/views/Home.vue b/src/views/Home.vue
index c1d9420..3ca1445 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -6,7 +6,10 @@
b-col(md="8" sm="12")
h2 List of commits
section#commits
+ .commit(style="padding: 50px" v-if="loading")
+ b-overlay(:show="true" spinner-large)
commit-card(
+ v-else
v-for="i in commits" :key="i.hash" :data="i"
:author="emails[i.author_email]"
:committer="emails[i.committer_email]"
@@ -35,6 +38,9 @@ export default {
emails: function() {
return this.$store.getters.emails;
},
+ loading: function() {
+ return this.$store.getters.loading;
+ }
}
}
</script>