Skip to content

Commit 1652047

Browse files
Lauritz-TiesteLauritz-Tieste
committed
Merge remote-tracking branch 'upstream/develop' into markings-in-skilltree
1 parent 3ade56d commit 1652047

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

56 files changed

+5597
-6494
lines changed

‎.github/workflows/build.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,3 +38,4 @@ jobs:
3838
dist/
3939
.pr
4040
retention-days: 1
41+
include-hidden-files: true

‎components/Btn.vue‎

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,11 @@
11
<template>
2-
<button :class="classes" @click="onclick" type="button">
3-
<component v-if="icon" :is="icon" class="icon"></component>
2+
<button :class="classes" @click="onclick" :disabled="disabled" type="button">
3+
<component v-if="icon" :is="icon" class="icon" />
44
<slot></slot>
55
</button>
66
</template>
77

88
<script lang="ts">
9-
import { defineComponent } from "vue";
10-
119
export default defineComponent({
1210
props: {
1311
full: { type: Boolean, default: false },
@@ -21,11 +19,12 @@ export default defineComponent({
2119
iconRight: { type: Boolean, default: false },
2220
bgColor: { type: String, default: "bg-accent" },
2321
borderColor: { type: String, default: "border-accent" },
22+
disabled: { type: Boolean, default: false },
2423
},
2524
emits: ["click"],
2625
setup(props, { emit }) {
2726
function onclick() {
28-
emit("click", true);
27+
if (!props.disabled) emit("click", true);
2928
}
3029
3130
const textColor = computed(() => {
@@ -39,28 +38,34 @@ export default defineComponent({
3938
sm: props.sm,
4039
"flex-row-reverse": props.iconRight,
4140
"text-center justify-center w-full": props.full,
41+
disabled: props.disabled,
4242
},
4343
props.primary && !props.secondary && !props.tertiary
44-
? `primary ${props.bgColor} text-primary hover:${props.bgColor} border ${props.borderColor} hover:ring-4 md:hover:ring-8 hover:ring-tertiary`
44+
? `primary ${props.bgColor} text-primary enabled:hover:${props.bgColor} border ${props.borderColor} enabled:hover:ring-4 md:enabled:hover:ring-8 enabled:hover:ring-tertiary`
4545
: "",
4646
props.secondary
47-
? `secondary bg-transparent text-heading hover:bg-transparent border ${props.borderColor} hover:ring-4 md:hover:ring-8 hover:ring-tertiary`
47+
? `secondary bg-transparent text-heading enabled:hover:bg-transparent border ${props.borderColor} enabled:hover:ring-4 md:enabled:hover:ring-8 enabled:hover:ring-tertiary`
4848
: "",
4949
props.tertiary
50-
? `tertiary bg-transparent text-heading hover:bg-transparent hover:scale-105 border border-transparent hover:ring-4 md:hover:ring-8 hover:ring-transparent`
50+
? `tertiary bg-transparent text-heading enabled:hover:bg-transparent enabled:hover:scale-105 border border-transparent enabled:hover:ring-4 md:enabled:hover:ring-8 enabled:hover:ring-transparent`
5151
: "",
5252
];
5353
});
5454
return { classes, onclick };
5555
},
5656
});
5757
</script>
58+
5859
<style scoped>
5960
button {
6061
@apply h-fit rounded flex items-center text-center
6162
uppercase tracking-widest transition-basic font-body;
6263
}
6364
65+
button:disabled {
66+
@apply opacity-50 cursor-not-allowed;
67+
}
68+
6469
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ STYLE */
6570
/* .primary {
6671
@apply bg-accent hover:bg-accent border border-accent focus:ring-8 focus:ring-tertiary;

‎components/CodingChallenge/Card.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@
66
<article class="flex gap-3 justify-between">
77
<p
88
v-if="!!codingChallenge?.description"
9-
class="sm:w-3/4 clamp tight line-1 text-accent"
9+
class="sm:w-3/4 tight text-accent"
1010
>
11-
{{ codingChallenge?.description ?? "" }}
11+
<span v-html="$md.render(codingChallenge?.description ?? '')"></span>
1212
</p>
1313

1414
<ArrowRightIcon

‎components/CookiePolicy.vue‎

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,15 @@
11
<template>
22
<div>
33
<Modal v-if="!agreed && route.name != 'docs-privacy'">
4-
<Dialog :dialog="dialog">
4+
<Dialog
5+
:dialog="dialog"
6+
role="dialog"
7+
aria-labelledby="cookie-dialog-title"
8+
aria-describedby="cookie-dialog-description"
9+
aria-modal="true"
10+
>
511
<template #content="{ t }">
6-
<p class="text-body-1 text-body font-body m-0 mt-box">
12+
<p id="cookie-dialog-description" class="text-body-1 text-body font-body m-0 mt-box">
713
{{ t('Body.CookiePolicy') }}
814

915
<NuxtLink
@@ -20,7 +26,7 @@
2026
</template>
2127

2228
<script lang="ts">
23-
import { defineComponent } from 'vue';
29+
import { defineComponent, onMounted } from 'vue';
2430
import Gleap from 'gleap';
2531
2632
export default defineComponent({
@@ -64,6 +70,14 @@ export default defineComponent({
6470
},
6571
});
6672
73+
onMounted(() => {
74+
const dialogElement = document.querySelector('[role="dialog"]');
75+
if (dialogElement && dialogElement instanceof HTMLElement) {
76+
dialogElement.setAttribute('tabindex', '-1');
77+
dialogElement.focus();
78+
}
79+
});
80+
6781
return { agreed, dialog, route };
6882
},
6983
});

‎components/NavbarBack.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -127,7 +127,7 @@ export default defineComponent({
127127
console.log("going back");
128128
pathname = `/courses/${route.query?.course ?? ""}/watch?section=${
129129
route.query?.section ?? ""
130-
}/${route.query?.lecture ?? ""}&skillID=${
130+
}&lecture=${route.query?.lecture ?? ""}&skillID=${
131131
route.query?.skillID ?? ""
132132
}&subSkillID=${route.query?.subSkillID ?? ""}`;
133133
label = "Links.GoToCourse";

‎components/NavbarDrawer.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<Transition>
66
<section
77
v-if="show"
8-
class="w-screen h-screen fixed left-0 top-0 z-50"
8+
class="w-screen h-screen fixed left-0 top-0 z-[10000]"
99
@click.self="closeMenu"
1010
>
1111
<aside class="h-full w-72 bg-tertiary p-[5vw] sm:p-9 shadow-2xl">

‎components/SectionTitle.vue‎

Lines changed: 28 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -7,33 +7,35 @@
77
<p class="text-body-2 col-span-2 hidden md:block">{{ t(body) }}</p>
88
</header>
99

10-
<header :class="{ 'text-center': center, 'max-w-xl': !full }" v-else>
11-
<h1 v-if="size == 'xl'" class="mb-4 md:mb-6 text-display-2 leading-tight">
12-
<strong class="text-subheading-1 mb-2 md:mb-4 block">
13-
{{ t(subheading) }}
14-
</strong>
15-
{{ t(heading) }}
16-
</h1>
10+
<div v-else class="flex justify-center">
11+
<header :class="{ 'text-center': center, 'max-w-xl': !full }">
12+
<h1 v-if="size == 'xl'" class="mb-4 md:mb-6 text-display-2 leading-tight">
13+
<strong class="text-subheading-1 mb-2 md:mb-4 block">
14+
{{ t(subheading) }}
15+
</strong>
16+
{{ t(heading) }}
17+
</h1>
1718

18-
<h1 v-else-if="size == 'lg'" class="mb-5 text-heading-1">
19-
<strong class="text-subheading-1 mb-2 block">{{ t(subheading) }}</strong>
20-
{{ t(heading) }}
21-
</h1>
22-
23-
<h3 v-else-if="size == 'sm'" class="mb-2 text-heading-2">
24-
<strong class="text-xs md:text-sm mb-2 text-accent block">
25-
{{ t(subheading) }}
26-
</strong>
27-
{{ t(heading) }}
28-
</h3>
29-
<h2 v-else class="mb-box leading-normal text-heading-1">
30-
<strong class="text-subheading-1 mb-1 xl:mb-2 block">
31-
{{ t(subheading) }}
32-
</strong>
33-
{{ t(heading) }}
34-
</h2>
35-
<p>{{ t(body) }}</p>
36-
</header>
19+
<h1 v-else-if="size == 'lg'" class="mb-5 text-heading-1">
20+
<strong class="text-subheading-1 mb-2 block">{{ t(subheading) }}</strong>
21+
{{ t(heading) }}
22+
</h1>
23+
24+
<h3 v-else-if="size == 'sm'" class="mb-2 text-heading-2">
25+
<strong class="text-xs md:text-sm mb-2 text-accent block">
26+
{{ t(subheading) }}
27+
</strong>
28+
{{ t(heading) }}
29+
</h3>
30+
<h2 v-else class="mb-box leading-normal text-heading-1">
31+
<strong class="text-subheading-1 mb-1 xl:mb-2 block">
32+
{{ t(subheading) }}
33+
</strong>
34+
{{ t(heading) }}
35+
</h2>
36+
<p>{{ t(body) }}</p>
37+
</header>
38+
</div>
3739
</template>
3840

3941
<script lang="ts">

‎components/SkillSelectionModal.vue‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
<template>
2+
<Modal v-if="show">
3+
<article class="style-card bg-secondary max-w-screen-md w-full">
4+
<div class="card overflow-scroll max-h-[80vh]">
5+
<div class="flex justify-center">
6+
<TagIcon class="w-12 h-12 m-4 text-accent" />
7+
</div>
8+
<h2 class="text-heading-2 mb-box text-center">
9+
{{ t("Headings.SelectSkill") }}
10+
</h2>
11+
<div class="flex justify-center mb-4">
12+
<p class="max-w-md text-center">
13+
{{ t("Body.SelectSkillDescription")}}
14+
</p>
15+
</div>
16+
<div
17+
v-for="(skill, index) in skills"
18+
:key="index"
19+
class="flex gap-card"
20+
>
21+
<article
22+
class="w-full grid grid-cols-1 gap-y-1 border-2 rounded-md py-2 px-4 mt-box cursor-pointer"
23+
:class="
24+
selectedSkill === skill.id
25+
? 'border-accent'
26+
: 'border-transparent bg-primary'
27+
"
28+
@click="selectSkill(skill.id)"
29+
>
30+
<p class="text-body-1">{{ skill.name }}</p>
31+
</article>
32+
</div>
33+
</div>
34+
<div class="card flex gap-card flex-wrap bg-[#1c3250]">
35+
<Btn secondary @click="closeModal">
36+
{{ t("Buttons.Cancel") }}
37+
</Btn>
38+
<div class="flex-1"></div>
39+
<Btn
40+
:disabled="!selectedSkill"
41+
class="disabled:opacity-25"
42+
@click="confirmSelection"
43+
>
44+
{{ t("Buttons.Next") }}
45+
</Btn>
46+
</div>
47+
</article>
48+
</Modal>
49+
</template>
50+
51+
<script lang="ts">
52+
import { defineComponent, ref } from "vue";
53+
import { useI18n } from "vue-i18n";
54+
import Modal from "@/components/Dialog.vue";
55+
import Btn from "@/components/Btn.vue";
56+
import { TagIcon } from "@heroicons/vue/24/outline";
57+
58+
export default defineComponent({
59+
components: { Modal, Btn, TagIcon },
60+
props: {
61+
show: { type: Boolean, default: false },
62+
skills: {
63+
type: Array as PropType<Array<{ id: string; name: string }>>,
64+
default: () => [],
65+
},
66+
},
67+
emits: ["select", "close"],
68+
setup(props, { emit }) {
69+
const { t } = useI18n();
70+
const selectedSkill = ref<string | null>(null);
71+
72+
function selectSkill(skillID: string) {
73+
selectedSkill.value = skillID;
74+
}
75+
76+
function confirmSelection() {
77+
if (!selectedSkill.value) return;
78+
79+
emit("select", selectedSkill.value);
80+
closeModal();
81+
}
82+
83+
function closeModal() {
84+
emit("close");
85+
}
86+
87+
return {
88+
t,
89+
selectedSkill,
90+
selectSkill,
91+
confirmSelection,
92+
closeModal,
93+
};
94+
},
95+
});
96+
</script>

‎components/Tooltip.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ function show() {
8282
@mouseleave="hide"
8383
ref="floatingRef"
8484
:class="[
85-
' absolute w-max max-w-[380px] text-sm top-0 left-0 z-50 bg-light text-subheading p-3 rounded-md cursor-default',
85+
'absolute w-max max-w-[calc(100vw-50px)] sm:max-w-[380px] text-sm top-0 left-0 z-50 bg-light text-subheading p-3 rounded-md cursor-default',
8686
isHidden && 'hidden',
8787
]"
8888
>

‎components/challenges/CodeEditor.vue‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,15 +22,15 @@
2222
:iconColor="'#FF0000'"
2323
@click="openDialogSubmission()"
2424
:loading="submitButtonLoading"
25-
>Submit</InputBtn
25+
>{{ t("Buttons.Submit") }}</InputBtn
2626
>
2727

2828
<InputBtn
2929
v-else-if="isPremium"
3030
iconRight
3131
@click="fnCreateSubmission()"
3232
:loading="submitButtonLoading"
33-
>Submit</InputBtn
33+
>{{ t("Buttons.Submit") }}</InputBtn
3434
>
3535
</article>
3636
</header>
@@ -42,6 +42,7 @@
4242
</template>
4343

4444
<script lang="ts">
45+
import { useI18n } from "vue-i18n";
4546
import { defineComponent, onMounted, onBeforeUnmount, watch, } from "vue";
4647
import type { Prop, Ref } from "vue";
4748
import * as monaco from "monaco-editor";
@@ -65,6 +66,7 @@ export default defineComponent({
6566
emits: ["update:modelValue", "valid", "environment"],
6667
components: { HeartIcon },
6768
setup(props, { emit }) {
69+
const { t } = useI18n();
6870
let editor: monaco.editor.IStandaloneCodeEditor;
6971
const editorContainer = ref<HTMLDivElement | null>(null);
7072
const environments: any = useEnvironments();
@@ -254,6 +256,7 @@ export default defineComponent({
254256
});
255257
256258
return {
259+
t,
257260
handleEditorDidMount,
258261
editorContainer,
259262
languages,

0 commit comments

Comments
 (0)