Skip to content
This repository was archived by the owner on Mar 16, 2026. It is now read-only.
Closed
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
16 changes: 8 additions & 8 deletions src/components/proposals/ProposalCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -155,14 +155,14 @@ export default function ProposalCard({
<motion.div
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: false, margin: "0px 0px -100px 0px", amount: 0.3 }}
viewport={{ once: true, margin: "0px 0px 0px 0px", amount: 0.3 }}
transition={{ duration: 0.5, ease: "easeOut" }}
>
<Link
href={`/proposals/${proposal.id}`}
className="block group cursor-pointer"
>
<div className="py-4 px-8 rounded-sm mb-3 bg-background group-hover:bg-black transition-colors duration-300 max-w-full overflow-hidden">
<div className="py-4 px-4 sm:px-8 rounded-sm mb-3 bg-background group-hover:bg-black transition-colors duration-300 max-w-full overflow-hidden">
{/* Header */}
<div className="flex flex-col sm:flex-row items-start sm:items-center justify-between mb-3 sm:mb-4 gap-3">
<div className="flex-1 min-w-0">
Expand All @@ -171,7 +171,7 @@ export default function ProposalCard({
? `#${proposal.proposal_id}: ${proposal.title}`
: proposal.title}
</h3>
<div className="flex flex-wrap items-center gap-2 mb-2">
<div className="flex flex-wrap items-center gap-2 mb-2 overflow-hidden">
<ProposalStatusBadge
proposal={proposal}
size="sm"
Expand Down Expand Up @@ -294,7 +294,7 @@ export default function ProposalCard({
</div>
<span
role="link"
className="text-sm text-primary hover:text-primary/80 transition-colors break-all cursor-pointer flex items-center gap-2"
className="text-sm text-primary hover:text-primary/80 transition-colors break-words cursor-pointer flex items-center gap-2"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
Expand All @@ -305,7 +305,7 @@ export default function ProposalCard({
);
}}
>
<span className="inline-block max-w-full break-all">
<span className="inline-block max-w-full break-words">
{referenceLink}
</span>
<ExternalLinkIcon className="h-4 w-4" />
Expand All @@ -319,7 +319,7 @@ export default function ProposalCard({
</div>
<span
role="link"
className="text-sm text-primary hover:text-primary/80 transition-colors break-all cursor-pointer flex items-center gap-2"
className="text-sm text-primary hover:text-primary/80 transition-colors break-words cursor-pointer flex items-center gap-2"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
Expand All @@ -343,7 +343,7 @@ export default function ProposalCard({
d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
/>
</svg>
<span className="inline-block max-w-full break-all">
<span className="inline-block max-w-full break-words">
{airdropTxId}
</span>
</span>
Expand Down Expand Up @@ -383,7 +383,7 @@ export default function ProposalCard({
</div>

{/* Metadata */}
<div className="flex flex-wrap items-center gap-2 sm:gap-3 md:gap-4 text-xs text-foreground/75 mb-4">
<div className="flex flex-wrap items-center gap-2 sm:gap-3 md:gap-4 text-xs text-foreground/75 mb-4 overflow-hidden">
{showDAOInfo && (
<div className="flex items-center gap-1 min-w-0 max-w-[120px] sm:max-w-none">
<Building2 className="h-3 w-3 flex-shrink-0" />
Expand Down
30 changes: 17 additions & 13 deletions src/components/proposals/VoteStatusChart.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,7 @@ const VoteStatusChart = ({
// Show loading state
if (isLoadingVotes && !error) {
return (
<div className="flex items-center justify-center p-4">
<div className="flex items-center justify-center p-4 min-h-[60px]">
<div className="animate-spin rounded-full h-6 w-6 border-b-2 border-primary"></div>
<span className="ml-2 text-sm text-muted-foreground">
Loading vote data...
Expand All @@ -106,7 +106,7 @@ const VoteStatusChart = ({
// Show error state with retry
if (error || (!hasData && !isLoadingVotes)) {
return (
<div className="flex flex-col items-center justify-center p-4 space-y-2">
<div className="flex flex-col items-center justify-center p-4 space-y-2 min-h-[60px]">
<div className="flex items-center text-destructive">
<AlertCircle className="h-4 w-4 mr-2" />
<span className="text-sm">Failed to load vote data</span>
Expand All @@ -131,7 +131,7 @@ const VoteStatusChart = ({

if (!voteDisplayData || !calculations || !progressBarCalculations) {
return (
<div className="flex items-center justify-center p-4">
<div className="flex items-center justify-center p-4 min-h-[60px]">
<span className="text-sm text-muted-foreground">
No vote data available
</span>
Expand All @@ -141,7 +141,7 @@ const VoteStatusChart = ({

// Main vote display
return (
<div className="space-y-2">
<div className="space-y-2 min-h-[60px]">
{/* Vote Progress Bar */}
<div className="relative">
<div className="h-3 sm:h-4 bg-muted rounded-sm overflow-hidden relative">
Expand Down Expand Up @@ -176,38 +176,42 @@ const VoteStatusChart = ({
</div>

{/* Vote Counts */}
<div className="flex justify-between items-center text-xs sm:text-sm">
<div className="flex items-center gap-1">
<span className="text-green-500 font-extrabold">For:</span>
<div className="flex justify-between items-center text-xs sm:text-sm overflow-hidden">
<div className="flex items-center gap-1 min-w-0 flex-1">
<span className="text-green-500 font-extrabold flex-shrink-0">
For:
</span>
<TokenBalance
value={voteDisplayData.rawVotesFor}
decimals={8}
variant="abbreviated"
symbol={tokenSymbol}
className="font-medium hidden sm:inline"
className="font-medium hidden sm:inline truncate"
/>
<TokenBalance
value={voteDisplayData.rawVotesFor}
decimals={8}
variant="abbreviated"
className="font-medium sm:hidden"
className="font-medium sm:hidden truncate"
/>
</div>

<div className="flex items-center gap-1">
<span className="text-red-500 font-extrabold">Against:</span>
<div className="flex items-center gap-1 min-w-0 flex-1 justify-end">
<span className="text-red-500 font-extrabold flex-shrink-0">
Against:
</span>
<TokenBalance
value={voteDisplayData.rawVotesAgainst}
decimals={8}
variant="abbreviated"
symbol={tokenSymbol}
className="font-medium hidden sm:inline"
className="font-medium hidden sm:inline truncate"
/>
<TokenBalance
value={voteDisplayData.rawVotesAgainst}
decimals={8}
variant="abbreviated"
className="font-medium sm:hidden"
className="font-medium sm:hidden truncate"
/>
</div>
</div>
Expand Down