update giao diện bottom bar

This commit is contained in:
Truong Vo 2025-12-12 17:12:51 +07:00
parent d4ae00dc37
commit a37e647674
1 changed files with 16 additions and 16 deletions

View File

@ -1194,11 +1194,11 @@ export const DrawerSwitchControl: React.FC<DrawerProps> = ({
<Box <Box
style={{ style={{
width: "fit-content", width: "fit-content",
minWidth: "50px", minWidth: "32px",
minHeight: "88px", minHeight: "56px",
}} }}
> >
<Flex gap={"8px"} wrap={"nowrap"}> <Flex gap={"4px"} wrap={"nowrap"}>
{sortedPorts(group) {sortedPorts(group)
.slice( .slice(
0, 0,
@ -1217,8 +1217,8 @@ export const DrawerSwitchControl: React.FC<DrawerProps> = ({
style={{ style={{
flex: "0 0 auto", flex: "0 0 auto",
position: "relative", position: "relative",
width: "50px", width: "34px",
height: "40px", height: "28px",
backgroundColor: backgroundColor:
port.poe === "ON" port.poe === "ON"
? "#f2dcf8" ? "#f2dcf8"
@ -1248,7 +1248,7 @@ export const DrawerSwitchControl: React.FC<DrawerProps> = ({
flexWrap: "wrap", flexWrap: "wrap",
}} }}
> >
<Text fw={500} fz={"11px"}> <Text fw={500} fz={"9px"}>
{normalizePortName(port.name)} {normalizePortName(port.name)}
</Text> </Text>
</Box> </Box>
@ -1269,7 +1269,7 @@ export const DrawerSwitchControl: React.FC<DrawerProps> = ({
</Card> </Card>
))} ))}
</Flex> </Flex>
<Flex gap={"8px"} wrap={"nowrap"} mt={"8px"}> <Flex gap={"4px"} wrap={"nowrap"} mt={"4px"}>
{sortedPorts(group) {sortedPorts(group)
.slice( .slice(
Math.ceil(sortedPorts(group).length / 2), Math.ceil(sortedPorts(group).length / 2),
@ -1288,8 +1288,8 @@ export const DrawerSwitchControl: React.FC<DrawerProps> = ({
style={{ style={{
flex: "0 0 auto", flex: "0 0 auto",
position: "relative", position: "relative",
width: "50px", width: "40px",
height: "40px", height: "32px",
backgroundColor: backgroundColor:
port.poe === "ON" port.poe === "ON"
? "#f2dcf8" ? "#f2dcf8"
@ -1359,11 +1359,11 @@ export const DrawerSwitchControl: React.FC<DrawerProps> = ({
<Box <Box
style={{ style={{
width: "fit-content", width: "fit-content",
minWidth: "50px", minWidth: "40px",
minHeight: "88px", minHeight: "56px",
}} }}
> >
<Flex gap={"8px"} wrap={"nowrap"}> <Flex gap={"6px"} wrap={"nowrap"}>
{sortedPorts(group) {sortedPorts(group)
.slice( .slice(
0, 0,
@ -1382,8 +1382,8 @@ export const DrawerSwitchControl: React.FC<DrawerProps> = ({
style={{ style={{
flex: "0 0 auto", flex: "0 0 auto",
position: "relative", position: "relative",
width: "50px", width: "40px",
height: "40px", height: "32px",
backgroundColor: backgroundColor:
port.poe === "ON" port.poe === "ON"
? "#f2dcf8" ? "#f2dcf8"
@ -1413,7 +1413,7 @@ export const DrawerSwitchControl: React.FC<DrawerProps> = ({
flexWrap: "wrap", flexWrap: "wrap",
}} }}
> >
<Text fw={500} fz={"11px"}> <Text fw={500} fz={"10px"}>
{normalizePortName(port.name)} {normalizePortName(port.name)}
</Text> </Text>
</Box> </Box>
@ -1434,7 +1434,7 @@ export const DrawerSwitchControl: React.FC<DrawerProps> = ({
</Card> </Card>
))} ))}
</Flex> </Flex>
<Flex gap={"8px"} wrap={"nowrap"} mt={"8px"}> <Flex gap={"6px"} wrap={"nowrap"} mt={"6px"}>
{sortedPorts(group) {sortedPorts(group)
.slice( .slice(
Math.ceil(sortedPorts(group).length / 2), Math.ceil(sortedPorts(group).length / 2),