prechydev/ighub-group1-konga

A recreation of Konga's landing page

Recreating Konga website

Group 1 Section

About Project Group 1 is expected to recreate the above section of Konga's homepage using the following technologies

• HTML

• CSS

• Bootstrap Framework

The project is to be responsive.

Getting Started

Prerequisite

1. You need to have git installed on your system

2. Be familiar with HTML and CSS

3. Do some research on bootstrap.

Installation

The most official build is available for download on the Git website.

Just go to https://git-scm.com/download/win and the download will start automatically.

Contributing

To contribute to the project,

1. Fork the repo by clicking on the fork sign on the top of this page.

2. Clone your fork of the repo by clicking on the green button you'll see in your fork. copy the url. Navigate to the directory you want to place the file, open your git bash and type in git clone url_you_copied. This should provide a local copy of this repo on yoyur device.

3. Make changes in your local branch (repo) using your VS code or any editor you make use of.

4. Checkout to a new branch. This is to avoid making changes to the master branch. Navigate to the cloned repo and checkout to a new branch. Type in git checkout -b BRANCH_NAME on git to do this. Branch_name can be the name of the section you worked on.

5. Commit your changes by staging them using git add . The space and the fullstop is needed. Commit by typing git commit -m "DESCRIPTION OF CHANGES".

6. Push your commits. When you are done making all of your changes, upload these changes to your fork using git push origin BRANCH_NAME. This would push them to the branchname in your forked repo.

7. Make a pull request. Return to your fork on GitHub, and refresh the page. You may see a highlighted area that displays your recently pushed branch Click the green Compare & pull request button to begin the pull request.

More info on how to contribute can be found here and easy steps here.

Further enquiry can be made on the WhatsApp group or slack workspace

Description

The project is made up of mostly images which can be found in the images folder of this repo.

Images with name 'up' refer to the first set of logos, 'down' refers to the last 6 six logos, 'konga' is the main logo found at the left hand side of the navbar, 'carousel' refers to the sliding images while 'ads' refers to the images beside the carousel.

The body has a background color of #f6f6f6

The top is a container of 5 logos with background color same with that of the body

The first section of the navbar has a background color of #ed017f and also contains the konga logo. The links have a transitional hover effect from background color #ed017f to #f170b5 then to #f6f6f6 with text color changing from the initial #fff to #f170b5

The 2nd section of the navbar contains links to various sections of the pages and has background color #94004f. The links have a transitional hover effect from background color #ed017f to #f170b5 then to #f6f6f6 with text color changing from the initial #fff to #040304. Also hovering on each link would take you to a section of the page.

The images have a border radius of 5px and are to be placed in anchor tags .

The down logos are placed in divs with background color #fff and border radius 5px.