View 18f-pages.rb
PAGES_BRANCHES = ['18f-pages']
if PAGES_BRANCHES.include? ENV['BRANCH']
Jekyll::Hooks.register :site, :pre_render do |site|
site.config['baseurl'] = '/{repo}'
end
end
View example.sketch.json
{
"currentPageIndex": null,
"assets": {
"gradients": [],
"colors": [],
"imageCollection": {
"images": {}
},
"images": []
},
View README.md

This is a minimal fractal.js for testing the live context data editor proposed in this PR.

View .babelrc
{"presets": ["es2015", "stage-0"]}
View README.md

This is a Jekyll-specific way to render HTML source for a given page (in this case, one in a collection) alongside the markup itself without having to duplicate content in includes.

View _mixins.scss
// generate a custom element selector with the correct prefix
@mixin custom-element($name) {
#{$usa-prefix}-#{$name} {
@content;
}
}
View aria-validated.css
label,
input {
display: block;
}
input[aria-invalid=true][aria-label]::before {
color: red;
content: attr(aria-label);
display: block;
}
View README.md

This is a Sketch script to make bar charts.

bars

Here's how to run it:

  1. Make a selection of only shapes with names in the format:

    (anything)value={number}
    
View README.md

This is an example of what you should be able to do once the major browsers implement some seriously cool features in the CSS3 draft spec as of April, 2016:

  1. [CSS variables][vars], using the --name: value assignment and var(--name) accessor syntax. (Already implemented by Chrome, Firefox, and Webkit!)
  2. [CSS3 calc()][calc], which gives us calculated values between different units, e.g. subtracting a value in px or em from a percentage. (Partially implemented in Chrome, Firefox, and Safari.)
  3. [CSS3 attr()][attr], which grants the function the ability to parse values in specific units in the form attr(attr-name units). (Not yet implemented in any major browser.)

Together, these features would enable us to use HTML element attribute values as the basis for calculated values in CSS on a per-element basis, and define (then change) which property the values are applied to. This would open up possibilities for more data-driven design entirely in CSS, without the need for JavaScript.

Note: I've

View markdown.html
{% capture markdown %}{% include {{ include.content }}.md %}{% endcapture %}
{{ markdown | markdownify }}