Files
bodyshop/client/src/components/shop-info/shop-info.scheduling.styles.scss

59 lines
1.2 KiB
SCSS

.shop-info-scheduling__bucket-card-body {
display: flex;
gap: 12px;
align-items: stretch;
}
.shop-info-scheduling__bucket-card-fields {
flex: 1 1 0;
min-width: 0;
display: grid;
grid-template-columns: repeat(3, minmax(92px, 1fr));
gap: 0 12px;
}
.shop-info-scheduling__bucket-card-fields .ant-form-item {
margin-bottom: 10px;
}
.shop-info-scheduling__bucket-card-color {
flex: 0 0 360px;
min-width: 360px;
max-width: 360px;
display: flex;
align-items: stretch;
}
.shop-info-scheduling__bucket-card-color .ant-form-item {
margin-bottom: 0;
width: 100%;
}
.shop-info-scheduling__bucket-card-color .ant-form-item-control,
.shop-info-scheduling__bucket-card-color .ant-form-item-control-input,
.shop-info-scheduling__bucket-card-color .ant-form-item-control-input-content {
height: 100%;
}
@media (max-width: 1199px) {
.shop-info-scheduling__bucket-card-body {
flex-direction: column;
}
.shop-info-scheduling__bucket-card-fields {
grid-template-columns: repeat(2, minmax(120px, 1fr));
}
.shop-info-scheduling__bucket-card-color {
flex-basis: auto;
min-width: 0;
max-width: none;
}
}
@media (max-width: 575px) {
.shop-info-scheduling__bucket-card-fields {
grid-template-columns: minmax(0, 1fr);
}
}