Merge pull request #988 from Snehagupta1907/fix-941

Fix: Changes the css  the search's suggestion section

components/UI/navbar.tsx

@@ -155,7 +155,7 @@ const Navbar: FunctionComponent = () => {
 
   return (
     <>
-      <div className={"fixed w-full z-20 bg-background top-0"}>
+      <div className={"fixed w-full z-20 bg-background-nav top-0"}>
         <div className={styles.navbarContainer}>
           <div className="ml-4">
             <Link href="/" className="cursor-pointer">

styles/globals.css

@@ -25,9 +25,10 @@
   --secondary300: #eae0d5;
   --tertiary: #bf9e7b;
   --light-tertiary: #f5f0eb;
-  --background: #fff9f0;
+  --background: #FCFFFE;
   --background-light: #fffcf8;
   --background-light300: #f8f7f7;
+  --background-white:#ffffff;
   --dark-content: #454545;
   --negative: #d32f2f;
   --nimiq-ease: cubic-bezier(0.25, 0, 0, 1);

styles/search.module.css

@@ -108,21 +108,21 @@
 .subtitle {
   color: var(--dark-content);
   text-align: center;
-  margin: 3rem 0 2rem;
+  margin: 2rem 0 1rem;
 
   /* Title/H3 */
   font-family: QuickZap;
   font-size: 30px;
   font-style: normal;
   font-weight: 400;
-  line-height: 32px; /* 106.667% */
+  line-height: 38px; /* 106.667% */
 }
 
 .suggestionCategory {
   width: 100%;
   max-width: 1184px;
   display: block;
-  margin: 1rem auto;
+  margin: 3rem auto 1rem;
 }
 
 .suggestedDomainsSkeleton {
@@ -131,7 +131,7 @@
   gap: 32px;
   padding: 24px 0;
   align-self: stretch;
-  border-radius: 20px;
+  border-radius: 16px;
 
   /* Small Shadow */
   box-shadow: var(--small-shadow);
@@ -146,27 +146,33 @@
   flex-direction: column;
   align-items: center;
   align-self: stretch;
-  border-radius: 20px;
-  background: var(--background-light);
+  border-radius: 16px;
+  background: var(--background-white);
+  border: 1px solid rgba(69, 69, 69, 0.1);
+
 
   /* Small Shadow */
   box-shadow: var(--small-shadow);
 
-  margin: 3rem 0;
+  margin: 1.5rem 0;
 }
 
 .suggestedDomainContainer {
   position: relative;
   width: 100%;
   display: flex;
-  padding: 16px 48px;
+  padding: 24px 48px;
   cursor: pointer;
 }
 
 .suggestionTable .suggestedDomainLink:first-child .suggestedDomainContainer {
   padding-top: 24px;
 }
 
+.suggestedDomainContainer p {
+  font-family: "Poppins-Bold"; 
+}
+
 .suggestionTable .suggestedDomainLink:last-child .suggestedDomainContainer {
   padding-bottom: 24px;
 }

tailwind.config.js

@@ -8,6 +8,7 @@ module.exports = {
         secondary: "#402D28",
         tertiary: "#BF9E7B",
         background: "#FFF9F0",
+        "background-nav":"#FCFFFE"
       },
     },
     fontFamily: {