From 33846cee343a110ba6b9b3a74e0b0efa94513c6a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=9B=D0=B5=D0=BE=D0=BD=D1=82=D0=B8=D0=B9=20=D0=92=D0=B0?=
 =?UTF-8?q?=D1=80=D1=82=D0=B0=D0=BD=D1=8F=D0=BD?=
 <72815747+loikx@users.noreply.github.com>
Date: Sat, 6 Jan 2024 21:17:11 +0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20style:=20replace=20the=20search?=
 =?UTF-8?q?=20button=20with=20a=20magnifying=20glass=20(#483)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: neon_arch <mustafadhuleb53@gmail.com>
---
 public/images/magnifying_glass.svg | 1 +
 public/static/themes/simple.css    | 8 ++++++++
 src/templates/partials/bar.rs      | 4 +++-
 3 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 public/images/magnifying_glass.svg

diff --git a/public/images/magnifying_glass.svg b/public/images/magnifying_glass.svg
new file mode 100644
index 0000000..5793e02
--- /dev/null
+++ b/public/images/magnifying_glass.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  --><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 50 50" width="24px" height="24px"><circle fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" cx="21" cy="20" r="16"/><line fill="none" stroke="#000000" stroke-width="4" stroke-miterlimit="10" x1="32.229" y1="32.229" x2="45.5" y2="45.5"/></svg>
\ No newline at end of file
diff --git a/public/static/themes/simple.css b/public/static/themes/simple.css
index ff05d70..3990799 100644
--- a/public/static/themes/simple.css
+++ b/public/static/themes/simple.css
@@ -95,6 +95,14 @@ button {
   color: var(--background-color);
   font-weight: 600;
   letter-spacing: 0.1rem;
+  position: relative;
+}
+
+.search_bar button img {
+  position:absolute;
+  left:50%;
+  top:50%;
+  transform:translate(-50%, -50%);
 }
 
 .search_bar button:active {
diff --git a/src/templates/partials/bar.rs b/src/templates/partials/bar.rs
index 13f78a8..ebf89fe 100644
--- a/src/templates/partials/bar.rs
+++ b/src/templates/partials/bar.rs
@@ -16,6 +16,8 @@ pub fn bar(query: &str) -> Markup {
     html!(
         (PreEscaped("<div class=\"search_bar\">"))
             input type="search" name="search-box" value=(query) placeholder="Type to search";
-            button type="submit" onclick="searchWeb()"{"search"}
+            button type="submit" onclick="searchWeb()" {
+                img src="./images/magnifying_glass.svg" alt="Info icon for error box";
+            }
     )
 }