diff --git a/about.html b/about.html index 8d54314..a2868b0 100644 --- a/about.html +++ b/about.html @@ -34,6 +34,8 @@ + + @@ -384,8 +386,15 @@
Newsletter
- - + + + @@ -430,6 +439,7 @@
Newsletter
+ @@ -532,4 +542,4 @@
Newsletter
- \ No newline at end of file + diff --git a/appointment.html b/appointment.html index 813d5b2..53e80a0 100644 --- a/appointment.html +++ b/appointment.html @@ -34,6 +34,8 @@ + + @@ -292,8 +294,15 @@
Newsletter
- - + + + @@ -338,6 +347,7 @@
Newsletter
+ @@ -440,4 +450,4 @@
Newsletter
- \ No newline at end of file + diff --git a/contact.html b/contact.html index c86c8bc..7d85a8a 100644 --- a/contact.html +++ b/contact.html @@ -34,6 +34,7 @@ + @@ -310,10 +311,14 @@
Newsletter
- - - - + + @@ -357,6 +362,7 @@
Newsletter
+ diff --git a/contributors.html b/contributors.html index e29912f..002b0d6 100644 --- a/contributors.html +++ b/contributors.html @@ -31,6 +31,8 @@ + + @@ -201,10 +203,14 @@
Newsletter
- - - - + + @@ -220,6 +226,7 @@
Newsletter
+ @@ -338,4 +345,4 @@
Newsletter
- \ No newline at end of file + diff --git a/css/Scroll.css b/css/Scroll.css new file mode 100644 index 0000000..dd9cb48 --- /dev/null +++ b/css/Scroll.css @@ -0,0 +1,59 @@ +/* Scroll */ +#scrollButton { + position: fixed; + bottom: 75px; + right: 15px; + width: 60px; + height: 60px; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + z-index: 1000; + opacity: 0; /* Initially hidden */ + pointer-events: none; /* Prevent interaction when hidden */ + transition: opacity 0.7s ease; /* Smooth fade-in effect */ +} + + +#scrollButton.visible { + opacity: 1; /* Fully visible */ + pointer-events: auto; /* Enable interaction */ +} + +.outer-circle { + position: relative; + width: 46px; + height: 46px; + border-radius: 50%; + background: conic-gradient( + #0075f4 0deg, + #004bee var(--scroll-progress, 0deg), + #e9363600 var(--scroll-progress, 0deg), + #b3575700 360deg + ); + transform: rotate(-90deg); /* Start animation from top */ + display: flex; + align-items: center; + justify-content: center; + transition: background 0.3s ease; +} + +.inner-circle { + width: 30px; + height: 30px; + background: white; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + box-shadow: 0 4px 6px rgb(0 0 0 / 66%); +} + +.arrow { + font-size: 18px; + color: #0075f4; + font-weight: 1000; /* Extreme weight for more boldness */ + text-shadow: 2px 2px 4px rgb(0 0 0 / 45%); /* Add shadow to make it appear thicker */ + transform: rotate(90deg); /* Fixed direction to the right */ +} diff --git a/feature.html b/feature.html index 56c1886..08b1a11 100644 --- a/feature.html +++ b/feature.html @@ -34,6 +34,8 @@ + + @@ -309,8 +311,15 @@
Newsletter
- - + + + @@ -355,6 +364,7 @@
Newsletter
+ @@ -456,4 +466,4 @@
Newsletter
- \ No newline at end of file + diff --git a/index.html b/index.html index 26cbd95..a1cbf1d 100644 --- a/index.html +++ b/index.html @@ -39,6 +39,8 @@ + + @@ -568,10 +570,14 @@
Newsletter
- - - - + + @@ -587,7 +593,8 @@
Newsletter
- + + @@ -722,4 +729,4 @@
Newsletter
- \ No newline at end of file + diff --git a/js/Scroll.js b/js/Scroll.js new file mode 100644 index 0000000..c539bb4 --- /dev/null +++ b/js/Scroll.js @@ -0,0 +1,27 @@ + + +const scrollButton = document.getElementById('scrollButton'); +const outerCircle = document.querySelector('.outer-circle'); +const arrow = document.querySelector('.arrow'); + +// Function to handle scroll behavior +window.addEventListener('scroll', () => { + const scrollTop = window.scrollY; + const scrollHeight = document.documentElement.scrollHeight - window.innerHeight; + const scrollProgress = (scrollTop / scrollHeight) * 360; + + // Show button after scrolling 7-8 lines (~100px) + if (scrollTop > 100) { + scrollButton.classList.add('visible'); + } else { + scrollButton.classList.remove('visible'); + } + + // Update the circular progress + outerCircle.style.setProperty('--scroll-progress', `${scrollProgress}deg`); +}); + +// Scroll-to-top functionality +scrollButton.addEventListener('click', () => { + window.scrollTo({ top: 0, behavior: 'smooth' }); +}); diff --git a/service.html b/service.html index fbe3c15..e2824bd 100644 --- a/service.html +++ b/service.html @@ -34,6 +34,8 @@ + + @@ -397,8 +399,15 @@
Newsletter
- - + + + @@ -443,6 +452,7 @@
Newsletter
+ @@ -545,4 +555,4 @@
Newsletter
- \ No newline at end of file + diff --git a/team.html b/team.html index e921bb1..d0fd559 100644 --- a/team.html +++ b/team.html @@ -34,6 +34,8 @@ + + @@ -352,8 +354,15 @@
Newsletter
- - + + + @@ -398,6 +407,7 @@
Newsletter
+ @@ -499,4 +509,4 @@
Newsletter
- \ No newline at end of file + diff --git a/testimonial.html b/testimonial.html index b6f0cda..d64ca0b 100644 --- a/testimonial.html +++ b/testimonial.html @@ -33,7 +33,9 @@ - + + + @@ -246,8 +248,15 @@
Newsletter
- - + + + @@ -264,6 +273,7 @@
Newsletter
+ @@ -398,4 +408,4 @@
Newsletter
- \ No newline at end of file +