changed all remaining 'zinc' color values to 'slate'

This commit is contained in:
xcexec 2024-10-22 11:31:15 +02:00
parent 89202c2a1d
commit 206383fdb7
22 changed files with 63 additions and 63 deletions

View file

@ -35,7 +35,7 @@ body {
@apply border-2 bg-mbz-warning text-black hover:bg-mbz-warning/90 hover:text-slate-800;
}
.btn-text {
@apply bg-transparent border-transparent text-black dark:text-white font-normal underline hover:bg-zinc-200 hover:text-black;
@apply bg-transparent border-transparent text-black dark:text-white font-normal underline hover:bg-slate-200 hover:text-black;
}
.btn-outlined-,
.btn-outlined-primary {
@ -95,7 +95,7 @@ body {
/* Input */
.input {
@apply appearance-none box-border rounded border w-full py-2 px-3 text-black leading-tight dark:bg-zinc-600 dark:placeholder:text-zinc-400 dark:text-zinc-50;
@apply appearance-none box-border rounded border w-full py-2 px-3 text-black leading-tight dark:bg-slate-600 dark:placeholder:text-slate-400 dark:text-slate-50;
}
.input-size-small {
@apply text-sm;
@ -120,7 +120,7 @@ body {
}
.input[type="text"]:disabled,
.input[type="email"]:disabled {
@apply bg-zinc-200 dark:bg-zinc-400;
@apply bg-slate-200 dark:bg-slate-400;
}
.icon-warning {
@ -147,7 +147,7 @@ body {
/* TagInput */
.taginput {
@apply rounded bg-white dark:bg-zinc-700;
@apply rounded bg-white dark:bg-slate-700;
}
.taginput-item {
@apply bg-primary mr-2;
@ -191,14 +191,14 @@ body {
}
.dropdown-menu {
min-width: 12em;
@apply bg-white dark:bg-zinc-700 shadow-lg rounded text-start py-2;
@apply bg-white dark:bg-slate-700 shadow-lg rounded text-start py-2;
}
.dropdown-item {
@apply relative inline-flex gap-1 no-underline p-2 cursor-pointer w-full hover:bg-[#f5f5f5] hover:text-black;
}
.dropdown-item-active {
@apply bg-mbz-yellow-500 dark:bg-mbz-yellow-900 dark:text-zinc-100 text-black;
@apply bg-mbz-yellow-500 dark:bg-mbz-yellow-900 dark:text-slate-100 text-black;
}
.dropdown-button {
@apply inline-flex gap-1;
@ -224,7 +224,7 @@ body {
/* Modal */
.modal-content {
@apply bg-white dark:bg-zinc-800 rounded px-2 py-4 w-full z-0;
@apply bg-white dark:bg-slate-800 rounded px-2 py-4 w-full z-0;
}
/* Switch */
@ -242,7 +242,7 @@ body {
/* Select */
.select {
@apply dark:bg-zinc-600 dark:placeholder:text-zinc-400 dark:text-zinc-50 pl-2 pr-8 border-2 border-transparent h-10 shadow-none rounded w-full;
@apply dark:bg-slate-600 dark:placeholder:text-slate-400 dark:text-slate-50 pl-2 pr-8 border-2 border-transparent h-10 shadow-none rounded w-full;
}
/* Radio */
@ -288,7 +288,7 @@ button.menubar__button {
/* Table */
.table tr {
@apply odd:bg-white dark:odd:bg-zinc-600 last:border-b-0 even:bg-gray-50 dark:even:bg-zinc-700 border-b rounded;
@apply odd:bg-white dark:odd:bg-slate-600 last:border-b-0 even:bg-gray-50 dark:even:bg-slate-700 border-b rounded;
}
.table-td {
@ -314,7 +314,7 @@ button.menubar__button {
@apply flex items-center text-center justify-between;
}
.pagination-link {
@apply inline-flex items-center relative justify-center cursor-pointer rounded h-10 m-1 p-2 bg-white dark:bg-zinc-300 text-lg text-black;
@apply inline-flex items-center relative justify-center cursor-pointer rounded h-10 m-1 p-2 bg-white dark:bg-slate-300 text-lg text-black;
}
.pagination-list {
@apply flex items-center text-center list-none flex-wrap grow shrink justify-start;
@ -346,10 +346,10 @@ button.menubar__button {
/** Tooltip */
.tooltip-content {
@apply bg-zinc-800 text-white dark:bg-zinc-300 dark:text-black rounded py-1 px-2;
@apply bg-slate-800 text-white dark:bg-slate-300 dark:text-black rounded py-1 px-2;
}
.tooltip-arrow {
@apply text-zinc-800 dark:text-zinc-200;
@apply text-slate-800 dark:text-slate-200;
}
.tooltip-content-success {
@apply bg-mbz-success text-white;
@ -388,7 +388,7 @@ button.menubar__button {
@apply rounded py-2 px-3;
}
.o-dpck__table__cell--selectable {
@apply dark:text-zinc-50;
@apply dark:text-slate-50;
}
.o-dpck__month__head-cell,
.o-dpck__table__head-cell {
@ -397,5 +397,5 @@ button.menubar__button {
/** Timepicker */
.o-tpck__select {
@apply dark:bg-zinc-700 dark:placeholder:text-zinc-400 dark:text-zinc-50;
@apply dark:bg-slate-700 dark:placeholder:text-slate-400 dark:text-slate-50;
}

View file

@ -1,6 +1,6 @@
<template>
<li
class="bg-white dark:bg-zinc-800 rounded p-2"
class="bg-white dark:bg-slate-800 rounded p-2"
:class="{
reply: comment.inReplyToComment,
'bg-mbz-purple-50 dark:bg-mbz-purple-500': comment.isAnnouncement,
@ -59,7 +59,7 @@
<div v-else>{{ t("[This comment has been deleted]") }}</div>
<nav class="flex gap-1 mt-1" v-if="!comment.deletedAt">
<button
class="cursor-pointer flex hover:bg-zinc-300 dark:hover:bg-zinc-600 rounded p-1"
class="cursor-pointer flex hover:bg-slate-300 dark:hover:bg-slate-600 rounded p-1"
v-if="
currentActor?.id &&
!readOnly &&
@ -74,7 +74,7 @@
<o-dropdown aria-role="list" v-show="!readOnly">
<template #trigger>
<button
class="cursor-pointer flex hover:bg-zinc-300 dark:hover:bg-zinc-600 rounded p-1"
class="cursor-pointer flex hover:bg-slate-300 dark:hover:bg-slate-600 rounded p-1"
>
<DotsHorizontal />
<span class="sr-only">{{ t("More options") }}</span>
@ -104,7 +104,7 @@
<button
v-if="!showReplies"
@click="showReplies = true"
class="flex cursor-pointer hover:bg-zinc-300 dark:hover:bg-zinc-600 rounded p-1"
class="flex cursor-pointer hover:bg-slate-300 dark:hover:bg-slate-600 rounded p-1"
>
<ChevronDown />
<span>{{
@ -120,7 +120,7 @@
<button
v-else-if="comment.totalReplies && showReplies"
@click="showReplies = false"
class="flex cursor-pointer hover:bg-zinc-300 dark:hover:bg-zinc-600 rounded p-1"
class="flex cursor-pointer hover:bg-slate-300 dark:hover:bg-slate-600 rounded p-1"
>
<ChevronUp />
<span>{{ t("Hide replies") }}</span>
@ -402,6 +402,6 @@ const dateFnsLocale = inject<Locale>("dateFnsLocale");
</script>
<style>
article.mbz-comment .mention.h-card {
@apply inline-block border border-zinc-600 dark:border-zinc-300 rounded py-0.5 px-1;
@apply inline-block border border-slate-600 dark:border-slate-300 rounded py-0.5 px-1;
}
</style>

View file

@ -1,6 +1,6 @@
<template>
<article
class="bg-white dark:bg-zinc-700 dark:text-white dark:hover:text-white rounded-lg shadow-md max-w-3xl p-2"
class="bg-white dark:bg-slate-700 dark:text-white dark:hover:text-white rounded-lg shadow-md max-w-3xl p-2"
>
<div class="flex gap-2">
<div class="">

View file

@ -1,5 +1,5 @@
<template>
<div class="border rounded p-2 bg-mbz-yellow-alt-50 dark:bg-zinc-700">
<div class="border rounded p-2 bg-mbz-yellow-alt-50 dark:bg-slate-700">
<div class="prose dark:prose-invert">
<i18n-t
tag="p"

View file

@ -177,7 +177,7 @@
<li class="m-auto">
<router-link
:to="{ name: RouteName.EVENT_CALENDAR }"
class="block py-2 pr-4 pl-3 text-gray-50 border-b border-gray-100 hover:bg-zinc-50 md:hover:bg-transparent md:border-0 md:hover:text-mbz-purple-700 md:p-0 dark:text-white md:dark:hover:text-white dark:hover:bg-black md:dark:hover:text-white md:dark:hover:bg-transparent"
class="block py-2 pr-4 pl-3 text-gray-50 border-b border-gray-100 hover:bg-slate-50 md:hover:bg-transparent md:border-0 md:hover:text-mbz-purple-700 md:p-0 dark:text-white md:dark:hover:text-white dark:hover:bg-black md:dark:hover:text-white md:dark:hover:bg-transparent"
>{{ t("Calendar") }}</router-link
>
</li>

View file

@ -1,6 +1,6 @@
<template>
<div v-if="checkDevice">
<div class="rounded-lg bg-white dark:bg-zinc-900 shadow-xl my-6 p-4 pt-1">
<div class="rounded-lg bg-white dark:bg-slate-900 shadow-xl my-6 p-4 pt-1">
<h1 class="text-3xl">
{{ t("Application authorized") }}
</h1>
@ -14,7 +14,7 @@
{{ t("Autorize this application to access your account?") }}
</h1>
<div class="rounded-lg bg-white dark:bg-zinc-900 shadow-xl my-6">
<div class="rounded-lg bg-white dark:bg-slate-900 shadow-xl my-6">
<div class="p-4 pb-0">
<p class="text-3xl font-bold">{{ authApplication.name }}</p>
<p>{{ authApplication.website }}</p>
@ -44,7 +44,7 @@
{{ t("This application asks for the following permissions:") }}
</p>
<o-collapse
class="mt-3 border-b pb-2 border-zinc-700 text-black dark:text-white"
class="mt-3 border-b pb-2 border-slate-700 text-black dark:text-white"
:class="{
'bg-mbz-warning dark:!text-black': collapse?.type === 'warning',
}"

View file

@ -5,7 +5,7 @@
</h2>
<EventListViewCard v-if="event" :event="event" />
<div class="flex flex-wrap gap-4 items-center w-full my-6">
<div class="bg-white dark:bg-zinc-700 rounded-md p-4 flex-1">
<div class="bg-white dark:bg-slate-700 rounded-md p-4 flex-1">
<router-link :to="{ name: RouteName.EVENT_PARTICIPATE_WITH_ACCOUNT }">
<figure class="flex justify-center my-2">
<img
@ -40,7 +40,7 @@
</p>
</div>
<div
class="bg-white dark:bg-zinc-700 rounded-md p-4 flex-1"
class="bg-white dark:bg-slate-700 rounded-md p-4 flex-1"
v-if="
event &&
anonymousParticipationAllowed &&

View file

@ -1,6 +1,6 @@
<template>
<div
class="bg-mbz-yellow-alt-50 hover:bg-mbz-yellow-alt-100 dark:bg-zinc-700 hover:dark:bg-zinc-600 rounded"
class="bg-mbz-yellow-alt-50 hover:bg-mbz-yellow-alt-100 dark:bg-slate-700 hover:dark:bg-slate-600 rounded"
v-if="report"
>
<div class="flex justify-between gap-1 border-b p-2">
@ -20,7 +20,7 @@
{{ report.reported.name }}
</p>
<p
class="text-zinc-700 dark:text-zinc-100 text-sm"
class="text-slate-700 dark:text-slate-100 text-sm"
v-else-if="report.reported?.preferredUsername"
>
@{{ usernameWithDomain(report.reported) }}

View file

@ -1,5 +1,5 @@
<template>
<section class="bg-white dark:bg-zinc-700 p-2 pt-0.5">
<section class="bg-white dark:bg-slate-700 p-2 pt-0.5">
<h1>{{ t("Resources") }}</h1>
<p v-if="isRoot">
{{ t("A place to store links to documents or resources of any type.") }}

View file

@ -1,6 +1,6 @@
<template>
<li
class="bg-mbz-purple-700 text-zinc-100 text-xl"
class="bg-mbz-purple-700 text-slate-100 text-xl"
>
<router-link
class="cursor-pointer my-2 mx-0 py-2 px-3 font-medium block no-underline"

View file

@ -345,7 +345,7 @@ const editor = useEditor({
"aria-label": ariaLabel.value ?? "",
role: "textbox",
class:
"prose dark:prose-invert prose-sm lg:prose-lg xl:prose-xl bg-white dark:bg-zinc-700 !max-w-full",
"prose dark:prose-invert prose-sm lg:prose-lg xl:prose-xl bg-white dark:bg-slate-700 !max-w-full",
},
transformPastedHTML: transformPastedHTML,
},
@ -677,11 +677,11 @@ const checkEditorEmpty = () => {
}
.menubar__button.is-active {
@apply bg-zinc-300 dark:bg-zinc-500;
@apply bg-slate-300 dark:bg-slate-500;
}
.mention[data-id] {
@apply inline-block border border-zinc-600 dark:border-zinc-300 rounded py-0.5 px-1;
@apply inline-block border border-slate-600 dark:border-slate-300 rounded py-0.5 px-1;
}
.editor__content > div {

View file

@ -34,7 +34,7 @@
<tr
v-for="{ key, value, link } in metadata"
:key="key"
class="odd:bg-white dark:odd:bg-zinc-800 even:bg-gray-50 dark:even:bg-zinc-700 border-b"
class="odd:bg-white dark:odd:bg-slate-800 even:bg-gray-50 dark:even:bg-slate-700 border-b"
>
<td class="py-4 px-2 whitespace-nowrap">
{{ key }}

View file

@ -49,7 +49,7 @@
<div
class="grid md:grid-cols-2 xl:grid-cols-4 gap-2 content-center text-center mt-2"
>
<div class="bg-zinc-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<div class="bg-slate-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<router-link
:to="{
name: RouteName.PROFILES,
@ -75,19 +75,19 @@
<span class="text-sm block">{{ t("Groups") }}</span>
</router-link>
</div>
<div class="bg-zinc-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<div class="bg-slate-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<span class="mb-4 text-xl font-semibold block">{{
instance.followingsCount
}}</span>
<span class="text-sm block">{{ t("Followings") }}</span>
</div>
<div class="bg-zinc-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<div class="bg-slate-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<span class="mb-4 text-xl font-semibold block">{{
instance.followersCount
}}</span>
<span class="text-sm block">{{ t("Followers") }}</span>
</div>
<div class="bg-zinc-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<div class="bg-slate-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<router-link
:to="{
name: RouteName.REPORTS,
@ -100,7 +100,7 @@
<span class="text-sm block">{{ t("Reports") }}</span>
</router-link>
</div>
<div class="bg-zinc-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<div class="bg-slate-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<span class="mb-4 font-semibold block">{{
formatBytes(instance.mediaSize)
}}</span>

View file

@ -38,7 +38,7 @@
{{ t("Category illustrations credits") }}
</o-button>
</template>
<div class="flex flex-col dark:text-zinc-300 gap-2 py-4 px-1">
<div class="flex flex-col dark:text-slate-300 gap-2 py-4 px-1">
<p
v-for="(categoryLicence, key) in categoriesPicturesLicences"
:key="key"

View file

@ -4,7 +4,7 @@
<div class="flex flex-col mb-3">
<event-banner :picture="event?.picture" />
<div
class="flex flex-col relative pb-2 bg-white dark:bg-zinc-700 my-4 rounded"
class="flex flex-col relative pb-2 bg-white dark:bg-slate-700 my-4 rounded"
>
<div class="date-calendar-icon-wrapper relative" v-if="event?.beginsOn">
<skeleton-date-calendar-icon
@ -171,12 +171,12 @@
class="rounded-lg dark:border-violet-title flex flex-wrap flex-col md:flex-row-reverse gap-4"
>
<aside
class="rounded bg-white dark:bg-zinc-700 shadow-md h-min max-w-screen-sm"
class="rounded bg-white dark:bg-slate-700 shadow-md h-min max-w-screen-sm"
>
<div class="sticky p-4">
<aside
v-if="eventLoading"
class="animate-pulse rounded bg-white dark:bg-zinc-700 h-min max-w-screen-sm"
class="animate-pulse rounded bg-white dark:bg-slate-700 h-min max-w-screen-sm"
>
<div class="mb-6 p-2" v-for="i in 3" :key="i">
<div class="mb-2 h-6 bg-slate-200 w-64" />
@ -199,7 +199,7 @@
</aside>
<div class="flex-1">
<section
class="event-description bg-white dark:bg-zinc-700 px-3 pt-1 pb-3 rounded mb-4"
class="event-description bg-white dark:bg-slate-700 px-3 pt-1 pb-3 rounded mb-4"
>
<h2 class="text-2xl">{{ t("About this event") }}</h2>
<div
@ -237,7 +237,7 @@
/>
</section>
<section
class="bg-white dark:bg-zinc-700 px-3 pt-1 pb-3 rounded my-4"
class="bg-white dark:bg-slate-700 px-3 pt-1 pb-3 rounded my-4"
ref="commentsObserver"
>
<a href="#comments">
@ -249,7 +249,7 @@
</div>
<section
class="bg-white dark:bg-zinc-700 px-3 pt-1 pb-3 rounded my-4"
class="bg-white dark:bg-slate-700 px-3 pt-1 pb-3 rounded my-4"
v-if="(event?.relatedEvents ?? []).length > 0"
>
<h2 class="text-2xl mb-2">
@ -631,6 +631,6 @@ useHead({
}
.event-description .mention.h-card {
@apply inline-block border border-zinc-600 dark:border-zinc-300 rounded py-0.5 px-1;
@apply inline-block border border-slate-600 dark:border-slate-300 rounded py-0.5 px-1;
}
</style>

View file

@ -21,7 +21,7 @@
<!-- <o-loading v-model:active="$apollo.loading"></o-loading> -->
<div class="flex flex-wrap gap-4 items-start">
<div
class="rounded p-3 flex-auto md:flex-none bg-zinc-300 dark:bg-zinc-700"
class="rounded p-3 flex-auto md:flex-none bg-slate-300 dark:bg-slate-700"
>
<o-field>
<o-switch v-model="showUpcoming">{{

View file

@ -17,7 +17,7 @@
<li
v-for="log in actionLogs.elements"
:key="log.id"
class="bg-mbz-yellow-alt-50 hover:bg-mbz-yellow-alt-100 dark:bg-zinc-700 hover:dark:bg-zinc-600 rounded p-2 my-1"
class="bg-mbz-yellow-alt-50 hover:bg-mbz-yellow-alt-100 dark:bg-slate-700 hover:dark:bg-slate-600 rounded p-2 my-1"
>
<div class="flex gap-1">
<div class="flex gap-1">

View file

@ -194,7 +194,7 @@
</table>
</section>
<section class="bg-white dark:bg-zinc-700 rounded px-2 pt-1 pb-2 my-3">
<section class="bg-white dark:bg-slate-700 rounded px-2 pt-1 pb-2 my-3">
<h2 class="mb-1">{{ t("Report reason") }}</h2>
<div class="">
<div class="flex gap-1">
@ -224,7 +224,7 @@
</section>
<section
class="bg-white dark:bg-zinc-700 rounded px-2 pt-1 pb-2 my-3"
class="bg-white dark:bg-slate-700 rounded px-2 pt-1 pb-2 my-3"
v-if="
report.events &&
report.events?.length > 0 &&
@ -249,7 +249,7 @@
</section>
<section
class="bg-white dark:bg-zinc-700 rounded px-2 pt-1 pb-2 my-3"
class="bg-white dark:bg-slate-700 rounded px-2 pt-1 pb-2 my-3"
v-if="report.comments.length > 0"
>
<h2 class="mb-1">{{ t("Reported content") }}</h2>
@ -329,7 +329,7 @@
</section>
<section
class="bg-white dark:bg-zinc-700 rounded px-2 pt-1 pb-2 my-3"
class="bg-white dark:bg-slate-700 rounded px-2 pt-1 pb-2 my-3"
v-if="
report.events &&
report.events?.length === 0 &&
@ -344,7 +344,7 @@
</EmptyContent>
</section>
<section class="bg-white dark:bg-zinc-700 rounded px-2 pt-1 pb-2 my-3">
<section class="bg-white dark:bg-slate-700 rounded px-2 pt-1 pb-2 my-3">
<h2 class="mb-1">{{ t("Notes") }}</h2>
<div
class=""

View file

@ -3,7 +3,7 @@
<form
@submit.prevent="() => validateCode({ userCode: code })"
@paste="pasteCode"
class="rounded-lg bg-white dark:bg-zinc-900 shadow-xl my-6 p-4"
class="rounded-lg bg-white dark:bg-slate-900 shadow-xl my-6 p-4"
v-if="!application"
>
<h1 class="text-3xl text-center">

View file

@ -204,7 +204,7 @@
<section
v-html="post.body"
dir="auto"
class="px-2 md:px-4 py-4 prose lg:prose-xl prose-p:mt-6 dark:prose-invert bg-white dark:bg-zinc-700 mx-auto"
class="px-2 md:px-4 py-4 prose lg:prose-xl prose-p:mt-6 dark:prose-invert bg-white dark:bg-slate-700 mx-auto"
:lang="post.language"
/>
<section class="flex gap-2 my-6 justify-center" dir="auto">

View file

@ -24,7 +24,7 @@
<legend class="sr-only">{{ t("Theme") }}</legend>
<o-radio
:class="{ 'border-mbz-bluegreen': theme === 'light' }"
class="p-4 bg-white text-zinc-800 rounded-md mt-2 mr-2 border-2"
class="p-4 bg-white text-slate-800 rounded-md mt-2 mr-2 border-2"
:disabled="systemTheme"
v-model="theme"
name="theme"
@ -33,7 +33,7 @@
>
<o-radio
:class="{ 'border-mbz-bluegreen': theme === 'dark' }"
class="p-4 bg-zinc-800 rounded-md text-white mt-2 ml-2 border-2"
class="p-4 bg-slate-800 rounded-md text-white mt-2 ml-2 border-2"
:disabled="systemTheme"
v-model="theme"
name="theme"

View file

@ -1,12 +1,12 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`App component > renders a Vue component 1`] = `
"<nav class=\\"bg-white border-gray-200 px-2 sm:px-4 py-2.5 dark:bg-zinc-900\\" id=\\"navbar\\">
"<nav class=\\"bg-white border-gray-200 px-2 sm:px-4 py-2.5 dark:bg-slate-900\\" id=\\"navbar\\">
<div class=\\"container mx-auto flex flex-wrap items-center mx-auto gap-2 sm:gap-4\\">
<router-link to=\\"[object Object]\\" class=\\"flex items-center flex-1\\">
<mobilizon-logo-stub invert=\\"false\\" class=\\"w-40\\"></mobilizon-logo-stub>
</router-link>
<!--v-if--><button type=\\"button\\" class=\\"inline-flex items-center p-2 ml-1 text-sm text-zinc-500 rounded-lg md:hidden hover:bg-zinc-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-zinc-400 dark:hover:bg-zinc-700 dark:focus:ring-gray-600\\" aria-controls=\\"mobile-menu-2\\" aria-expanded=\\"false\\"><span class=\\"sr-only\\">Open main menu</span><svg class=\\"w-6 h-6\\" aria-hidden=\\"true\\" fill=\\"currentColor\\" viewBox=\\"0 0 20 20\\" xmlns=\\"http://www.w3.org/2000/svg\\">
<!--v-if--><button type=\\"button\\" class=\\"inline-flex items-center p-2 ml-1 text-sm text-slate-500 rounded-lg md:hidden hover:bg-slate-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-slate-400 dark:hover:bg-slate-700 dark:focus:ring-gray-600\\" aria-controls=\\"mobile-menu-2\\" aria-expanded=\\"false\\"><span class=\\"sr-only\\">Open main menu</span><svg class=\\"w-6 h-6\\" aria-hidden=\\"true\\" fill=\\"currentColor\\" viewBox=\\"0 0 20 20\\" xmlns=\\"http://www.w3.org/2000/svg\\">
<path fill-rule=\\"evenodd\\" d=\\"M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z\\" clip-rule=\\"evenodd\\"></path>
</svg></button>
<div class=\\"justify-between items-center w-full md:flex md:w-auto md:order-1 hidden\\" id=\\"mobile-menu-2\\">
@ -14,7 +14,7 @@ exports[`App component > renders a Vue component 1`] = `
<!--v-if-->
<!--v-if-->
<li>
<router-link to=\\"[object Object]\\" class=\\"block py-2 pr-4 pl-3 text-zinc-700 border-b border-gray-100 hover:bg-zinc-50 md:hover:bg-transparent md:border-0 md:hover:text-mbz-purple-700 md:p-0 dark:text-zinc-400 md:dark:hover:text-white dark:hover:bg-zinc-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700\\">Login</router-link>
<router-link to=\\"[object Object]\\" class=\\"block py-2 pr-4 pl-3 text-slate-700 border-b border-gray-100 hover:bg-slate-50 md:hover:bg-transparent md:border-0 md:hover:text-mbz-purple-700 md:p-0 dark:text-slate-400 md:dark:hover:text-white dark:hover:bg-slate-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700\\">Login</router-link>
</li>
<!--v-if-->
</ul>