ramon
/
skillbox
1
0
Fork 0
Code Issues 1 Pull Requests 1 Packages Projects 1 Releases 1 Wiki Activity

Fix margins after and before titles 

Resolves MS-713 #complete
This commit is contained in:
Ramon Wenger 2023-05-10 16:27:03 +02:00
parent 433f10629a
commit 6e409fa0f0
6 changed files with 48 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
client/src/components/content-blocks/ContentComponent.vue
View File

@ -25,66 +25,26 @@
import { constructContentComponentBookmarkMutation } from '@/helpers/update-content-bookmark-mutation'; import { constructContentComponentBookmarkMutation } from '@/helpers/update-content-bookmark-mutation';
import { defineAsyncComponent } from 'vue'; import { defineAsyncComponent } from 'vue';
const TextBlock = defineAsyncComponent(() => const TextBlock = defineAsyncComponent(() => import('@/components/content-blocks/TextBlock.vue'));
import('@/components/content-blocks/TextBlock.vue') const InstrumentWidget = defineAsyncComponent(() => import('@/components/content-blocks/InstrumentWidget.vue'));
); const ImageBlock = defineAsyncComponent(() => import('@/components/content-blocks/ImageBlock.vue'));
const InstrumentWidget = defineAsyncComponent(() => const ImageUrlBlock = defineAsyncComponent(() => import('@/components/content-blocks/ImageUrlBlock.vue'));
import('@/components/content-blocks/InstrumentWidget.vue') const VideoBlock = defineAsyncComponent(() => import('@/components/content-blocks/VideoBlock.vue'));
); const LinkBlock = defineAsyncComponent(() => import('@/components/content-blocks/LinkBlock.vue'));
const ImageBlock = defineAsyncComponent(() => const DocumentBlock = defineAsyncComponent(() => import('@/components/content-blocks/DocumentBlock.vue'));
import('@/components/content-blocks/ImageBlock.vue') const CmsDocumentBlock = defineAsyncComponent(() => import('@/components/content-blocks/CmsDocumentBlock.vue'));
); const InfogramBlock = defineAsyncComponent(() => import('@/components/content-blocks/InfogramBlock.vue'));
const ImageUrlBlock = defineAsyncComponent(() => const ThinglinkBlock = defineAsyncComponent(() => import('@/components/content-blocks/ThinglinkBlock.vue'));
import('@/components/content-blocks/ImageUrlBlock.vue') const GeniallyBlock = defineAsyncComponent(() => import('@/components/content-blocks/GeniallyBlock.vue'));
); const SubtitleBlock = defineAsyncComponent(() => import('@/components/content-blocks/SubtitleBlock.vue'));
const VideoBlock = defineAsyncComponent(() => const SectionTitleBlock = defineAsyncComponent(() => import('@/components/content-blocks/SectionTitleBlock.vue'));
import('@/components/content-blocks/VideoBlock.vue') const ContentListBlock = defineAsyncComponent(() => import('@/components/content-blocks/ContentListBlock.vue'));
); const ModuleRoomSlug = defineAsyncComponent(() => import('@/components/content-blocks/ModuleRoomSlug.vue'));
const LinkBlock = defineAsyncComponent(() => const Assignment = defineAsyncComponent(() => import('@/components/content-blocks/assignment/Assignment.vue'));
import('@/components/content-blocks/LinkBlock.vue') const Survey = defineAsyncComponent(() => import('@/components/content-blocks/SurveyBlock.vue'));
); const Solution = defineAsyncComponent(() => import('@/components/content-blocks/Solution.vue'));
const DocumentBlock = defineAsyncComponent(() => const Instruction = defineAsyncComponent(() => import('@/components/content-blocks/Instruction.vue'));
import('@/components/content-blocks/DocumentBlock.vue') const BookmarkActions = defineAsyncComponent(() => import('@/components/notes/BookmarkActions.vue'));
);
const CmsDocumentBlock = defineAsyncComponent(() =>
import('@/components/content-blocks/CmsDocumentBlock.vue')
);
const InfogramBlock = defineAsyncComponent(() =>
import('@/components/content-blocks/InfogramBlock.vue')
);
const ThinglinkBlock = defineAsyncComponent(() =>
import('@/components/content-blocks/ThinglinkBlock.vue')
);
const GeniallyBlock = defineAsyncComponent(() =>
import('@/components/content-blocks/GeniallyBlock.vue')
);
const SubtitleBlock = defineAsyncComponent(() =>
import('@/components/content-blocks/SubtitleBlock.vue')
);
const SectionTitleBlock = defineAsyncComponent(() =>
import('@/components/content-blocks/SectionTitleBlock.vue')
);
const ContentListBlock = defineAsyncComponent(() =>
import('@/components/content-blocks/ContentListBlock.vue')
);
const ModuleRoomSlug = defineAsyncComponent(() =>
import('@/components/content-blocks/ModuleRoomSlug.vue')
);
const Assignment = defineAsyncComponent(() =>
import('@/components/content-blocks/assignment/Assignment.vue')
);
const Survey = defineAsyncComponent(() =>
import('@/components/content-blocks/SurveyBlock.vue')
);
const Solution = defineAsyncComponent(() =>
import('@/components/content-blocks/Solution.vue')
);
const Instruction = defineAsyncComponent(() =>
import('@/components/content-blocks/Instruction.vue')
);
const BookmarkActions = defineAsyncComponent(() =>
import('@/components/notes/BookmarkActions.vue')
);
export default { export default {
props: { props: {
@ -190,8 +150,8 @@ export default {
} }
&--subtitle { &--subtitle {
margin-top: $section-spacing; margin-top: 2 * $medium-spacing;
margin-bottom: $large-spacing; margin-bottom: $medium-spacing;
} }
&--section_title { &--section_title {

17
client/src/components/modules/Module.vue
View File

@ -58,11 +58,20 @@
class="module__objective-groups" class="module__objective-groups"
v-if="module.objectiveGroups.length" v-if="module.objectiveGroups.length"
> >
<objective-groups :groups="languageCommunicationObjectiveGroups" /> <objective-groups
:groups="languageCommunicationObjectiveGroups"
v-if="languageCommunicationObjectiveGroups.length"
/>
<objective-groups :groups="societyObjectiveGroups" /> <objective-groups
:groups="societyObjectiveGroups"
v-if="societyObjectiveGroups.length"
/>
<objective-groups :groups="interdisciplinaryObjectiveGroups" /> <objective-groups
:groups="interdisciplinaryObjectiveGroups"
v-if="interdisciplinaryObjectiveGroups.length"
/>
</div> </div>
<chapter <chapter
@ -185,7 +194,7 @@ export default {
} }
&__objective-groups { &__objective-groups {
margin-bottom: $large-spacing; margin-bottom: 2 * $large-spacing;
} }
} }
</style> </style>

1
client/src/components/objective-groups/ObjectiveGroup.vue
View File

@ -81,7 +81,6 @@ export default {
.objective-group { .objective-group {
position: relative; position: relative;
margin-top: $large-spacing;
&__actions { &__actions {
position: absolute; position: absolute;

16
client/src/components/objective-groups/ObjectiveGroups.vue
View File

@ -1,10 +1,12 @@
<template> <template>
<div class="objective-groups"> <div class="objective-groups">
<objective-group <template v-for="group in filteredObjectiveGroups">
:group="group" <objective-group
v-for="group in filteredObjectiveGroups" :group="group"
:key="group.id" v-if="group.objectives.length"
/> :key="group.id"
/>
</template>
</div> </div>
</template> </template>
@ -65,5 +67,9 @@ export default {
margin-bottom: $large-spacing; margin-bottom: $large-spacing;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
&:last-child {
margin-bottom: 0;
}
} }
</style> </style>

1
client/src/layouts/SimpleLayout.vue
View File

@ -20,7 +20,6 @@
<script lang="ts" setup> <script lang="ts" setup>
import DynamicFooter from '@/layouts/DynamicFooter.vue'; import DynamicFooter from '@/layouts/DynamicFooter.vue';
import MyKvFooter from '@/layouts/MyKVFooter.vue';
import { defineAsyncComponent, computed } from 'vue'; import { defineAsyncComponent, computed } from 'vue';
import { useRoute, useRouter } from 'vue-router'; import { useRoute, useRouter } from 'vue-router';
import flavor from '@/helpers/app-flavor'; import flavor from '@/helpers/app-flavor';

2
client/src/pages/instrument.vue
View File

@ -60,6 +60,8 @@ export default {
@import 'styles/helpers'; @import 'styles/helpers';
.instrument { .instrument {
padding-top: 2 * $large-spacing;
&__title { &__title {
font-size: toRem(35px); font-size: toRem(35px);
margin-bottom: $large-spacing; margin-bottom: $large-spacing;