85 lines
14 KiB
HTML
85 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<script src="./support.js"></script>
|
|
</head>
|
|
<body>
|
|
<x-dc>
|
|
<helmet data-dc-atomics>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:ital,wght@0,400;0,500;0,600;0,700;0,800&display=swap" rel="stylesheet">
|
|
<style>
|
|
*{box-sizing:border-box}
|
|
html,body{margin:0;padding:0}
|
|
body{font-family:'Nunito',system-ui,sans-serif;background:#F6ECDF;color:#3F362E;-webkit-font-smoothing:antialiased}
|
|
a{text-decoration:none;color:inherit}
|
|
::-webkit-scrollbar{width:10px}
|
|
::-webkit-scrollbar-thumb{background:#E4D6C4;border-radius:8px;border:3px solid transparent;background-clip:content-box}
|
|
</style>
|
|
</helmet>
|
|
|
|
<div style="display:flex;min-height:100vh;background:#F6ECDF">
|
|
<aside style="width:248px;flex:none;background:#FFFDF9;border-right:1px solid #ECE0D0;display:flex;flex-direction:column;padding:24px 16px;position:sticky;top:0;height:100vh">
|
|
<a href="index.dc.html" style="display:flex;align-items:center;gap:11px;padding:4px 8px 22px">
|
|
<div style="width:38px;height:38px;border-radius:12px;background:linear-gradient(155deg,#F8C3A8,#F2937A);display:flex;align-items:center;justify-content:center;flex:none"><svg width="21" height="21" viewBox="0 0 24 24" fill="none" stroke="#fff" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg></div>
|
|
<div><div style="font-family:'Fredoka';font-weight:600;font-size:17px;color:#3F362E;line-height:1">OpenDayCare</div><div style="font-size:11.5px;color:#A89A8B;margin-top:2px">Familia</div></div>
|
|
</a>
|
|
<nav style="display:flex;flex-direction:column;gap:4px;flex:1;margin-top:4px">
|
|
<a href="familia-feed.dc.html" style="display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;background:#FBE3D8;color:#D9583C;font-weight:800;font-size:14.5px"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 9.5 12 3l9 6.5V20a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z"/></svg>Feed</a>
|
|
<a href="resumen-dia.dc.html" style="display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;background:transparent;color:#6E6359;font-weight:600;font-size:14.5px"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>Resumen del día</a>
|
|
<a href="familia-cuenta.dc.html" style="display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;background:transparent;color:#6E6359;font-weight:600;font-size:14.5px"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>Mi cuenta</a>
|
|
</nav>
|
|
<div style="border-top:1px solid #ECE0D0;padding-top:14px;margin-top:10px"><div style="display:flex;align-items:center;gap:11px;padding:6px 8px">
|
|
<div style="width:38px;height:38px;border-radius:50%;background:#C9B6E8;color:#fff;font-family:'Fredoka';font-weight:600;font-size:16px;display:flex;align-items:center;justify-content:center;flex:none">L</div>
|
|
<div style="flex:1;min-width:0"><div style="font-weight:800;font-size:14px;color:#3F362E">Lucía Fernández</div><div style="font-size:12px;color:#A89A8B">Mamá de Mateo</div></div>
|
|
<a href="login.dc.html" title="Cerrar sesión" style="flex:none;width:32px;height:32px;border-radius:10px;background:#F6ECDF;color:#94887B;display:flex;align-items:center;justify-content:center"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4M16 17l5-5-5-5M21 12H9"/></svg></a>
|
|
</div></div>
|
|
</aside>
|
|
|
|
<main style="flex:1;min-width:0;height:100vh;overflow-y:auto">
|
|
<div style="max-width:720px;width:100%;margin:0 auto;padding:34px 40px 80px">
|
|
<div style="margin-bottom:20px">
|
|
<div style="font-size:12.5px;font-weight:800;letter-spacing:.8px;color:#D9583C;margin-bottom:4px">TU FAMILIA</div>
|
|
<h1 style="font-family:'Fredoka';font-weight:600;font-size:30px;margin:0;color:#3F362E">Hola, Lucía</h1>
|
|
<p style="margin:5px 0 0;color:#94887B;font-size:14.5px">Así va el día de hoy</p>
|
|
</div>
|
|
<div style="display:flex;gap:10px;margin-bottom:22px;flex-wrap:wrap">
|
|
<button style="display:flex;align-items:center;gap:8px;padding:7px 15px 7px 8px;border-radius:999px;border:1.5px solid #3F362E;background:#3F362E;color:#fff;font-weight:700;font-size:14px;cursor:pointer;font-family:inherit"><span style="width:26px;height:26px;border-radius:50%;background:#A9D9E8;color:#1F7A93;display:flex;align-items:center;justify-content:center;font-family:'Fredoka';font-weight:600;font-size:13px">M</span>Mateo</button>
|
|
<button style="display:flex;align-items:center;gap:8px;padding:7px 15px 7px 8px;border-radius:999px;border:1.5px solid #ECE0D0;background:#FFFDF9;color:#6E6359;font-weight:700;font-size:14px;cursor:pointer;font-family:inherit"><span style="width:26px;height:26px;border-radius:50%;background:#F4B8CC;color:#C44A7A;display:flex;align-items:center;justify-content:center;font-family:'Fredoka';font-weight:600;font-size:13px">S</span>Sofía</button>
|
|
<button style="padding:7px 16px;border-radius:999px;border:1.5px solid #ECE0D0;background:#FFFDF9;color:#6E6359;font-weight:700;font-size:14px;cursor:pointer;font-family:inherit">Todos</button>
|
|
</div>
|
|
<div style="display:flex;align-items:center;gap:14px;margin-bottom:14px"><span style="font-size:12.5px;font-weight:800;letter-spacing:.8px;color:#8A7C6D">HOY · MARTES 17 JUN</span><span style="flex:1;height:1px;background:#E7DAC8"></span></div>
|
|
|
|
<div style="display:flex;flex-direction:column;gap:16px">
|
|
<a href="detalle-publicacion.dc.html" style="display:block;background:#FFFDF9;border:1px solid #ECE0D0;border-radius:20px;padding:20px 22px;box-shadow:0 4px 16px -12px rgba(120,90,60,.5)">
|
|
<div style="display:flex;align-items:center;gap:12px;margin-bottom:14px"><div style="width:44px;height:44px;border-radius:50%;background:#A9D9E8;color:#1F7A93;font-family:'Fredoka';font-weight:600;font-size:17px;display:flex;align-items:center;justify-content:center;flex:none">M</div><div style="flex:1"><div style="font-family:'Fredoka';font-weight:600;font-size:16.5px;color:#3F362E">Mateo</div><div style="font-size:12.5px;color:#A89A8B">14:20 · Maestra Caro · Sala Soles</div></div><div style="display:flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;background:#CFEBD8"><span style="width:8px;height:8px;border-radius:50%;background:#3E9B6C"></span><span style="font-size:12px;font-weight:800;letter-spacing:.5px;color:#3E9B6C">LOGRO</span></div></div>
|
|
<p style="font-size:15.5px;line-height:1.55;color:#4A4038;margin:0">¡Usó el orinal solito por primera vez! Estaba feliz de contárselo a todos. Un gran paso.</p>
|
|
<div style="display:flex;align-items:center;gap:18px;margin-top:16px;padding-top:14px;border-top:1px solid #F0E6D8"><span style="display:flex;align-items:center;gap:7px;color:#E0654A;font-weight:700;font-size:14px"><svg width="19" height="19" viewBox="0 0 24 24" fill="#E0654A" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1-1.1a5.5 5.5 0 0 0-7.8 7.8l1 1L12 21.2l7.8-7.8 1-1a5.5 5.5 0 0 0 0-7.8z"/></svg>3</span><span style="display:flex;align-items:center;gap:7px;color:#94887B;font-weight:700;font-size:14px"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8z"/></svg>1</span></div>
|
|
</a>
|
|
<a href="detalle-publicacion.dc.html" style="display:block;background:#FFFDF9;border:1px solid #ECE0D0;border-radius:20px;padding:20px 22px;box-shadow:0 4px 16px -12px rgba(120,90,60,.5)">
|
|
<div style="display:flex;align-items:center;gap:12px;margin-bottom:14px"><div style="width:44px;height:44px;border-radius:50%;background:#A9D9E8;color:#1F7A93;font-family:'Fredoka';font-weight:600;font-size:17px;display:flex;align-items:center;justify-content:center;flex:none">M</div><div style="flex:1"><div style="font-family:'Fredoka';font-weight:600;font-size:16.5px;color:#3F362E">Mateo</div><div style="font-size:12.5px;color:#A89A8B">09:40 · Maestra Caro · Sala Soles</div></div><div style="display:flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;background:#C7E7F1"><span style="width:8px;height:8px;border-radius:50%;background:#2E89A6"></span><span style="font-size:12px;font-weight:800;letter-spacing:.5px;color:#2E89A6">ACTIVIDAD</span></div></div>
|
|
<p style="font-size:15.5px;line-height:1.55;color:#4A4038;margin:0">Pintamos con témperas esta mañana. Mateo eligió el azul para todo y se concentró un montón mezclando colores.</p>
|
|
<div style="display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;margin-top:14px;border:1.5px dashed #DBCDBA;border-radius:16px;background:#F4ECE1;height:200px;color:#B0A290"><svg width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-3.6-3.6a2 2 0 0 0-2.8 0L6 21"/></svg><span style="font-size:13.5px">Foto · pintando con témperas</span></div>
|
|
<div style="display:flex;align-items:center;gap:18px;margin-top:16px;padding-top:14px;border-top:1px solid #F0E6D8"><span style="display:flex;align-items:center;gap:7px;color:#E0654A;font-weight:700;font-size:14px"><svg width="19" height="19" viewBox="0 0 24 24" fill="#E0654A" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1-1.1a5.5 5.5 0 0 0-7.8 7.8l1 1L12 21.2l7.8-7.8 1-1a5.5 5.5 0 0 0 0-7.8z"/></svg>5</span><span style="display:flex;align-items:center;gap:7px;color:#94887B;font-weight:700;font-size:14px"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8z"/></svg>2</span></div>
|
|
</a>
|
|
<a href="detalle-publicacion.dc.html" style="display:block;background:#FFFDF9;border:1px solid #ECE0D0;border-radius:20px;padding:20px 22px;box-shadow:0 4px 16px -12px rgba(120,90,60,.5)">
|
|
<div style="display:flex;align-items:center;gap:12px;margin-bottom:14px"><div style="width:44px;height:44px;border-radius:50%;background:#CCD8F4;color:#4E72C8;display:flex;align-items:center;justify-content:center;flex:none"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m3 11 18-5v12L3 14v-3zM11.6 16.8a3 3 0 1 1-5.8-1.6"/></svg></div><div style="flex:1"><div style="font-family:'Fredoka';font-weight:600;font-size:16.5px;color:#3F362E">Anuncio general</div><div style="font-size:12.5px;color:#A89A8B">07:50 · Maestra Caro</div></div><div style="display:flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;background:#CCD8F4"><span style="width:8px;height:8px;border-radius:50%;background:#4E72C8"></span><span style="font-size:12px;font-weight:800;letter-spacing:.5px;color:#4E72C8">ANUNCIO</span></div></div>
|
|
<p style="font-size:15.5px;line-height:1.55;color:#4A4038;margin:0">El viernes salimos al parque por la mañana. Recuerden mandar gorra y una botellita de agua.</p>
|
|
<div style="display:flex;align-items:center;gap:18px;margin-top:16px;padding-top:14px;border-top:1px solid #F0E6D8"><span style="display:flex;align-items:center;gap:7px;color:#E0654A;font-weight:700;font-size:14px"><svg width="19" height="19" viewBox="0 0 24 24" fill="#E0654A" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1-1.1a5.5 5.5 0 0 0-7.8 7.8l1 1L12 21.2l7.8-7.8 1-1a5.5 5.5 0 0 0 0-7.8z"/></svg>8</span><span style="display:flex;align-items:center;gap:7px;color:#94887B;font-weight:700;font-size:14px"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8z"/></svg>0</span></div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
|
|
<template id="__bundler_thumbnail" data-bg-color="#F6ECDF">
|
|
<svg viewBox="0 0 1200 800" xmlns="http://www.w3.org/2000/svg"><rect width="1200" height="800" fill="#F6ECDF"/><rect x="160" y="160" width="120" height="44" rx="22" fill="#3F362E"/><rect x="300" y="160" width="110" height="44" rx="22" fill="#fff" stroke="#ECE0D0" stroke-width="3"/><rect x="160" y="250" width="880" height="200" rx="24" fill="#fff" stroke="#ECE0D0" stroke-width="4"/><rect x="160" y="480" width="880" height="200" rx="24" fill="#fff" stroke="#ECE0D0" stroke-width="4"/><circle cx="230" cy="310" r="30" fill="#A9D9E8"/></svg>
|
|
</template>
|
|
</x-dc>
|
|
<script type="text/x-dc" data-dc-script data-props="{"$preview":{"width":"100%","height":"100%"}}"></script>
|
|
</body>
|
|
</html>
|