| class Toggle { | |
| constructor(element) { | |
| this.trigger = element; | |
| this.triggerText = this.trigger.textContent; | |
| this.triggerAlternativeText = this.trigger.dataset.toggleTriggerAlternativeText; | |
| this.triggerActiveClass = this.trigger.dataset.toggleTriggerActiveClass; | |
| this.targetIDs = JSON.parse(this.trigger.dataset.toggle); | |
| this.targets = []; | |
| this.targets = this.targetIDs.map(id => document.getElementById(id)); |
| _sum(array) { | |
| let arrayNum = array.map(Number); | |
| return arrayNum.reduce((sum, x) => sum + x); | |
| } |
| { | |
| "added_words": | |
| [ | |
| "Qian", | |
| "refactor", | |
| "prioritisation", | |
| "thoughtbot", | |
| "cofounded", | |
| "workflow", | |
| "online", |
| var gulp = require('gulp'); | |
| var sass = require('gulp-sass'), | |
| autoprefix = require('gulp-autoprefixer'), | |
| bourbon = require('bourbon'), | |
| jshint = require('gulp-jshint'), | |
| stylish = require('jshint-stylish'), | |
| zip = require('gulp-zip'); | |
| // Stylesheets |
| body { | |
| background: | |
| linear-gradient(0deg, rgba(#ccc,1) 1px, rgba(0,0,0,0) 1px), | |
| linear-gradient(0deg, rgb(238,238,238) 1px, rgba(0,0,0,0) 1px); | |
| background-position: auto auto; | |
| background-origin: padding-box; | |
| background-clip: border-box; | |
| background-size: 100% 28px, 100% 4px; | |
| } |
| Book flights | |
| Book hotel | |
| Confirm flights | |
| Confirm hotel | |
| Add flight schedule to calendar | |
| Pack identification | |
| Determine transport time to airport | |
| Pack toiletries | |
| ...Toothbrush | |
| ...Toothpaste |
A tool to add design patterns into your code base that follow a highly opinionated directory structure and encourage standardized patterns. No more copy pasta. As an added benefit you get a living styleguide that genuinely reflects the use of your design patterns.
We got our ideas for rendering design patterns using a method from Mountain View, and the notion for pre-made design patterns from Refills.
| //============ Icon Styles ============ | |
| [data-icon]:before { | |
| font-family: 'entypo'; | |
| content: attr(data-icon); | |
| speak: none; | |
| font-weight: normal; | |
| font-variant: normal; | |
| text-transform: none; | |
| letter-spacing:0.125em; |
| //============ Grid Helpers ============ | |
| // w.i.p. | |
| .smallish { | |
| font-size: 0.875em; | |
| } | |
| .smally { | |
| font-size: 0.75em; | |
| } |
| //============ Mixins ============ | |
| // Box Shadows | |
| @mixin basic-shadow( $horz:0, $vert:2px, $raid:5px, $colr:rgba($glass-color, 0.2)) { | |
| -webkit-box-shadow: $horz $vert $raid $colr; | |
| -moz-box-shadow: $horz $vert $raid $colr; | |
| box-shadow: $horz $vert $raid $colr; | |
| } |
