mirror of
https://github.com/ragestudio/comty.git
synced 2025-06-10 02:54:15 +00:00
use buttons
This commit is contained in:
parent
8e07edf738
commit
42a03c5f87
@ -34,22 +34,20 @@ const NavMenuMobile = (props) => {
|
||||
<div className="card">
|
||||
{
|
||||
props.items.map((item) => {
|
||||
return <div
|
||||
return <antd.Button
|
||||
key={item.key}
|
||||
className={classnames(
|
||||
"item",
|
||||
item.key === props.activeKey && "active",
|
||||
)}
|
||||
onClick={() => props.onClickItem(item.key)}
|
||||
type="ghost"
|
||||
disabled={item.disabled}
|
||||
>
|
||||
<div className="icon">
|
||||
{item.icon}
|
||||
</div>
|
||||
|
||||
<div className="label">
|
||||
{item.label}
|
||||
</div>
|
||||
</div>
|
||||
</antd.Button>
|
||||
})
|
||||
}
|
||||
</div>
|
||||
|
@ -1,3 +1,5 @@
|
||||
@import "theme/vars.less";
|
||||
|
||||
.navmenu_wrapper {
|
||||
position: relative;
|
||||
}
|
||||
@ -5,7 +7,7 @@
|
||||
.__mobile__navmenu_wrapper {
|
||||
box-sizing: border-box;
|
||||
|
||||
position: sticky;
|
||||
position: relative;
|
||||
|
||||
top: 0;
|
||||
left: 0;
|
||||
@ -13,9 +15,50 @@
|
||||
width: 100%;
|
||||
|
||||
.card {
|
||||
width: 100%;
|
||||
height: @app_topBar_height;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
justify-content: space-evenly;
|
||||
|
||||
box-shadow: @card-shadow;
|
||||
|
||||
gap: 10px;
|
||||
padding: 5px;
|
||||
border-radius: 12px;
|
||||
|
||||
isolation: unset;
|
||||
overflow: visible;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
align-items: center;
|
||||
|
||||
height: fit-content;
|
||||
|
||||
gap: 4px;
|
||||
|
||||
padding: 8px 10px;
|
||||
|
||||
&.active {
|
||||
color: var(--colorPrimary);
|
||||
}
|
||||
|
||||
.icon {
|
||||
margin: 0;
|
||||
line-height: 1rem;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.label {
|
||||
height: fit-content;
|
||||
line-height: 1rem;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user