client: fix style

This commit is contained in:
fantasticit 2022-06-23 18:10:14 +08:00
parent 661dc1862f
commit 5f05715ed1
2 changed files with 67 additions and 1 deletions

View File

@ -13,6 +13,12 @@
justify-content: space-between;
align-items: center;
> span {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
&:hover {
background-color: var(--semi-color-fill-0);
}
@ -97,3 +103,61 @@
opacity: 1;
}
}
.navItemWrap {
display: flex;
justify-content: space-between;
align-items: center;
color: var(--semi-color-text-0);
&.hoverable {
&:hover {
color: var(--semi-color-text-0);
background-color: var(--semi-color-fill-0);
}
}
&.isActive {
font-weight: 600;
color: var(--semi-color-primary);
background-color: var(--semi-color-primary-light-default);
}
.navItem {
display: flex;
width: 100%;
padding: 12px 16px;
font-size: 14px;
cursor: pointer;
border-radius: var(--semi-border-radius-small);
align-items: center;
> span {
display: flex;
align-items: center;
}
.icon {
display: flex;
justify-content: center;
align-items: center;
min-width: 24px;
min-height: 24px;
margin: 0 6px 0 0;
:global {
.semi-icon-default {
font-size: 24px;
}
}
}
.title {
overflow: hidden;
color: inherit;
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
}
}
}

View File

@ -109,7 +109,9 @@ export const WikiTocs: React.FC<IProps> = ({
>
{wiki.name.charAt(0)}
</Avatar>
<Text strong>{wiki.name}</Text>
<Text strong ellipsis={{ rows: 1 }}>
{wiki.name}
</Text>
</span>
</a>
</Link>