Beautiful_Arts is a stunning art gallery website built using HTML and Bootstrap. This project showcases a collection of beautiful artworks from diverse artists around the world. It features a responsive design, easy navigation, and a modern aesthetic that appeals to both art enthusiasts and casual visitors.
- Responsive Design: Works seamlessly on all devices.
- Bootstrap Integration: Utilizes Bootstrap 5.3 for a modern and clean look.
- Easy Navigation: Intuitive navigation bar with dropdown menus.
- Gallery Section: Displays a collection of artworks with a carousel.
- Contact Page: Includes a contact form for inquiries and sponsorship requests.
- Sponsorship Page: Details how to sponsor the gallery.
- About Page: Provides information about the gallery and its mission.
- Art enthusiasts
- Artists looking to showcase their work
- Web developers interested in Bootstrap and HTML projects
- 🌟 Responsive Design: Ensures the gallery looks great on all devices.
- 🎨 Artwork Display: Showcases a collection of beautiful artworks.
- 📞 Contact Form: Allows visitors to get in touch with the gallery.
- 💰 Sponsorship Information: Details how to support the gallery.
- 📝 About Page: Provides information about the gallery and its mission.
- Programming Language: HTML
- Frameworks and Libraries:
- Bootstrap 5.3
- Sass for CSS pre-processing
- System Requirements:
- A modern web browser
- Node.js and npm for development (optional)
- Node.js and npm (optional, for development)
-
Clone the repository:
git clone https://github.com/7ever/Beautiful_Arts.git cd Beautiful_Arts -
Install dependencies (optional, for development):
npm install
-
Build the project (optional, for development):
npm run build
-
Open
index.htmlin your browser to view the gallery.
- Docker: (if applicable)
- Package Managers: (if applicable)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Beautiful_Arts</title>
<link rel="stylesheet" href="assets/style/css/mainmin.css">
<link rel="shortcut icon" href="assets/svg/logo.svg" type="image/x-icon">
</head>
<body>
<!-- Your HTML content here -->
</body>
</html>- Customization: Modify the
sass/main.scssfile to change the styles. - Adding New Artworks: Add new images to the
gallery.htmlfile and update the carousel.
Beautiful_Arts/
├── assets/
│ ├── js/
│ │ └── gallery.js
│ ├── style/
│ │ └── css/
│ │ └── mainmin.css
│ ├── svg/
│ │ ├── contact.svg
│ │ ├── insta.svg
│ │ ├── linkedin.svg
│ │ ├── logo.svg
│ │ ├── nextBtn.svg
│ │ ├── pin.svg
│ │ ├── prevBtn.svg
│ │ ├── tiktok.svg
│ │ ├── time.svg
│ │ └── x.svg
├── index.html
├── about.html
├── contact.html
├── gallery.html
├── sponsorship.html
├── .gitignore
├── package.json
├── package-lock.json
└── README.md
- Environment Variables: None
- Configuration Files:
sass/main.scssfor custom styles - Customization Options: Modify the
sass/main.scssfile to change the styles.
- Fork the repository
- Create a new branch (
git checkout -b feature/your-feature) - Commit your changes (
git commit -am 'Add some feature') - Push to the branch (
git push origin feature/your-feature) - Create a new Pull Request
This project is licensed under the ISC License - see the LICENSE file for details.
- Joseph Ridge X 7ever - Initial work
- Contributors: (add contributors here)
- Report issues on the GitHub Issues page
- For support, please contact the maintainers at your-email@example.com
- Planned Features:
- Add more artwork categories
- Implement user authentication
- Improve SEO
- Known Issues:
- (list known issues here)
- Future Improvements:
- Add more interactive features
- Improve performance
Additional Guidelines:
- Use modern markdown features (badges, collapsible sections, etc.)
- Include practical, working code examples
- Make it visually appealing with appropriate emojis
- Ensure all code snippets are syntactically correct for HTML
- Include relevant badges (build status, version, license, etc.)
- Make installation instructions copy-pasteable
- Focus on clarity and developer experience