Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/smerth/foundation-64-playground
Foundation 6.4 sandbox hosted on surge.sh
https://github.com/smerth/foundation-64-playground
css foundation html javascript mixitup panini
Last synced: about 1 month ago
JSON representation
Foundation 6.4 sandbox hosted on surge.sh
- Host: GitHub
- URL: https://github.com/smerth/foundation-64-playground
- Owner: smerth
- Created: 2018-02-21T22:29:45.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2023-01-04T03:45:32.000Z (almost 2 years ago)
- Last Synced: 2024-04-15T00:13:17.020Z (8 months ago)
- Topics: css, foundation, html, javascript, mixitup, panini
- Language: HTML
- Homepage: http://jealous-business.surge.sh
- Size: 2.25 MB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 14
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# Foundation 6.4 Sandbox
This project is just a sandbox to play around in and work out how to implement various features of foundation 6.4, how to integrate some javascript libraries and structure layouts, etc...
Click through the demo site to see something interesting.
The markup for each page should be displayed on each page at the bottom so can see how the page is composed.
![App Screenshot](https://raw.githubusercontent.com/smerth/foundation-64-playground/master/screenshot.png)
## ZURB Template
[This is the official ZURB Template for use with [Foundation for Sites](http://foundation.zurb.com/sites). We use this template at ZURB to deliver static code to our clients. It has a Gulp-powered build system with these features:
- Handlebars HTML templates with Panini
- Sass compilation and prefixing
- JavaScript module bundling with webpack
- Built-in BrowserSync server
- For production builds:
- CSS compression
- JavaScript compression
- Image compression## Installation
To use this template, your computer needs:
- [NodeJS](https://nodejs.org/en/) (0.12 or greater)
- [Git](https://git-scm.com/)This template can be installed with the Foundation CLI, or downloaded and set up manually.
### Using the CLI
Install the Foundation CLI with this command:
```bash
npm install foundation-cli --global
```Use this command to set up a blank Foundation for Sites project with this template:
```bash
foundation new --framework sites --template zurb
```The CLI will prompt you to give your project a name. The template will be downloaded into a folder with this name.
Now `cd` to your project name and to start your project run
```bash
foundation watch
```### Manual Setup
To manually set up the template, first download it with Git:
```bash
git clone https://github.com/zurb/foundation-zurb-template projectname
```Then open the folder in your command line, and install the needed dependencies:
```bash
cd projectname
npm install
```Finally, run `npm start` to run Gulp. Your finished site will be created in a folder called `dist`, viewable at this URL:
```
http://localhost:8000
```To create compressed, production-ready assets, run `npm run build`.