https://github.com/anhtungbui/apple-isass
A clone of Apple.com's landing page layout as of July 2020 to practice Sass language
https://github.com/anhtungbui/apple-isass
css frontend sass smacss
Last synced: 10 months ago
JSON representation
A clone of Apple.com's landing page layout as of July 2020 to practice Sass language
- Host: GitHub
- URL: https://github.com/anhtungbui/apple-isass
- Owner: anhtungbui
- Created: 2020-07-11T22:23:49.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2020-07-31T11:17:39.000Z (over 5 years ago)
- Last Synced: 2025-01-28T05:11:12.207Z (12 months ago)
- Topics: css, frontend, sass, smacss
- Language: CSS
- Homepage: https://anhtungbui.github.io/apple-iSass/
- Size: 1010 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# apple-iSass
## Live Demo
https://anhtungbui.github.io/apple-iSass/
A clone of Apple's landing page layout as of July 2020 to practice Sass language (Syntactically Awesome Style Sheets)
No copyright infringement intended
## Project Structure
The Sass organizing structure that we used was heavily based on SMACSS (Scalable and Modular Architecture for CSS) methodology
```
scss
┣ base
┃ ┣ _base.scss
┃ ┣ _mixins.scss
┃ ┗ _variables.scss
┣ layout
┃ ┗ _layout.scss
┣ module
┃ ┣ _covid.scss
┃ ┣ _featured-1.scss
┃ ┣ _featured-2.scss
┃ ┣ _footer-extras.scss
┃ ┣ _footer-nav.scss
┃ ┣ _footnotes.scss
┃ ┣ _hero.scss
┃ ┣ _navbar.scss
┃ ┣ _ribbon.scss
┃ ┣ _unit-1.scss
┃ ┣ _unit-2.scss
┃ ┣ _unit-3.scss
┃ ┣ _unit-4.scss
┃ ┣ _unit-5.scss
┃ ┗ _unit-6.scss
┗ main.scss
```
## Lessons learned
+ Sass in pratice
+ Combined SMACSS (Scalable and Modular Architecture for CSS) and SASS.
+ Github's workflow in a team
+ Clean coding
## Contributors
+ Anh Tung Bui (Team Lead)
+ Rasel Hasan
+ Mykhailo Riabokliach