Boilerplate project for sites using UNDP Design System
- Grid system
- UNDP official web typefaces: ProximaNova and Söhne
- basic HTML elements styling:
- H1-6 headings
- Paragraph text & links
- Inline elements (abbr, blockuote, cite, code, mark, quotation)
- Image and Video default styling, including captions and credit
- Table
- served via jsDelivr CDN with <20ms latency
Inspired by ZURB Template
- Sass compilaton. Using DartSass library with source maps support.
- Javascript compilation. Transpiled with Babel, bundling is handled via Webpack
- Assets copying for distribution. Image compressed and optimized using imagemin
- Page compilation. Based on flat file compiler Panini using Handlebars template language
- Development mode with BrowserSync server, file watching and on the fly compilation
- Content decoupled from layout for easy translation via data files
- jQuery
- GSAP with ScrollTrigger and EasePack plugins - animations and transitions
- Swiper - carousels and sliders
Clone project repo locally To manually set up the template, first download it with Git:
git clone https://github.com/undp/design-system-starter-template projectname
cd projectname
Install dependencies
npm install
Run development server (at http://localhost:8000)
npm run start
When ready for publication build production ready assets (published to /docs directory)
npm run build
Don't forget to relink Git to your own repository:
git remote set-url origin <remote_url>