VBV-144: enable `hyphens: auto` on body tag

This commit is contained in:
Daniel Egger 2022-09-14 09:34:59 +02:00
parent 0c01d39fb3
commit 20a3de4d80
6 changed files with 19 additions and 9 deletions

View File

@ -182,8 +182,14 @@ export default {
const circlesText = circle_groups const circlesText = circle_groups
.append('text') .append('text')
.attr('fill', colors.blue[900]) .attr('fill', colors.blue[900])
.style('font-size', 19) .style('font-size', 18)
.text((d) => d.title) .style('hyphens', 'auto')
.text((d) => {
if (!this.vertical) {
return d.title.replace('Prüfungsvorbereitung', 'Prüfungs- vorbereitung')
}
return d.title
})
const topicHeightOffset = 20 const topicHeightOffset = 20
const topicHeight = 50 const topicHeight = 50
@ -294,7 +300,7 @@ export default {
topicTitles topicTitles
.attr('y', 20) .attr('y', 20)
.style('font-size', 19) .style('font-size', 18)
.call(wrap, circleWidth * 0.8) .call(wrap, circleWidth * 0.8)
.attr('class', 'topicTitles font-bold') .attr('class', 'topicTitles font-bold')
} }

View File

@ -59,7 +59,7 @@ onMounted(async () => {
<span class="inline">zurück zum Lernpfad</span> <span class="inline">zurück zum Lernpfad</span>
</router-link> </router-link>
<h1 class="text-blue-dark text-7xl" data-cy="circle-title"> <h1 class="text-blue-dark text-4xl lg:text-6xl" data-cy="circle-title">
{{ circleStore.circle?.title }} {{ circleStore.circle?.title }}
</h1> </h1>

View File

@ -54,7 +54,7 @@ onMounted(async () => {
></LearningPathDiagram> ></LearningPathDiagram>
</div> </div>
<h1 data-cy="learning-path-title" class="m-6 lg:m-12" style="hyphens: auto"> <h1 data-cy="learning-path-title" class="m-6 lg:m-12">
{{ learningPathStore.learningPath.title }} {{ learningPathStore.learningPath.title }}
</h1> </h1>
@ -66,7 +66,7 @@ onMounted(async () => {
<p class="mt-4 text-xl"></p> <p class="mt-4 text-xl"></p>
</div> </div>
<div class="p-4 lg:p-8 flex-2" v-if="learningPathStore.learningPath.nextLearningContent" translate> <div class="p-4 lg:p-8 flex-2" v-if="learningPathStore.learningPath.nextLearningContent" translate>
Nächster Schirtt Nächster Schritt
<h3> <h3>
{{ learningPathStore.learningPath.nextLearningContent.parentCircle.title }}: {{ learningPathStore.learningPath.nextLearningContent.parentCircle.title }}:
{{ learningPathStore.learningPath.nextLearningContent.parentLearningSequence.title }} {{ learningPathStore.learningPath.nextLearningContent.parentLearningSequence.title }}

View File

@ -21,7 +21,7 @@ const emits = defineEmits(['closemodal'])
<template> <template>
<ItFullScreenModal :show="show" @closemodal="$emit('closemodal')"> <ItFullScreenModal :show="show" @closemodal="$emit('closemodal')">
<div class="bg-white mx-auto max-w-[1440px] lg:p-6 p-4" v-if="learningPathStore.learningPath"> <div class="bg-white mx-auto max-w-[1440px] lg:p-6 p-4" v-if="learningPathStore.learningPath">
<h1 style="hyphens: auto">{{ learningPathStore.learningPath.title }}</h1> <h1>{{ learningPathStore.learningPath.title }}</h1>
<div class="learningpath flex flex-col"> <div class="learningpath flex flex-col">
<div class="flex flex-col h-max"> <div class="flex flex-col h-max">
<div class="bg-red py-8"> <div class="bg-red py-8">

View File

@ -6,6 +6,10 @@ html {
@apply text-black @apply text-black
} }
body {
hyphens: auto;
}
svg { svg {
@apply fill-current @apply fill-current
} }

View File

@ -425,8 +425,8 @@ Neukundinnen und -kunden.""",
create_circle_children(circle_analyse, 'Betreuen') create_circle_children(circle_analyse, 'Betreuen')
TopicFactory(title="Prüfung", is_visible=True, parent=lp) TopicFactory(title="Prüfung", is_visible=True, parent=lp)
circle_analyse = create_circle('Prüfungs- vorbereitung', lp) circle_analyse = create_circle('Prüfungsvorbereitung', lp)
create_circle_children(circle_analyse, 'Prüfungs- vorbereitung') create_circle_children(circle_analyse, 'Prüfungsvorbereitung')
# locales # locales
if not skip_locales: if not skip_locales: