<template>
<div>

<card-right 
title="Promoções & Ofertas"
subTitle="Preços imperdíveis"
>

<template slot="icon">

<font-awesome-icon  class="icon bg-primary text-light" icon="bullhorn" />

</template>


<template slot="btn-more">

<b-button class="btn-more btn-primary" @click="showModal" >Ver todas as Promoções</b-button>

</template>
</card-right>

<promotions-modal />

</div>
</template>

<script>
import cardRight from './CardRightList'
import PromotionsModal from '@/components/modals/Order/Promotions';
export default {
    components:{
        cardRight,
        PromotionsModal
    },
    methods:{
        showModal(){
         
         this.$modal.show('promotions-modal');
      }
    }
}
</script>

<style lang="scss" scoped>
.icon{
    svg{

        background: #CB2D2D80 0% 0% no-repeat padding-box;
        color: #CB2D2D;
    }

}

.btn-more {
  background: #CB2D2D 0% 0% no-repeat padding-box;
  border-radius: 20px;
  border: none;
  margin: 10px 0px;
}
</style>