Fix icon color on hover

This commit is contained in:
Ramon Wenger 2024-11-21 15:07:08 +01:00
parent a620803413
commit bc5055324c
3 changed files with 7 additions and 8 deletions

View File

@ -91,7 +91,7 @@ const dropdownSelected = computed<DropdownSelectable>({
active ? 'bg-blue-900 text-white' : 'text-black', active ? 'bg-blue-900 text-white' : 'text-black',
'relative cursor-default select-none py-2 pl-3 pr-9', 'relative cursor-default select-none py-2 pl-3 pr-9',
]" ]"
class="flex flex-row items-center" class="group flex flex-row items-center"
:data-cy="`dropdown-select-option-${item.name}`" :data-cy="`dropdown-select-option-${item.name}`"
> >
<span v-if="item.iconName" class="mr-4"> <span v-if="item.iconName" class="mr-4">
@ -110,7 +110,11 @@ const dropdownSelected = computed<DropdownSelectable>({
v-if="dropdownSelected" v-if="dropdownSelected"
class="absolute inset-y-0 right-0 flex items-center pr-4 text-blue-900" class="absolute inset-y-0 right-0 flex items-center pr-4 text-blue-900"
> >
<it-icon-check v-if="selected" class="h-5 w-5" aria-hidden="true" /> <it-icon-check
v-if="selected"
class="h-5 w-5 fill-current group-hover:text-white"
aria-hidden="true"
/>
</span> </span>
</li> </li>
</ListboxOption> </ListboxOption>

View File

@ -11,7 +11,6 @@ import { ATTENDANCE_CHECK_QUERY } from "@/graphql/queries";
import { exportAttendance } from "@/services/dashboard"; import { exportAttendance } from "@/services/dashboard";
import { useExpertCockpitStore } from "@/stores/expertCockpit"; import { useExpertCockpitStore } from "@/stores/expertCockpit";
import { useUserStore } from "@/stores/user"; import { useUserStore } from "@/stores/user";
import { getStatus } from "@/utils/attendance";
import { openDataAsXls } from "@/utils/export"; import { openDataAsXls } from "@/utils/export";
import { useMutation, useQuery } from "@urql/vue"; import { useMutation, useQuery } from "@urql/vue";
import { useDateFormat } from "@vueuse/core"; import { useDateFormat } from "@vueuse/core";
@ -137,10 +136,6 @@ const formattedCourseDueDate = computed(() => {
} }
return ""; return "";
}); });
const attendanceStatus = computed(() => {
return getStatus(attendanceSaved.value, courseDueDate.value);
});
</script> </script>
<template> <template>

View File

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { howManyDaysInFuture, isInFuture } from "@/components/dueDates/dueDatesUtils"; import { howManyDaysInFuture } from "@/components/dueDates/dueDatesUtils";
import { getStatus } from "@/utils/attendance"; import { getStatus } from "@/utils/attendance";
import { useTranslation } from "i18next-vue"; import { useTranslation } from "i18next-vue";
import { computed } from "vue"; import { computed } from "vue";