高雄前端社群 CSS 讀書會，建立 Sass 環境

8. nav {
ul {
margin: 0;
padding: 0;
list-style: none;
}
li { display: inline-block; }
a {
display: block;
padding: 6px 12px;
text-decoration: none;
}
}
nav ul {
margin: 0;
padding: 0;
list-style: none;
}
nav li {
display: inline-block;
}
nav a {
display: block;
padding: 6px 12px;
text-decoration: none;
}
>

9. .container { width: 100%; }
article[role="main"] {
float: left;
width: 600px / 960px * 100%;
}
aside[role="complimentary"] {
float: right;
width: 300px / 960px * 100%;
}
.container {
width: 100%;
}
article[role="main"] {
float: left;
width: 62.5%;
}
aside[role="complimentary"] {
float: right;
width: 31.25%;
}
>

14. Adobe Creative Cloud

32. <%= contents %>
<%= title %>

33.
<%- contents %>
<%- include %>

34. ---
title:
layout: ./source/layout.ejs
engine: ejs
---
<p> </p>
<div>
<%- contents %>
</div>
<div>
<p> </p>
</div>

35. <p> </p>
<div>
<%- include part %>
</div>
<div>
<p> </p>
</div>

36. ---
title:
layout: ./source/layout.ejs
engine: ejs
---
<title><%= title %></title>
<title> </title>

39. /*
* public
*/
others: [
'**/*.html',
'**/*.ejs',
'**/*.scss',
'**/*.sass',
'**/*.css'
],

40. /*
*
*/
paths: {
//
'source': './source/',
'sass': './source/stylesheets/',
'img': './source/images/',
//
'sass_output': 'stylesheets/',
'public': './public/',
},

41. /*
* CSS, PostCSS, Sass
* PostCSS autoprefixer
*/
postcss: {
'enabled': true, // PostCSS
'output_name': 'all.css', // CSS
'output_folder': 'css' // CSS
},
sass: {
'output_style': 'compressed'
// sass 'nested',
'expanded', 'compact', 'compressed'
}