TelegramPWA/src/components/common/profile/BusinessHours.module.scss

87 lines
1.4 KiB
SCSS

.root {
cursor: pointer;
}
.top {
display: flex;
justify-content: space-between;
align-items: center;
}
.icon {
align-self: flex-start;
margin-top: 1rem;
}
.left, .bottom {
display: flex;
flex-direction: column;
line-height: 1.4;
}
.status {
font-size: 0.875rem;
color: var(--color-error);
}
.status-open {
color: var(--color-green);
}
.arrow {
margin-inline-end: 0.375rem;
font-size: 1.25rem;
color: var(--color-text-secondary);
}
.offset-trigger {
display: inline-block;
padding: 0 0.5rem;
border-radius: 0.75rem;
font-size: 0.875rem;
color: var(--color-primary);
background-color: var(--color-primary-tint);
align-self: flex-end;
margin-bottom: 0.25rem;
z-index: 1;
transition: background-color 0.2s ease-in-out;
&:hover {
background-color: var(--color-primary-opacity);
}
}
.transition {
margin-bottom: 0.5rem;
height: 0;
/* stylelint-disable-next-line plugin/no-low-performance-animation-properties */
transition: height 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.timetable {
margin-bottom: 0;
display: grid;
grid-template-columns: auto 1fr;
gap: 0.5rem;
margin-top: 0.6875rem;
}
.schedule {
color: var(--color-text-secondary);
font-size: 0.875rem;
margin-bottom: 0;
justify-self: end;
text-align: end;
}
.weekday {
word-break: break-all;
line-height: 1.25;
font-size: 0.875rem;
}
.current-day {
color: var(--color-primary);
}