https://github.com/brunortech/off-platform-project-dasmotos-arts-and-crafts
A simple multi-section webpage built with HTML and CSS as part of a Codecademy project. Demonstrates basic structure, semantic tags, and introductory styling using fonts, images, and color-coded layout blocks.
https://github.com/brunortech/off-platform-project-dasmotos-arts-and-crafts
arts-and-crafts beginner-project codecademy css html responsive-design static-website web-development
Last synced: 21 days ago
JSON representation
A simple multi-section webpage built with HTML and CSS as part of a Codecademy project. Demonstrates basic structure, semantic tags, and introductory styling using fonts, images, and color-coded layout blocks.
- Host: GitHub
- URL: https://github.com/brunortech/off-platform-project-dasmotos-arts-and-crafts
- Owner: BrunoRTech
- Created: 2025-04-22T14:40:12.000Z (25 days ago)
- Default Branch: main
- Last Pushed: 2025-04-22T15:09:16.000Z (25 days ago)
- Last Synced: 2025-04-27T00:51:25.007Z (21 days ago)
- Topics: arts-and-crafts, beginner-project, codecademy, css, html, responsive-design, static-website, web-development
- Language: HTML
- Homepage:
- Size: 3.18 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Dasmoto's Arts & Crafts
This project is a simple static website built with HTML and CSS, created using the guide provided by [Codecademy](https://www.codecademy.com/journeys/full-stack-engineer/paths/fscj-22-web-development-foundations/tracks/fscj-22-html-and-css/modules/wdcp-22-css-box-model/project/off-platform-project-dasmotos).
It serves as an example of how to structure and style a basic multi-section page for a fictional arts and crafts store called **Dasmoto's Arts & Crafts**.
## Features
- **Hero Header**: Large, eye-catching store title styled with a background image.
- **Color-Coded Sections**: Each product category (Brushes, Frames, Paint) is styled with a unique background color.
- **Styled Text**: Section headings and prices use custom fonts, weights, and colors.
- **Inline Product Display**: Each product is represented with an image, description, and price.
- **Simple Responsive Base**: Basic layout renders cleanly on different screen sizes.
## File Structure
- `index.html`: Contains the structure and content of the arts & crafts page.
- `styles.css`: Defines styling rules for layout, typography, and section formatting.
- `hacksaw.jpeg`, `frames.jpeg`, `finnish.jpeg`, `pattern.jpeg`: Images used in the webpage.
## Usage
To view the project:
1. Download or clone the repository.
2. Open the `index.html` file in any web browser.
## Customization
If you’d like to modify this page:
- Update the `index.html` to add new products or edit existing descriptions.
- Modify `styles.css` to change colors, fonts, or layout.
- Swap out the image files for your own assets.
## Acknowledgment
This project was built using the guide provided by Codecademy. The original project can be found [here](https://www.codecademy.com/journeys/full-stack-engineer/paths/fscj-22-web-development-foundations/tracks/fscj-22-html-and-css/modules/wdcp-22-css-box-model/project/off-platform-project-dasmotos).