From ecdd91e3b40014252dba96c625cf3684a9f6700e Mon Sep 17 00:00:00 2001 From: Ankit Date: Wed, 5 Apr 2023 13:14:18 +0530 Subject: [PATCH 1/2] Adding Transitions in Navbar --- css/nav.css | 3 +++ css/style.css | 8 ++++++++ 2 files changed, 11 insertions(+) diff --git a/css/nav.css b/css/nav.css index 3eefa8b..e7e5bf4 100644 --- a/css/nav.css +++ b/css/nav.css @@ -21,10 +21,13 @@ .topnav a:hover { color: rgb(255, 255, 255); font-weight: 500; + transform: 2s; + transform: scale(1.1); } .topnav a.active { color: white; + } .topnav .icon { diff --git a/css/style.css b/css/style.css index f335ebe..f49b152 100644 --- a/css/style.css +++ b/css/style.css @@ -57,6 +57,14 @@ nav{ border: 3px solid var(--secondary-colour); border-radius: 100px; } +.logo img:hover{ + transition: 1s; + transform: scale(1.1); + border-radius: 100%; + cursor: pointer; + box-shadow: -1px 1px 1px 1px white; + +} /* List and search button styling */ .main-menu { From 11b510c080dd5e8c0f14dfa7f50b546caeca556e Mon Sep 17 00:00:00 2001 From: Ankit Rattan Date: Tue, 8 Aug 2023 23:41:12 +0530 Subject: [PATCH 2/2] Navbar and other transitions and Footer logo --- css/nav.css | 11 +++++++++++ css/style.css | 11 +++++++++++ index.html | 9 ++++++--- 3 files changed, 28 insertions(+), 3 deletions(-) diff --git a/css/nav.css b/css/nav.css index e7e5bf4..0cf1c5a 100644 --- a/css/nav.css +++ b/css/nav.css @@ -7,6 +7,11 @@ justify-content: space-between; align-items: center; } + nav:hover{ + /* transform: scale(); */ + box-shadow: 10px 10px 10px 10px rgba(40, 40, 40, 0.4); + transition-duration: 0.5s; + } .topnav a { float: left; @@ -45,6 +50,12 @@ margin-bottom: auto; } + #srch-bar:hover{ + border-color: rgb(255, 255, 255); + background-color: black; + color: white; + transition-duration: 1s; + } @media screen and (max-width: 600px) { .topnav a:not(:first-child) {display: none;} .topnav a.icon { diff --git a/css/style.css b/css/style.css index f49b152..b3c7eb2 100644 --- a/css/style.css +++ b/css/style.css @@ -110,6 +110,16 @@ nav{ font-size: 15px; border-radius: 8px; } +#main-img{ + margin: auto; +} + +#main-img:hover{ + box-shadow: 5px 5px 5px 5px rgba(255, 255, 255, 0.4); + transform: scale(1.02); + transition-duration: 1s; + +} /* background styling */ .background { @@ -143,6 +153,7 @@ nav{ } .secondhalf { width: 30%; + margin: auto; } .secondhalf img { diff --git a/index.html b/index.html index d11343d..c86c3ee 100644 --- a/index.html +++ b/index.html @@ -41,7 +41,7 @@ @@ -55,7 +55,7 @@
- +

The Shopping place for all needs!

@@ -279,7 +279,10 @@

Subscribe to our newsletter