style(home components): convert rounded-24 to rounded-[24px] across card components
Update all home page card components to use Tailwind's arbitrary radius syntax. Also adjust SharedVisual/CardShell.vue to add a subtle box shadow, fix border class formatting, and include transition and opacity styles for pressable and disabled states.
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="long-text-guide-card w-full">
|
||||
<div v-if="mode === 'list'" class="long-text-guide-card__list w-full">
|
||||
<div v-for="item in cards" :key="item.id" class="long-text-guide-card__summary-card bg-white rounded-24 "
|
||||
<div v-for="item in cards" :key="item.id" class="long-text-guide-card__summary-card bg-white rounded-[24px] "
|
||||
:class="{ 'is-disabled': disabled }" @click="openDetail(item)">
|
||||
<div class="long-text-guide-card__badge text-[12px] font-bold" :class="`is-${item.badgeTone}`">
|
||||
{{ item.badge }}
|
||||
@@ -19,7 +19,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-else class="long-text-guide-card__detail-card bg-white rounded-24 overflow-hidden">
|
||||
<div v-else class="long-text-guide-card__detail-card bg-white rounded-[24px] overflow-hidden">
|
||||
<div class="long-text-guide-card__detail-header flex items-center border-bottom-F1F5F9">
|
||||
<div class="long-text-guide-card__back flex items-center flex-justify-center rounded-full font-700"
|
||||
@click="closeDetail">
|
||||
|
||||
Reference in New Issue
Block a user