https://github.com/pktcodes/tea-station-html-css-project
Tea Station Project using HTML and CSS
https://github.com/pktcodes/tea-station-html-css-project
css3 font-awesome formspree git google-fonts html5 javascript pexels
Last synced: 2 months ago
JSON representation
Tea Station Project using HTML and CSS
- Host: GitHub
- URL: https://github.com/pktcodes/tea-station-html-css-project
- Owner: pktcodes
- Created: 2022-11-16T04:42:42.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2022-12-05T06:28:23.000Z (over 3 years ago)
- Last Synced: 2025-01-05T07:24:29.375Z (over 1 year ago)
- Topics: css3, font-awesome, formspree, git, google-fonts, html5, javascript, pexels
- Language: SCSS
- Homepage: https://html-css-tea-station-prod.netlify.app/
- Size: 3.39 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Tea Station 🍵
> PROD [Live] : https://html-css-tea-station-prod.netlify.app/
#### Tea Station consists of a straightforward user interface where there is a
- List of pages i.e. **Home** by default, **Skills**, **About**, **Products**.
- **Home** consists of the
- **NavButton** upon the click opens **Navbar** that has the links to navigate to other pages along with **`Close`** option.
- **Header** is the hero which has the headings, background image and an **`Explore`** on click navigates to *Skills* page.
- **Skills** has been implemented into columns using *float* tells about features and benefits of the products.
- **About** will have about some information about the company and **`Learn More`** on click navigates to *About* page.
- **Products** shows some of the featured products along with an **`Inventory`** on click navigates to *Products* page.
- **Services** has been implemented in cards with some information that tell about the services provided along with an **`Read More`** for each service card.
- **Contact** will have the *Address*, *Email*, *Telephone* information and a form to fill in the details along with **`Submit Here`** which on click sends an email to the company.
- **Footer** has links to social media operated by company and copyright information.
- **NavButton**, **Navbar**, **Header**, **Footer** are implemented similarly across all pages.
- Icons are implemented using by **Font Awesome**, form functionality is handled by **Formspree**, images from **Pexels** and fonts using **Google Fonts**.
- To run the project locally, clone the repo, and open the `index.html` in the browser.
#### Languages
HTML5, CSS3, JavaScript
#### API
https://formspree.io/
#### Deployment / Hosting
Netlify
---
*Note: I have developed this project ~ [2] as part of HTML & CSS Tutorial and Projects Course(Flexbox&Grid) taught by John Smilga.*