añado archivos para ver si consigo usar plantillas
parent
b9ba610251
commit
c6d23aa131
@ -1,2 +0,0 @@
|
|||||||
<script>
|
|
||||||
</script>
|
|
@ -0,0 +1,6 @@
|
|||||||
|
import { verde } from '$lib/templates/verde';
|
||||||
|
/**
|
||||||
|
* @type {Array<Object>}
|
||||||
|
*/
|
||||||
|
export const templates = [];
|
||||||
|
templates.push(verde);
|
@ -0,0 +1,18 @@
|
|||||||
|
export const verde = {
|
||||||
|
name: "verde",
|
||||||
|
heading: {
|
||||||
|
top: "50px",
|
||||||
|
bottom: "120px",
|
||||||
|
left: "5rem",
|
||||||
|
right: "5rem",
|
||||||
|
fontSize: "1rem",
|
||||||
|
color: "blue",
|
||||||
|
|
||||||
|
},
|
||||||
|
title: "title",
|
||||||
|
subtitle: "subtitle",
|
||||||
|
content: "content",
|
||||||
|
datetime: "datetime",
|
||||||
|
weekday: "weekday",
|
||||||
|
address: "address",
|
||||||
|
}
|
@ -0,0 +1,7 @@
|
|||||||
|
/** @type {import('./$types').PageLoad} */
|
||||||
|
export function load(event) {
|
||||||
|
const slug = event.params.slug;
|
||||||
|
return {
|
||||||
|
slug
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,45 @@
|
|||||||
|
<script>
|
||||||
|
import { templates } from '$lib/templates/templates';
|
||||||
|
export let data;
|
||||||
|
import Form from '$lib/form/Form.svelte';
|
||||||
|
import Preview from '$lib/preview/Preview.svelte';
|
||||||
|
|
||||||
|
const slug = data.slug;
|
||||||
|
const i = templates.map((e) => e.name).indexOf(slug);
|
||||||
|
|
||||||
|
const template = templates[i];
|
||||||
|
console.log('La plantilla es ', template);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<svelte:head>
|
||||||
|
<title>Carteles DMD</title>
|
||||||
|
<meta
|
||||||
|
name="description"
|
||||||
|
content="Aplicación para la generación automática de carteles de actividades de DMD"
|
||||||
|
/>
|
||||||
|
</svelte:head>
|
||||||
|
|
||||||
|
<div class="main">
|
||||||
|
<section class="form"><Form /></section>
|
||||||
|
<section class="preview"><Preview /></section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.main {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: minmax(200px, 1fr) minmax(480px, min-content);
|
||||||
|
grid-gap: 0.5rem;
|
||||||
|
min-height: calc(100vh - 5rem);
|
||||||
|
}
|
||||||
|
|
||||||
|
.form {
|
||||||
|
grid-column: 1/2;
|
||||||
|
background-color: rgb(230, 240, 240);
|
||||||
|
}
|
||||||
|
|
||||||
|
.preview {
|
||||||
|
grid-column: 2/3;
|
||||||
|
min-height: 200px;
|
||||||
|
background-color: rgb(240, 238, 240);
|
||||||
|
}
|
||||||
|
</style>
|
Loading…
Reference in New Issue