Skip to content
This repository has been archived by the owner on Jan 16, 2018. It is now read-only.

Commit

Permalink
Merge 5531d08 into ec472f6
Browse files Browse the repository at this point in the history
  • Loading branch information
jbalsas committed Jan 15, 2018
2 parents ec472f6 + 5531d08 commit 3205b5b
Show file tree
Hide file tree
Showing 975 changed files with 208,379 additions and 123 deletions.
7 changes: 7 additions & 0 deletions packages/clay/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
node_modules
release
lexicon*.zip
clay*.zip
bower_components
maven-dist
temp
2,547 changes: 2,547 additions & 0 deletions packages/clay/CHANGELOG.md

Large diffs are not rendered by default.

93 changes: 93 additions & 0 deletions packages/clay/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
## Notice: 2.0.0-beta Release

> This project is under active development, we recommended not using beta
releases in your project.

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
### Jump to Section

- [About](#about)
- [Building](#building)
- [Clone the repo](#clone-the-repo)
- [Install Node.js and NPM](#install-nodejs-and-npm)
- [Install the NPM modules](#install-the-npm-modules)
- [Modify files in src/](#modify-files-in-src)
- [Build the static files](#build-the-static-files)
- [View the files](#view-the-files)
- [File Heading Options](#file-heading-options)
- [Available Build Tasks](#available-build-tasks)
- [Changelog](#changelog)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## About
Clay is Liferay's web implementation of the Lexicon Design Language. It is built with HTML, CSS, and Javascript with [Bootstrap](http://getbootstrap.com) as a foundation.

You can view the various components on [the Clay site](http://claycss.com).

<!-- TODO: provide link to Lexicon site for documentation on design patterns -->

## Building
If you would like to contribute, or make changes on your system you need to do the following:

### Clone the repo
Clone the repo to your computer

### Install Node.js (v4.6.0 LTS) and NPM
If you don't already have it installed. You can find more info here: http://nodejs.org/
Node and NPM come bundled together, so you only need to install one package.

### Install the NPM modules
Run `npm install` inside of the `clay` directory

### Modify files in src/
The files are generated from the `src/` directory, however, most of the files you'd be interested in changing are in `src/content/`. Files can be either HTML (`.html`) or Markdown (`.md`).
Every file in `src/content/` has a heading at the top in YAML format that looks something like:


---
title: Title of the Page
---

This section has a couple of options that can be leveraged for different purposes. Those will be covered below.

### Build the static files
Run `gulp build` to generate the static files.

### View the files
The generated files are placed into the `build/` directory.
Sass files in the `.scss` format are generated to CSS, Markdown files with the extension of `.md` are generated to HTML, and HTML files have one bit of processing applied, which is that HTML inside of triple ticks is escaped, like so:

```
<div>Foo</div>
```

### File Heading Options
There are a couple of properties you can add to the headings of files, only one of which is required:

`title:`: **(Required)** This is used for the title of the page in the heading and in the navigation sidebar

`navIndex:`: The navigation is sorted alphabetically by default, but if you pass a `navIndex:` property, it will manually sort the item into that position.
The property is any number, with `0` as the first position, but you can also pass in a keyword of `last` to force an item to the end.

`section:`: If you want to group multiple files into sections, in each of those files, pass the same title to the `section:` property. That title will be used for the section heading, and the files will be sorted in there. The `navIndex:` property works inside of sections as well.

### Available Build Tasks
You can pass these options when running `gulp`.

`build`: This is the default task, so running just `gulp` will fire off the build task.
This will generate all of the HTML/CSS/etc into the `build/` directory.

`watch`: Because running a script after every change can get tedious, run `gulp watch` to rebuild the files automatically as you change files.

`serve`: Starts a local server on port 3000 and also runs the watch task.

`release`: This task will create a zip file located in the root of the repo with the version number located in the package.json.
We use this to deploy into Liferay.

`toc`: If you add a section to the README file, running `gulp toc` will generate a new table of contents.

## Changelog

You can view the [full changelog here](CHANGELOG.md).
38 changes: 38 additions & 0 deletions packages/clay/bower.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
{
"name": "claycss",
"main": "release/scss/atlas.scss",
"homepage": "http://claycss.com",
"authors": [
"Nate Cavanaugh",
"Patrick Yeo"
],
"license": "MIT",
"ignore": [
"**/*",
"!release/**/*",
"!package.json",
"!CHANGELOG.md",
"!README.md"
],
"dependencies": {
"bootstrap-sass": "~3.3.5",
"svg4everybody": "~2.0.0"
},
"overrides": {
"bootstrap-sass": {
"main": [
"*/**/_bootstrap.scss",
"*/**/bootstrap/*.scss"
],
"normalize": {
"js": "*/**/*.js",
"css": [
"*/**/*.css"
],
"scss": [
"*/**/*.scss"
]
}
}
}
}
Loading

0 comments on commit 3205b5b

Please sign in to comment.