<template>
  <div class="grid">
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
    <p>test</p>
  </div>
</template>

<script>
import Vuex from 'vuex';

export default {
  computed: { ...Vuex.mapState ({ log: (state) => state.log }) },
  mounted () {
    this.get_log ();
  },
  methods: { ...Vuex.mapActions ({ get_log: 'get_log' }) }
};
</script>

<style scoped>
.grid {
  display: grid;
  grid-auto-columns: 2in;
  grid-auto-rows: 1in;
  grid-auto-flow: dense;
  width: 100%;
  height: 100%;
}

p {
  display: inline-block;
}
</style>
