feat: templates screen

This commit is contained in:
Arman
2024-10-28 15:05:10 +01:00
parent 983e2ac82c
commit 8e996b1fe1
3 changed files with 66 additions and 17 deletions
+1 -1
View File
@@ -33,7 +33,7 @@
<svelte:window on:resize={throttle(onScroll, 25)} />
<div style="margin-block-start: auto; margin-block-end: 1rem;">
<div style="margin-block-start: auto; ">
{#if showLeft}
<button
class="tabs-button-scroll is-start"
@@ -160,21 +160,20 @@
<ul
class="grid-box"
style="--grid-item-size:18rem; --grid-item-size-small-screens:19rem; --grid-gap: 12px">
{#each new Array(3) as _}
{#each data.templates as template}
{@const templateFrameworks = template.frameworks.map((t) => t.name)}
<Card.Link
variant="secondary"
href={`${base}/project-${$page.params.project}/sites/create-site/templates/template-${template.id}`}
padding="xs">
<Card.Media
title={template.name}
description={templateFrameworks.join(', ')}
src="https://f002.backblazeb2.com/file/meldiron-public/Desktop+-+2.png"
alt={template.name}>
</Card.Media>
</Card.Link>
{/each}
{#each data.templates as template}
{@const templateFrameworks = template.frameworks.map((t) => t.name)}
<Card.Link
variant="secondary"
href={`${base}/project-${$page.params.project}/sites/create-site/templates/template-${template.key}`}
padding="xs">
<Card.Media
title={template.name}
description={templateFrameworks.join(', ')}
src={template.preview ??
'https://f002.backblazeb2.com/file/meldiron-public/Desktop+-+2.png'}
alt={template.name}>
</Card.Media>
</Card.Link>
{/each}
</ul>
{:else}
@@ -49,7 +49,57 @@ export const load = async ({ url, route }) => {
}
});
console.log(frameworks, useCases, templates);
templates.push(
{
name: 'Dashboard',
preview:
'https://upload.wikimedia.org/wikipedia/commons/4/40/Ceph_Dashboard_landing_page.webp',
frameworks: [
{
key: 'sveltekit',
name: 'SvelteKit',
installCommand: 'npm install --force',
buildCommand: 'npm run build',
outputDirectory: './build',
serveRuntime: 'static-1',
buildRuntime: 'node-22',
providerRootDirectory: './'
},
{
key: 'nextjs',
name: 'Next.js',
installCommand: 'npm install --force',
buildCommand: 'npm run build',
outputDirectory: './build',
serveRuntime: 'static-1',
buildRuntime: 'node-22',
providerRootDirectory: './'
}
],
useCases: ['chatbot'],
$id: 'sadsadarwwa'
},
{
name: 'Personal Blog',
preview:
'https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/05724439-bbdf-4da1-b9dc-a2ec88879412/d4i24mv-71bd02d0-9d6c-4957-9a70-0dc90eba8122.jpg?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzA1NzI0NDM5LWJiZGYtNGRhMS1iOWRjLWEyZWM4ODg3OTQxMlwvZDRpMjRtdi03MWJkMDJkMC05ZDZjLTQ5NTctOWE3MC0wZGM5MGViYTgxMjIuanBnIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.FVKeww4kI23jYfCq8m6wt8kOEy0FK_HZKVDYSZJQ57o',
frameworks: [
{
key: 'sveltekit',
name: 'SvelteKit',
installCommand: 'npm install --force',
buildCommand: 'npm run build',
outputDirectory: './build',
serveRuntime: 'static-1',
buildRuntime: 'node-22',
providerRootDirectory: './'
}
],
useCases: ['chatbot'],
$id: 'sadsadarwwa'
}
);
console.dir(...templates);
return {
offset,