https://github.com/michojekunle/wine-house
Wine House, A Fully Responsive Website with smooth horizontal scroll effect browsing its sections.
https://github.com/michojekunle/wine-house
css3 html javascript
Last synced: 3 months ago
JSON representation
Wine House, A Fully Responsive Website with smooth horizontal scroll effect browsing its sections.
- Host: GitHub
- URL: https://github.com/michojekunle/wine-house
- Owner: michojekunle
- Created: 2023-03-15T15:15:45.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2023-03-17T18:21:03.000Z (over 2 years ago)
- Last Synced: 2025-03-02T17:32:26.443Z (8 months ago)
- Topics: css3, html, javascript
- Language: CSS
- Homepage: https://wnh.netlify.app/
- Size: 11.6 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# WINE HOUSE
This is a CSS(Responsive Design) Challenge project.
## Table of contents
- [Overview](#overview)
- [The challenge](#the-challenge)
- [Screenshot](#screenshot)
- [Links](#links)
- [My process](#my-process)
- [Built with](#built-with)
- [What I learned](#what-i-learned)
- [Continued development](#continued-development)
- [Useful resources](#useful-resources)
- [Author](#author)
- [Acknowledgments](#acknowledgments)
## Overview
### The challenge
Users should be able to:
- View the optimal layout for the site depending on their device's screen size
- See hover states for all interactive elements on the page.
### Screenshot
### Links
- Solution URL: [https://github.com/michojekunle/wine-house/](https://github.com/michojekunle/wine-house/)
- Live Site URL: [https://wnh.netlify.app/](https://wnh.netlify.app/)
## My process
### Built with
- Semantic HTML5 markup
- CSS3
- Flexbox
- Desktop-first workflow
### What I learned
In the course of this Project as Interesting and Refreshing as it was, I grabbed a few Important concepts such as:
- Effectively Building Responsive websites and apps with vanilla css.
- Implementing A Smooth Horizontal scroll with Javascript wheel event.
### Continued development
```
Going forward, I'll be working on more animated, responsive, dynamic and interactive websites with vanilla CSS and other CSS & JS Libraries.
```
### Useful resources
- Javascript Wheel Event [Elements wheel event - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/wheel_event)
- If you want more help with writing markdown, I'd recommend checking out [The Markdown Guide](https://www.markdownguide.org/) to learn more.
## Author
- Github - [AMD](https://github.com/michojekunle)
- Twitter - [@MichaelOjekunl2](https://www.twitter.com/MichaelOjekunl2)
- LinkedIn - [Michael Ojekunle](https://www.linkedin.com/in/michael-ojekunle-651a8a232/)
## Acknowledgments
Special Credits to
- [Code and Create](https://youtube.com/@codeandcreate)