update(Wave accessability): updates aria labels for accessability

This commit is contained in:
SimonGschnell
2025-07-10 11:47:51 +02:00
parent 129b8b2e49
commit 6f3759d95d
5 changed files with 29 additions and 31 deletions
+5 -5
View File
@@ -112,23 +112,23 @@
}
.cursor-nw-resize {
cursor: nw-resize;
cursor: nw-resize !important;
}
.cursor-ew-resize {
cursor: ew-resize;
cursor: ew-resize !important;
}
.cursor-ns-resize {
cursor: ns-resize;
cursor: ns-resize !important;
}
.no-drag-drop {
cursor: not-allowed;
cursor: not-allowed !important;
}
.cursor-move {
cursor: move;
cursor: move !important;
}
.draggedItem {
+1 -3
View File
@@ -2,7 +2,6 @@ import FhcCalendar from "../../Calendar/Calendar.js";
import CalendarDate from "../../../composables/CalendarDate.js";
import LvModal from "../Mylv/LvModal.js";
import LvMenu from "../Mylv/LvMenu.js"
import lehreinheitEvent from "../Renderer/Lehreinheit/calendarEvent.js"
import ApiLvPlan from '../../../api/factory/lvPlan.js';
import ApiAuthinfo from '../../../api/factory/authinfo.js';
@@ -24,7 +23,6 @@ const LvPlan = {
studiensemester_start: null,
studiensemester_ende: null,
uid: null,
renderComponents: {},
isModalContentResolved: false,
isModalTitleResolved: false,
isShowModal: false,
@@ -94,7 +92,7 @@ const LvPlan = {
}
},
components: {
FhcCalendar, LvModal, LvMenu, lehreinheitEvent
FhcCalendar, LvModal, LvMenu
},
computed:{
modalLoaded: function(){
+1 -1
View File
@@ -196,7 +196,7 @@ export default {
<div class="core-dashboard">
<h3 v-show="viewDataInternal?.name">
{{ $p.t('global/personalGreeting', [ viewDataInternal?.name ]) }}
<button style="margin-left: 8px;" class="btn" @click="editMode = !editMode"><i class="fa-solid fa-gear"></i></button>
<button style="margin-left: 8px;" class="btn" @click="editMode = !editMode" aria-label="edit dashboard" v-tooltip="{showDelay:1000,value:'edit dashboard'}"><i class="fa-solid fa-gear" aria-hidden="true"></i></button>
</h3>
<dashboard-section v-for="(section, index) in sections" :key="section.name" :seperator="index" :name="section.name" :widgets="section.widgets" @widgetAdd="widgetAdd" @widgetUpdate="widgetUpdate" @widgetRemove="widgetRemove"></dashboard-section>
<dashboard-widget-picker ref="widgetpicker" :widgets="widgets"></dashboard-widget-picker>
+17 -17
View File
@@ -160,32 +160,32 @@ export default {
<div v-show="!dragstate" class="h-100 card border-0">
<div v-if="widget" class="card-header d-flex ps-0 pe-2 align-items-center">
<Transition>
<span v-if="editMode && !isPinned" drag-action="move" class="col-auto mx-2 px-2 cursor-move"><i class="fa-solid fa-grip-vertical"></i></span>
<span type="button" v-if="editMode && !isPinned" drag-action="move" class="col-auto mx-2 px-2 cursor-move" aria-label="move widget" v-tooltip="{showDelay:1000, value:'move widget'}"><i class="fa-solid fa-grip-vertical" aria-hidden="true"></i></span>
</Transition>
<span class="col mx-2 px-2">{{ widget.setup.name }}</span>
<template v-if="isPinned">
<div v-if="editMode" pinned="true" @click="unpin" class="pin cursor-pointer col-auto me-2">
<i class="fa-solid fa-thumbtack "></i>
<div type="button" v-if="editMode" pinned="true" @click="unpin" v-tooltip="{showDelay:1000, value: 'unpin item'}" aria-label="unpin item" class="pin cursor-pointer col-auto me-2">
<i class="fa-solid fa-thumbtack " aria-hidden="true"></i>
</div>
<div v-else class="col-auto me-2">
<i class="fa-solid fa-thumbtack "></i>
</div>
</template>
<template v-else>
<div v-if="editMode" class="col-auto me-2 pin" @click="pinItem">
<i class="fa-solid fa-thumbtack" style="color:lightgray;"></i>
<div type="button" v-if="editMode" class="col-auto me-2 pin" @click="pinItem" aria-label="pin item" v-tooltip="{showDelay:1000, value: 'pin item'}">
<i class="fa-solid fa-thumbtack" aria-hidden="true" style="color:lightgray;"></i>
</div>
</template>
<a v-if="widget.setup.cis4link" :href="getWidgetC4Link(widget)" class="col-auto ms-auto ">
<i class="fa fa-arrow-up-right-from-square me-1"></i>
<a type="button" v-if="widget.setup.cis4link" :href="getWidgetC4Link(widget)" aria-label="widget link" v-tooltip="{showDelay:1000, value:'widget link'}" class="col-auto ms-auto ">
<i class="fa fa-arrow-up-right-from-square me-1" aria-hidden="true"></i>
</a>
<a v-if="hasConfig" class="col-auto px-1" href="#" @click.prevent="openConfig"><i class="fa-solid fa-gear"></i></a>
<a v-if="custom && editMode" class="col-auto px-1" href="#" @click.prevent="$emit('remove')">
<i class="fa-solid fa-trash"></i>
<a type="button" v-if="hasConfig" class="col-auto px-1" href="#" @click.prevent="openConfig" aria-label="configure widget" v-tooltip="{showDelay:1000,value:'configure widget'}"><i class="fa-solid fa-gear" aria-hidden="true"></i></a>
<a type="button" v-if="custom && editMode" class="col-auto px-1" aria-label="delete widget" v-tooltip="{showDelay:1000,value:'delete widget'}" href="#" @click.prevent="$emit('remove')">
<i class="fa-solid fa-trash" aria-hidden="true"></i>
</a>
<Transition>
<div v-if="!custom && editMode" class="col-auto px-1 form-switch">
<input class="form-check-input ms-0" type="checkbox" role="switch" id="flexSwitchCheckChecked" :checked="!hidden" @input="$emit('remove', hidden)">
<input class="form-check-input ms-0" type="checkbox" role="switch" aria-label="toggle widget" id="flexSwitchCheckChecked" :checked="!hidden" @input="$emit('remove', hidden)">
</div>
</Transition>
</div>
@@ -209,18 +209,18 @@ export default {
<height-transition>
<div v-if="editMode && isResizeable && !isPinned " class="card-footer d-flex justify-content-end p-0">
<template v-if="maxWidth < 2">
<span drag-action="resize" class="col-auto px-1 cursor-ns-resize">
<i class="fa-solid fa-up-down pe-2"></i>
<span type="button" drag-action="resize" class="col-auto px-1 cursor-ns-resize" aria-label="resize widget" v-tooltip="{showDelay:1000, value:'resize widget'}">
<i class="fa-solid fa-up-down pe-2" aria-hidden="true"></i>
</span>
</template>
<template v-else-if="maxHeight < 2">
<span drag-action="resize" class="col-auto px-1 cursor-ew-resize">
<i class="fa-solid fa-left-right pe-2"></i>
<span type="button" drag-action="resize" class="col-auto px-1 cursor-ew-resize" aria-label="resize widget" v-tooltip="{showDelay:1000, value:'resize widget'}">
<i class="fa-solid fa-left-right pe-2" aria-hidden="true"></i>
</span>
</template>
<template v-else>
<span drag-action="resize" class="col-auto px-1 cursor-nw-resize">
<i class="fa-solid fa-up-right-and-down-left-from-center mirror-x"></i>
<span type="button" drag-action="resize" class="col-auto px-1 cursor-nw-resize" aria-label="resize widget" v-tooltip="{showDelay:1000, value:'resize widget'}">
<i class="fa-solid fa-up-right-and-down-left-from-center mirror-x" aria-hidden="true"></i>
</span>
</template>
</div>
+5 -5
View File
@@ -161,7 +161,7 @@ export default {
template: /*html*/ `
<div class="widgets-url w-100 h-100 overflow-scroll" style="padding: 1rem 1rem;">
<div class="d-flex flex-column justify-content-between">
<button class="btn btn-outline-secondary btn-sm w-100 mt-2" @click="openCreateModal" type="button">{{$p.t('bookmark','newLink')}}</button>
<button class="btn btn-outline-secondary btn-sm w-100 mt-2 card" @click="openCreateModal" type="button">{{$p.t('bookmark','newLink')}}</button>
<template v-if="shared">
@@ -173,12 +173,12 @@ export default {
<div class="ms-auto">
<!--EDIT BOOKMARK-->
<a href="#" @click.prevent="openEditModal(link)" >
<i class="fa fa-edit me-1"></i>
<a type="button" href="#" @click.prevent="openEditModal(link)" aria-label="edit bookmark" v-tooltip="{showDelay:1000,value:'edit bookmark'}">
<i class="fa fa-edit me-1" aria-hidden="true"></i>
</a>
<!--DELETE BOOKMARK-->
<a id="deleteBookmark" href="#" @click.prevent="removeLink(link.bookmark_id)">
<i class="fa fa-regular fa-trash-can"></i>
<a type="button" id="deleteBookmark" href="#" aria-label="delete bookmark" v-tooltip="{showDelay:1000,value:'delete bookmark'}" @click.prevent="removeLink(link.bookmark_id)">
<i class="fa fa-regular fa-trash-can" aria-hidden="true"></i>
</a>
</div>
</div>