diff options
author | dartcafe <github@dartcafe.de> | 2020-08-28 09:20:56 +0300 |
---|---|---|
committer | dartcafe <github@dartcafe.de> | 2020-08-28 09:20:56 +0300 |
commit | 95a420dd7209668a1640b820a51e5e83cefc6d33 (patch) | |
tree | b10348acbee9ab838072f0bf05f440269cbce77f /src | |
parent | e2688ab4b086812ac0086b7c25df9fdb15094e8a (diff) |
styling calendar-peek
Diffstat (limited to 'src')
-rw-r--r-- | src/js/components/Base/CalendarInfo.vue | 20 | ||||
-rw-r--r-- | src/js/components/VoteTable/VoteTableCalendarPeek.vue | 6 |
2 files changed, 22 insertions, 4 deletions
diff --git a/src/js/components/Base/CalendarInfo.vue b/src/js/components/Base/CalendarInfo.vue index f0baf8a0..c75ee55f 100644 --- a/src/js/components/Base/CalendarInfo.vue +++ b/src/js/components/Base/CalendarInfo.vue @@ -23,7 +23,7 @@ <template> <div class="calendar-info" :class="conflictLevel" - :style="{ backgroundColor: event.displayColor, color: fontColor }"> + :style="calendarStyle"> <div class="calendar-info__time"> {{ formatDate(event.eventFrom) }} - {{ formatDate(event.eventTo) }} </div> @@ -53,6 +53,13 @@ export default { }, computed: { + calendarStyle() { + return { + backgroundColor: this.event.displayColor, + color: this.fontColor, + } + }, + fontColor() { if (this.event.displayColor === 'transparent') { return 'black' @@ -75,9 +82,9 @@ export default { conflictLevel() { if (this.event.key === 0) { return 'conflict-ignore' - } else if (this.event.eventFrom >= this.option.timestamp + 3600) { + } else if (this.event.eventFrom > this.option.timestamp + 3599) { return 'conflict-no' - } else if (this.event.eventTo <= this.option.timestamp) { + } else if (this.event.eventTo - 1 < this.option.timestamp) { return 'conflict-no' } else { return 'conflict-yes' @@ -106,6 +113,9 @@ export default { &.conflict-ignore { border-left: 4px solid transparent; + .calendar-info__summay { + font-weight: bold; + } } &.conflict-no { @@ -122,5 +132,7 @@ export default { font-size: 80%; flex: 0 auto; } - +.calendar-info__summay { + margin-left: 4px; +} </style> diff --git a/src/js/components/VoteTable/VoteTableCalendarPeek.vue b/src/js/components/VoteTable/VoteTableCalendarPeek.vue index d1df9b02..dfe548b3 100644 --- a/src/js/components/VoteTable/VoteTableCalendarPeek.vue +++ b/src/js/components/VoteTable/VoteTableCalendarPeek.vue @@ -142,6 +142,12 @@ export default { margin: 4px auto; } +.calendar-grid { + padding: 8px; + background-color: #fff; + border-radius: var(--border-radius); +} + .vote-table-calendar-peek >div { display: flex; flex-direction: column; |