diff --git a/index.html b/index.html index a3a4349..e60b5e1 100644 --- a/index.html +++ b/index.html @@ -8,27 +8,10 @@ - + + diff --git a/js/script.js b/js/script.js index 289e34f..ab8bf59 100644 --- a/js/script.js +++ b/js/script.js @@ -18,6 +18,66 @@ document.addEventListener('DOMContentLoaded', () => { }); }); + // Get Started button functionality + const getStartedBtn = document.querySelector('.btn-primary'); + if (getStartedBtn) { + getStartedBtn.addEventListener('click', () => { + // Create and show modal + const modal = document.createElement('div'); + modal.className = 'fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 fade-in'; + modal.innerHTML = ` +
+

Get Started

+

Choose how you'd like to get started with our services:

+
+ + + +
+ +
+ `; + document.body.appendChild(modal); + + // Add click event to close modal when clicking outside + modal.addEventListener('click', (e) => { + if (e.target === modal) { + modal.remove(); + } + }); + + // Add click events to modal buttons + const modalButtons = modal.querySelectorAll('button:not(:last-child)'); + modalButtons.forEach(button => { + button.addEventListener('click', () => { + const action = button.textContent.trim(); + switch(action) { + case 'Start Free Trial': + window.location.href = '#contact'; + break; + case 'Schedule Demo': + alert('Demo scheduling feature coming soon!'); + break; + case 'Contact Sales': + window.location.href = '#contact'; + break; + } + modal.remove(); + }); + }); + }); + } + // Form submission handling const contactForm = document.querySelector('form'); if (contactForm) { @@ -70,4 +130,83 @@ document.addEventListener('DOMContentLoaded', () => { } }); } + + // Add hover effects to cards + const cards = document.querySelectorAll('.card, .bg-white.rounded-lg'); + cards.forEach(card => { + card.addEventListener('mouseenter', () => { + card.style.transform = 'translateY(-5px)'; + card.style.boxShadow = '0 10px 15px -3px rgba(0,0,0,0.1)'; + }); + card.addEventListener('mouseleave', () => { + card.style.transform = 'translateY(0)'; + card.style.boxShadow = '0 2px 4px rgba(0,0,0,0.1)'; + }); + }); + + // Learn More button functionality + const learnMoreBtn = document.querySelector('.btn-outline-secondary'); + if (learnMoreBtn) { + learnMoreBtn.addEventListener('click', () => { + // Create and show modal + const modal = document.createElement('div'); + modal.className = 'fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 fade-in'; + modal.innerHTML = ` +
+

About Our Services

+
+
+
+ + + +
+
+

Lightning Fast Performance

+

Our platform is optimized for speed and efficiency, ensuring your business operations run smoothly without any delays.

+
+
+
+
+ + + +
+
+

Enterprise-Grade Security

+

Your data is protected with state-of-the-art encryption and security measures, ensuring complete privacy and compliance.

+
+
+
+
+ + + +
+
+

Cloud Integration

+

Seamlessly connect with your existing cloud infrastructure and scale your operations as needed.

+
+
+
+
+ + +
+
+ `; + document.body.appendChild(modal); + + // Add click event to close modal when clicking outside + modal.addEventListener('click', (e) => { + if (e.target === modal) { + modal.remove(); + } + }); + }); + } }); diff --git a/js/tailwind.config.js b/js/tailwind.config.js new file mode 100644 index 0000000..468ebaa --- /dev/null +++ b/js/tailwind.config.js @@ -0,0 +1,17 @@ +tailwind.config = { + theme: { + extend: { + animation: { + 'float': 'float 3s ease-in-out infinite', + 'pulse-slow': 'pulse 4s cubic-bezier(0.4, 0, 0.6, 1) infinite', + 'bounce-slow': 'bounce 3s infinite', + }, + keyframes: { + float: { + '0%, 100%': { transform: 'translateY(0)' }, + '50%': { transform: 'translateY(-10px)' }, + } + } + } + } +} \ No newline at end of file