adamalston.com · 
The second iteration of adamalston.com built with React and hosted with Netlify.
Previous iteration: v1
This website's design is both simple and accessible. Dynamic particles create an experience that is interactive and visually inviting. The site offers two themes via a toggle, dark mode (default) and light mode. Once toggled, the selected theme should persist between tabs, windows, and page reloads.
Mobile support for the site ranges from 4 in. displays through 6.7 in. all the way up to 13 in. tablets.
Open Source
I made this website open source under the assumption that others would use the code to create their own websites. I only ask that this code be used with attribution as a significant amount of time was spent writing and optimizing it. Please give proper credit by linking back to adamalston.com. Thanks!
Installation & Setup
- Clone this repository
- Install packages/dependencies:
npm install - Start the development server:
npm start - Feel free to change anything like icons or particle colors
Building & Deployment
- Create a production build of the website:
npm run build - The React/Deployment docs detail how to deploy to
gh-pages, Netlify, and many other services
Icons
Font Awesome Icons
| Use | Icon | Short-Code |
|---|---|---|
| Dark Mode | fas moon |
|
| Light Mode | fas sun |
|
| GitHub | fab github |
|
fab linkedin |
||
| Resume | fas file-alt |
|
fas paper-plane |
Color Reference
Text and icons have a color contrast ratio greater than 7:1 satisfying WCAG 2.1 Section 1.4.6
| Name | Color | Hex |
|---|---|---|
| Black | 000000 |
|
| Slate | 333333 |
|
| Red | FF2600 |
|
| Orange | FF8000 |
|
| Yellow | FFD500 |
|
| Green | 22DD22 |
|
| Blue | 00BFFF |
|
| Purple | C912ED |
|
| Silver | CCCCCC |
|
| White | FFFFFF |
Themes
Themes have their own branch
Current themes include fireworks, snow, and holidays - more will be added soon
If you found this project useful, please consider giving it a ! If you have any questions or feedback, open an issue and I will get back to you :​)
