mirror of
https://github.com/hcengineering/platform.git
synced 2025-04-25 18:02:04 +00:00
Team Calendar UI fixes (#3609)
Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
parent
6e3ad0eb62
commit
0dd2fe3d72
@ -511,6 +511,7 @@ input.search {
|
|||||||
.mx-4 { margin: 0 1rem; }
|
.mx-4 { margin: 0 1rem; }
|
||||||
.mx-10 { margin: 0 2.5rem; }
|
.mx-10 { margin: 0 2.5rem; }
|
||||||
.mx-auto { margin: 0 auto; }
|
.mx-auto { margin: 0 auto; }
|
||||||
|
.my-1 { margin: .25rem 0; }
|
||||||
.my-2 { margin: .5rem 0; }
|
.my-2 { margin: .5rem 0; }
|
||||||
.my-3 { margin: .75rem 0; }
|
.my-3 { margin: .75rem 0; }
|
||||||
.my-4 { margin: 1rem 0; }
|
.my-4 { margin: 1rem 0; }
|
||||||
|
@ -105,8 +105,10 @@
|
|||||||
}
|
}
|
||||||
&:disabled { background-color: var(--theme-button-disabled); }
|
&:disabled { background-color: var(--theme-button-disabled); }
|
||||||
&.selected {
|
&.selected {
|
||||||
background-color: var(--theme-button-hovered);
|
color: var(--theme-button-contrast-color);
|
||||||
.btn-icon { color: var(--theme-caption-color); }
|
background-color: var(--theme-accent-color);
|
||||||
|
.btn-icon { color: var(--theme-button-contrast-color); }
|
||||||
|
&:hover { color: var(--theme-button-contrast-color); }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.no-border {
|
&.no-border {
|
||||||
@ -196,10 +198,6 @@
|
|||||||
}
|
}
|
||||||
&.regular, &.ghost {
|
&.regular, &.ghost {
|
||||||
&:hover, &:active, &:focus { color: var(--theme-caption-color); }
|
&:hover, &:active, &:focus { color: var(--theme-caption-color); }
|
||||||
&.selected {
|
|
||||||
color: var(--theme-button-contrast-color);
|
|
||||||
background-color: var(--theme-accent-color);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
&.accented,
|
&.accented,
|
||||||
&.brand,
|
&.brand,
|
||||||
|
@ -181,10 +181,10 @@
|
|||||||
const index = grid[event.day].columns.findIndex(
|
const index = grid[event.day].columns.findIndex(
|
||||||
(col) => col.elements[col.elements.length - 1].dueDate <= event.date
|
(col) => col.elements[col.elements.length - 1].dueDate <= event.date
|
||||||
)
|
)
|
||||||
if (index === -1) {
|
|
||||||
const intersects = grid[event.day].columns.filter((col) =>
|
const intersects = grid[event.day].columns.filter((col) =>
|
||||||
checkIntersect(col.elements[col.elements.length - 1], event)
|
checkIntersect(col.elements[col.elements.length - 1], event)
|
||||||
)
|
)
|
||||||
|
if (index === -1) {
|
||||||
const size = intersects.length + 1
|
const size = intersects.length + 1
|
||||||
grid[event.day].columns.forEach((col) => {
|
grid[event.day].columns.forEach((col) => {
|
||||||
if (checkIntersect(col.elements[col.elements.length - 1], event)) {
|
if (checkIntersect(col.elements[col.elements.length - 1], event)) {
|
||||||
@ -195,9 +195,6 @@
|
|||||||
elements: [{ id: event._id, date: event.date, dueDate: event.dueDate, cols: size }]
|
elements: [{ id: event._id, date: event.date, dueDate: event.dueDate, cols: size }]
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
const intersects = grid[event.day].columns.filter((col) =>
|
|
||||||
checkIntersect(col.elements[col.elements.length - 1], event)
|
|
||||||
)
|
|
||||||
let maxCols = 1
|
let maxCols = 1
|
||||||
intersects.forEach((col) => {
|
intersects.forEach((col) => {
|
||||||
if (col.elements[col.elements.length - 1].cols > maxCols) {
|
if (col.elements[col.elements.length - 1].cols > maxCols) {
|
||||||
@ -454,6 +451,7 @@
|
|||||||
bind:divScroll={scroller}
|
bind:divScroll={scroller}
|
||||||
fade={{ multipler: { top: (showHeader ? 3.5 : 0) + styleAD / fontSize, bottom: 0 } }}
|
fade={{ multipler: { top: (showHeader ? 3.5 : 0) + styleAD / fontSize, bottom: 0 } }}
|
||||||
>
|
>
|
||||||
|
{#key newEvents}
|
||||||
<div
|
<div
|
||||||
bind:this={container}
|
bind:this={container}
|
||||||
class="calendar-container"
|
class="calendar-container"
|
||||||
@ -510,7 +508,11 @@
|
|||||||
style:--mask-image={getMask(rect.visibility)}
|
style:--mask-image={getMask(rect.visibility)}
|
||||||
tabindex={500 + i}
|
tabindex={500 + i}
|
||||||
>
|
>
|
||||||
<EventElement hourHeight={cellHeight} event={ev} size={{ width: rect.width, height: rect.height }} />
|
<EventElement
|
||||||
|
hourHeight={cellHeight}
|
||||||
|
event={ev}
|
||||||
|
size={{ width: rect.width, height: rect.height }}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
{/each}
|
{/each}
|
||||||
@ -666,6 +668,7 @@
|
|||||||
{/each}
|
{/each}
|
||||||
{/key}
|
{/key}
|
||||||
</div>
|
</div>
|
||||||
|
{/key}
|
||||||
</Scroller>
|
</Scroller>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
|
Loading…
Reference in New Issue
Block a user