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

Style mobile Mediathek overview

This commit is contained in:
Christian Cueni 2022-10-20 16:21:25 +02:00
parent 74ec62493e
commit f6114c78e7
3 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
client/src/components/mediaLibrary/OverviewCard.vue
View File

@ -13,8 +13,8 @@ const props = withDefaults(defineProps<Props>(), {
</script>
<template>
<div class="bg-white p-8 flex justify-between">
<div>
<div class="bg-white lg:pb-8 pb-4 p-8 flex justify-between flex-col lg:flex-row">
<div class="mb-4 lg:mb-0">
<h3 class="mb-4">{{ title }}</h3>
<p class="mb-4">{{ description }}</p>
<router-link
@ -29,7 +29,7 @@ const props = withDefaults(defineProps<Props>(), {
<div
v-if="icon"
:class="[`bg-${icon}`]"
class="hidden lg:block bg-contain bg-no-repeat bg-right w-2/6 -mr-8"
class="lg:block bg-contain bg-no-repeat bg-left lg:bg-right h-32 lg:w-2/6 -ml-8 lg:ml-0 lg:-mr-8"
></div>
</div>
</template>

10
client/src/pages/competence/CompetenceIndexPage.vue
View File

@ -2,10 +2,10 @@
import CompetenceProgress from "@/components/competences/CompetenceProgress.vue";
import PerformanceCriteriaRow from "@/components/competences/PerformanceCriteriaRow.vue";
import ItDropdownSelect from "@/components/ui/ItDropdownSelect.vue";
import { useCompetenceStore } from "@/stores/competence";
import {useCompetenceStore} from "@/stores/competence";
import _ from "lodash";
import * as log from "loglevel";
import { computed } from "vue";
import {computed} from "vue";
log.debug("CompetenceIndexPage created");
@ -60,7 +60,7 @@ const countStatus = computed(() => {
:items="competenceStore.availableCircles"
></ItDropdownSelect>
</div>
<div class="bg-white p-8 mb-8">
<div class="bg-white px-8 py-4 lg:py-8 l mb-4 lg:mb-8">
<div>
<h3 class="pb-4 border-b">Letzte verbesserte Kompetenzen</h3>
<ul>
@ -90,7 +90,7 @@ const countStatus = computed(() => {
</router-link>
</div>
</div>
<div class="bg-white p-8 mb-8">
<div class="bg-white px-8 py-4 lg:py-8 l mb-4 lg:mb-8">
<h3 class="pb-4 lg:pb-0 mb-4 border-b lg:border-0">Einschätzungen</h3>
<ul
class="flex flex-col lg:flex-row lg:items-center lg:justify-between lg:gap-8 mb-6"
@ -133,7 +133,7 @@ const countStatus = computed(() => {
<it-icon-arrow-right></it-icon-arrow-right>
</router-link>
</div>
<div v-if="failedCriteria.length > 0" class="bg-white p-8">
<div v-if="failedCriteria.length > 0" class="bg-white px-8 py-4 lg:py-8 l mb-4 lg:mb-8">
<div class="border-b flex flex-row items-center pb-4 mb-4">
<it-icon-smiley-thinking class="w-11 h-11 mr-5"></it-icon-smiley-thinking>
<h3>«Das muss ich nochmals anschauen»</h3>

14
client/src/pages/competence/PerformanceCriteriaPage.vue
View File

@ -1,11 +1,11 @@
<script setup lang="ts">
import { default as PerformanceCriteriaRow } from "@/components/competences/PerformanceCriteriaRow.vue";
import {default as PerformanceCriteriaRow} from "@/components/competences/PerformanceCriteriaRow.vue";
import ItDropdownSelect from "@/components/ui/ItDropdownSelect.vue";
import { useCompetenceStore } from "@/stores/competence";
import type { CourseCompletionStatus } from "@/types";
import {useCompetenceStore} from "@/stores/competence";
import type {CourseCompletionStatus} from "@/types";
import * as log from "loglevel";
import type { Ref } from "vue";
import { computed, ref } from "vue";
import type {Ref} from "vue";
import {computed, ref} from "vue";
log.debug("CompetencesMainView created");
@ -27,11 +27,11 @@ const shownCriteria = computed(() => {
class="btn-text inline-flex items-center pl-0"
:to="`${competenceStore.competenceProfilePage?.frontend_url}`"
>
<it-icon-arrow-left />
<it-icon-arrow-left/>
<span>zurück</span>
</router-link>
</nav>
<div class="flex flex-col lg:flex-row items-center justify-between mb-10">
<div class="flex flex-col lg:flex-row items-center justify-between mb-4 lg:mb-10">
<h1>Einschätzungen</h1>
<ItDropdownSelect
v-model="competenceStore.selectedCircle"