<template>
  <div
    class="row"
    style="
      border-radius: 2px;
      box-shadow: rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset,
        rgba(0, 0, 0, 0.3) 0px 0px 0px 1px;
    "
  >
    <q-icon
      class="self-center q-ma-sm"
      name="widgets"
      color="grey-9"
      style="font-size: 2em"
    />

    <div class="col-7 self-center ellipsis">
      {{ actName }}
    </div>

    <div class="self-center">
      <q-btn
        outline
        dense
        label="変 更"
        padding="none sm"
        color="primary"
      ></q-btn>
    </div>
  </div>
</template>

<script>
import { computed } from 'vue';

export default {
  props: ['actName'],
  setup(props) {
    const actName = computed(() => props.actName);
  },
};
</script>
