Files
orion-visor/orion-ops-ui/src/assets/style/layout.less
2023-10-18 17:11:27 +08:00

202 lines
2.4 KiB
Plaintext

.layout-container {
background-color: var(--color-fill-2);
padding: 16px;
display: flex;
flex-direction: column;
}
.table-search-card {
width: 100%;
padding-top: 16px;
margin-bottom: 16px;
.arco-form-item {
margin-bottom: 0;
}
}
.table-left-bar-handle {
display: flex;
align-items: center;
justify-content: start;
}
.table-right-bar-handle {
display: flex;
align-items: center;
justify-content: end
}
.table-card {
width: 100%;
.arco-card-header {
padding: 8px 16px 0 16px;
.arco-card-header-title {
display: flex;
justify-content: space-between;
.table-title {
display: flex;
align-items: center;
font-size: 16px;
font-weight: 600;
margin-right: 16px;
}
}
}
}
.table-wrapper {
&-8 {
margin-top: 8px;
}
&-16 {
margin-top: 16px;
}
}
.table-handle-wrapper {
.arco-btn-text {
padding: 0 8px;
}
}
.modal-form {
.arco-form-item {
&:last-child {
margin-bottom: 0 !important;
}
}
}
.card-list-item {
height: 100%;
display: flex;
flex-direction: column;
border-radius: 4px;
border: 1px solid var(--color-neutral-3);
transition-property: all;
& > .arco-card-header {
padding: 16px 16px 8px 16px;
border: none;
.arco-card-header-title {
font-size: 15px;
}
}
& > .arco-card-body {
padding: 0 16px 16px 16px;
flex-grow: 1;
}
}
.card-list-item:hover {
transform: translateY(-4px);
box-shadow: 2px 2px 12px rgba(0, 0, 0, .15);
}
.card-extra-icon {
font-size: 16px;
cursor: pointer;
}
.card-filter-wrapper {
padding: 18px 24px 14px 24px;
}
.usn {
user-select: none;
}
.hide {
display: none;
}
.pointer {
cursor: pointer;
}
.ml4 {
margin-left: 4px;
}
.mr4 {
margin-right: 4px;
}
.mt4 {
margin-top: 4px;
}
.mb4 {
margin-bottom: 4px;
}
.mx4 {
margin-left: 4px;
margin-right: 4px;
}
.my4 {
margin-top: 4px;
margin-bottom: 4px;
}
.ml8 {
margin-left: 8px;
}
.mr8 {
margin-right: 8px;
}
.mt8 {
margin-top: 8px;
}
.mb8 {
margin-bottom: 8px;
}
.mx8 {
margin-left: 8px;
margin-right: 8px;
}
.my8 {
margin-top: 8px;
margin-bottom: 8px;
}
.ml16 {
margin-left: 16px;
}
.mr16 {
margin-right: 16px;
}
.mt16 {
margin-top: 16px;
}
.mb16 {
margin-bottom: 16px;
}
.mx16 {
margin-left: 16px;
margin-right: 16px;
}
.my16 {
margin-top: 16px;
margin-bottom: 16px;
}