@servicensw/grid v3.0.0
@servicensw/grid
Service NSW package documentation and examples (Login credentials required)
Installation
npm install @servicensw/grid --save-dev
How to use
CSS
- PostCSS workflow:
@import '@servicensw/grid';
- Sass/Eyeglass:
@import 'servicensw-grid';
- Native CSS:
@import url('dist/grid.css');
- Link tag:
<link href="dist/grid.css" rel="stylesheet" type="text/css">
HTML
<div class="container">
<div class="grid">
<div class="grid__col grid--6-col"></div>
<div class="grid__col grid--6-col"></div>
</div>
<div class="grid">
<div class="grid__col grid--4-col"></div>
<div class="grid__col grid--8-col"></div>
</div>
<div class="grid">
<div class="grid__col grid--3-col"></div>
<div class="grid__col grid--9-col"></div>
</div>
<div class="grid">
<div class="grid__col grid--4-col"></div>
<div class="grid__col grid--4-col"></div>
<div class="grid__col grid--4-col"></div>
</div>
<div class="grid">
<div class="grid__col grid--3-col"></div>
<div class="grid__col grid--3-col"></div>
<div class="grid__col grid--3-col"></div>
<div class="grid__col grid--3-col"></div>
</div>
<div class="grid">
<div class="grid__col grid--6-col"></div>
<div class="grid__col grid--3-col"></div>
<div class="grid__col grid--3-col"></div>
</div>
<div class="grid">
<div class="grid__col grid--3-col"></div>
<div class="grid__col grid--6-col"></div>
<div class="grid__col grid--3-col"></div>
</div>
</div>
Developer notes
.container
element provides correct max-width
to match Service NSW branding.
Change log
18 days ago
22 days ago
22 days ago
23 days ago
23 days ago
24 days ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
4 months ago
5 months ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago