diff --git a/src/pages/calendar/components/CalendarColumn.vue b/src/pages/calendar/components/CalendarColumn.vue
index 8385369..d197e16 100644
--- a/src/pages/calendar/components/CalendarColumn.vue
+++ b/src/pages/calendar/components/CalendarColumn.vue
@@ -1,11 +1,14 @@
- .calendar-column-wrapper
+ .calendar-column-wrapper.flex.flex-col
.header.flex.items-center.justify-between.py-2.px-6
.flex.items-center
img.avatar-wrapper.mr-2(:src="info.avatar" alt="Team member")
span.member-name.font-medium.text-base.mr-6 {{ info.name }}
- img.icon-wrapper(src="@/assets/icons/lock.svg")
- base-doc-ok-button
+ img.icon-wrapper.cursor-pointer(src="@/assets/icons/lock.svg")
+ base-doc-ok-button
+ .body.flex.flex-col
+ .line.flex.items-center(v-for="hour in 10" :key="hour")
+ .middle-line
@@ -33,6 +33,7 @@ export default {
.header
height: 48px
+ border-bottom: 1px solid var(--border-light-grey-color)
.avatar-wrapper
width: 32px
@@ -44,4 +45,12 @@ export default {
.member-name
color: var(--font-dark-blue-color)
+
+.line
+ border-bottom: 1px solid var(--border-light-grey-color)
+ height: 62px
+
+.middle-line
+ border-top: 1px dashed var(--border-light-grey-color)
+ width: 100%