左右にアイテムを配置可能なmu-card-actionsコンポーネント

SepalatableCardActions.vue

<template>
  <mu-card-actions>
    <mu-row gutter>
      <mu-col width="100" tablet="50" desktop="50">
        <slot name="left"></slot>
      </mu-col>
      <mu-col class="right" width="100" tablet="50" desktop="50">
        <slot name="right"></slot>
      </mu-col>
    </mu-row>
  </mu-card-actions>
</template>

<script>
import { flexbox, flexboxItem } from 'muse-ui/src/flexbox';
import { row, col } from 'muse-ui/src/grid';

export default {
  name: 'sepalatable-card-actions',
  components: {
    flexbox,
    flexboxItem,
    row,
    col,
  },
};
</script>

<style scoped>
.right {
  display: flex;
  justify-content: flex-end;
}
</style>