Merge pull request #46 from CodeandoMexico/feat/detalles

Feat/detalles

Author: basicavisual

src/components/Cards/CommunityCard.svelte

@@ -8,7 +8,7 @@
     <div class="border border-cmxyellow p-5 h-[150px] flex justify-between flex-col hover:bg-zinc-100 transition-colors duration-200">
       <h3 class="text-lg font-bold">{text}</h3>
       <img src="/flecha-amarilla.png" class="inline h-[20px] w-[20px] 
-      self-end">
+      self-end" alt="flecha amarilla">
     </div>
   </a>
 </div>

src/routes/+error.svelte

@@ -0,0 +1,10 @@
+<script>
+  import { page } from '$app/stores';
+</script>
+
+<div class="container mx-auto py-20">
+  <div class="w-1/2 p-20 mx-auto w-1/2 mx-auto bg-[url('/grid-bg.png')] bg-cmxyellow text-center" style={`box-shadow: 7px 7px 1px black;`}>
+    <h1 class="text-5xl font-bold">Error {$page.status}</h1>
+    <p class="text-lg">{$page.error.message}</p>
+  </div>
+</div>

src/routes/+layout.svelte

@@ -2,8 +2,21 @@
 	import Footer from '@/components/Footer.svelte';
 	import Navbar from '@/components/Navbar.svelte';
 	import '../app.css';
+
+	let title = "Codeando México"
+	let description = "Tecnología cívica y datos para mejorar lo público"
+	let meta_description = "Generamos nuevas formas de participación ciudadana, abrimos conocimiento e innovamos en el espacio público a través de la tecnología."
+	let image = "/metaimage.png"
 </script>
 
+<svelte:head>
+  <title>{title}</title>
+  <meta name="description" content={meta_description} />
+  <meta property="og:title" content={title} />
+  <meta property="og:description" content={meta_description} />
+  <meta property="og:image" content={image} />
+</svelte:head>
+
 <Navbar />
 
 <slot />

src/routes/aviso-de-privacidad/+page.server.js

@@ -0,0 +1,11 @@
+import client from '$lib/apiClient'
+import { readSingleton } from '@directus/sdk'
+
+export async function load() {
+  const aviso = await client.request(readSingleton('aviso_privacidad', {
+    fields: ['*']
+  }))
+
+  return { aviso }
+}
+export const prerender = true;

src/routes/aviso-de-privacidad/+page.svelte

@@ -0,0 +1,26 @@
+<script>
+  export let data
+  const { aviso } = data
+  const date_updated = processDate(aviso.date_updated)
+  function processDate(dateObject, locale) {
+    locale ??= 'es-mx'
+    console.log(locale)
+    let formattedDate = new Date(dateObject)
+    let finalDate = formattedDate.toLocaleString(locale, { weekday: 'long', day: 'numeric', month: 'long', year: 'numeric' })
+    return finalDate
+  } 
+  console.log(aviso)  
+</script>
+<style>
+	#aviso ul {
+		list-style-type: disc !important;
+	}
+</style>
+
+<div id="aviso" class="container mx-auto py-20">
+  <div class="w-10/12 p-5 mx-auto w-1/2 mx-auto bg-[url('/grid-bg.png')] bg-slate-200 prose" style={`box-shadow: 7px 7px 1px black;`}>
+    {@html aviso.content}
+    <p>Ultima actualización: {date_updated}</p>
+  </div>
+</div>
+