news design correction padding 6

This commit is contained in:
alma 2025-04-15 14:17:24 +02:00
parent 4a19269894
commit 666c0b2fa1

View File

@ -68,12 +68,12 @@ export function News() {
if (status === 'loading' || loading) {
return (
<Card className="transition-transform duration-500 ease-in-out transform hover:scale-105 bg-white/95 backdrop-blur-sm border-0 shadow-lg h-full">
<CardHeader className="flex flex-row items-center justify-between p-4 border-b border-gray-100">
<Card className="bg-white/95 backdrop-blur-sm border-0 shadow-lg">
<CardHeader className="flex flex-row items-center justify-between py-3 px-4 border-b border-gray-100">
<CardTitle className="text-lg font-semibold text-gray-800">News</CardTitle>
</CardHeader>
<CardContent className="p-4">
<div className="flex items-center justify-center h-[420px]">
<div className="flex items-center justify-center h-[500px]">
<RefreshCw className="h-5 w-5 animate-spin text-gray-400" />
</div>
</CardContent>
@ -82,8 +82,8 @@ export function News() {
}
return (
<Card className="transition-transform duration-500 ease-in-out transform hover:scale-105 bg-white/95 backdrop-blur-sm border-0 shadow-lg h-full">
<CardHeader className="flex flex-row items-center justify-between p-4 space-x-4 border-b border-gray-100">
<Card className="bg-white/95 backdrop-blur-sm border-0 shadow-lg">
<CardHeader className="flex flex-row items-center justify-between py-3 px-4 border-b border-gray-100">
<CardTitle className="text-lg font-semibold text-gray-800">News</CardTitle>
<Button
variant="ghost"
@ -99,17 +99,17 @@ export function News() {
{error ? (
<p className="text-center text-red-500">{error}</p>
) : (
<div className="space-y-3 h-[420px] overflow-y-auto pr-1 scrollbar-thin scrollbar-thumb-gray-200 scrollbar-track-transparent">
<div className="space-y-2 h-[500px] overflow-y-auto scrollbar-thin scrollbar-thumb-gray-200 scrollbar-track-transparent">
{news.length === 0 ? (
<p className="text-center text-gray-500">No news available</p>
) : (
news.map((item) => (
<div
key={item.id}
className="p-4 hover:bg-gray-50/50 rounded-lg transition-colors cursor-pointer border border-gray-100 shadow-sm"
className="p-4 bg-gray-50/50 hover:bg-gray-100/50 rounded-lg transition-colors cursor-pointer"
onClick={() => window.open(item.url, '_blank')}
>
<div className="flex items-center justify-between mb-2">
<div className="flex items-center justify-between mb-2.5">
<span className="text-xs text-gray-500">{formatDate(item.date)}</span>
{item.category && (
<span className="text-xs px-2 py-0.5 rounded-full bg-blue-50 text-blue-600">