2023-07-24 11:56:13 +02:00

88 lines
1.4 KiB
SCSS

@import "@Themes/constants.scss";
.root {
.header {
display: flex;
justify-content: space-between;
align-items: center;
@media (max-width: $screen-s) {
flex-direction: column;
align-items: flex-start;
gap: 16px;
}
.header-right {
display: flex;
align-items: center;
gap: 16px;
.round {
width: 16px;
height: 16px;
background-color: var(--green-flash);
border-radius: 100px;
}
}
}
.office-infos {
background-color: var(--grey-soft);
display: flex;
justify-content: space-between;
padding: 24px;
margin-top: 32px;
@media (max-width: $screen-l) {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 32px;
}
@media (max-width: $screen-s) {
grid-template-columns: repeat(1, 1fr);
}
.office-infos-row {
display: flex;
flex-direction: column;
gap: 12px;
}
}
.office-users {
.users {
.title {
margin-top: 32px;
}
.users-container {
margin-top: 32px;
text-align: center;
display: flex;
flex-direction: column;
gap: 24px;
.first-line,
.user-line {
display: grid;
grid-template-columns: repeat(5, 1fr);
padding: 24px;
background-color: var(--purple-soft);
}
.user-line {
background-color: var(--grey-soft);
}
.user-line {
&:nth-child(odd) {
background-color: var(--grey-medium);
}
}
}
}
}
}