dededit/src/components/AboutPane.vue

it <template>
  <div class="about-pane dialog" v-if="visible">
      <div class="dialog-content">
        <button title="fermer" class="close-btn" v-on:click="collapse()">
          <svg viewPort="0 0 42 42" version="1.1"
                               xmlns="http://www.w3.org/2000/svg">
                              <line x1="0" y1="42"
                                    x2="42" y2="0"
                                    stroke="black"
                                    stroke-width="2"/>
                              <line x1="0" y1="0"
                                    x2="42" y2="42"
                                    stroke="black"
                                    stroke-width="2"/>
            </svg>

        </button>
        <div class="about-content">
          <h2>DEDITOR</h2>
          <h3>DEDE EDITOR</h3>
        </div>
      </div>
  </div>
  <div v-else class="about-pane-button" v-on:click="expand"> ... </div>
</template>


<script>


    export default {
        components: {},
        data() {
          return {
              visible : false
            }
        },
        beforeDestroy() {

        },

        mounted() {

        },

        methods: {

            expand : function(){
                this.visible = true;
                this.$forceUpdate();
                console.log(this.visible);

            },
            collapse : function(){
                this.visible = false;
            },

        }
    }
</script>

<style lang="scss" scoped>
@import '../assets/_dialog';

  .dialog-content{
    border: 2px solid black;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .about-pane-button{
    position: fixed;
    bottom : 5px;
    right: 5px;
    z-index: 55;
    cursor: pointer;
    font-weight: bold;
  }

  .about-content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color : #aaa;

    h2, h3{
      margin : 0;
      padding: 0;
    }

    h2{
      font-size: 5rem;
    }
    h3{
      font-size: 2rem;
    }
  }

</style>