Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: cards hight overflow #80

Merged
merged 1 commit into from
Aug 29, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion public/css/app.css

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion public/js/app.js

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions public/mix-manifest.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
{
"/js/app.js": "/js/app.js?id=b4a45f47f33bcf565b2201f9b67549a0",
"/css/app.css": "/css/app.css?id=b79b77ba2f91ca1e2fe30cefb779b91c"
"/js/app.js": "/js/app.js?id=6d6922f70813e7630d36ac6196ced5c1",
"/css/app.css": "/css/app.css?id=506f15ca3a2c203c3018aed2631dcf48"
}
4 changes: 0 additions & 4 deletions resources/css/app.css
Original file line number Diff line number Diff line change
Expand Up @@ -40,10 +40,6 @@
}
}

.h-150 {
height: 150px;
}

.loaded {
animation: loaded 1s ease-in-out 1;
}
Expand Down
26 changes: 12 additions & 14 deletions resources/js/Components/Domain/PartitionMetric.js
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@ export default function PartitionMetric({ name, graphql_query, ranges, relation,

return (
<Card className="relative">
<div className="px-6 py-4">
<div className="px-6 py-4 flex flex-col h-full">
<div className="flex justify-between items-center mb-2">
<div className="flex items-center">
<h3 className="mr-2 text-base text-gray-700 font-bold">{ name }</h3>
Expand All @@ -114,19 +114,17 @@ export default function PartitionMetric({ name, graphql_query, ranges, relation,
<canvas id={graphql_query}></canvas>
</div>

<div className="min-h-22">
<div className="overflow-hidden overflow-y-auto max-h-22">
<ul className="list-reset">
{data.map((item, index) => <li key={index} className="text-xs text-gray-700 leading-normal">
<span className={`inline-block rounded-full w-2 h-2 mr-2 ${getTailwindColor(index)}`} />
{item.label} ({show_currency && <>{AppCurrency} </>}{formatNumber(item.value)} - {total > 0 && formatNumber(item.value * 100 / total) + "%"})
</li>)}
</ul>

{data.length == 0 && <p className="flex items-center text-gray-500">
No data found
</p>}
</div>
<div className='grow overflow-y-auto'>
<ul className="list-reset">
{data.map((item, index) => <li key={index} className="text-xs text-gray-700 leading-normal">
<span className={`inline-block rounded-full w-2 h-2 mr-2 ${getTailwindColor(index)}`} />
{item.label} ({show_currency && <>{AppCurrency} </>}{formatNumber(item.value)} - {total > 0 && formatNumber(item.value * 100 / total) + "%"})
</li>)}
</ul>

{data.length == 0 && <p className="flex items-center text-gray-500">
No data found
</p>}
</div>
</div>
</Card>
Expand Down
2 changes: 1 addition & 1 deletion resources/js/Components/Global/Card.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import React from 'react';

const Card = ({children, className = ''}) => {
return (
<div className={`bg-white shadow rounded-lg h-150 ${className}`}>
<div className={`bg-white shadow rounded-lg h-[160px] ${className}`}>
{children}
</div>
)
Expand Down
2 changes: 1 addition & 1 deletion resources/js/Pages/Dashboard.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import Card from "@/Components/Global/Card";
export default function Dashboard({auth, metrics, budgets, hasData}) {
return (
<Authenticated auth={auth}>
<Head title="Dashboard" />
<Head title="Hisabi Dashboard" />

<div className="py-12">
<div className="max-w-7xl mx-auto flex flex-wrap md:px-6">
Expand Down
Loading