diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonInformation.vue b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonInformation.vue index 52b8bf8ad927ff9b01703ec629255f98cfab33ba..2d0c45ec4208e9f1c350ce55f952b99a93b37803 100644 --- a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonInformation.vue +++ b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonInformation.vue @@ -1,13 +1,15 @@ <template> <div :class="{ 'full-width grid mr-0': true, 'mr-md-4': compact }"> <div> - <time :datetime="documentation.datetimeStart" :class="{ 'd-block': compact }"> - {{ $d(toDateTime(documentation.datetimeStart), "shortTime") }} - </time> - <span v-if="!compact">–</span> - <time :datetime="documentation.datetimeEnd" :class="{ 'd-block': compact }"> - {{ $d(toDateTime(documentation.datetimeEnd), "shortTime") }} - </time> + <div :class="{ 'text-right d-flex flex-column fit-content': compact }"> + <time :datetime="documentation.datetimeStart" class="text-no-wrap"> + {{ $d(toDateTime(documentation.datetimeStart), "shortTime") }} + </time> + <span v-if="!compact">–</span> + <time :datetime="documentation.datetimeEnd" class="text-no-wrap"> + {{ $d(toDateTime(documentation.datetimeEnd), "shortTime") }} + </time> + </div> </div> <span class="text-center"> {{ documentation.course?.name }} @@ -51,4 +53,8 @@ export default { .subject { justify-self: end; } + +.fit-content { + width: fit-content; +} </style>