Skip to content
Permalink
Browse files

Add gulp based contibuting structure

  • Loading branch information...
whmii committed Jun 26, 2015
1 parent a4ac7c4 commit ccc9aa85f0c13abf7809c0aa866f7bcaa0fbf747
Showing with 262 additions and 0 deletions.
  1. +2 −0 .gitignore
  2. +31 −0 Gulpfile.js
  3. +181 −0 contrib/index.html
  4. +14 −0 contrib/styles.scss
  5. +34 −0 package.json
@@ -4,3 +4,5 @@ _site
*gem
*swp
Gemfile.lock
contrib/*.css
node_modules
@@ -0,0 +1,31 @@
var gulp = require('gulp'),
autoprefix = require('gulp-autoprefixer'),
sass = require('gulp-sass'),
connect = require('gulp-connect'),
bourbon = require('node-bourbon').includePaths;

var paths = {
scss: './contrib/*.scss'
};

gulp.task('sass', function () {
return gulp.src(paths.scss)
.pipe(sass({
includePaths: ['styles'].concat(bourbon)
}))
.pipe(autoprefix('last 2 versions'))
.pipe(gulp.dest('./contrib'))
.pipe(connect.reload());
});

gulp.task('connect', function() {
connect.server({
root: 'contrib',
port: 8000,
livereload: true
});
});

gulp.task('default', ['sass', 'connect'], function() {
gulp.watch(paths.scss, ['sass']);
});
@@ -0,0 +1,181 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Have fun ♥️</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<h1>
Hey there! Thanks for contributing to
<a href="http://bitters.bourbon.io">Bitters</a>
</h1>
</header>
<main>
<p>
The purpose of this HTML is to help contibutors test and develop
Bitters styles and default settings.
</p>
<hr>
<h1 id="headings">Headings</h1>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
<hr>
<h1 id="paragraph">Paragraph</h1>
<p>
Lorem ipsum dolor sit amet, <a href="#" title="test link">test link</a>
adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec
faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero
nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent
mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu
volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus
eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem,
consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue
quis tellus.
</p>
<p>
Lorem ipsum dolor sit amet, <em>emphasis</em> consectetuer adipiscing
elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus.
Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi,
imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis,
massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim
diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien
fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at,
commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.
</p>
<hr>
<h1 id="list_types">List Types</h1>
<h3>Definition List</h3>
<dl>
<dt>Definition List Title</dt>
<dd>This is a definition list division.</dd>
</dl>
<h3>Ordered List</h3>
<ol>
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
</ol>
<h3>Unordered List</h3>
<ul>
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
</ul>
<h3>%default-ol Ordered List</h3>
<ol>
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
</ol>
<h3>%default-ul Unordered List</h3>
<ul>
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
</ul>
<hr>
<h1 id="form_elements">Fieldsets and Form Elements</h1>
<fieldset>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam
dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis
suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at,
tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis
luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget
metus.
</p>
<form>
<h2>Form Element</h2>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam
dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc
iaculis suscipit dui.
</p>
<p><label for="text_field">Text Field:</label>
<input type="text" id="text_field" /></p>
<p><label for="text_area">Text Area:</label>
<textarea id="text_area"></textarea></p>
<p>
<label for="select_element">Select Element:</label>
<select name="select_element">
<optgroup label="Option Group 1">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</optgroup>
<optgroup label="Option Group 2">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</optgroup>
</select>
</p>
<p><label for="radio_buttons">Radio Buttons:</label>
<label>
<input type="radio" name="radio_button" value="radio_1"/>
Radio 1
</label>
<label>
<input type="radio" name="radio_button" value="radio_2"/>
Radio 2
</label>
<label>
<input type="radio" name="radio_button" value="radio_3"/>
Radio 3
</label>
</p>
<p><label for="checkboxes">Checkboxes:</label>
<label>
<input type="checkbox" name="checkboxes" value="check_1"/>
Checkbox 1
</label>
<label>
<input type="checkbox" name="checkboxes" value="check_2"/>
Checkbox 2
</label>
<label>
<input type="checkbox" name="checkboxes" value="check_3"/>
Checkbox 3
</label>
</p>
<p>
<label for="password">Password:</label>
<input type="password" name="password"/>
</p>
<p>
<label for="file">File Input:</label>
<input type="file" name="file"/>
</p>
<p>
<input type="submit" value="Submit"/>
</p>
</form>
</fieldset>
<hr>
<h1 id="tables">Tables</h1>
<table cellspacing="0" cellpadding="0">
<tr>
<th>Table Header 1</th><th>Table Header 2</th><th>Table Header 3</th>
</tr>
<tr>
<td>Division 1</td><td>Division 2</td><td>Division 3</td>
</tr>
<tr>
<td>Division 1</td><td>Division 2</td><td>Division 3</td>
</tr>
<tr>
<td>Division 1</td><td>Division 2</td><td>Division 3</td>
</tr>
</table>
</div>
</main>
</body>
</html>
@@ -0,0 +1,14 @@
@import "bourbon";

@import "../app/assets/stylesheets/base";

body {
margin: auto;
max-width: 50em;
padding: 1em;
}

header,
footer {
text-align: center;
}
@@ -0,0 +1,34 @@
{
"name": "Bitters",
"version": "1.0.0",
"description": "Scaffold styles, variables and structure for Bourbon projects.",
"main": "Gulpfile.js",
"repository": {
"type": "git",
"url": "https://github.com/thoughtbot/bitters.git"
},
"keywords": [
"bourbon",
"css",
"sass",
"scss"
],
"author": {
"name": "thoughtbot",
"url": "http://thoughtbot.com"
},
"license": "MIT",
"bugs": {
"url": "https://github.com/thoughtbot/bitters/issues"
},
"homepage": "http://bitters.bourbon.io",
"dependencies": {
"bourbon": "^4.2.3",
"gulp": "^3.8.11",
"gulp-autoprefixer": "^2.3.1",
"gulp-concat": "^2.6.0",
"gulp-connect": "^2.2.0",
"gulp-sass": "^2.0.2",
"node-bourbon": "^4.2.3"
}
}

0 comments on commit ccc9aa8

Please sign in to comment.
You can’t perform that action at this time.