my-cloud-devops-consulting 1.1.202507100102__tar.gz → 1.1.202507110132__tar.gz

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. {my-cloud-devops-consulting-1.1.202507100102/my_cloud_devops_consulting.egg-info → my-cloud-devops-consulting-1.1.202507110132}/PKG-INFO +4 -1
  2. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/README.md +4 -1
  3. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132/my_cloud_devops_consulting.egg-info}/PKG-INFO +4 -1
  4. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/my_cloud_devops_consulting.egg-info/SOURCES.txt +4 -0
  5. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/css/assessment.css +1 -44
  6. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/css/index.css +0 -1
  7. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/css/main.css +1 -9
  8. my-cloud-devops-consulting-1.1.202507110132/static/images/pexels-divinetechygirl-1181341.jpg +0 -0
  9. my-cloud-devops-consulting-1.1.202507110132/static/images/pexels-divinetechygirl-1181472.jpg +0 -0
  10. my-cloud-devops-consulting-1.1.202507110132/static/images/pexels-fotios-photos-16129703.jpg +0 -0
  11. my-cloud-devops-consulting-1.1.202507110132/static/images/pexels-tiger-lily-7108466.jpg +0 -0
  12. my-cloud-devops-consulting-1.1.202507110132/static/js/counter.js +20 -0
  13. my-cloud-devops-consulting-1.1.202507110132/static/js/index.js +119 -0
  14. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/base.html +57 -35
  15. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/index.html +31 -8
  16. my-cloud-devops-consulting-1.1.202507100102/static/js/counter.js +0 -19
  17. my-cloud-devops-consulting-1.1.202507100102/static/js/index.js +0 -118
  18. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/MANIFEST.in +0 -0
  19. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/app.py +0 -0
  20. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/my_cloud_devops_consulting.egg-info/dependency_links.txt +0 -0
  21. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/my_cloud_devops_consulting.egg-info/requires.txt +0 -0
  22. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/my_cloud_devops_consulting.egg-info/top_level.txt +0 -0
  23. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/setup.cfg +0 -0
  24. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/setup.py +0 -0
  25. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/anifest.json +0 -0
  26. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/css/about.css +0 -0
  27. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/css/contact-form.css +0 -0
  28. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/css/login.css +0 -0
  29. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/css/register.css +0 -0
  30. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/css/services.css +0 -0
  31. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/images/facebook.png +0 -0
  32. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/images/favicon.svg +0 -0
  33. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/images/image.jpg +0 -0
  34. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/images/instagram.png +0 -0
  35. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/images/linkedin.png +0 -0
  36. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/images/whatsapp-navbar.png +0 -0
  37. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/js/login.js +0 -0
  38. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/js/main.js +0 -0
  39. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/js/register.js +0 -0
  40. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/js/services.js +0 -0
  41. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/js/typing.js +0 -0
  42. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/robots.txt +0 -0
  43. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/static/sitemap.xml +0 -0
  44. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/about.html +0 -0
  45. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/assessment.html +0 -0
  46. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/contact-form.html +0 -0
  47. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/forgot-password.html +0 -0
  48. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/login.html +0 -0
  49. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/private-videos.html +0 -0
  50. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/register.html +0 -0
  51. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/reset-password.html +0 -0
  52. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/templates/services.html +0 -0
  53. {my-cloud-devops-consulting-1.1.202507100102 → my-cloud-devops-consulting-1.1.202507110132}/test/test.py +0 -0
@@ -1,6 +1,6 @@
1
1
  Metadata-Version: 2.1
2
2
  Name: my-cloud-devops-consulting
3
- Version: 1.1.202507100102
3
+ Version: 1.1.202507110132
4
4
  Summary: This is my consulting website for Cloud & DevOps services.
5
5
  Home-page: https://github.com/Betrand1999/project-root
6
6
  Author: Betrand Mutagha
@@ -103,3 +103,6 @@ docker system prune -a
103
103
 
104
104
  site:1beto.com ### it confirms that 1beto.com is not yet indexed by Google
105
105
 
106
+
107
+ # moving image is in the base.html start with moving
108
+
@@ -85,4 +85,7 @@ docker system prune -a
85
85
  ################################################
86
86
 
87
87
 
88
- site:1beto.com ### it confirms that 1beto.com is not yet indexed by Google
88
+ site:1beto.com ### it confirms that 1beto.com is not yet indexed by Google
89
+
90
+
91
+ # moving image is in the base.html start with moving
@@ -1,6 +1,6 @@
1
1
  Metadata-Version: 2.1
2
2
  Name: my-cloud-devops-consulting
3
- Version: 1.1.202507100102
3
+ Version: 1.1.202507110132
4
4
  Summary: This is my consulting website for Cloud & DevOps services.
5
5
  Home-page: https://github.com/Betrand1999/project-root
6
6
  Author: Betrand Mutagha
@@ -103,3 +103,6 @@ docker system prune -a
103
103
 
104
104
  site:1beto.com ### it confirms that 1beto.com is not yet indexed by Google
105
105
 
106
+
107
+ # moving image is in the base.html start with moving
108
+
@@ -23,6 +23,10 @@ static/images/favicon.svg
23
23
  static/images/image.jpg
24
24
  static/images/instagram.png
25
25
  static/images/linkedin.png
26
+ static/images/pexels-divinetechygirl-1181341.jpg
27
+ static/images/pexels-divinetechygirl-1181472.jpg
28
+ static/images/pexels-fotios-photos-16129703.jpg
29
+ static/images/pexels-tiger-lily-7108466.jpg
26
30
  static/images/whatsapp-navbar.png
27
31
  static/js/counter.js
28
32
  static/js/index.js
@@ -1,46 +1,3 @@
1
- /* body {
2
- font-family: Arial, sans-serif;
3
- background-color: #f8f9fa;
4
- color: #333;
5
- }
6
-
7
- .container {
8
- width: 60%;
9
- margin: 50px auto;
10
- background: white;
11
- padding: 30px;
12
- border-radius: 8px;
13
- box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
14
- }
15
-
16
- label {
17
- display: block;
18
- margin-top: 20px;
19
- }
20
-
21
- input[type="text"],
22
- input[type="number"] {
23
- width: 100%;
24
- padding: 8px;
25
- margin-top: 5px;
26
- }
27
-
28
- button {
29
- margin-top: 20px;
30
- padding: 10px 20px;
31
- background-color: #0077cc;
32
- color: white;
33
- border: none;
34
- border-radius: 5px;
35
- cursor: pointer;
36
- }
37
-
38
- .result {
39
- margin-top: 30px;
40
- padding: 20px;
41
- background-color: #eef;
42
- border-left: 5px solid #0077cc;
43
- } */
44
1
  body {
45
2
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
46
3
  background-color: #f0f4f8;
@@ -113,7 +70,7 @@ button:hover {
113
70
  color: #333;
114
71
  }
115
72
 
116
- @media (max-width: 600px) {
73
+ @media (max-width: 20px) {
117
74
  .container {
118
75
  padding: 25px;
119
76
  margin: 20px;
@@ -177,7 +177,6 @@ footer {
177
177
  box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.1);
178
178
  }
179
179
 
180
-
181
180
  @media (max-width: 768px) {
182
181
  /* 🔧 Fix navigation links hidden on mobile */
183
182
  nav ul {
@@ -152,12 +152,4 @@ nav ul li a i {
152
152
  animation-delay: 3s;
153
153
  }
154
154
 
155
- @keyframes float {
156
- 0%,
157
- 100% {
158
- transform: translateY(0px);
159
- }
160
- 50% {
161
- transform: translateY(-20px);
162
- }
163
- }
155
+ /* moving image is not here */
@@ -0,0 +1,20 @@
1
+ document.addEventListener("DOMContentLoaded", () => {
2
+ const counters = document.querySelectorAll(".counter");
3
+ counters.forEach(counter => {
4
+ const updateCount = () => {
5
+ const target = +counter.getAttribute("data-target");
6
+ const count = +counter.innerText;
7
+ const increment = target / 600; // smaller = slower
8
+
9
+ if (count < target) {
10
+ counter.innerText = Math.ceil(count + increment);
11
+ setTimeout(updateCount, 40);
12
+ } else {
13
+ counter.innerText = target;
14
+ }
15
+ };
16
+ updateCount();
17
+ });
18
+ });
19
+
20
+ // update our impact numbers here
@@ -0,0 +1,119 @@
1
+
2
+ document.addEventListener("DOMContentLoaded", () => {
3
+ // Smooth scrolling for internal links
4
+ const links = document.querySelectorAll("a[href^='#']");
5
+ links.forEach(link => {
6
+ link.addEventListener("click", (event) => {
7
+ event.preventDefault();
8
+ const targetId = link.getAttribute("href").substring(1);
9
+ const targetElement = document.getElementById(targetId);
10
+ if (targetElement) {
11
+ targetElement.scrollIntoView({ behavior: "smooth" });
12
+ }
13
+ });
14
+ });
15
+
16
+ // Back to top button functionality
17
+ const backToTopButton = document.createElement("button");
18
+ backToTopButton.innerText = "↑ Top";
19
+ backToTopButton.className = "scroll-to-top";
20
+ document.body.appendChild(backToTopButton);
21
+
22
+ backToTopButton.style.display = "none";
23
+ backToTopButton.addEventListener("click", () => {
24
+ window.scrollTo({ top: 0, behavior: "smooth" });
25
+ });
26
+
27
+ window.addEventListener("scroll", () => {
28
+ if (window.pageYOffset > 300) {
29
+ backToTopButton.style.display = "block";
30
+ } else {
31
+ backToTopButton.style.display = "none";
32
+ }
33
+ });
34
+
35
+ // Hero section animation
36
+ const heroSection = document.querySelector(".hero");
37
+ if (heroSection) {
38
+ heroSection.style.transition = "opacity 1s ease, transform 1s ease";
39
+ heroSection.style.opacity = 0;
40
+ heroSection.style.transform = "translateY(20px)";
41
+ setTimeout(() => {
42
+ heroSection.style.opacity = 1;
43
+ heroSection.style.transform = "translateY(0)";
44
+ }, 100);
45
+ }
46
+
47
+ // Card hover effect with subtle movement
48
+ const cards = document.querySelectorAll(".card");
49
+ cards.forEach(card => {
50
+ card.addEventListener("mouseover", () => {
51
+ card.style.transform = "scale(1.05)";
52
+ card.style.transition = "transform 0.3s ease";
53
+ });
54
+ card.addEventListener("mouseout", () => {
55
+ card.style.transform = "scale(1)";
56
+ });
57
+ });
58
+
59
+ // Section reveal on scroll
60
+ const sections = document.querySelectorAll("section");
61
+ const revealSection = () => {
62
+ const viewportHeight = window.innerHeight;
63
+ sections.forEach(section => {
64
+ const sectionTop = section.getBoundingClientRect().top;
65
+ if (sectionTop < viewportHeight - 100) {
66
+ section.classList.add("visible");
67
+ }
68
+ });
69
+ };
70
+ window.addEventListener("scroll", revealSection);
71
+
72
+ // Styling enhancements for the reveal effect
73
+ const styleSheet = document.createElement("style");
74
+ styleSheet.type = "text/css";
75
+ styleSheet.innerText = `
76
+ section {
77
+ opacity: 0;
78
+ transform: translateY(20px);
79
+ transition: opacity 0.5s ease, transform 0.5s ease;
80
+ }
81
+ section.visible {
82
+ opacity: 1;
83
+ transform: translateY(0);
84
+ }
85
+ .scroll-to-top {
86
+ position: fixed;
87
+ bottom: 20px;
88
+ right: 20px;
89
+ padding: 10px 15px;
90
+ background: #ff8c42;
91
+ color: white;
92
+ border: none;
93
+ border-radius: 5px;
94
+ display: none;
95
+ cursor: pointer;
96
+ transition: background 0.3s ease;
97
+ }
98
+ .scroll-to-top:hover {
99
+ background: #e07a35;
100
+ }
101
+ `;
102
+ document.head.appendChild(styleSheet);
103
+ });
104
+
105
+
106
+ // Function to scroll to the top of the page
107
+ function scrollToTop() {
108
+ window.scrollTo({ top: 0, behavior: 'smooth' });
109
+ }
110
+
111
+ // Show the button when the user scrolls down
112
+ window.addEventListener('scroll', () => {
113
+ const scrollToTopButton = document.querySelector('.scroll-to-top');
114
+ if (window.pageYOffset > 300) {
115
+ scrollToTopButton.style.display = 'block';
116
+ } else {
117
+ scrollToTopButton.style.display = 'none';
118
+ }
119
+ });
@@ -70,35 +70,77 @@
70
70
  {% endif %}
71
71
 
72
72
  <style>
73
- /* CSS for Moving Image */
74
- .moving-image-container {
75
- overflow: hidden;
73
+ /* Wrapper holding both images horizontally */
74
+ .moving-images-row {
75
+ display: flex;
76
+ justify-content: center;
77
+ gap: 30px;
78
+ padding: 40px 20px;
79
+ background: #f9f9f9;
80
+ overflow-x: auto;
81
+ }
82
+
83
+ /* Individual image wrapper */
84
+ .moving-image-box {
76
85
  position: relative;
77
- width: 100%;
78
- height: 300px; /* Adjust height as needed */
79
- margin: 20px 0;
86
+ width: 400px; /* Width of each image */
87
+ height: 200px;
88
+ overflow: hidden;
89
+ border-radius: 12px;
90
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
91
+ flex: 0 0 auto;
80
92
  }
81
93
 
94
+ /* Floating animation effect */
82
95
  .moving-image {
83
- position: absolute;
84
- width: 1400px; /* Adjust the size as needed */
85
- height: auto;
86
- animation: moveImage 30s linear infinite;
96
+ width: 100%;
97
+ height: 100%;
98
+ object-fit: cover;
99
+ animation: floatImage 4s ease-in-out infinite; /* 👈 reduced from 8s to 4s */
87
100
  }
88
101
 
89
- @keyframes moveImage {
102
+ @keyframes floatImage {
90
103
  0% {
91
- left: -150px; /* Start off-screen (left) */
104
+ transform: translateY(0px);
92
105
  }
93
106
  50% {
94
- left: 50%; /* Move to the center */
95
- transform: translateX(-50%);
107
+ transform: translateY(-10px);
96
108
  }
97
109
  100% {
98
- left: 100%; /* Move off-screen (right) */
110
+ transform: translateY(0px);
111
+ }
112
+ }
113
+
114
+ /* Staggered float animation delays */
115
+ .moving-image-box:nth-child(1) .moving-image {
116
+ animation-delay: 0s;
117
+ }
118
+
119
+ .moving-image-box:nth-child(2) .moving-image {
120
+ animation-delay: 2s;
121
+ }
122
+
123
+ .moving-image-box:nth-child(3) .moving-image {
124
+ animation-delay: 4s;
125
+ }
126
+
127
+ .moving-image-box:nth-child(4) .moving-image {
128
+ animation-delay: 6s;
129
+ }
130
+
131
+ @keyframes zoomInOut {
132
+ 0% {
133
+ transform: scale(1);
134
+ }
135
+ 50% {
136
+ transform: scale(1.05);
137
+ }
138
+ 100% {
139
+ transform: scale(1);
99
140
  }
100
141
  }
101
142
  </style>
143
+
102
144
  <link
103
145
  href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
104
146
  rel="stylesheet"
@@ -116,26 +158,6 @@
116
158
  </div>
117
159
  </a>
118
160
 
119
- <!--
120
- <nav aria-label="Main Navigation">
121
- <ul>
122
- <li><a href="{{ url_for('home') }}">Home</a></li>
123
- <li><a href="{{ url_for('about') }}">About</a></li>
124
- <li><a href="{{ url_for('assessment') }}">Assessment</a></li>
125
- <li><a href="{{ url_for('services') }}">Services</a></li>
126
- <li><a href="{{ url_for('contact_form') }}">Contact Form</a></li>
127
- {% if current_user.is_authenticated %}
128
- <li><a href="{{ url_for('private_videos') }}">Videos</a></li>
129
- <li><a href="{{ url_for('logout') }}">Logout</a></li>
130
-
131
- {% else %}
132
-
133
- <li><a href="{{ url_for('register') }}">Register</a></li>
134
- <li><a href="{{ url_for('login') }}">Login</a></li>
135
- {% endif %}
136
- </ul>
137
- </nav> -->
138
-
139
161
  <nav aria-label="Main Navigation">
140
162
  <ul>
141
163
  <li>
@@ -73,15 +73,38 @@
73
73
  Request A Demo
74
74
  </a>
75
75
  </section>
76
- <!-- add demo -->
77
76
 
78
- <!-- Moving Image Section -->
79
- <section class="moving-image-container">
80
- <img
81
- src="{{ url_for('static', filename='images/image.jpg') }}"
82
- alt="Moving Image"
83
- class="moving-image"
84
- />
77
+ <!-- Moving Image Section 1 -->
78
+ <!-- Horizontal Moving Images -->
79
+ <section class="moving-images-row">
80
+ <div class="moving-image-box">
81
+ <img
82
+ src="{{ url_for('static', filename='images/pexels-tiger-lily-7108466.jpg') }}"
83
+ alt="Tiger Lily"
84
+ class="moving-image"
85
+ />
86
+ </div>
87
+ <div class="moving-image-box">
88
+ <img
89
+ src="{{ url_for('static', filename='images/pexels-divinetechygirl-1181341.jpg') }}"
90
+ alt="Techy Girl"
91
+ class="moving-image"
92
+ />
93
+ </div>
94
+ <div class="moving-image-box">
95
+ <img
96
+ src="{{ url_for('static', filename='images/pexels-divinetechygirl-1181472.jpg') }}"
97
+ alt="Techy Girl"
98
+ class="moving-image"
99
+ />
100
+ </div>
101
+ <div class="moving-image-box">
102
+ <img
103
+ src="{{ url_for('static', filename='images/pexels-fotios-photos-16129703.jpg') }}"
104
+ alt="Techy Girl"
105
+ class="moving-image"
106
+ />
107
+ </div>
85
108
  </section>
86
109
 
87
110
  <!-- Services Highlights -->
@@ -1,19 +0,0 @@
1
- document.addEventListener("DOMContentLoaded", () => {
2
- const counters = document.querySelectorAll(".counter");
3
- counters.forEach(counter => {
4
- const updateCount = () => {
5
- const target = +counter.getAttribute("data-target");
6
- const count = +counter.innerText;
7
- const increment = target / 200; // smaller = slower
8
-
9
- if (count < target) {
10
- counter.innerText = Math.ceil(count + increment);
11
- setTimeout(updateCount, 20);
12
- } else {
13
- counter.innerText = target;
14
- }
15
- };
16
- updateCount();
17
- });
18
- });
19
-
@@ -1,118 +0,0 @@
1
- document.addEventListener("DOMContentLoaded", () => {
2
- // Smooth scrolling for internal links
3
- const links = document.querySelectorAll("a[href^='#']");
4
- links.forEach(link => {
5
- link.addEventListener("click", (event) => {
6
- event.preventDefault();
7
- const targetId = link.getAttribute("href").substring(1);
8
- const targetElement = document.getElementById(targetId);
9
- if (targetElement) {
10
- targetElement.scrollIntoView({ behavior: "smooth" });
11
- }
12
- });
13
- });
14
-
15
- // Back to top button functionality
16
- const backToTopButton = document.createElement("button");
17
- backToTopButton.innerText = "↑ Top";
18
- backToTopButton.className = "scroll-to-top";
19
- document.body.appendChild(backToTopButton);
20
-
21
- backToTopButton.style.display = "none";
22
- backToTopButton.addEventListener("click", () => {
23
- window.scrollTo({ top: 0, behavior: "smooth" });
24
- });
25
-
26
- window.addEventListener("scroll", () => {
27
- if (window.pageYOffset > 300) {
28
- backToTopButton.style.display = "block";
29
- } else {
30
- backToTopButton.style.display = "none";
31
- }
32
- });
33
-
34
- // Hero section animation
35
- const heroSection = document.querySelector(".hero");
36
- if (heroSection) {
37
- heroSection.style.transition = "opacity 1s ease, transform 1s ease";
38
- heroSection.style.opacity = 0;
39
- heroSection.style.transform = "translateY(20px)";
40
- setTimeout(() => {
41
- heroSection.style.opacity = 1;
42
- heroSection.style.transform = "translateY(0)";
43
- }, 100);
44
- }
45
-
46
- // Card hover effect with subtle movement
47
- const cards = document.querySelectorAll(".card");
48
- cards.forEach(card => {
49
- card.addEventListener("mouseover", () => {
50
- card.style.transform = "scale(1.05)";
51
- card.style.transition = "transform 0.3s ease";
52
- });
53
- card.addEventListener("mouseout", () => {
54
- card.style.transform = "scale(1)";
55
- });
56
- });
57
-
58
- // Section reveal on scroll
59
- const sections = document.querySelectorAll("section");
60
- const revealSection = () => {
61
- const viewportHeight = window.innerHeight;
62
- sections.forEach(section => {
63
- const sectionTop = section.getBoundingClientRect().top;
64
- if (sectionTop < viewportHeight - 100) {
65
- section.classList.add("visible");
66
- }
67
- });
68
- };
69
- window.addEventListener("scroll", revealSection);
70
-
71
- // Styling enhancements for the reveal effect
72
- const styleSheet = document.createElement("style");
73
- styleSheet.type = "text/css";
74
- styleSheet.innerText = `
75
- section {
76
- opacity: 0;
77
- transform: translateY(20px);
78
- transition: opacity 0.5s ease, transform 0.5s ease;
79
- }
80
- section.visible {
81
- opacity: 1;
82
- transform: translateY(0);
83
- }
84
- .scroll-to-top {
85
- position: fixed;
86
- bottom: 20px;
87
- right: 20px;
88
- padding: 10px 15px;
89
- background: #ff8c42;
90
- color: white;
91
- border: none;
92
- border-radius: 5px;
93
- display: none;
94
- cursor: pointer;
95
- transition: background 0.3s ease;
96
- }
97
- .scroll-to-top:hover {
98
- background: #e07a35;
99
- }
100
- `;
101
- document.head.appendChild(styleSheet);
102
- });
103
-
104
-
105
- // Function to scroll to the top of the page
106
- function scrollToTop() {
107
- window.scrollTo({ top: 0, behavior: 'smooth' });
108
- }
109
-
110
- // Show the button when the user scrolls down
111
- window.addEventListener('scroll', () => {
112
- const scrollToTopButton = document.querySelector('.scroll-to-top');
113
- if (window.pageYOffset > 300) {
114
- scrollToTopButton.style.display = 'block';
115
- } else {
116
- scrollToTopButton.style.display = 'none';
117
- }
118
- });