33 lines
10 KiB
Svelte
33 lines
10 KiB
Svelte
|
<script lang="ts">
|
||
|
|
const date = new Date();
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<svelte:head>
|
||
|
|
<title>Home</title>
|
||
|
|
</svelte:head>
|
||
|
|
|
||
|
|
<div><div class="grid grid-cols-1 gap-6 lg:p-10 xl:grid-cols-3 lg:bg-base-200 rounded-box"><div class="navbar col-span-1 shadow-lg xl:col-span-3 bg-neutral-focus text-neutral-content rounded-box"><div class="flex-none"><button class="btn btn-square btn-ghost"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-6 h-6 stroke-current"><!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----></svg></button></div> <div class="flex-none px-2 mx-2"><span class="text-lg font-bold">
|
||
|
|
DaisyUI
|
||
|
|
</span></div> <div class="flex justify-center flex-1 px-2 mx-2"><div class="items-stretch hidden lg:flex"><a class="btn btn-ghost btn-sm rounded-btn">
|
||
|
|
Home
|
||
|
|
</a> <a class="btn btn-ghost btn-sm rounded-btn">
|
||
|
|
Portfolio
|
||
|
|
</a> <a class="btn btn-ghost btn-sm rounded-btn">
|
||
|
|
About
|
||
|
|
</a> <a class="btn btn-ghost btn-sm rounded-btn">
|
||
|
|
Contact
|
||
|
|
</a></div></div> <div class="flex-none"><button class="btn btn-square btn-ghost"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-6 h-6 stroke-current"><!----> <!----> <!----> <!----> <!----> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9"></path> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----></svg></button></div> <div class="flex-none"><button class="btn btn-square btn-ghost"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-6 h-6 stroke-current"><!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----></svg></button></div></div> <div class="card shadow-lg compact side bg-base-100"><div class="flex-row items-center space-x-4 card-body"><div><div class="avatar"><div class="rounded-full w-14 h-14 shadow"><img src="https://i.pravatar.cc/500?img=32"></div></div></div> <div><h2 class="card-title">Janis Johnson</h2> <p class="text-base-content text-opacity-40">Accounts Agent</p></div></div></div> <div class="card shadow-lg compact side bg-base-100"><div class="flex-row items-center space-x-4 card-body"><div class="flex-1"><h2 class="card-title">Meredith Mayer</h2> <p class="text-base-content text-opacity-40">Data Liaison</p></div> <div class="flex-0"><button class="btn btn-sm">Follow</button></div></div></div> <div class="card row-span-3 shadow-lg compact bg-base-100"><figure><img src="https://picsum.photos/id/1005/600/400"></figure> <div class="flex-row items-center space-x-4 card-body"><div><h2 class="card-title">Karolann Collins</h2> <p class="text-base-content text-opacity-40">Direct Interactions Liaison</p></div></div></div> <div class="card shadow-lg compact side bg-base-100"><div class="flex-row items-center space-x-4 card-body"><div class="flex-1"><h2 class="card-title text-primary">4,600</h2> <p class="text-base-content text-opacity-40">Page views</p></div> <div class="flex space-x-2 flex-0"><button class="btn btn-sm btn-square"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-6 h-6 stroke-current"><!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"></path> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----></svg></button> <button class="btn btn-sm btn-square"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-6 h-6 stroke-current"><!----> <!----> <!----> <!----> <!----> <!----> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 12h.01M12 12h.01M19 12h.01M6 12a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0z"></path> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----></svg></button></div></div></div> <div class="card shadow-lg compact side bg-base-100"><div class="flex-row items-center space-x-4 card-body"><label class="flex-0"><input type="checkbox" checked="checked" class="toggle toggle-primary"></label> <div class="flex-1"><h2 class="card-title">Enable Notificati
|
||
|
|
Downloading...
|
||
|
|
</h2> <progress value="70" max="100" class="progress progress-secondary"></progress></div> <div class="flex-0"><button class="btn btn-circle"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-6 h-6 stroke-current"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg></button></div></div></div> <div class="card shadow-lg compact side bg-base-100"><div class="flex-row items-center space-x-4 card-body"><label class="cursor-pointer label"><input type="checkbox" checked="checked" class="checkbox checkbox-accent"> <span class="mx-4 label-text">Enable Autosave</span></label></div></div> <ul class="menu row-span-3 p-4 shadow-lg bg-base-100 rounded-box"><li class="menu-title"><span>
|
||
|
|
Menu Title
|
||
|
|
</span></li> <li><a><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-5 h-5 mr-2 stroke-current"><!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"></path> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----></svg>
|
||
|
|
Item with icon
|
||
|
|
</a></li> <li><a><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-5 h-5 mr-2 stroke-current"><!----> <!----> <!----> <!----> <!----> <!----> <!----> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4"></path> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----></svg>
|
||
|
|
Item with icon
|
||
|
|
</a></li> <li><a><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-5 h-5 mr-2 stroke-current"><!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"></path> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----></svg>
|
||
|
|
Item with icon
|
||
|
|
</a></li></ul> <div class="alert col-span-1 xl:col-span-2 bg-base-100"><div class="flex-1"><label class="mx-3">Lorem ipsum dolor sit amet, consectetur adip!</label></div> <div class="flex-none"><button class="btn btn-sm btn-ghost mr-2">Cancel</button> <button class="btn btn-sm btn-primary">Apply</button></div></div> <div class="alert col-span-1 xl:col-span-2 alert-info"><div class="flex-1"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="w-6 h-6 mx-2 stroke-current"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----></svg> <label>Lorem ipsum dolor sit amet, consectetur adip!</label></div></div> <div class="alert col-span-1 xl:col-span-2 alert-success"><div class="flex-1"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="w-6 h-6 mx-2 stroke-current"><!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"></path> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----> <!----></svg> <label>Lorem ipsum dolor sit amet, consectetur adip!</label></div></div></div></div>
|
||
|
|
|
||
|
|
<style lang="postcss">
|
||
|
|
</style>
|