bjankord

Component Features

• Cross-Browser Support
• LTR/RTL Support
• Responsive Support
• Mobile Support
• Adherence to Design Standard
• Internationalization (I18n) Support
• Translation Support

bjankord

Please fill out the below template as best you can.

Description of Issue

Describe the issue as best you can. We love screenshots!

###System Configuration

Component Version

Browser and Version

bjankord

Example: https://www.webpackbin.com/bins/-Ki2nECMzZC9_V_UEObo

When rendering <Button /> and <Button primary/> components, there are CSS properties that are duplicated across instances. Looking at the rendered-styles.css file, you can see the duplication. Looking at the markup, it looks like there are a couple ways styles could be mapped to avoid duplicated CSS rules, however I'm not sure what implementation considerations/constraints this would involve.

With the rendered markup styled-components creates in the rendered-html example, I assume the rendered CSS most developers who frequently write CSS would expect is something like:

.sc-bdVaJa {
  font-size: 1em;

bjankord

"scripts": {    
    "compile": "node ../../scripts/compile.js",
    "lint": "node ../../scripts/lint.js",
    "pretest": "node ../../scripts/pretest.js",
    "release:major": "npm test && npm run compile && npm version major -m \"Released version %s\" && npm publish && git push",
    "release:minor": "npm test && npm run compile && npm version minor -m \"Released version %s\" && npm publish && git push",
    "release:patch": "npm test && npm run compile && npm version patch -m \"Released version %s\" && npm publish && git push",
    "test": "node ../../scripts/test.js"
}

bjankord

const list = ['apple', 'orange', 'bananna'];


function isThemableIcon(value) {
  return ['orange', 'bananna'].indexOf(value) >= 0;
}

const themableIcons = list.filter(isThemableIcon);
const staticIcons = list.filter(x => !isThemableIcon(x));

bjankord

.foo {
  background: #f00;
}

bjankord

var nav = document.querySelector('.nav__toggle');
var toggleState = function (elem, one, two) {
  var elem = document.querySelector(elem);
  elem.setAttribute('data-state', elem.getAttribute('data-state') === one ? two : one);
};

nav.onclick = function (e) {
  toggleState('.nav ul', 'closed', 'open');
  e.preventDefault();
};

bjankord

# Inspired by http://www.codeography.com/2011/08/05/project-specific-git-author.html
git config --global alias.homeprofile '!git config user.name "Brett Jankord" && git config user.email "bjankord@gmail.com" && git config github.user "bjankord"'

bjankord

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<!-- Generated by: TmTheme-Editor                 -->
<!-- ============================================ -->
<!-- app:  http://tmtheme-editor.herokuapp.com    -->
<!-- code: https://github.com/aziz/tmTheme-Editor -->
<plist version="1.0">
<dict>
	<key>name</key>
	<string>Monokaish</string>

bjankord

• Eighties Next
• mersi
• pastels on dark
• brackets dark
• Monokai Spacegray Eighties
• Predawn Monokai
• Piatto Dark
• Today