añade plantilla azul sin definir pero ya funcoina la imagen y el enlace y todo

src/lib/templates/azul.js

@@ -0,0 +1,88 @@
+import '$lib/templates/templates'
+
+/** @type {import('$lib/templates/templates').Template} */
+export const azul = {
+  name: "azul",
+  image: "azul.png",
+  heading: {
+    top: 300,
+    height: 1.2,
+    left: 1,
+    right: 1,
+    fontSize: 1,
+    color: "grey",
+    fontFamily: "sans-serif",
+    lineHeight: 1.1
+  },
+  title: {
+    top: 320,
+    height: 6,
+    left: 1,
+    right: 1,
+    fontSize: 2.9,
+    color: "firebrick",
+    fontFamily: "Gill Sans, sans-serif",
+    lineHeight: 2.5
+
+  },
+  subtitle: {
+    top: 420,
+    height: 3,
+    left: 1,
+    right: 2,
+    fontSize: 1.2,
+    color: "#787",
+    fontFamily: "Gill Sans, sans-serif",
+    lineHeight: 1.5
+  },
+  content: {
+    top: 480,
+    height: 8.5,
+    left: 1.5,
+    right: 17,
+    fontSize: 0.8,
+    color: "#222",
+    fontFamily: "sans-serif",
+    lineHeight: 1.1
+  },
+  date: {
+    top: 625,
+    height: 4,
+    left: 18.5,
+    right: 4,
+    fontSize: 1.1,
+    color: "#fff",
+    fontFamily: "sans-serif",
+    lineHeight: 1
+  },
+  time: {
+    top: 645,
+    height: 2,
+    left: 18.5,
+    right: 5,
+    fontSize: 1.8,
+    color: "#fff",
+    fontFamily: "sans-serif",
+    lineHeight: 1
+  },
+  weekday: {
+    top: 600,
+    height: 1.5,
+    left: 18.5,
+    right: 5,
+    fontSize: 1.3,
+    color: "#fff",
+    fontFamily: "sans-serif",
+    lineHeight: 1.8
+  },
+  address: {
+    top: 625,
+    height: 4.5,
+    left: 2,
+    right: 20,
+    fontSize: 1,
+    color: "firebrick",
+    fontFamily: "sans-serif",
+    lineHeight: 1.5
+  },
+}

src/lib/templates/templates.js

@@ -1,4 +1,34 @@
 import { verde } from '$lib/templates/verde';
-/** @type Array<import('$lib/templates/verde').Template> */
+import { azul } from '$lib/templates/azul';
+/** 
+* @typedef {{
+* top: number;
+* height: number;
+* right: number;
+* left: number;
+* color: string;
+* fontSize: number;
+* fontFamily: string;
+* lineHeight: number;
+* }} Element
+*/
+
+/**
+* @typedef {{
+* name: string;
+* image: string;
+* heading: Element;
+* title: Element;
+* subtitle: Element;
+* date: Element;
+* time: Element;
+* weekday: Element;
+* content: Element;
+* address: Element;
+* }} Template
+*/
+
+/** @type Array<Template> */
 export const templates = [];
 templates.push(verde);
+templates.push(azul);

src/lib/templates/verde.js

@@ -1,32 +1,6 @@
-/** 
+import '$lib/templates/templates'
-* @typedef {{
-* top: number;
-* height: number;
-* right: number;
-* left: number;
-* color: string;
-* fontSize: number;
-* fontFamily: string;
-* lineHeight: number;
-* }} Element
-*/
 
-/**
+/** @type {import('$lib/templates/templates').Template} */
-* @typedef {{
-* name: string;
-* image: string;
-* heading: Element;
-* title: Element;
-* subtitle: Element;
-* date: Element;
-* time: Element;
-* weekday: Element;
-* content: Element;
-* address: Element;
-* }} Template
-*/
-
-/** @type {Template} */
 export const verde = {
   name: "verde",
   image: "imagen01.png",

src/routes/+page.svelte

@@ -1,4 +1,5 @@
 <script>
+	import { templates } from '$lib/templates/templates';
 </script>
 
 <svelte:head>
@@ -11,7 +12,9 @@
 
 <div class="main">
 	<ul>
-		<li><a href="/verde">Plantilla Verde</a></li>
+		{#each templates as template}
+			<li><a href="/{template.name}">{template.name}</a></li>
+		{/each}
 	</ul>
 </div>
 
@@ -24,4 +27,11 @@
 		border: 1px solid blue;
 		padding: 1rem;
 	}
+	li {
+		line-height: 2rem;
+	}
+	a {
+		text-transform: capitalize;
+		cursor: pointer;
+	}
 </style>