https://github.com/top-submissions/foundations-landing-page
https://github.com/top-submissions/foundations-landing-page
foundations-path the-odin-project
Last synced: 11 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/top-submissions/foundations-landing-page
- Owner: top-submissions
- Created: 2025-06-26T02:56:51.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-07-01T03:23:52.000Z (12 months ago)
- Last Synced: 2026-04-03T13:54:15.485Z (2 months ago)
- Topics: foundations-path, the-odin-project
- Language: HTML
- Homepage:
- Size: 10.7 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# landing-page
### ☑️ Tasks:
1. Initialize project
- [x] Create assets directory
- [x] Touch files:
- index.html
- styles.css
- [x] Apply HTML boilerplate
- [x] Add title placeholder to index.html
2. Create Colors and Fonts in styles.css
- [x] body font
- [x] header-bg and footer-bg
- [x] main-text
- [x] secondary-text
- [x] logo-text
- [x] blue-button, cta
- [x] header-text
- [x] quote-background
- [x] quote-text
- [x] flex-row
- [x] flex-col
3. Structure webpage in index.html
- [x] header
- [x] header-logo
- [x] header-links
- [x] content
- [x] main-section
- [x] information-section
- [x] quote-section
- [x] footer
4. Apply properties on flex containers and flex items in the header
- [x] flex-flow
- [x] justify-content
- [x] align-items
- [x] gap
5. Apply properties on flex containers and flex items in main-section
- [x] flex-flow
- [x] justify-content
- [x] align-items
- [x] flex
- [x] gap
6. Apply properties on flex containers and flex items in info-section
- [x] flex-flow
- [x] justify-content
- [x] align-items
- [x] flex
- [x] gap
7. Apply properties on flex containers and flex items in quote-section
- [x] flex-flow
- [x] justify-content
- [x] align-items
- [x] flex
8. Apply properties on flex containers and flex items in CTA
- [x] flex-flow
- [x] justify-content
- [x] align-items
- [x] flex
- [x] gap
9. Apply styling properties to footer
- [x] flex-container properties
- [x] font styling
- [x] sizing and positioning
10. [x] Fix header stretching to the ends when zooming out