fix(ui-layout): correct flex text truncation issues
Add min-w-0, w-full, and block classes to flex child elements and text nodes across various UI components to ensure text truncation works correctly. Remove outdated hardcoded card item width styles from global SCSS and replace them with inline responsive width classes where appropriate.
This commit is contained in:
@@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<view v-if="orderType == 0" class="border-box bg-white p-[12px] rounded-[12px] mb-[12px]">
|
||||
<view v-if="orderType == 0" class="border-box w-full min-w-0 bg-white p-[12px] rounded-[12px] mb-[12px]">
|
||||
<!-- 酒店类型入住离店日期部分 -->
|
||||
<DateRangeSection v-if="orderData.orderType == 0" :selectedDate="selectedDate" />
|
||||
|
||||
<view class="text-[16px] font-[500] text-[#000000] leading-[24px] truncate">
|
||||
<view class="w-full text-[16px] font-[500] text-[#000000] leading-[24px] truncate">
|
||||
{{ orderData.commodityName }}
|
||||
</view>
|
||||
|
||||
@@ -20,8 +20,8 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="orderType != 0" class="border-box bg-white p-[12px] rounded-[12px] mb-[12px]">
|
||||
<view class="text-[16px] font-[500] text-[#000000] leading-[24px] truncate mb-[8px]">
|
||||
<view v-if="orderType != 0" class="border-box w-full min-w-0 bg-white p-[12px] rounded-[12px] mb-[12px]">
|
||||
<view class="w-full text-[16px] font-[500] text-[#000000] leading-[24px] truncate mb-[8px]">
|
||||
{{ orderData.commodityName }}
|
||||
</view>
|
||||
|
||||
|
||||
@@ -13,8 +13,8 @@
|
||||
<view class="bg-white rounded-[12px] flex flex-col items-center justify-center p-[12px] mb-[12px] mx-[12px]">
|
||||
|
||||
<view class="flex w-full flex-row items-center justify-between py-[4px]">
|
||||
<view>
|
||||
<view class="text-[16px] font-[500] text-[#000000] leading-[24px] truncate">
|
||||
<view class="min-w-0 flex-1">
|
||||
<view class="w-full text-[16px] font-[500] text-[#000000] leading-[24px] truncate">
|
||||
{{ selectedVoucher.name }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
Reference in New Issue
Block a user