fix(ui): improve layout stability and refactor trade detail styles
- fix schedule screen layout by measuring day width on web to prevent overflow - add overflow hidden to schedule grid cells - refactor trade detail screen styles for better organization and readability - update trade detail seller card and avatar components - expand trade type and status maps in trade detail screen
This commit is contained in:
@@ -199,6 +199,7 @@ export const ScheduleScreen: React.FC = () => {
|
||||
return Math.max(DEFAULT_SECTION_HEIGHT, calculatedHeight);
|
||||
}, [screenHeight, isMobile, insets.bottom]);
|
||||
const [isAddModalVisible, setIsAddModalVisible] = useState(false);
|
||||
const [measuredDayWidth, setMeasuredDayWidth] = useState<number | null>(null);
|
||||
const [pendingDay, setPendingDay] = useState<number>(0);
|
||||
const [pendingMergedSection, setPendingMergedSection] = useState<number>(1);
|
||||
const [newCourseName, setNewCourseName] = useState('');
|
||||
@@ -676,7 +677,9 @@ export const ScheduleScreen: React.FC = () => {
|
||||
const height = duration * sectionHeight - 4;
|
||||
const laneGap = 2;
|
||||
const baseLeft = 2;
|
||||
const availableWidth = dayColumnWidth - baseLeft * 2;
|
||||
const baseRight = 2;
|
||||
const effectiveDayWidth = measuredDayWidth ?? dayColumnWidth;
|
||||
const availableWidth = effectiveDayWidth - baseLeft - baseRight;
|
||||
const cardWidth =
|
||||
laneCount > 1
|
||||
? (availableWidth - laneGap * (laneCount - 1)) / laneCount
|
||||
@@ -728,6 +731,9 @@ export const ScheduleScreen: React.FC = () => {
|
||||
return (
|
||||
<View
|
||||
key={dayOfWeek}
|
||||
onLayout={(e) => {
|
||||
if (isWeb) setMeasuredDayWidth(e.nativeEvent.layout.width);
|
||||
}}
|
||||
style={[
|
||||
styles.dayColumn,
|
||||
{
|
||||
@@ -1336,6 +1342,7 @@ function createScheduleStyles(colors: AppColors) {
|
||||
backgroundColor: colors.background.default,
|
||||
borderRightWidth: StyleSheet.hairlineWidth,
|
||||
borderRightColor: colors.divider,
|
||||
overflow: 'hidden',
|
||||
},
|
||||
gridCell: {
|
||||
borderBottomWidth: StyleSheet.hairlineWidth,
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user