Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/inglorious-ratbastard/the-bonsall-project
The Bonsall Project | @the-bonsall-project | Material Design concept with GSAP animation
https://github.com/inglorious-ratbastard/the-bonsall-project
css greensock gsap-library hacktoberfest hacktoberfest-accepted html javascript material-design p5js
Last synced: about 2 months ago
JSON representation
The Bonsall Project | @the-bonsall-project | Material Design concept with GSAP animation
- Host: GitHub
- URL: https://github.com/inglorious-ratbastard/the-bonsall-project
- Owner: inglorious-ratbastard
- Created: 2021-09-20T04:40:44.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2024-04-01T05:13:01.000Z (9 months ago)
- Last Synced: 2024-05-07T11:51:13.965Z (8 months ago)
- Topics: css, greensock, gsap-library, hacktoberfest, hacktoberfest-accepted, html, javascript, material-design, p5js
- Language: HTML
- Homepage: https://inglorious-ratbastard.github.io/The-Bonsall-Project/
- Size: 112 KB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
Awesome Lists containing this project
README
## The-Bonsall-Project
#### *@the-bonsall-project*
##### Suicide Prevention and Depression Awareness Website
#### Material Design concept with GSAP animation
![HTML](https://img.shields.io/badge/HTML-239120?style=for-the-badge&logo=html5&logoColor=white)
![CSS](https://img.shields.io/badge/CSS-239120?&style=for-the-badge&logo=css3&logoColor=white)
![Javascript](https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)
![jQuery](https://img.shields.io/badge/jQuery-0769AD?style=for-the-badge&logo=jquery&logoColor=white)
![Green Sock](https://img.shields.io/badge/green%20sock-88CE02?style=for-the-badge&logo=greensock&logoColor=white)
![p5js](https://img.shields.io/badge/p5.js-ED225D?style=for-the-badge&logo=p5.js&logoColor=FFFFFF)
##### Live Development Version:
https://inglorious-ratbastard.github.io/The-Bonsall-Project/
##### **About This Repo:**
The original concept was to build something modern and flashy but not overdone to be submitted as part of a hackathon. It was left an incomplete template after discovering about the passing of a good friend. The project then became his namesake dedicated to depression awareness and suicide prevention.
##### In Memory of John Bridger Bonsall (1989 - 2019)
##### In Memory of Ethan Ryan Skipper (1997 - 2021)##### **Features:**
* Dynamic, fluid splash screen using the **GSAP** animation library
* **Material Design** pattern inspired layout aesthetic
* Interactive components tooled with the **P5js** processing library
* Ease of use/flow thru smooth scrolling and animation transitions
##### This site is build solely using HTML, CSS, and Javascript. No major frameworks have been used thus far.
The **Material Design** aesthetic was achieved by simply using Font Awesome and CSS styling.
___
##### **Open Source and Contributing:**
The Bonsall Project was created by [Javier Yzaguirre](https://github.com/inglorious-ratbastard) and is considered free and open source to use as reference for those wanting to create their own webpage from it or contribute to this project. For guidelines on [Contributing](CONTRIBUTING.md) to this repo please refer to the documentation for further details.
___
##### **Reporting Bugs or Issues:**
If you would like to report a **Bug** or **Issue** in this repo feel free to do so under the **Issues** tab or contact me directly about any major concerns. Ideas for improvements or enhancements to this project are also encouraged. Please address these matters by sending a **Pull Request** as they will be reviewed for potential consideration.
##### Your contribution will be reviewed and considered for merge into Main or a separate branch.
Thank you for assisting in the development and/or advancement of this project.
___
##### **Resources:**
[Materialize CSS](https://materializecss.com/getting-started.html)
[Greensock Animation Library](https://greensock.com/docs/)
[p5*JS Creative Coding Library](https://p5js.org/reference/)
[jQuery](https://api.jquery.com/)
___