ma7moudal3raby/kaf

Kaf Website Task

This repository contains the source code for a website built using HTML, CSS, and JavaScript (with jQuery). The website offers several features aimed at enhancing user experience and interaction.

Features

• Light Mode & Dark Mode: The website supports both light and dark modes, allowing users to choose their preferred theme, you can switch modes from the dropdown menu shown by clicking on the user avatar image.

• Responsive Design: The website is designed to be responsive, ensuring optimal viewing and interaction across various devices and screen sizes.

• Sidebar Menu: A SideBar menu is implemented to offer a smooth and organized navigation experience in mobile View.

• Translation: Content on the website is translated into Arabic and English languages, ensuring accessibility for users worldwide.

• Rating: Users can add a rate, providing feedback and insights.

• Services Select: The user can Select all or some services.

• Review Submission: Users have the option to submit reviews, just fill in the comment text and click post review

• Clickable Like Icons: Like icons throughout the website are clickable, providing users with a convenient way to express their preferences.

• Review: Rate in comment calculated based on selected 3 rates

• Copy Button: The user can copy the page URL by clicking on the copy icon at the share widget

• Validation: The user must insert a value to the comment field and set all rates before submitting

Repository Structure

index.html: The main HTML file containing the structure of the website.

• ar-index.html: the translated page of Kaf in Arabic Language.
• app.css: The CSS file containing the styles for the website's layout and design.
• app.js: The JavaScript file containing the scripts for implementing interactive features and functionality with jQuery.
• assets: the assets folder contains all images and SVG icons that exported from Figma

Usage:

you can visit this link: https://kaf.alaraby.dev/