From 66238c11691abe87c449d1ee6f7a6a7bcc29428c Mon Sep 17 00:00:00 2001
From: Ayo <ramon.aycojr@gmail.com>
Date: Mon, 12 Jun 2023 22:00:06 +0200
Subject: [PATCH] style: address bar color adjustments

---
 src/components/AddressBar.astro | 10 ++++------
 src/layouts/Layout.astro        |  5 +++--
 2 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/components/AddressBar.astro b/src/components/AddressBar.astro
index 2abc001..aa25800 100644
--- a/src/components/AddressBar.astro
+++ b/src/components/AddressBar.astro
@@ -11,7 +11,7 @@ const form = new FormGroup([
   {
     name: "url",
     value: url,
-    placeholder: "Put the URL here",
+    placeholder: "Type a URL here",
     validators: [Validators.required, Validators.minLength(11)],
   },
 ]);
@@ -37,7 +37,6 @@ const form = new FormGroup([
 
 <style lang="scss">
   .address-bar {
-    background-color:antiquewhite;
     text-align: center;
     padding: 0.5em;
     width: 100%;
@@ -60,13 +59,12 @@ const form = new FormGroup([
   }
 
   :global(input) {
-    width: 100%;
+    width: var(--cozy-width);
     text-align: center;
     border: 0px;
     border-radius: 5px;
     padding: 0.5rem;
-  }
-  :global(input[type="text"]) {
-    border: 2px solid brown;
+    background-color: #f5f5f5;
+    box-shadow: 0 0 1px 1px #ccc;
   }
 </style>
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 0805f0c..501065b 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -40,7 +40,7 @@ const { meta } = Astro.props;
 
 <style>
   #main-content {
-    max-width: 600px;
+    max-width: var(--cozy-width);
     margin: 0 auto;
   }
 
@@ -49,12 +49,13 @@ const { meta } = Astro.props;
     padding: 0 0.5rem;
   }
 </style>
-
 <style is:global lang="scss">
   :root {
+    --cozy-width: 600px;
     --system-ui: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif,
       "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   }
+
   html * {
     font-family: var(--system-ui);
   }