andros/pattern-7-1-lite-with-split-media
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
a85b9d4854
pattern-7-1-lite-with-split.../README.md
Andros Fenollosa a85b9d4854
Create README.md
2022-12-15 13:41:47 +01:00

1.2 KiB
Raw Blame History

Pattern Template 7-1 Lite version with Split Media

An extraordinarily neat architecture that any Web Designer can understand at a glance. Structure with the help of SASS and media queries.

sass/                    
|
|– mobile/             
|   |– _header.sass          
|   |– _footer.sass                       
|   |– pages/                
|   |   |– _home.sass        
|   |   |– _contact.sass     
|   |   ... 
|– desktop/             
|   |– _header.sass          
|   |– _footer.sass                       
|   |– pages/                
|   |   |– _home.sass        
|   |   |– _contact.sass     
|   |   ... 
|– _base.sass                    
|– _mixins.sass          
|– _typography.sass      
|– _variables.sass                          
|– vendors/              
|   |– _bootstrap.sass   
|   |– _jquery-ui.sass   
|   ...                  
`– mobile.sass      
`– desktop.sass

Compile SASS.

Install

yarn global add node-sass

Run

node-sass --output-style compressed sass/mobile.sass css/mobile.css
node-sass --output-style compressed sass/desktop.sass css/desktop.css