Files
mareike/app/Views/Partials/GlobalWidgets/GlobalWidgets.vue

44 lines
991 B
Vue

<script setup>
import ShadowedBox from "../../Components/ShadowedBox.vue";
import MyInvoices from "../../../Domains/Dashboard/Views/Partials/Widgets/MyInvoices.vue";
import OpenCostUnits from "../../../Domains/Dashboard/Views/Partials/Widgets/OpenCostUnits.vue";
</script>
<template>
<diV class="widget-container">
<shadowed-box class="widget-box">
Widget 1
</shadowed-box>
<shadowed-box class="widget-box">
<MyInvoices />
</shadowed-box>
<shadowed-box class="widget-box">
Widget 3
</shadowed-box>
<shadowed-box class="widget-box">
<OpenCostUnits />
</shadowed-box>
</diV>
</template>
<style>
.widget-container {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
position: relative;
}
.widget-box {
flex-grow: 1; display: inline-block;
width: calc(25% - 40px);
height: 150px;
margin: 0 10px;
}
</style>