bnilsen/custom_ui
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Shrank Cards on the Dashboard. Implemented own Card as well.

Browse source
This commit is contained in:
rocketdebris 2025-12-20 14:54:07 -05:00
parent 796b835c08
commit 6d9342a970
3 changed files with 58 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

30
frontend/src/components/common/Card.vue Normal file
View file

@ -0,0 +1,30 @@
<template>
<div class="card">
<slot name="header">
</slot>
<slot name="content">
</slot>
</div>
</template>
<script setup>
</script>
<style scoped>
.card {
width: 200px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
border-radius: 12px;
display: flex;
justify-content: space-between;
transition:
transform 0.2s ease,
box-shadow 0.2s ease;
background-color: var(--theme-surface-alt);
}
.card:hover {
/*transform: translateY(-2px);*/
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}
</style>

6
frontend/src/components/common/TodoChart.vue
View file

@ -232,11 +232,13 @@ watch(() => props.completedNumber, (newValue) => {
.chart-wrapper {
position: relative;
height: 300px;
margin-top: 20px;
height: 200px;
width: 200px;
/*margin-top: 20px;*/
display: flex;
align-items: center;
justify-content: center;
padding: 0;
}
.chart-canvas {