From f006df6089876bbd5d577d9bf629707bbbfaa484 Mon Sep 17 00:00:00 2001
From: Nulo <git@nulo.in>
Date: Wed, 13 Dec 2023 01:14:05 -0300
Subject: [PATCH] mejorar layout en pantallas chicas

---
 frontend/src/lib/components/SourceLink.svelte | 4 ++--
 frontend/src/lib/routes/Dataset.svelte        | 8 ++++++--
 frontend/src/lib/routes/Portal.svelte         | 6 +++---
 3 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/frontend/src/lib/components/SourceLink.svelte b/frontend/src/lib/components/SourceLink.svelte
index e2f7273..feb1998 100644
--- a/frontend/src/lib/components/SourceLink.svelte
+++ b/frontend/src/lib/components/SourceLink.svelte
@@ -10,8 +10,8 @@
   target="_blank"
   rel="noopener"
 >
-  <ExternalLink fill="currentColor" class="h-4" />
-  <span class="underline">
+  <ExternalLink fill="currentColor" class="h-4 shrink-0" />
+  <span class="w-full break-words underline">
     <slot>Fuente</slot>
   </span>
 </a>
diff --git a/frontend/src/lib/routes/Dataset.svelte b/frontend/src/lib/routes/Dataset.svelte
index 3364e22..e721769 100644
--- a/frontend/src/lib/routes/Dataset.svelte
+++ b/frontend/src/lib/routes/Dataset.svelte
@@ -54,7 +54,9 @@
                 e.datasetIdentifier === dataset.identifier &&
                 e.distributionIdentifier === dist.identifier,
             )}
-            <li class="flex items-center justify-between px-6 py-5">
+            <li
+              class="flex flex-col items-center items-stretch justify-between gap-1 px-6 py-5 sm:flex-row"
+            >
               <div>
                 <h3>
                   {dist.title}
@@ -81,7 +83,9 @@
                   <small>{dist.fileName}</small>
                 {/if}
               </div>
-              <div class="flex flex-col items-center gap-2">
+              <div
+                class="flex flex-row-reverse place-content-end gap-4 sm:flex-col sm:place-content-center sm:items-center sm:gap-2"
+              >
                 {#if !error}
                   <button
                     type="button"
diff --git a/frontend/src/lib/routes/Portal.svelte b/frontend/src/lib/routes/Portal.svelte
index ec51110..3198108 100644
--- a/frontend/src/lib/routes/Portal.svelte
+++ b/frontend/src/lib/routes/Portal.svelte
@@ -56,7 +56,7 @@
         <small>
           Viendo portal archivado de
           <a
-            class="text-blue-500 underline dark:text-blue-300"
+            class="break-words text-blue-500 underline dark:text-blue-300"
             target="_blank"
             rel="noopener"
             href={url}>{url}</a
@@ -90,14 +90,14 @@
               class="flex justify-between px-6 py-5 hover:bg-gray-50 dark:hover:bg-gray-700"
               href={datasetLink}
             >
-              <div>
+              <div class="max-w-full hyphens-auto break-words">
                 <h3 class="text-lg">{dataset.title}</h3>
                 <p class="text-sm">{dataset.description}</p>
               </div>
               <ArrowForward
                 fill="currentColor"
                 aria-hidden="true"
-                class="w-6 shrink-0 text-gray-600 dark:text-gray-400  "
+                class="w-6 shrink-0 text-gray-600 dark:text-gray-400"
               />
             </a>
           </li>