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

Fix linting issues

This commit is contained in:
Ramon Wenger 2024-07-17 16:59:40 +02:00 committed by Christian Cueni
parent 1d2224e941
commit 2513aa6fac
4 changed files with 23 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
client/src/pages/learningPath/learningPathPage/LearningPathListTopic.vue
View File

@ -1,6 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
import LearningPathCircleListTile from "@/pages/learningPath/learningPathPage/LearningPathCircleListTile.vue"; import LearningPathCircleListTile from "@/pages/learningPath/learningPathPage/LearningPathCircleListTile.vue";
import type { LearningContentWithCompletion, TopicType } from '@/types'; import type { LearningContentWithCompletion, TopicType } from "@/types";
import { computed } from "vue"; import { computed } from "vue";
interface Props { interface Props {
@ -10,7 +10,6 @@ interface Props {
} }
const props = defineProps<Props>(); const props = defineProps<Props>();
const filteredCircles = computed(() => { const filteredCircles = computed(() => {
if (props.filter === undefined || props.filter === "") { if (props.filter === undefined || props.filter === "") {
return props.topic.circles; return props.topic.circles;

14
client/src/pages/learningPath/learningPathPage/LearningPathPathTopic.vue
View File

@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed } from "vue"; import { computed } from "vue";
import type { LearningContentWithCompletion, TopicType } from '@/types'; import type { LearningContentWithCompletion, TopicType } from "@/types";
import LearningPathCircleColumn from './LearningPathCircleColumn.vue'; import LearningPathCircleColumn from "./LearningPathCircleColumn.vue";
interface Props { interface Props {
topic: TopicType; topic: TopicType;
@ -20,7 +20,6 @@ const isFirstCircle = (circleIndex: number) =>
const isLastCircle = (circleIndex: number, numCircles: number) => const isLastCircle = (circleIndex: number, numCircles: number) =>
props.isLastTopic && circleIndex === numCircles - 1; props.isLastTopic && circleIndex === numCircles - 1;
const filteredCircles = computed(() => { const filteredCircles = computed(() => {
if (props.filter === undefined || props.filter === "") { if (props.filter === undefined || props.filter === "") {
return props.topic.circles; return props.topic.circles;
@ -33,10 +32,7 @@ const filteredCircles = computed(() => {
</script> </script>
<template> <template>
<div <div class="border-l border-gray-500" :class="topicIndex == 0 ? 'ml-6 sm:ml-12' : ''">
class="border-l border-gray-500"
:class="topicIndex == 0 ? 'ml-6 sm:ml-12' : ''"
>
<p <p
:id="`topic-${topic.slug}`" :id="`topic-${topic.slug}`"
class="inline-block h-12 self-start px-4 font-bold text-gray-800" class="inline-block h-12 self-start px-4 font-bold text-gray-800"
@ -51,9 +47,7 @@ const filteredCircles = computed(() => {
:circle="circle" :circle="circle"
:next-learning-content="nextLearningContent" :next-learning-content="nextLearningContent"
:is-first-circle="isFirstCircle(circleIndex)" :is-first-circle="isFirstCircle(circleIndex)"
:is-last-circle=" :is-last-circle="isLastCircle(circleIndex, topic.circles.length)"
isLastCircle(circleIndex, topic.circles.length)
"
:override-circle-url=" :override-circle-url="
overrideCircleUrlBase ? `${overrideCircleUrlBase}/${circle.slug}` : undefined overrideCircleUrlBase ? `${overrideCircleUrlBase}/${circle.slug}` : undefined
" "

16
client/src/pages/learningPath/learningPathPage/LearningPathPathView.vue
View File

@ -3,10 +3,7 @@ import LearningPathCircleColumn from "@/pages/learningPath/learningPathPage/Lear
import LearningPathScrollButton from "@/pages/learningPath/learningPathPage/LearningPathScrollButton.vue"; import LearningPathScrollButton from "@/pages/learningPath/learningPathPage/LearningPathScrollButton.vue";
import { useScroll } from "@vueuse/core"; import { useScroll } from "@vueuse/core";
import { computed, nextTick, ref, watch } from "vue"; import { computed, nextTick, ref, watch } from "vue";
import type { import type { LearningContentWithCompletion, LearningPathType } from "@/types";
LearningContentWithCompletion,
LearningPathType,
} from "@/types";
import LoadingSpinner from "@/components/ui/LoadingSpinner.vue"; import LoadingSpinner from "@/components/ui/LoadingSpinner.vue";
import LearningPathPathTopic from "./LearningPathPathTopic.vue"; import LearningPathPathTopic from "./LearningPathPathTopic.vue";
@ -34,16 +31,19 @@ const scrollLearnPathDiagram = (offset: number) => {
const topics = computed(() => props.learningPath?.topics ?? []); const topics = computed(() => props.learningPath?.topics ?? []);
watch(()=> props.filter, () => { watch(
() => props.filter,
() => {
// we need to update the scroll state of the element, otherwise the arrows won't match the scroll state // we need to update the scroll state of the element, otherwise the arrows won't match the scroll state
// https://github.com/vueuse/vueuse/issues/2875 // https://github.com/vueuse/vueuse/issues/2875
nextTick(() => { nextTick(() => {
if (learnPathDiagram.value) { if (learnPathDiagram.value) {
const scrollEvent = new Event('scroll'); const scrollEvent = new Event("scroll");
learnPathDiagram.value.dispatchEvent(scrollEvent); learnPathDiagram.value.dispatchEvent(scrollEvent);
} }
}); });
}) }
);
</script> </script>
<template> <template>
@ -69,7 +69,7 @@ watch(()=> props.filter, () => {
:next-learning-content="nextLearningContent" :next-learning-content="nextLearningContent"
:override-circle-url-base="overrideCircleUrlBase" :override-circle-url-base="overrideCircleUrlBase"
:filter="filter" :filter="filter"
:is-last-topic="topicIndex === (topics.length - 1)" :is-last-topic="topicIndex === topics.length - 1"
/> />
</div> </div>
<LearningPathScrollButton <LearningPathScrollButton

5
client/tailwind.css
View File

@ -93,7 +93,7 @@ textarea {
} }
.link { .link {
@apply underline underline-offset-2 cursor-pointer; @apply cursor-pointer underline underline-offset-2;
} }
.link-large { .link-large {
@ -117,7 +117,8 @@ textarea {
} }
.filter-blue-900 { .filter-blue-900 {
filter: invert(9%) sepia(38%) saturate(5684%) hue-rotate(200deg) brightness(95%) contrast(105%); filter: invert(9%) sepia(38%) saturate(5684%) hue-rotate(200deg) brightness(95%)
contrast(105%);
} }
} }