From 6c0bfabce7a6b2087f8f398a389d5c332cb5ba64 Mon Sep 17 00:00:00 2001 From: debasmitasarkar Date: Sun, 6 Oct 2024 01:13:05 +0530 Subject: [PATCH] features --- frontend/index.html | 38 +++++++++++++++++++++++++++++++++----- frontend/script.js | 22 ++++++++++++++++++++++ frontend/style.css | 29 ++++++++++++++++++++--------- 3 files changed, 75 insertions(+), 14 deletions(-) diff --git a/frontend/index.html b/frontend/index.html index 6014354..41f4262 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -6,6 +6,12 @@ Python Voice Assistant + + + + + + @@ -29,26 +35,48 @@

Python Voice Assistant with Gemini AI

Features

-
+

Voice Recognition

-

Processes and understands spoken commands.

+

Processes and understands + spoken commands. +

+
+
+ +

Text-to-Speech

+

Converts written text into natural, clear speech,enabling auditory feedback. +

Weather Updates

-

Provides real-time weather information.

+

Provides real-time
weather information.

News Retrieval

-

Fetches the latest news headlines.

+

Fetches the latest
news headlines. +

Jokes

-

Delivers fun and entertaining jokes.

+

Delivers fun and entertaining
jokes. +

+
+
+ +

Wikipedia Information

+

Retrieves relevant information from Wiki,offering quick access to knowledge. +

+
+
+ +

Music Management

+

Plays,pauses,and manages your music library,letting you enjoy your favorite tracks. +

diff --git a/frontend/script.js b/frontend/script.js index 9cc5bfc..60dba8a 100644 --- a/frontend/script.js +++ b/frontend/script.js @@ -1,3 +1,4 @@ +// Smooth scroll for anchor links document.querySelectorAll('a[href^="#"]').forEach(anchor => { anchor.addEventListener('click', function(e) { e.preventDefault(); @@ -6,3 +7,24 @@ document.querySelectorAll('a[href^="#"]').forEach(anchor => { }); }); }); + +// Slick Slider initialization +$(document).ready(function(){ + $('.features-slider').slick({ + infinite: true, + slidesToShow: 3, // Adjust number of slides shown at once + slidesToScroll: 1, + autoplay: true, + autoplaySpeed: 2000, + arrows: true, // Adds the arrows for navigation + dots: true, // Adds the pagination dots + responsive: [ + { + breakpoint: 768, + settings: { + slidesToShow: 1 // Show 1 slide on smaller screens + } + } + ] + }); +}); \ No newline at end of file diff --git a/frontend/style.css b/frontend/style.css index 3cd20ba..893f447 100644 --- a/frontend/style.css +++ b/frontend/style.css @@ -78,6 +78,7 @@ nav ul li a { color: white; } + /* Features Section */ .features-section { padding: 60px 20px; @@ -85,25 +86,34 @@ nav ul li a { background-color: #ffffff; } -.features-container { - display: flex; - justify-content: space-around; - flex-wrap: wrap; +.features-slider { + width: 80%; + margin: 0 auto; /* Center the slider */ } .feature-item { - background-color: #f9f9f9; + background-color:#B0CFDE; padding: 30px; - width: 200px; text-align: center; - margin: 20px; border-radius: 10px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); + transition: transform 0.3s; /* Add transition for hover effect */ + + /* Ensure equal height for all cards */ + height: 250px; /* Set a fixed height */ + display: flex; /* Use flexbox for alignment */ + flex-direction: column; /* Stack children vertically */ + justify-content: space-between; /* Space items evenly */ +} + +.feature-item:hover { + transform: scale(1.05); /* Scale up on hover */ } .feature-item i { - font-size: 2.5rem; + font-size: 50px; color: #3498db; - margin-bottom: 20px; + margin-bottom: 15px; } .feature-item h3 { @@ -113,6 +123,7 @@ nav ul li a { .feature-item p { font-size: 1rem; + margin: 0; /* Remove default margin */ }