pari's repositories
multiplication-app
A simple web application that generates random multiplication problems and asks the user to solve them. The app keeps track of the user's score and updates it based on their answers. It also uses local storage to persist the score across multiple sessions.
emoji-rating
This is a simple rating feedback project using HTML, CSS, and JavaScript. It allows users to rate a product/service using stars and provides visual feedback.
animated-search-bar
The code creates an animated search bar using HTML, CSS, and JavaScript, with a stylish design that includes a shadow effect, magnifier and microphone icons, and a transparent input field.
blurred-background-popup
The webpage contains a container with a background image and a button that, when clicked, displays a popup window with a blurred background.
BMI-calculator
This web app calculates BMI using height and weight inputs. It displays the BMI value and weight condition. Built using HTML, CSS, and JavaScript, it's a useful tool for quickly determining BMI and weight condition.
button-ripple-effect
Created a button with a ripple effect using HTML, CSS, and JavaScript. This adds interactivity to the webpage and uses CSS ::before pseudo-elements and transform to create the ripple circle, while JavaScript calculates the position of the user's mouse and updates the CSS custom properties used for the ripple animation.
counter
This is a basic counter app with HTML, CSS, and JS. It displays a large numerical value that can be adjusted using three buttons, and changes color based on whether it is positive, negative, or zero.
dark-mode-toggle
A dark-mode toggle effect created using HTML, CSS & JS. Also when we switch on and off, these modes are saved inside the local storage of the browser.
double-landing-page
This project is a double landing page built using HTML, CSS, and JavaScript, featuring two split sections, with interactivity provided by modifying the split sections' width on mouse hover. The project provides a basic template for building interactive landing pages.
feedback-ui
This project is a simple feedback UI with three rating icons and a "Send Review" button. Users can select their satisfaction level and submit feedback. Once submitted, a message appears displaying the selected rating and thanking the user.
heart-trail-animation
A simple web animation that uses the mouse movement of the user to generate heart icons that float around the screen.
loading-bar
This project is a simple loading bar animation that uses JavaScript to update the progress of the loading bar as well as display a percentage counter.
mini-calendar
I've created a mini calendar with a simple and minimalist design using HTML, CSS, and JavaScript. This calendar displays the current date, which is dynamically updated using JavaScript's Date object.
mouse-event
This project is a webpage that displays the X and Y position of the user's mouse cursor in real-time. The JavaScript code updates the values in the boxes as the user moves their mouse. This project demonstrates dynamic HTML updates with user interaction.
navbar-menu
This is a responsive navbar menu with a hamburger icon that toggles the display of the menu on click. It improves user experience on different devices by hiding the menu on small screens and displaying it on larger screens.
q-a-section
This code is an HTML page with a Q&A section built using JavaScript and CSS. The HTML page includes questions and their answers which are initially hidden. The JavaScript code controls the display of the answers when the user clicks the plus/minus button, toggling the visibility of the answer text.
random-color-generator
This project dynamically generates and displays unique hex codes for 30 divs using JavaScript
random-emoji
This project fetches a list of emojis from an external API and displays a random emoji and its code upon button click. It uses JavaScript's async/await and JSON methods to handle API data
random-password-generator
This allows users to generate a random password and was made using JavaScript, HTML, and CSS
random-photos
This project is a simple webpage that displays random images from the Picsum API inside a container with a shadow effect. A button is provided to load more images to the container. It's a fun and easy way to showcase a variety of random images on a webpage.
real-time-character-counter
I created a text area with real-time character count and limit functionality using JavaScript
sidebar-menu
I created a sidebar menu using HTML, CSS, and JS. JS adds event listeners to show/hide the sidebar. It's a simple project demonstrating basic web development skills.
social-media-selector-menu
This project creates a social media selector menu using HTML, CSS, and JavaScript. Clicking the button shows a list of social media platforms and selecting one updates the button text.
tabs-section
This project is a simple tabs implementation using HTML, CSS, and JavaScript. It allows users to switch between different tabs to view different contents.
temperature-converter
Temperature converter web app using HTML, CSS, and JS to convert Celsius, Fahrenheit, and Kelvin values. Provides real-time results as users input values. Simple and user-friendly interface.
video-trailer-popup
The popup contains a video trailer of the album and a close icon to exit the popup, using HTML, CSS, and JavaScript.
weight-converter
This project is a weight converter calculator that converts pounds to kilograms. It shows an error message for invalid inputs and is a handy tool for quick weight conversions!