fix(settings): dark mode divider and text colors

frontend/src/components/Settings/Categories.vue

@@ -45,7 +45,7 @@
 		</div>
 
 		<div class="overflow-y-scroll">
-			<div class="divide-y space-y-2">
+			<div class="divide-y divide-outline-gray-modals space-y-2">
 				<div
 					v-for="(cat, index) in categories.data"
 					:key="cat.name"
@@ -53,7 +53,7 @@
 				>
 					<div
 						v-if="editing?.name !== cat.name"
-						class="flex items-center justify-between group text-sm"
+						class="flex items-center justify-between group text-sm text-ink-gray-9"
 					>
 						<div class="text-ink-gray-9" @dblclick="allowEdit(cat, index)">
 							{{ cat.category }}

frontend/src/components/Settings/Evaluators.vue

@@ -32,7 +32,7 @@
 				</template>
 			</FormControl>
 			<div class="overflow-auto h-[60vh]">
-				<div class="divide-y">
+				<div class="divide-y divide-outline-gray-modals">
 					<div
 						v-for="evaluator in evaluators.data"
 						:key="evaluator.evaluator"

frontend/src/components/Settings/Members.vue

@@ -32,7 +32,7 @@
 				</template>
 			</FormControl>
 			<div class="overflow-y-scroll h-[60vh]">
-				<ul class="divide-y">
+				<ul class="divide-y divide-outline-gray-modals">
 					<li
 						v-for="member in memberList"
 						class="flex items-center justify-between py-2 cursor-pointer"
@@ -58,7 +58,7 @@
 							</div>
 						</div>
 						<div
-							class="flex items-center space-x-1 bg-surface-gray-2 px-2 py-1.5 rounded-md"
+							class="flex items-center text-ink-gray-9 space-x-1 bg-surface-gray-2 px-2 py-1.5 rounded-md"
 							v-if="member.role && member.role !== 'LMS Student'"
 						>
 							<Shield class="size-4 stroke-1.5" />

frontend/src/components/Settings/SettingFields.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="mb-5 divide-y overflow-y-auto">
+	<div class="mb-5 divide-y divide-outline-gray-modals overflow-y-auto">
 		<div v-for="(section, index) in sections" class="py-5">
 			<div v-if="section.label" class="font-semibold text-ink-gray-9 mb-4">
 				{{ section.label }}