42 lines
788 B
Vue
42 lines
788 B
Vue
<script setup>
|
|
|
|
import ShadowedBox from "../../Components/ShadowedBox.vue";
|
|
</script>
|
|
|
|
<template>
|
|
<diV class="widget-container">
|
|
<shadowed-box class="widget-box">
|
|
Widget 1
|
|
</shadowed-box>
|
|
|
|
<shadowed-box class="widget-box">
|
|
Widget 2
|
|
</shadowed-box>
|
|
<shadowed-box class="widget-box">
|
|
Widget 3
|
|
</shadowed-box>
|
|
<shadowed-box class="widget-box">
|
|
Widget 4
|
|
</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>
|