Merge pull request #1195 from harshit-sharmaaa/fevicon

TusharKesarwani · web-flow · commit 3849924fa11e · 2023-06-15T19:30:08.000+05:30
Fevicon Fetcher UI updated [SSOC 2.O]
diff --git a/Projects/Favicon Fetcher/README.md b/Projects/Favicon Fetcher/README.md
@@ -27,14 +27,13 @@ Example :
  
  http://www.google.com/s2/favicons?domain=www.github.com
  
- As I have specified the domain to be github Favicon og github will be fetched.
+ As I have specified the domain to be google Favicon of google will be fetched.
  
  ## SCREENSHOTS
  
- ![Screenshot (299)](https://user-images.githubusercontent.com/80022302/212536821-411dc6b6-f305-4ccb-bec3-185fee32f4dd.png)
- 
+![Screenshot_20230613_230426](https://github.com/harshit-sharmaaa/Front-End-Projects/assets/121124691/55dc31ac-25e2-4958-8285-9a78f3669a4b)
+
  <br/>
  
- ![Screenshot (300)](https://user-images.githubusercontent.com/80022302/212536835-1d61a93d-3c29-4761-ae2a-6492547402e7.png)
-
+![image](https://github.com/harshit-sharmaaa/Front-End-Projects/assets/121124691/550022af-c6c7-4836-8349-7aef994bff34)
 
diff --git a/Projects/Favicon Fetcher/images/background.avif b/Projects/Favicon Fetcher/images/background.avif
diff --git a/Projects/Favicon Fetcher/index.html b/Projects/Favicon Fetcher/index.html
@@ -7,6 +7,9 @@
     <link rel="shortcut icon" href="images/icon.png" type="image/x-icon">
     <link rel="stylesheet" href="styles.css">
     <title>Favicon Fetcher</title>
+    <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=Roboto:wght@300&display=swap" rel="stylesheet">
 </head>
 <body>
     <h2>Favicon Fetcher</h2>
diff --git a/Projects/Favicon Fetcher/styles.css b/Projects/Favicon Fetcher/styles.css
@@ -2,7 +2,7 @@
     margin: 0;
     padding: 0;
     box-sizing: border-box;
-    font-family: "sans";
+    font-family: "roboto";
 }
 
 
@@ -15,16 +15,18 @@ body{
     display: flex;
     align-items: center;
     justify-content: center;
-    background: #b9ecff;
+    background-image: url('images/background.avif');
 }
 
 h2 {
     position: absolute;
     top: 0;
     padding-top: 100px;
-    color: rgb(9, 6, 6);
-    font-size: 2rem;
+    color: rgba(9, 6, 6, 0.567);
+    font-size: 80px;
     text-align: center;
+    font-family: roboto;
+    
   }
 
 
@@ -48,4 +50,12 @@ label input{
 
 input[type='button']:hover{
     cursor: pointer;
+}
+
+#grab,#input{
+    border-radius: 5px;
+    border-style: solid;
+    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.368);
+    font-family: roboto;
+    margin-top: 100px;
 }
