Update chart components: adjust bar height in HorizontalBarChart and set stroke width in LineChart; enhance Dashboard card layout with icons and format numbers

This commit is contained in:
Vaibhav Surve 2025-04-09 17:56:52 +05:30
parent c0477285e3
commit cb3abe4831
3 changed files with 8 additions and 13 deletions

View File

@ -45,7 +45,7 @@ const HorizontalBarChart = ({
},
plotOptions: {
bar: {
barHeight: "80%",
barHeight: "60%",
distributed: true,
horizontal: true,
dataLabels: {

View File

@ -30,7 +30,8 @@ const LineChart = ({
enabled: false // Hide value labels on dots
},
stroke: {
curve: 'straight'
curve: 'straight',
width: 2
},
grid: {
show: false,

View File

@ -28,11 +28,7 @@ const Dashboard = () => {
<div className="col-sm-6 col-lg-4">
<div className="card p-3 h-100 text-center d-flex justify-content-between">
<div className="d-flex justify-content-start align-items-center mb-3">
<i
className="rounded-circle bx bx-building-house"
style={{ fontSize: "xx-large" }}
></i>
<h5 className="fw-bold mb-0 ms-2" style={{ fontSize: '1.5rem' }}>Projects</h5>
<h5 class="fw-bold mb-0 ms-2"><i class="rounded-circle bx bx-building-house" ></i> Projects</h5>
</div>
<div className="d-flex justify-content-around align-items-start mt-n2">
<div>
@ -51,8 +47,7 @@ const Dashboard = () => {
<div className="col-sm-6 col-lg-4">
<div className="card p-3 h-100 text-center d-flex justify-content-between">
<div className="d-flex justify-content-start align-items-center mb-3">
<i className="bx bx-group text-warning" style={{ fontSize: '2rem' }}></i>
<h5 className="fw-bold mb-0 ms-2" style={{ fontSize: '1.5rem' }}>Teams</h5>
<h5 class="fw-bold mb-0 ms-2"><i className="bx bx-group text-warning" ></i> Teams</h5>
</div>
<div className="d-flex justify-content-around align-items-start mt-n2">
<div>
@ -71,16 +66,15 @@ const Dashboard = () => {
<div className="col-sm-6 col-lg-4">
<div className="card p-3 h-100 text-center d-flex justify-content-between">
<div className="d-flex justify-content-start align-items-center mb-3">
<i className="bx bx-task text-success" style={{ fontSize: '2rem' }}></i>
<h5 className="fw-bold mb-0 ms-2" style={{ fontSize: '1.5rem' }}>Tasks</h5>
<h5 class="fw-bold mb-0 ms-2"><i className="bx bx-task text-success" ></i> Tasks</h5>
</div>
<div className="d-flex justify-content-around align-items-start mt-n2">
<div>
<h4 className="mb-0 fw-bold">10000</h4>
<h4 className="mb-0 fw-bold">10,000</h4>
<small className="text-muted">Total</small>
</div>
<div>
<h4 className="mb-0 fw-bold">4000</h4>
<h4 className="mb-0 fw-bold">4,000</h4>
<small className="text-muted">Completed</small>
</div>
</div>