TalMizrahii / AP2-Ex1

The first project in AP2 course, Bar Ilan university.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool


HTML
Advanced-Programming-2

This GitHub repository is for the first assignment given in Advanced Programming 2 course, Bar Ilan University.

DescriptionImplementationInstalling And ExecutingAuthors

Description

The project contains 3 web pages:

  1. Login page.
  2. regestration page.
  3. chat room page.

The log in page is a simple login page for Hat Chat, a chat application. This page allows existing users to log in to their accounts, and new users to navigate to the registration page.

The login page template includes a form with fields for username, password, display name, and profile picture. The template uses Bootstrap 5.3.0-alpha3 for styling and includes custom CSS to adjust the positioning and styling of certain elements.

The chat screen is divided into two sections; the left panel lists your chats, and the right panel displays the conversation. The chat screen is simple, clean, and easy to use, making it an ideal platform for personal and business communication.

Implementation

This login page is created using HTML and styled with CSS. It uses Bootstrap v5.3.0-alpha3 for the styling of the form and buttons. The login form contains two input fields for the user's username and password, respectively. When the user clicks the "Log In" button, they are redirected to the ChatScreen.html page. The registration page is accessible via the link at the bottom of the form.

The background of the page is a gradient animation created using CSS. The animation gives the page a dynamic and modern feel.

rm1

The registration page includes a registration form for new users and has a responsive design to ensure it looks great on all devices. This page uses Bootstrap CSS framework for the styling. The HTML structure for this page consists of a header, body and footer. The header contains the logo and the body contains the registration form. The footer contains a link to the login page and the copyright information.

rm2

The chat room contains a list of recent conversations, images of the contant and a date and time note about the last message made in this conveersation. The second part in the conversation is a the chat itself. It contains all messages in the conversation with the spesific contant. The image of the contant is located in the left upper part of the screen.

rm3

Installing And Executing

To clone and run this application, you'll need Git installed on your computer. From your command line:

# Clone this repository.
$ git clone https://github.com/TalMizrahii/AP2-Ex1

# Go into the repository.
$ cd AP2-Ex1

from here you can run any of the pages bellow:

  1. index.html
  2. ChatScreen.html
  3. RegistrationScreen.html

Authors

About

The first project in AP2 course, Bar Ilan university.


Languages

Language:HTML 81.8%Language:CSS 18.2%