diff options
| author | Caidan Williams <caidan@internet.dev> | 2025-07-22 15:18:07 -0700 |
|---|---|---|
| committer | Caidan Williams <caidan@internet.dev> | 2025-07-24 12:30:35 -0700 |
| commit | 66950a08cb0551fe600bf8c8d14f5e58632c11d5 (patch) | |
| tree | 7ffb552f03e821196096410fc38aa5b3e682648e | |
| parent | b89645a172b56c51e6b886072bf53aecd6834b14 (diff) | |
| download | voidsky-66950a08cb0551fe600bf8c8d14f5e58632c11d5.tar.zst | |
feat(ui): add border to video post and trending cards
Added a border and low contrast border color to CompactVideoPostCard, CompactVideoPostCardPlaceholder, and TrendingVideos card components for improved visual separation.
| -rw-r--r-- | src/components/VideoPostCard.tsx | 8 | ||||
| -rw-r--r-- | src/components/interstitials/TrendingVideos.tsx | 2 |
2 files changed, 10 insertions, 0 deletions
diff --git a/src/components/VideoPostCard.tsx b/src/components/VideoPostCard.tsx index 4cb4c4a75..a1bdd29b4 100644 --- a/src/components/VideoPostCard.tsx +++ b/src/components/VideoPostCard.tsx @@ -424,6 +424,8 @@ export function CompactVideoPostCard({ a.justify_center, a.rounded_lg, a.overflow_hidden, + a.border, + t.atoms.border_contrast_low, { backgroundColor: black, aspectRatio: 9 / 16, @@ -444,6 +446,8 @@ export function CompactVideoPostCard({ a.inset_0, a.justify_center, a.align_center, + a.border, + t.atoms.border_contrast_low, { backgroundColor: 'black', opacity: 0.2, @@ -465,6 +469,8 @@ export function CompactVideoPostCard({ a.justify_center, a.rounded_lg, a.overflow_hidden, + a.border, + t.atoms.border_contrast_low, { backgroundColor: black, aspectRatio: 9 / 16, @@ -540,6 +546,8 @@ export function CompactVideoPostCardPlaceholder() { style={[ a.rounded_lg, a.overflow_hidden, + a.border, + t.atoms.border_contrast_low, { backgroundColor: black, aspectRatio: 9 / 16, diff --git a/src/components/interstitials/TrendingVideos.tsx b/src/components/interstitials/TrendingVideos.tsx index 8eaa13be0..c64da3b5d 100644 --- a/src/components/interstitials/TrendingVideos.tsx +++ b/src/components/interstitials/TrendingVideos.tsx @@ -196,6 +196,8 @@ function VideoCards({ a.align_center, a.flex_1, a.rounded_lg, + a.border, + t.atoms.border_contrast_low, t.atoms.bg, t.atoms.shadow_sm, ]}> |