feat: editorial article list

web/src/components/ArticleListSkeleton.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import { t } from '@/i18n'
+
+const OPACITIES = ['opacity-100', 'opacity-88', 'opacity-76', 'opacity-64', 'opacity-52']
+</script>
+
+<template>
+	<div aria-busy="true" class="flex flex-col gap-2.5" data-testid="article-list-skeleton">
+		<span role="status" class="sr-only">{{ t('Loading articles') }}</span>
+		<USkeleton
+			v-for="(opacity, index) in OPACITIES"
+			:key="index"
+			class="h-14 rounded-none bg-elevated md:h-11"
+			:class="opacity"
+		/>
+	</div>
+</template>