From 66911957d23e76a72a64d82e0dccd7642f6f7b20 Mon Sep 17 00:00:00 2001 From: garthdb Date: Fri, 2 Sep 2016 14:15:25 -0600 Subject: [PATCH 1/2] WIP getting resin updated --- README.md | 3 +- css/button.min.css | 1 - test/expected/button.css => css/index.css | 4 -- package.json | 50 ++++++++++++----------- src/button.css | 36 ---------------- src/index.css | 18 ++++++++ test/button.test.js | 33 ++++----------- css/button.css => test/expected/index.css | 6 +-- test/fixtures/button.css | 30 -------------- test/fixtures/index.css | 13 ++++++ test/perf/topcoat_button-base.test.html | 1 - 11 files changed, 69 insertions(+), 126 deletions(-) delete mode 100644 css/button.min.css rename test/expected/button.css => css/index.css (85%) delete mode 100644 src/button.css create mode 100644 src/index.css rename css/button.css => test/expected/index.css (85%) delete mode 100644 test/fixtures/button.css create mode 100644 test/fixtures/index.css delete mode 100644 test/perf/topcoat_button-base.test.html diff --git a/README.md b/README.md index 9d2b2d6..8569084 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,4 @@ -Button Base -=========== +# Topcoat Button Base This is the base for all Topcoat buttons. Look at the button file in src to see an example usage of the mixins. diff --git a/css/button.min.css b/css/button.min.css deleted file mode 100644 index 59188fb..0000000 --- a/css/button.min.css +++ /dev/null @@ -1 +0,0 @@ -.button{padding:0;margin:0;font:inherit;color:inherit;background:transparent;border:0}.button--quiet{background:transparent;border:1px solid transparent;box-shadow:none}.button{cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.button{-moz-box-sizing:border-box;box-sizing:border-box;background-clip:padding-box}.button{white-space:nowrap;overflow:hidden}.button{position:relative;display:inline-block;vertical-align:top}.button{text-overflow:ellipsis}.button--disabled{opacity:.3;cursor:default;pointer-events:none}.button{text-decoration:none} \ No newline at end of file diff --git a/test/expected/button.css b/css/index.css similarity index 85% rename from test/expected/button.css rename to css/index.css index 89aae0c..a8fcbac 100644 --- a/test/expected/button.css +++ b/css/index.css @@ -15,14 +15,10 @@ .button { cursor: default; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; user-select: none; } .button { - -moz-box-sizing: border-box; box-sizing: border-box; background-clip: padding-box; } diff --git a/package.json b/package.json index 06607c3..1cf4db5 100644 --- a/package.json +++ b/package.json @@ -1,43 +1,47 @@ { "name": "topcoat-button-base", - "version": "0.7.0", + "version": "0.10.2", "description": "Topcoat button base. Reset styles for buttons.", - "main": "index.html", - "style": "src/button.css", + "style": "src/", "directories": { - "test": "test", - "lib": "src", - "bin": "css" + "test": "test" }, "scripts": { - "test": "grunt test", - "prepublish": "grunt" + "test": "mocha test/", + "build": "postcss --use postcss-import --use postcss-inherit ./test/fixtures/index.css -o ./css/index.css", + "pretest": "npm run build" }, "repository": { "type": "git", - "url": "git://github.com/topcoat/button-base.git" + "url": "git://github.com/topcoat/topcoat.git" }, "keywords": [ "button", "css", "topcoat", "base", - "reset", - "adobe" + "reset" ], - "author": "@dam Kristofer Joseph", - "license": "Apache", - "devDependencies": { - "grunt": "~0.4.1", - "grunt-contrib-watch": "~0.4.4", - "grunt-contrib-cssmin": "~0.6.1", - "grunt-contrib-jade": "~0.7.0", - "grunt-contrib-clean": "~0.5.0", - "grunt-simple-mocha": "~0.4.0", - "grunt-rework": "0.0.5", - "grunt-topcoat": "~0.1.0" + "author": "Kristofer Joseph (http://kristoferjoseph.com/)", + "contributors": [ + "Garth Braithwaite (http://garthdb.com)", + "Andrei Oprea (http://andreio.net/)" + ], + "license": "Apache-2.0", + "bugs": { + "url": "https://github.com/topcoat/topcoat/issues" }, + "homepage": "http://topcoat.io", "dependencies": { - "topcoat-utils": "~0.3.0" + "topcoat-utils": "^0.4.1" + }, + "devDependencies": { + "autoprefixer": "^6.4.0", + "mocha": "^3.0.2", + "postcss": "^5.1.2", + "postcss-cli": "^2.5.2", + "postcss-css-variables": "^0.5.1", + "postcss-import": "^8.1.2", + "postcss-inherit": "^2.0.2" } } diff --git a/src/button.css b/src/button.css deleted file mode 100644 index 198f95e..0000000 --- a/src/button.css +++ /dev/null @@ -1,36 +0,0 @@ -/** -* -* Copyright 2012 Adobe Systems Inc.; -* -* Licensed under the Apache License, Version 2.0 (the "License"); -* you may not use this file except in compliance with the License. -* You may obtain a copy of the License at -* -* http://www.apache.org/licenses/LICENSE-2.0 -* -* Unless required by applicable law or agreed to in writing, software -* distributed under the License is distributed on an "AS IS" BASIS, -* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -* See the License for the specific language governing permissions and -* limitations under the License. -* -*/ -@import "topcoat-utils"; - -%button { - extend: %inline-block; - extend: %reset-box-model; - extend: %reset-base; - extend: %reset-cursor; - extend: %ellipsis; - text-decoration: none; -} - -%button--quiet { - extend: %reset-quiet; -} - -%button--disabled { - extend: %disabled; -} - diff --git a/src/index.css b/src/index.css new file mode 100644 index 0000000..ce5b546 --- /dev/null +++ b/src/index.css @@ -0,0 +1,18 @@ +@import "topcoat-utils"; + +%button { + extend: %inline-block; + extend: %reset-box-model; + extend: %reset-base; + extend: %reset-cursor; + extend: %ellipsis; + text-decoration: none; +} + +%button--quiet { + extend: %reset-quiet; +} + +%button--disabled { + extend: %disabled; +} diff --git a/test/button.test.js b/test/button.test.js index 8886bf0..58bc975 100644 --- a/test/button.test.js +++ b/test/button.test.js @@ -1,32 +1,17 @@ -/** - * - * Copyright 2012 Adobe Systems Inc.; - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * - */ +var assert = require('assert'); +var fs = require('fs'); -/*global require, describe, it*/ +function read(file) { + return fs.readFileSync(file, 'utf8'); +} -var grunt = require('grunt'), - assert = require('assert'); - -describe('button-base', function() { +describe('Topcoat Button Base', function() { 'use strict'; it('should create expected css file', function() { - var actual = grunt.file.read('css/button.css').trim(); - var expected = grunt.file.read('test/expected/button.css').trim(); + console.log(require('../package.json').name) + var actual = read('css/index.css').trim(); + var expected = read('test/expected/index.css').trim(); assert.equal(actual, expected, 'should generate correct css'); }); diff --git a/css/button.css b/test/expected/index.css similarity index 85% rename from css/button.css rename to test/expected/index.css index ec44e21..a8fcbac 100644 --- a/css/button.css +++ b/test/expected/index.css @@ -15,14 +15,10 @@ .button { cursor: default; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; user-select: none; } .button { - -moz-box-sizing: border-box; box-sizing: border-box; background-clip: padding-box; } @@ -50,4 +46,4 @@ .button { text-decoration: none; -} \ No newline at end of file +} diff --git a/test/fixtures/button.css b/test/fixtures/button.css deleted file mode 100644 index 2cb9e68..0000000 --- a/test/fixtures/button.css +++ /dev/null @@ -1,30 +0,0 @@ -/** -* -* Copyright 2012 Adobe Systems Inc.; -* -* Licensed under the Apache License, Version 2.0 (the "License"); -* you may not use this file except in compliance with the License. -* You may obtain a copy of the License at -* -* http://www.apache.org/licenses/LICENSE-2.0 -* -* Unless required by applicable law or agreed to in writing, software -* distributed under the License is distributed on an "AS IS" BASIS, -* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -* See the License for the specific language governing permissions and -* limitations under the License. -* -*/ -@import "./src/button.css"; - -.button { - extend: %button; -} - -.button--quiet { - extend: %button--quiet; -} - -.button--disabled { - extend: %button--disabled; -} diff --git a/test/fixtures/index.css b/test/fixtures/index.css new file mode 100644 index 0000000..b3a477d --- /dev/null +++ b/test/fixtures/index.css @@ -0,0 +1,13 @@ +@import "../../src/"; + +.button { + extend: %button; +} + +.button--quiet { + extend: %button--quiet; +} + +.button--disabled { + extend: %button--disabled; +} diff --git a/test/perf/topcoat_button-base.test.html b/test/perf/topcoat_button-base.test.html deleted file mode 100644 index 2f30769..0000000 --- a/test/perf/topcoat_button-base.test.html +++ /dev/null @@ -1 +0,0 @@ -Button \ No newline at end of file From c8ca321c3382d668d7d20fc2f91992bd6ab18913 Mon Sep 17 00:00:00 2001 From: garthdb Date: Fri, 2 Sep 2016 15:24:48 -0600 Subject: [PATCH 2/2] feat(Syntax): updated to new inherit syntax (i.e. @inherit ./button.css) * Updated new inherit syntax (atRule) * Added semantic-release * Enabled greenkeeper BREAKING CHANGE: Changed syntax to atRoot --- .cz-config.js | 20 ++++++ .npmignore | 2 + .travis.yml | 8 +-- Gruntfile.js | 71 ------------------- LICENSE | 3 +- .../expected/index.css => css/button-base.css | 3 + index.html | 13 ---- package.json | 29 +++++--- src/button-base.css | 18 +++++ src/index.css | 18 ----- test/button-base.expected.css | 52 ++++++++++++++ test/button-base.fixture.css | 11 +++ test/button-base.test.js | 16 +++++ test/button.test.js | 18 ----- test/fixtures/index.css | 13 ---- 15 files changed, 144 insertions(+), 151 deletions(-) create mode 100644 .cz-config.js create mode 100644 .npmignore delete mode 100644 Gruntfile.js rename test/expected/index.css => css/button-base.css (88%) delete mode 100644 index.html create mode 100644 src/button-base.css delete mode 100644 src/index.css create mode 100644 test/button-base.expected.css create mode 100644 test/button-base.fixture.css create mode 100644 test/button-base.test.js delete mode 100644 test/button.test.js delete mode 100644 test/fixtures/index.css diff --git a/.cz-config.js b/.cz-config.js new file mode 100644 index 0000000..7d9cfd4 --- /dev/null +++ b/.cz-config.js @@ -0,0 +1,20 @@ +'use strict'; + +module.exports = { + + types: [ + {value: 'feat', name: 'feat: A new feature'}, + {value: 'fix', name: 'fix: A bug fix'}, + {value: 'docs', name: 'docs: Documentation only changes'}, + {value: 'style', name: 'style: Changes that do not affect the meaning of the code\n (white-space, formatting, missing semi-colons, etc)'}, + {value: 'refactor', name: 'refactor: A code change that neither fixes a bug nor adds a feature'}, + {value: 'perf', name: 'perf: A code change that improves performance'}, + {value: 'test', name: 'test: Adding missing tests'}, + {value: 'chore', name: 'chore: Changes to the build process or auxiliary tools\n and libraries such as documentation generation'}, + {value: 'revert', name: 'revert: Revert to a commit'}, + {value: 'WIP', name: 'WIP: Work in progress'} + ], + + allowBreakingChanges: ['feat', 'fix', 'perf'] + +}; diff --git a/.npmignore b/.npmignore new file mode 100644 index 0000000..2c630f1 --- /dev/null +++ b/.npmignore @@ -0,0 +1,2 @@ +test +.* diff --git a/.travis.yml b/.travis.yml index afffc56..0760cfb 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,6 +1,4 @@ language: node_js -node_js: - - "0.8.23" -before_install: - - "npm install -g mocha" - - "npm install -g grunt-cli" \ No newline at end of file +node_js: "6" +after_success: + - npm run semantic-release diff --git a/Gruntfile.js b/Gruntfile.js deleted file mode 100644 index 21cd5a2..0000000 --- a/Gruntfile.js +++ /dev/null @@ -1,71 +0,0 @@ -/** - * - * Copyright 2012 Adobe Systems Inc.; - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * - */ - -/*global module:false*/ - -module.exports = function(grunt) { - - // Project configuration. - grunt.initConfig({ - - clean: { - release: ['css'] - }, - - topcoat: { - options: { - browsers: ['last 2 versions'] - }, - compile: { - files: [{ - src: 'test/fixtures/button.css', - dest: 'css/button.css' - } - ] - } - }, - - cssmin: { - minify: { - expand: true, - cwd: 'css', - src: ['*.css', '!*.min.css'], - dest: 'css', - ext: '.min.css' - }, - }, - - simplemocha: { - all: { - src: ['test/*.test.js'] - } - } - }); - - // These plugins provide necessary tasks. - grunt.loadNpmTasks('grunt-topcoat'); - grunt.loadNpmTasks('grunt-simple-mocha'); - grunt.loadNpmTasks('grunt-contrib-cssmin'); - grunt.loadNpmTasks('grunt-contrib-clean'); - - grunt.registerTask('default', ['clean', 'build', 'test', 'release']); - grunt.registerTask('build', ['topcoat']); - grunt.registerTask('test', ['simplemocha']); - grunt.registerTask('release', ['cssmin']); - -}; diff --git a/LICENSE b/LICENSE index 242fd8a..d645695 100644 --- a/LICENSE +++ b/LICENSE @@ -1,4 +1,3 @@ -Copyright (C) 2012 Adobe Systems Incorporated. All rights reserved. Apache License Version 2.0, January 2004 @@ -200,4 +199,4 @@ Copyright (C) 2012 Adobe Systems Incorporated. All rights reserved. distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and - limitations under the License. \ No newline at end of file + limitations under the License. diff --git a/test/expected/index.css b/css/button-base.css similarity index 88% rename from test/expected/index.css rename to css/button-base.css index a8fcbac..7279f97 100644 --- a/test/expected/index.css +++ b/css/button-base.css @@ -15,6 +15,9 @@ .button { cursor: default; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; user-select: none; } diff --git a/index.html b/index.html deleted file mode 100644 index cfd8d8f..0000000 --- a/index.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - Topcoat Button Base - - - - Button - - diff --git a/package.json b/package.json index 1cf4db5..a3c88fa 100644 --- a/package.json +++ b/package.json @@ -1,19 +1,18 @@ { "name": "topcoat-button-base", - "version": "0.10.2", "description": "Topcoat button base. Reset styles for buttons.", "style": "src/", "directories": { "test": "test" }, "scripts": { - "test": "mocha test/", - "build": "postcss --use postcss-import --use postcss-inherit ./test/fixtures/index.css -o ./css/index.css", - "pretest": "npm run build" + "test": "ava test", + "prepublish": "rsn -p './src/button-base.css' -o ./css/button-base.css ./test/button-base.fixture.css", + "semantic-release": "semantic-release pre && npm publish && semantic-release post" }, "repository": { "type": "git", - "url": "git://github.com/topcoat/topcoat.git" + "url": "https://github.com/topcoat/button-base.git" }, "keywords": [ "button", @@ -33,15 +32,23 @@ }, "homepage": "http://topcoat.io", "dependencies": { - "topcoat-utils": "^0.4.1" + "topcoat-utils": "^1.0.0" }, "devDependencies": { "autoprefixer": "^6.4.0", + "ava": "^0.16.0", + "babel-cli": "^6.14.0", + "babel-core": "^6.14.0", + "babel-preset-es2015": "^6.14.0", + "babel-register": "^6.14.0", + "cz-customizable": "^4.0.0", "mocha": "^3.0.2", - "postcss": "^5.1.2", - "postcss-cli": "^2.5.2", - "postcss-css-variables": "^0.5.1", - "postcss-import": "^8.1.2", - "postcss-inherit": "^2.0.2" + "resin": "^1.1.0", + "semantic-release": "^4.3.5" + }, + "config": { + "commitizen": { + "path": "./node_modules/cz-customizable" + } } } diff --git a/src/button-base.css b/src/button-base.css new file mode 100644 index 0000000..dfec5d9 --- /dev/null +++ b/src/button-base.css @@ -0,0 +1,18 @@ +@import "topcoat-utils"; + +%button { + @extend: %inline-block; + @extend: %reset-box-model; + @extend: %reset-base; + @extend: %reset-cursor; + @extend: %ellipsis; + text-decoration: none; +} + +%button--quiet { + @extend: %reset-quiet; +} + +%button--disabled { + @extend: %disabled; +} diff --git a/src/index.css b/src/index.css deleted file mode 100644 index ce5b546..0000000 --- a/src/index.css +++ /dev/null @@ -1,18 +0,0 @@ -@import "topcoat-utils"; - -%button { - extend: %inline-block; - extend: %reset-box-model; - extend: %reset-base; - extend: %reset-cursor; - extend: %ellipsis; - text-decoration: none; -} - -%button--quiet { - extend: %reset-quiet; -} - -%button--disabled { - extend: %disabled; -} diff --git a/test/button-base.expected.css b/test/button-base.expected.css new file mode 100644 index 0000000..7279f97 --- /dev/null +++ b/test/button-base.expected.css @@ -0,0 +1,52 @@ +.button { + padding: 0; + margin: 0; + font: inherit; + color: inherit; + background: transparent; + border: none; +} + +.button--quiet { + background: transparent; + border: 1px solid transparent; + box-shadow: none; +} + +.button { + cursor: default; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.button { + box-sizing: border-box; + background-clip: padding-box; +} + +.button { + white-space: nowrap; + overflow: hidden; +} + +.button { + position: relative; + display: inline-block; + vertical-align: top; +} + +.button { + text-overflow: ellipsis; +} + +.button--disabled { + opacity: 0.3; + cursor: default; + pointer-events: none; +} + +.button { + text-decoration: none; +} diff --git a/test/button-base.fixture.css b/test/button-base.fixture.css new file mode 100644 index 0000000..16ee73a --- /dev/null +++ b/test/button-base.fixture.css @@ -0,0 +1,11 @@ +.button { + @extend: %button; +} + +.button--quiet { + @extend: %button--quiet; +} + +.button--disabled { + @extend: %button--disabled; +} diff --git a/test/button-base.test.js b/test/button-base.test.js new file mode 100644 index 0000000..8dd861b --- /dev/null +++ b/test/button-base.test.js @@ -0,0 +1,16 @@ +import test from 'ava'; +import resin from 'resin'; +import fs from 'fs'; + +test('compilation', t => { + const input = './button-base.fixture.css'; + const expected = fs.readFileSync('./button-base.expected.css','utf-8').trim(); + return resin({ + src: input, + vars: true, + extend: true, + prepend: '../src/button-base.css' + }).then(result => { + t.is(result.css.trim(), expected); + }); +}); diff --git a/test/button.test.js b/test/button.test.js deleted file mode 100644 index 58bc975..0000000 --- a/test/button.test.js +++ /dev/null @@ -1,18 +0,0 @@ -var assert = require('assert'); -var fs = require('fs'); - -function read(file) { - return fs.readFileSync(file, 'utf8'); -} - -describe('Topcoat Button Base', function() { - 'use strict'; - - it('should create expected css file', function() { - console.log(require('../package.json').name) - var actual = read('css/index.css').trim(); - var expected = read('test/expected/index.css').trim(); - assert.equal(actual, expected, 'should generate correct css'); - }); - -}); diff --git a/test/fixtures/index.css b/test/fixtures/index.css deleted file mode 100644 index b3a477d..0000000 --- a/test/fixtures/index.css +++ /dev/null @@ -1,13 +0,0 @@ -@import "../../src/"; - -.button { - extend: %button; -} - -.button--quiet { - extend: %button--quiet; -} - -.button--disabled { - extend: %button--disabled; -}