Parcourir la source

feat: made sidebar sticky

tags/0.9.0
John Maeda il y a 6 ans
Parent
révision
227c1868fe
2 fichiers modifiés avec 12 ajouts et 29 suppressions
  1. 10
    27
      vue-theme/src/components/sidebars/sidebar.vue
  2. 2
    2
      vue-theme/src/pages/single.vue

+ 10
- 27
vue-theme/src/components/sidebars/sidebar.vue Voir le fichier

1
 <template lang="pug">
1
 <template lang="pug">
2
-aside
2
+aside.sidebar
3
     section
3
     section
4
         slot
4
         slot
5
         .shadow.b-radius(v-if="type === 'artists'")
5
         .shadow.b-radius(v-if="type === 'artists'")
13
 
13
 
14
 export default {
14
 export default {
15
     props: {
15
     props: {
16
-        sidebar: {
17
-            type: Boolean
18
-        },
19
         type: {
16
         type: {
20
             type: String
17
             type: String
21
         }
18
         }
22
     },
19
     },
23
-    computed: {
24
-        ...mapGetters({
25
-            allArtists: 'allArtists',
26
-            allArtistsLoaded: 'allArtistsLoaded',
27
-
28
-            allEpisodes: 'allEpisodes',
29
-            allEpisodesLoaded: 'allEpisodesLoaded',
30
-        }),
31
-        posts() {
32
-            let type = this.$route.params.type
33
-            type = type.charAt(0).toUpperCase() + type.slice(1)
34
-
35
-            // Return list keyed by slug
36
-            return Object.values(this[`all${type}`]).reduce((postsMap, post) => { 
37
-                postsMap[post.slug] = post
38
-                return postsMap
39
-            }, {})
40
-        },
41
-    },
42
-    mounted() {
43
-        // TODO: this should be conditional after checking vuex stat
44
-    }
20
+    computed: {},
21
+    mounted() {}
45
 }
22
 }
46
-</script>
23
+</script>
24
+
25
+<style lang="postcss">
26
+aside.sidebar
27
+    position: sticky
28
+    top: 0
29
+</style>

+ 2
- 2
vue-theme/src/pages/single.vue Voir le fichier

1
 <template lang="pug">
1
 <template lang="pug">
2
 .page--single.f-row.between
2
 .page--single.f-row.between
3
-    article.f-grow
3
+    article.f-grow.shadow.b-radius
4
         header
4
         header
5
             h1 {{ type }}:{{ $route.params.slug }} single
5
             h1 {{ type }}:{{ $route.params.slug }} single
6
         section
6
         section
29
 
29
 
30
             allPosts: 'allPosts',
30
             allPosts: 'allPosts',
31
             allPostsLoaded: 'allPostsLoaded',
31
             allPostsLoaded: 'allPostsLoaded',
32
-            
32
+
33
             allArtists: 'allArtists',
33
             allArtists: 'allArtists',
34
             allArtistsLoaded: 'allArtistsLoaded',
34
             allArtistsLoaded: 'allArtistsLoaded',
35
 
35
 

Chargement…
Annuler
Enregistrer