From a59fdd72d9ebc3799832b43f35e3e77c529733de Mon Sep 17 00:00:00 2001
From: Leo Bazan <leo.bazan.x@gmail.com>
Date: Mon, 26 Jun 2023 18:22:38 -0300
Subject: [PATCH] CSS: Bulk Archives -> Fix responsive input

---
 assets/css/app.css                     | 7 +++++++
 lib/bookmark_web/live/bulk_archives.ex | 4 ++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/assets/css/app.css b/assets/css/app.css
index 454f64b..76b36d9 100644
--- a/assets/css/app.css
+++ b/assets/css/app.css
@@ -970,3 +970,10 @@ body {
 }
 
 
+
+
+/*****************************************  Bulk Archives **************************************/
+
+@media screen and (max-width: 350px) {.responsive-form {width: auto;}}
+@media screen and (min-width: 350px) {.responsive-form {width: 300px;}}
+@media screen and (min-width: 550px) {.responsive-form {width: 500px;}}
\ No newline at end of file
diff --git a/lib/bookmark_web/live/bulk_archives.ex b/lib/bookmark_web/live/bulk_archives.ex
index b68cff5..5d0276b 100644
--- a/lib/bookmark_web/live/bulk_archives.ex
+++ b/lib/bookmark_web/live/bulk_archives.ex
@@ -24,11 +24,11 @@ defmodule BookmarkWeb.BulkArchivesLive do
               <% end %>
             </ul>
         <% else %>
-          <.form for={@form} phx-submit="save">
+          <.form for={@form} phx-submit="save" class="responsive-form">
             <textarea placeholder="Paste your URLs here, one per line:
             https://www.example.com/
             https://www.google.com/"
-            name="urls" style="height: 100px; width: 500px; background-color: white; font-size: 16px;"><%= if  @links, do: @links%></textarea>
+            name="urls" style="height: 100px; width: 100%; background-color: white; font-size: 16px;"><%= if  @links, do: @links%></textarea>
 
             <button class="donate-button">Bulk archive</button>
           </.form>