38 lines
1.1 KiB
HTML
38 lines
1.1 KiB
HTML
<!-- Riot.js component for the settings layout (converted from app/settings/layout.tsx) -->
|
|
<template>
|
|
<div class="flex-1 overflow-auto">
|
|
<div class="p-5">
|
|
<div class="mb-6">
|
|
<h1 class="text-2xl font-bold">Settings</h1>
|
|
<p class="text-sm text-gray-500">
|
|
Manage your account settings and set e-mail preferences.
|
|
</p>
|
|
</div>
|
|
<div class="border-t border-gray-200 my-6"></div>
|
|
<div class="flex flex-col md:flex-row gap-6">
|
|
<div class="w-full md:w-1/4">
|
|
<sidebar-nav items="{sidebarNavItems}" />
|
|
</div>
|
|
<div class="flex-1">
|
|
<slot></slot>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script >
|
|
import './style.css';
|
|
import './components/sidebar-nav.html';
|
|
|
|
export default {
|
|
// Reactive state
|
|
sidebarNavItems: [
|
|
{ title: "Profile", href: "/settings" },
|
|
{ title: "Account", href: "/settings/account" },
|
|
{ title: "Appearance", href: "/settings/appearance" },
|
|
{ title: "Notifications", href: "/settings/notifications" },
|
|
{ title: "Display", href: "/settings/display" },
|
|
]
|
|
};
|
|
</script>
|