closing gallery properly

vue-theme/src/components/gallery.vue

 <script>
 export default {
     props: {
-        fullscreengallery: {
-            type: Boolean
-        }
+        fullscreengallery: { type: Boolean }
     },
     methods: {
         hideGallery() {
-            this.$emit('fullscreengalleryclose')
+            this.$emit('close')
         }
     }
 }
     width: 100vw
     height: 100%
     background-color: blue
-    opacity: 50%
+    opacity: 75%
     z-index: 1001
     ul
         list-style: none

vue-theme/src/pages/single.vue

 <template lang="pug">
 .page--single.f-row.between
+    gallery(:fullscreengallery="fullscreengallery" v-on:close="fullscreengallery = false")
     article.f-grow.shadow
         header
             h1 {{ type }}:{{ $route.params.slug }} single
-            button(@click="fullscreengallery=false") fullscreen
+            button(@click="fullscreengallery = true") fullscreen
         section
             h4 {{ posts[$route.params.slug].title }}
             .block-wrapper(v-for="block in posts[$route.params.slug].blocks" v-html="block")
-        stupidgallery(:fullscreengallery="fullscreengallery" :fullscreengalleryclose="fullscreengallery = false")
     sidebar(v-if="sidebar" :type="`${type}`")
         .shadow
             h1.t-up single slot
     },
     components: {
         sidebar: sidebar,
-        stupidgallery: gallery,
+        gallery: gallery
     },
     data() {
         return {
-            fullscreengallery: true
-        }
-    },   
-    methods: {
-        showGallery() {
-            console.log('testingshowGallery')
+            fullscreengallery: false
         }
     },
     computed: {