Revert to pre-parcel setup
This commit is contained in:
Rico Sta. Cruz
parent
048697b3d3
commit
89fae0fcb9
5
.babelrc
5
.babelrc
|
|
@ -1,10 +1,9 @@
|
|||
{
|
||||
"presets": [
|
||||
[
|
||||
"@babel/preset-env",
|
||||
"env",
|
||||
{
|
||||
"useBuiltIns": "entry",
|
||||
"targets": "> 2%"
|
||||
"forceAllTransforms": true
|
||||
}
|
||||
]
|
||||
]
|
||||
|
|
|
|||
|
|
@ -1 +0,0 @@
|
|||
yarn.lock binary
|
||||
|
|
@ -3,8 +3,4 @@ _site
|
|||
.jekyll-metadata
|
||||
/node_modules
|
||||
/vendor
|
||||
.idea/
|
||||
|
||||
# Generated by 'yarn dev'
|
||||
/_includes/2017/critical/critical-home.js
|
||||
/_includes/2017/critical/critical-sheet.js
|
||||
.idea/
|
||||
|
|
@ -1,6 +1,5 @@
|
|||
{
|
||||
"semi": false,
|
||||
"singleQuote": true,
|
||||
"jsxSingleQuote": true,
|
||||
"trailingComma": "none"
|
||||
"jsxSingleQuote": true
|
||||
}
|
||||
|
|
|
|||
25
.travis.yml
25
.travis.yml
|
|
@ -1,25 +1,10 @@
|
|||
language: ruby
|
||||
rvm: [2.7.1]
|
||||
|
||||
before_install:
|
||||
- nvm install 12
|
||||
- nvm use 12
|
||||
- node --version
|
||||
- ruby --version
|
||||
|
||||
install:
|
||||
- yarn --frozen-lockfile
|
||||
- bundle --jobs=3 --retry=3 --deployment --path=${BUNDLE_PATH:-vendor/bundle}
|
||||
|
||||
rvm:
|
||||
- 2.5
|
||||
script:
|
||||
- yarn build
|
||||
- yarn test
|
||||
- if ! make test; then make test-warning; exit 16; fi
|
||||
|
||||
cache:
|
||||
bundler: true
|
||||
yarn: true
|
||||
|
||||
- make -B _site
|
||||
- if ! make test; then make test-warning; exit 16; fi
|
||||
cache: bundler
|
||||
notifications:
|
||||
slack:
|
||||
if: branch = master OR branch =~ ^.*slack.*$
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
# Developer notes
|
||||
|
||||
## Gitpod
|
||||
|
||||
## Gitpod
|
||||
This repository supports contribution using [gitpod](https://gitpod.io) which is online IDE using [Theia](https://github.com/eclipse-theia/theia).
|
||||
|
||||
To open-up the environment simple natigate on https://gitpod.io/#https://github.com/rstacruz/cheatsheets
|
||||
|
|
@ -10,14 +9,14 @@ Or using a button:<br>
|
|||
[](https://gitpod.io/#https://github.com/rstacruz/cheatsheets)
|
||||
|
||||
### Preview built website
|
||||
|
||||
To preview the website you need to first build it then you can navigate to file that you are trying to contribute and preview directly.
|
||||
|
||||
<img src='_docs/images/gitpod_preview_tut.png' width=828 height=459/>
|
||||
|
||||
|
||||
## Starting a local instance
|
||||
|
||||
This starts Jekyll and Parcel. This requires recent versions of [Node.js], [Yarn], [Ruby] and [Bundler] installed.
|
||||
This starts Jekyll and Webpack. This requires recent versions of [Node.js], [Yarn], [Ruby] and [Bundler] installed.
|
||||
|
||||
```bash
|
||||
yarn install
|
||||
|
|
@ -57,11 +56,9 @@ See <https://devhints.io/cheatsheet-styles> for a reference on styling.
|
|||
|
||||
## JavaScript
|
||||
|
||||
When updating JavaScript, be sure Parcel is running (`yarn dev` takes care of this).
|
||||
When updating JavaScript, be sure webpack is running (`yarn run dev` takes care of this).
|
||||
|
||||
This auto-updates `/assets/packed/` and `_includes/2017/critical/` with sources in `_parcel/`.
|
||||
|
||||
Before committing, run `yarn parcel:build` first.
|
||||
This auto-updates `/assets/packed/` with sources in `_js/`.
|
||||
|
||||
## JavaScript tests
|
||||
|
||||
|
|
@ -78,16 +75,16 @@ Each sheet supports these metadata:
|
|||
```yml
|
||||
---
|
||||
title: React.js
|
||||
layout: 2017/sheet # 'default' | '2017/sheet'
|
||||
layout: 2017/sheet # 'default' | '2017/sheet'
|
||||
|
||||
# Optional:
|
||||
category: React
|
||||
updated: 2017-08-30 # To show in the updated list
|
||||
ads: false # Add this to disable ads
|
||||
weight: -5 # lower number = higher in related posts list
|
||||
deprecated: true # Don't show in related posts
|
||||
deprecated_by: /enzyme # Point to latest version
|
||||
prism_languages: [vim] # Extra syntax highlighting
|
||||
updated: 2017-08-30 # To show in the updated list
|
||||
ads: false # Add this to disable ads
|
||||
weight: -5 # lower number = higher in related posts list
|
||||
deprecated: true # Don't show in related posts
|
||||
deprecated_by: /enzyme # Point to latest version
|
||||
prism_languages: [vim] # Extra syntax highlighting
|
||||
intro: |
|
||||
This is some *Markdown* at the beginning of the article.
|
||||
tags:
|
||||
|
|
@ -96,10 +93,9 @@ tags:
|
|||
|
||||
# Special pages:
|
||||
# (don't set these for cheatsheets)
|
||||
type: home # home | article | error
|
||||
og_type: website # opengraph type
|
||||
type: home # home | article | error
|
||||
og_type: website # opengraph type
|
||||
---
|
||||
|
||||
```
|
||||
|
||||
## Prism languages
|
||||
|
|
@ -119,7 +115,6 @@ title: ES2015
|
|||
category: Hidden
|
||||
redirect_to: /es6
|
||||
---
|
||||
|
||||
```
|
||||
|
||||
## Localizations
|
||||
|
|
@ -175,3 +170,26 @@ building web user interfaces...
|
|||
### intro only
|
||||
|
||||
If you left out `description` or `keywords`, a default description will be added.
|
||||
|
||||
## Critical path CSS
|
||||
|
||||
The critical path CSS is stored in:
|
||||
|
||||
- `_includes/2017/critical/home.html`
|
||||
- `_includes/2017/critical/sheet.html`
|
||||
|
||||
You'll need to update these every now and then when you change something in the CSS. Use this to update these snippets:
|
||||
|
||||
```
|
||||
yarn run critical
|
||||
```
|
||||
|
||||
You can temporarily disable critical path optimizations by loading it with `?nocrit=1`, eg, `https://devhints.io/?nocrit=1`.
|
||||
|
||||
## Critical path JS
|
||||
|
||||
There's JavaScript that's included inline in every page. It's entrypoint is:
|
||||
|
||||
- `_js/critical.js`
|
||||
|
||||
This is automatically compiled into the partial `_includes/2017/critical/critical.js`. Keep this bundle as small as possible.
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
FROM ruby:2.7.1
|
||||
RUN curl -sL https://deb.nodesource.com/setup_12.x | bash -
|
||||
FROM ruby:2.5.1
|
||||
RUN curl -sL https://deb.nodesource.com/setup_10.x | bash -
|
||||
RUN curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add -
|
||||
RUN echo "deb https://dl.yarnpkg.com/debian/ stable main" | tee /etc/apt/sources.list.d/yarn.list
|
||||
RUN apt-get update -qq && apt-get install -qq --no-install-recommends \
|
||||
|
|
|
|||
37
Makefile
37
Makefile
|
|
@ -9,14 +9,43 @@ help:
|
|||
@echo
|
||||
|
||||
# Builds intermediate files. Needs a _site built first though
|
||||
update: _site
|
||||
update: _site critical
|
||||
|
||||
# Builds _site
|
||||
_site:
|
||||
yarn build
|
||||
bundle exec jekyll build --incremental
|
||||
|
||||
dev:
|
||||
yarn dev
|
||||
critical: _site ## Builds critical path CSS/JS
|
||||
node _support/critical.js
|
||||
|
||||
# Ensure that bins are available.
|
||||
ensure-bin:
|
||||
@if [ ! -d $(npmbin) ]; then \
|
||||
echo "---"; \
|
||||
echo "Error: $(npmbin) not found, you may need to run '[docker-compose run --rm web] yarn install'."; \
|
||||
echo "---"; \
|
||||
exit 1; \
|
||||
fi
|
||||
@if ! which jekyll &>/dev/null; then \
|
||||
echo "---"; \
|
||||
echo "Warning: Jekyll not found, you may need to run '[docker-compose run --rm web] bundle install'."; \
|
||||
echo "---"; \
|
||||
fi
|
||||
|
||||
dev: ensure-bin ## Starts development server
|
||||
$(npmbin)/concurrently -k -p command -c "blue,green" \
|
||||
"make dev-webpack" \
|
||||
"make dev-jekyll"
|
||||
|
||||
dev-webpack: ensure-bin
|
||||
$(npmbin)/webpack --watch --colors -p
|
||||
|
||||
dev-jekyll: ensure-bin
|
||||
if [ -f _site ]; then \
|
||||
bundle exec jekyll serve --safe --trace --drafts --watch --incremental --host $(HOST) --port $(PORT); \
|
||||
else \
|
||||
bundle exec jekyll serve --safe --trace --drafts --watch --host $(HOST) --port $(PORT); \
|
||||
fi
|
||||
|
||||
test: _site ## Runs rudimentary tests
|
||||
@test -f _site/vim.html
|
||||
|
|
|
|||
22
_config.yml
22
_config.yml
|
|
@ -9,23 +9,21 @@ plugins:
|
|||
- jekyll-github-metadata
|
||||
|
||||
exclude:
|
||||
- .babelrc
|
||||
- .cache
|
||||
- CNAME
|
||||
- Makefile
|
||||
- README.md
|
||||
- CONTRIBUTING.md
|
||||
- docker_compose.yml
|
||||
- Dockerfile
|
||||
- Gemfile
|
||||
- Gemfile.lock
|
||||
- Makefile
|
||||
- node_modules
|
||||
- package.json
|
||||
- package-lock.json
|
||||
- README.md
|
||||
- CNAME
|
||||
- vendor
|
||||
- webpack.config.js
|
||||
- yarn-error.log
|
||||
- package.json
|
||||
- .babelrc
|
||||
- yarn.lock
|
||||
- package-lock.json
|
||||
- webpack.config.js
|
||||
- node_modules
|
||||
- Dockerfile
|
||||
- docker_compose.yml
|
||||
|
||||
# Markdown
|
||||
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,15 +1 @@
|
|||
parcelRequire=function(e,r,t,n){var i,o="function"==typeof parcelRequire&&parcelRequire,u="function"==typeof require&&require;function f(t,n){if(!r[t]){if(!e[t]){var i="function"==typeof parcelRequire&&parcelRequire;if(!n&&i)return i(t,!0);if(o)return o(t,!0);if(u&&"string"==typeof t)return u(t);var c=new Error("Cannot find module '"+t+"'");throw c.code="MODULE_NOT_FOUND",c}p.resolve=function(r){return e[t][1][r]||r},p.cache={};var l=r[t]=new f.Module(t);e[t][0].call(l.exports,p,l,l.exports,this)}return r[t].exports;function p(e){return f(p.resolve(e))}}f.isParcelRequire=!0,f.Module=function(e){this.id=e,this.bundle=f,this.exports={}},f.modules=e,f.cache=r,f.parent=o,f.register=function(r,t){e[r]=[function(e,r){r.exports=t},{}]};for(var c=0;c<t.length;c++)try{f(t[c])}catch(e){i||(i=e)}if(t.length){var l=f(t[t.length-1]);"object"==typeof exports&&"undefined"!=typeof module?module.exports=l:"function"==typeof define&&define.amd?define(function(){return l}):n&&(this[n]=l)}if(parcelRequire=f,i)throw i;return f}({"r6WJ":[function(require,module,exports) {
|
||||
function e(e,t){var r=e.matches||e.matchesSelector||e.msMatchesSelector||e.mozMatchesSelector||e.webkitMatchesSelector||e.oMatchesSelector;if(r)return r.call(e,t);if(e.parentNode){for(var c=e.parentNode.querySelectorAll(t),o=c.length;o--;0)if(c[o]===e)return!0;return!1}}module.exports=e;
|
||||
},{}],"cDuO":[function(require,module,exports) {
|
||||
function e(e,r){var n,o,t=e.length;if("number"==typeof t)for(n=0;n<t;n++)r(e[n],n);else for(n in o=0,e)e.hasOwnProperty(n)&&r(e[n],n,o++);return e}module.exports=e;
|
||||
},{}],"G20n":[function(require,module,exports) {
|
||||
var s=require("./each");function e(i,a){if(a)if(Array.isArray(a))s(a,function(s){e(i,s)});else if(i.classList){var r=a.split(" ").filter(Boolean);s(r,function(s){i.classList.add(s)})}else i.className+=" "+a}module.exports=e;
|
||||
},{"./each":"cDuO"}],"THIL":[function(require,module,exports) {
|
||||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.appendMany=c,exports.nextUntil=f,exports.before=s,exports.findChildren=d,exports.createDiv=p;var t=e(require("dom101/matches"));function e(t){return t&&t.__esModule?t:{default:t}}function r(t){return u(t)||i(t)||o(t)||n()}function n(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function o(t,e){if(t){if("string"==typeof t)return a(t,e);var r=Object.prototype.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?a(t,e):void 0}}function i(t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(t))return Array.from(t)}function u(t){if(Array.isArray(t))return a(t)}function a(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=new Array(e);r<e;r++)n[r]=t[r];return n}function c(t,e){e.forEach(function(e){t.appendChild(e)})}function f(t,e){return l(t.nextSibling,e,[])}function l(e,n,o){return e?(0,t.default)(e,n)?o:l(e.nextSibling,n,[].concat(r(o),[e])):o}function s(t,e){t.parentNode.insertBefore(e,t)}function d(e,r){return[].slice.call(e.children).filter(function(e){return(0,t.default)(e,r)})}function p(t){var e=document.createElement("div");return Object.keys(t).forEach(function(r){e.setAttribute(r,t[r])}),e}
|
||||
},{"dom101/matches":"r6WJ"}],"hE9p":[function(require,module,exports) {
|
||||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=f,exports.groupify=p;var r=e(require("dom101/matches")),t=e(require("dom101/add-class")),n=require("../helpers/dom");function e(r){return r&&r.__esModule?r:{default:r}}function o(r){return c(r)||u(r)||i(r)||a()}function a(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function i(r,t){if(r){if("string"==typeof r)return s(r,t);var n=Object.prototype.toString.call(r).slice(8,-1);return"Object"===n&&r.constructor&&(n=r.constructor.name),"Map"===n||"Set"===n?Array.from(r):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?s(r,t):void 0}}function u(r){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(r))return Array.from(r)}function c(r){if(Array.isArray(r))return s(r)}function s(r,t){(null==t||t>r.length)&&(t=r.length);for(var n=0,e=new Array(t);n<t;n++)e[n]=r[n];return e}function f(r){l(r).forEach(function(r){(0,n.findChildren)(r,"[data-js-h3-section-list]").forEach(function(r){d(r)})})}function l(r){return p(r,{tag:"h2",wrapperFn:function(){return(0,n.createDiv)({class:"h2-section"})},bodyFn:function(){return(0,n.createDiv)({class:"body h3-section-list","data-js-h3-section-list":""})}})}function d(r){return p(r,{tag:"h3",wrapperFn:function(){return(0,n.createDiv)({class:"h3-section"})},bodyFn:function(){return(0,n.createDiv)({class:"body"})}})}function p(e,a){var i=a.tag,u=a.wrapperFn,c=a.bodyFn,s=e.children[0],f=[];if(s&&!(0,r.default)(s,i)){var l=(0,n.nextUntil)(s,i);f.push(d(s,null,[s].concat(o(l))))}return(0,n.findChildren)(e,i).forEach(function(r){var t=(0,n.nextUntil)(r,i);f.push(d(r,r,t))}),f;function d(r,e,o){var a=u(),i=r.className;i&&(0,t.default)(a,i),(0,n.before)(r,a);var s=c();return i&&(0,t.default)(s,i),(0,n.appendMany)(s,o),e&&a.appendChild(e),a.appendChild(s),a}}
|
||||
},{"dom101/matches":"r6WJ","dom101/add-class":"G20n","../helpers/dom":"THIL"}],"DJ2P":[function(require,module,exports) {
|
||||
function n(n,t,e){n.addEventListener?n.addEventListener(t,e):n.attachEvent("on"+t,function(){e.call(n)})}module.exports=n;
|
||||
},{}],"eoMl":[function(require,module,exports) {
|
||||
"use strict";var e=u(require("./wrapify")),d=u(require("dom101/add-class")),t=u(require("dom101/on"));function u(e){return e&&e.__esModule?e:{default:e}}var a,o=document.querySelector("[data-js-main-body]");function r(){a||((0,d.default)(document.documentElement,"LoadDone"),a=!0)}o&&((0,e.default)(o),(0,d.default)(o,"-wrapified")),(0,t.default)(window,"load",r),setTimeout(r,5e3);
|
||||
},{"./wrapify":"hE9p","dom101/add-class":"G20n","dom101/on":"DJ2P"}]},{},["eoMl"], null)
|
||||
!function(e){function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}var t={};n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:r})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},n.p="",n(n.s=2)}([function(e,n){function t(e,n){var t=e.matches||e.matchesSelector||e.msMatchesSelector||e.mozMatchesSelector||e.webkitMatchesSelector||e.oMatchesSelector;if(t)return t.call(e,n);if(e.parentNode){for(var r=e.parentNode.querySelectorAll(n),o=r.length;o--;0)if(r[o]===e)return!0;return!1}}e.exports=t},function(e,n,t){function r(e,n){if(n){if(Array.isArray(n))return void o(n,function(n){r(e,n)});if(e.classList){var t=n.split(" ").filter(Boolean);o(t,function(n){e.classList.add(n)})}else e.className+=" "+n}}var o=t(4);e.exports=r},function(e,n,t){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function o(){d||((0,c.default)(document.documentElement,"LoadDone"),d=!0)}var i=t(3),u=r(i),a=t(1),c=r(a),f=t(6),l=r(f),s=document.querySelector("[data-js-main-body]");s&&((0,u.default)(s),(0,c.default)(s,"-wrapified")),(0,l.default)(window,"load",o),setTimeout(o,5e3);var d=void 0},function(e,n,t){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function o(e){if(Array.isArray(e)){for(var n=0,t=Array(e.length);n<e.length;n++)t[n]=e[n];return t}return Array.from(e)}function i(e){u(e).forEach(function(e){(0,p.findChildren)(e,"[data-js-h3-section-list]").forEach(function(e){a(e)})})}function u(e){return c(e,{tag:"h2",wrapperFn:function(){return(0,p.createDiv)({class:"h2-section"})},bodyFn:function(){return(0,p.createDiv)({class:"body h3-section-list","data-js-h3-section-list":""})}})}function a(e){return c(e,{tag:"h3",wrapperFn:function(){return(0,p.createDiv)({class:"h3-section"})},bodyFn:function(){return(0,p.createDiv)({class:"body"})}})}function c(e,n){function t(e,n,t){var r=i(),o=e.className;o&&(0,d.default)(r,o),(0,p.before)(e,r);var a=u();return o&&(0,d.default)(a,o),(0,p.appendMany)(a,t),n&&r.appendChild(n),r.appendChild(a),r}var r=n.tag,i=n.wrapperFn,u=n.bodyFn,a=e.children[0],c=[];if(a&&!(0,l.default)(a,r)){var f=(0,p.nextUntil)(a,r);c.push(t(a,null,[a].concat(o(f))))}return(0,p.findChildren)(e,r).forEach(function(e){var n=(0,p.nextUntil)(e,r);c.push(t(e,e,n))}),c}Object.defineProperty(n,"__esModule",{value:!0}),n.default=i,n.groupify=c;var f=t(0),l=r(f),s=t(1),d=r(s),p=t(5)},function(e,n){function t(e,n){var t,r,o=e.length;if("number"==typeof o)for(t=0;t<o;t++)n(e[t],t);else{r=0;for(t in e)e.hasOwnProperty(t)&&n(e[t],t,r++)}return e}e.exports=t},function(e,n,t){"use strict";function r(e){if(Array.isArray(e)){for(var n=0,t=Array(e.length);n<e.length;n++)t[n]=e[n];return t}return Array.from(e)}function o(e,n){n.forEach(function(n){e.appendChild(n)})}function i(e,n){return u(e.nextSibling,n,[])}function u(e,n,t){return e?(0,s.default)(e,n)?t:u(e.nextSibling,n,[].concat(r(t),[e])):t}function a(e,n){e.parentNode.insertBefore(n,e)}function c(e,n){return[].slice.call(e.children).filter(function(e){return(0,s.default)(e,n)})}function f(e){var n=document.createElement("div");return Object.keys(e).forEach(function(t){n.setAttribute(t,e[t])}),n}Object.defineProperty(n,"__esModule",{value:!0}),n.appendMany=o,n.nextUntil=i,n.before=a,n.findChildren=c,n.createDiv=f;var l=t(0),s=function(e){return e&&e.__esModule?e:{default:e}}(l)},function(e,n){function t(e,n,t){e.addEventListener?e.addEventListener(n,t):e.attachEvent("on"+n,function(){t.call(e)})}e.exports=t}]);
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,3 +1,5 @@
|
|||
<!-- critical js -->
|
||||
<script>{% include 2017/critical/critical.js %}</script>
|
||||
<script src='{{base}}/assets/packed/vendor.js?t={{ timestamp }}'></script>
|
||||
<script src='{{base}}/assets/packed/app.js?t={{ timestamp }}'></script>
|
||||
{% for lang in page.prism_languages %}<script src='https://cdn.jsdelivr.net/npm/prismjs@1.6.0/components/prism-{{lang}}.min.js'></script>{% endfor %}
|
||||
|
|
|
|||
|
|
@ -3,11 +3,11 @@
|
|||
|
||||
<!-- critical css -->
|
||||
{% if include.critical == 'home'
|
||||
%}<style id='critical-css'>{% include 2017/critical/critical-home.css %}</style>{%
|
||||
%}<style id='critical-css'>{% include 2017/critical/home.css %}</style>{%
|
||||
endif
|
||||
%}{%
|
||||
if include.critical == 'sheet'
|
||||
%}<style id='critical-css'>{% include 2017/critical/critical-sheet.css %}</style>{%
|
||||
%}<style id='critical-css'>{% include 2017/critical/sheet.css %}</style>{%
|
||||
endif %}
|
||||
|
||||
<!-- allow disabling critical CSS optimization by passing ?nocrit=1 -->
|
||||
|
|
|
|||
|
|
@ -0,0 +1,7 @@
|
|||
// 3rd party libs
|
||||
window.Prism = require('prismjs')
|
||||
|
||||
// All the others
|
||||
function requireAll (r) { r.keys().forEach(r) }
|
||||
requireAll(require.context('./initializers/', true, /\.js$/))
|
||||
requireAll(require.context('./behaviors/', true, /\.js$/))
|
||||
|
|
@ -9,7 +9,7 @@ const DEFAULTS = {
|
|||
// text of anchor
|
||||
text: '#',
|
||||
// append before or after innerText?
|
||||
shouldAppend: false
|
||||
shouldAppend: false,
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -19,9 +19,7 @@ const DEFAULTS = {
|
|||
onmount('[data-js-anchors]', function () {
|
||||
const data = JSON.parse(this.getAttribute('data-js-anchors') || '{}')
|
||||
const rules = Array.isArray(data)
|
||||
? data.length
|
||||
? data
|
||||
: [DEFAULTS]
|
||||
? (data.length ? data : [DEFAULTS])
|
||||
: [Object.assign({}, DEFAULTS, data)]
|
||||
|
||||
for (const { rule, className, text, shouldAppend } of rules) {
|
||||
|
|
@ -14,7 +14,7 @@ onmount('[data-js-dismiss]', function () {
|
|||
const dismissable = getData(parent, 'js-dismissable')
|
||||
const id = (dismissable && dismissable.id) || ''
|
||||
|
||||
on(this, 'click', (e) => {
|
||||
on(this, 'click', e => {
|
||||
Dismiss.setDismissed(id)
|
||||
e.preventDefault()
|
||||
if (parent) remove(parent)
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
/* eslint-disable no-new */
|
||||
|
||||
import Isotope from 'isotope-layout'
|
||||
import Isotope from 'isotope-layout/dist/isotope.pkgd.js'
|
||||
import onmount from 'onmount'
|
||||
import on from 'dom101/on'
|
||||
import qsa from 'dom101/query-selector-all'
|
||||
|
|
@ -17,7 +17,7 @@ onmount('[data-js-h3-section-list]', function () {
|
|||
|
||||
const images = qsa('img', this)
|
||||
|
||||
images.forEach((image) => {
|
||||
images.forEach(image => {
|
||||
on(image, 'load', () => {
|
||||
iso.layout()
|
||||
})
|
||||
|
|
@ -6,7 +6,7 @@ import on from 'dom101/on'
|
|||
*/
|
||||
|
||||
onmount('[data-js-search-form]', function () {
|
||||
on(this, 'submit', (e) => {
|
||||
on(this, 'submit', e => {
|
||||
e.preventDefault()
|
||||
|
||||
const link = document.querySelector('a[data-search-index]:visible')
|
||||
|
|
@ -17,8 +17,6 @@ onmount('[data-js-search-input]', function () {
|
|||
const query = (qs(window.location.search) || {}).q
|
||||
if (query && query.length) {
|
||||
this.value = query
|
||||
setTimeout(() => {
|
||||
Search.show(query)
|
||||
})
|
||||
setTimeout(() => { Search.show(query) })
|
||||
}
|
||||
})
|
||||
|
|
@ -10,12 +10,11 @@ import './searchable-item'
|
|||
*/
|
||||
|
||||
onmount('[data-js-searchable-header]', function () {
|
||||
const els = nextUntil(this, '[data-js-searchable-header]').filter((el) =>
|
||||
matches(el, '[data-search-index]')
|
||||
)
|
||||
const els = nextUntil(this, '[data-js-searchable-header]')
|
||||
.filter(el => matches(el, '[data-search-index]'))
|
||||
|
||||
const keywords = els
|
||||
.map((n) => n.getAttribute('data-search-index'))
|
||||
.map(n => n.getAttribute('data-search-index'))
|
||||
.join(' ')
|
||||
.split(' ')
|
||||
|
||||
|
|
@ -20,7 +20,7 @@ on(window, 'load', done)
|
|||
setTimeout(done, 5000)
|
||||
|
||||
let isDone
|
||||
function done() {
|
||||
function done () {
|
||||
if (isDone) return
|
||||
addClass(document.documentElement, 'LoadDone')
|
||||
isDone = true
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
/* eslint-env jest */
|
||||
import qs from '../qs'
|
||||
|
||||
describe('qs()', () => {
|
||||
test('basic', run({
|
||||
input: '?preview=1',
|
||||
output: { preview: '1' }
|
||||
}))
|
||||
|
||||
test('two fragments', run({
|
||||
input: '?a=1&b=2',
|
||||
output: { a: '1', b: '2' }
|
||||
}))
|
||||
|
||||
function run ({ input, output }) {
|
||||
return function () {
|
||||
const result = qs(input)
|
||||
expect(result).toEqual(output)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
* Stores and retrieves data from an element. Works like jQuery.data().
|
||||
*/
|
||||
|
||||
export function data(el, key, val) {
|
||||
export function data (el, key, val) {
|
||||
if (typeof val !== 'undefined') {
|
||||
return getData(el, key)
|
||||
} else {
|
||||
|
|
@ -10,11 +10,11 @@ export function data(el, key, val) {
|
|||
}
|
||||
}
|
||||
|
||||
export function getData(el, key) {
|
||||
export function getData (el, key) {
|
||||
const str = el.getAttribute('data-' + key)
|
||||
return JSON.parse(str || '{}')
|
||||
}
|
||||
|
||||
export function setData(el, key, val) {
|
||||
export function setData (el, key, val) {
|
||||
el.setAttribute('data-' + key, JSON.stringify(val))
|
||||
}
|
||||
|
|
@ -7,7 +7,7 @@ import * as Store from './store'
|
|||
* setDismissed('2017-09-02-happy-birthday')
|
||||
*/
|
||||
|
||||
export function setDismissed(id) {
|
||||
export function setDismissed (id) {
|
||||
Store.update('dismissed', function (data) {
|
||||
data[id] = true
|
||||
return data
|
||||
|
|
@ -22,7 +22,7 @@ export function setDismissed(id) {
|
|||
* isDismissed('2017-09-02-happy-birthday') => true
|
||||
*/
|
||||
|
||||
export function isDismissed(id) {
|
||||
export function isDismissed (id) {
|
||||
const data = Store.fetch('dismissed')
|
||||
return data && data[id]
|
||||
}
|
||||
|
|
@ -4,35 +4,33 @@ import matches from 'dom101/matches'
|
|||
* Just like jQuery.append
|
||||
*/
|
||||
|
||||
export function appendMany(el, children) {
|
||||
children.forEach((child) => {
|
||||
el.appendChild(child)
|
||||
})
|
||||
export function appendMany (el, children) {
|
||||
children.forEach(child => { el.appendChild(child) })
|
||||
}
|
||||
|
||||
/*
|
||||
* Just like jQuery.nextUntil
|
||||
*/
|
||||
|
||||
export function nextUntil(el, selector) {
|
||||
export function nextUntil (el, selector) {
|
||||
const nextEl = el.nextSibling
|
||||
return nextUntilTick(nextEl, selector, [])
|
||||
}
|
||||
|
||||
function nextUntilTick(el, selector, acc) {
|
||||
function nextUntilTick (el, selector, acc) {
|
||||
if (!el) return acc
|
||||
|
||||
const isMatch = matches(el, selector)
|
||||
if (isMatch) return acc
|
||||
|
||||
return nextUntilTick(el.nextSibling, selector, [...acc, el])
|
||||
return nextUntilTick(el.nextSibling, selector, [ ...acc, el ])
|
||||
}
|
||||
|
||||
/*
|
||||
* Just like jQuery.before
|
||||
*/
|
||||
|
||||
export function before(reference, newNode) {
|
||||
export function before (reference, newNode) {
|
||||
reference.parentNode.insertBefore(newNode, reference)
|
||||
}
|
||||
|
||||
|
|
@ -40,8 +38,9 @@ export function before(reference, newNode) {
|
|||
* Like jQuery.children('selector')
|
||||
*/
|
||||
|
||||
export function findChildren(el, selector) {
|
||||
return [].slice.call(el.children).filter((child) => matches(child, selector))
|
||||
export function findChildren (el, selector) {
|
||||
return [].slice.call(el.children)
|
||||
.filter(child => matches(child, selector))
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -53,9 +52,9 @@ export function findChildren(el, selector) {
|
|||
* createDiv({ class: 'foo' })
|
||||
*/
|
||||
|
||||
export function createDiv(props) {
|
||||
export function createDiv (props) {
|
||||
const d = document.createElement('div')
|
||||
Object.keys(props).forEach((key) => {
|
||||
Object.keys(props).forEach(key => {
|
||||
d.setAttribute(key, props[key])
|
||||
})
|
||||
return d
|
||||
|
|
@ -5,12 +5,12 @@
|
|||
* inject('devhints.disqus.com')
|
||||
*/
|
||||
|
||||
export default function inject(host) {
|
||||
export default function inject (host) {
|
||||
injectEmbed(host)
|
||||
injectCount(host)
|
||||
}
|
||||
|
||||
export function injectEmbed(host) {
|
||||
export function injectEmbed (host) {
|
||||
const d = document
|
||||
const s = d.createElement('script')
|
||||
s.src = `https://${host}/embed.js`
|
||||
|
|
@ -18,7 +18,7 @@ export function injectEmbed(host) {
|
|||
;(d.head || d.body).appendChild(s)
|
||||
}
|
||||
|
||||
export function injectCount(host) {
|
||||
export function injectCount (host) {
|
||||
const d = document
|
||||
const s = d.createElement('script')
|
||||
s.src = `https://${host}/count.js`
|
||||
|
|
@ -7,7 +7,7 @@
|
|||
* })
|
||||
*/
|
||||
|
||||
export default function permutate(data) {
|
||||
export default function permutate (data) {
|
||||
let words = []
|
||||
if (data.slug) {
|
||||
words = words.concat(permutateString(data.slug))
|
||||
|
|
@ -26,11 +26,11 @@ export default function permutate(data) {
|
|||
* => ['h', 'hi', 'j', 'jo', 'joe']
|
||||
*/
|
||||
|
||||
export function permutateString(str) {
|
||||
export function permutateString (str) {
|
||||
let words = []
|
||||
let inputs = splitwords(str)
|
||||
|
||||
inputs.forEach((word) => {
|
||||
inputs.forEach(word => {
|
||||
words = words.concat(permutateWord(word))
|
||||
})
|
||||
|
||||
|
|
@ -45,7 +45,7 @@ export function permutateString(str) {
|
|||
* => ['h', 'he', 'hel', 'hell', 'hello']
|
||||
*/
|
||||
|
||||
export function permutateWord(str) {
|
||||
export function permutateWord (str) {
|
||||
let words = []
|
||||
const len = str.length
|
||||
for (var i = 1; i <= len; ++i) {
|
||||
|
|
@ -62,11 +62,10 @@ export function permutateWord(str) {
|
|||
* => ['hello', 'world']
|
||||
*/
|
||||
|
||||
export function splitwords(str) {
|
||||
const words = str
|
||||
.toLowerCase()
|
||||
export function splitwords (str) {
|
||||
const words = str.toLowerCase()
|
||||
.split(/[ /\-_]/)
|
||||
.filter((k) => k && k.length !== 0)
|
||||
.filter(k => k && k.length !== 0)
|
||||
|
||||
return words
|
||||
}
|
||||
|
|
@ -2,6 +2,6 @@
|
|||
* Checks if we're in preview mode (?preview=1).
|
||||
*/
|
||||
|
||||
export function isPreview() {
|
||||
export function isPreview () {
|
||||
return window.location.search.indexOf('preview=1') !== -1
|
||||
}
|
||||
|
|
@ -2,16 +2,16 @@
|
|||
* Helper: minimal qs implementation
|
||||
*/
|
||||
|
||||
export default function qs(search) {
|
||||
export default function qs (search) {
|
||||
search = search.substr(1)
|
||||
const parts = search.split('&').map((p) => p.split('='))
|
||||
const parts = search.split('&').map(p => p.split('='))
|
||||
return parts.reduce((result, part) => {
|
||||
result[part[0]] = qsdecode(part[1])
|
||||
return result
|
||||
}, {})
|
||||
}
|
||||
|
||||
export function qsdecode(string) {
|
||||
export function qsdecode (string) {
|
||||
if (!string) string = ''
|
||||
string = string.replace(/\+/g, ' ')
|
||||
return string
|
||||
|
|
@ -8,8 +8,8 @@ import qsa from 'dom101/query-selector-all'
|
|||
* Search.showAll()
|
||||
*/
|
||||
|
||||
export function showAll() {
|
||||
qsa('[data-search-index]').forEach((el) => {
|
||||
export function showAll () {
|
||||
qsa('[data-search-index]').forEach(el => {
|
||||
el.removeAttribute('aria-hidden')
|
||||
})
|
||||
}
|
||||
|
|
@ -21,20 +21,20 @@ export function showAll() {
|
|||
* Search.show('hello')
|
||||
*/
|
||||
|
||||
export function show(val) {
|
||||
export function show (val) {
|
||||
const keywords = splitwords(val)
|
||||
|
||||
if (!keywords.length) return showAll()
|
||||
|
||||
const selectors = keywords
|
||||
.map((k) => `[data-search-index~=${JSON.stringify(k)}]`)
|
||||
.map(k => `[data-search-index~=${JSON.stringify(k)}]`)
|
||||
.join('')
|
||||
|
||||
qsa('[data-search-index]').forEach((el) => {
|
||||
qsa('[data-search-index]').forEach(el => {
|
||||
el.setAttribute('aria-hidden', true)
|
||||
})
|
||||
|
||||
qsa(selectors).forEach((el) => {
|
||||
qsa(selectors).forEach(el => {
|
||||
el.removeAttribute('aria-hidden')
|
||||
})
|
||||
}
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
* })
|
||||
*/
|
||||
|
||||
export function update(key, fn) {
|
||||
export function update (key, fn) {
|
||||
if (!window.localStorage) return
|
||||
let data = JSON.parse(window.localStorage[key] || '{}')
|
||||
data = fn(data)
|
||||
|
|
@ -23,7 +23,7 @@ export function update(key, fn) {
|
|||
* const data = fetch('dismissed')
|
||||
*/
|
||||
|
||||
export function fetch(key) {
|
||||
export function fetch (key) {
|
||||
if (!window.localStorage) return
|
||||
return JSON.parse(window.localStorage[key] || '{}')
|
||||
}
|
||||
|
|
@ -6,7 +6,5 @@ import onmount from 'onmount'
|
|||
*/
|
||||
|
||||
ready(() => {
|
||||
setTimeout(() => {
|
||||
onmount()
|
||||
})
|
||||
setTimeout(() => { onmount() })
|
||||
})
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
/* eslint-env jest */
|
||||
import wrapify from '../index'
|
||||
import $ from 'jquery'
|
||||
|
||||
it('simple usage', run(`
|
||||
<div>
|
||||
<h2>simple usage<h2>
|
||||
|
||||
<h3>install</h3>
|
||||
<p>(install)</p>
|
||||
|
||||
<h3>usage</h3>
|
||||
<p>(usage)</p>
|
||||
</div>
|
||||
`, $div => {
|
||||
expect($div.find('.h2-section .h3-section-list .h3-section').length).toEqual(2)
|
||||
}))
|
||||
|
||||
it('h3 with class', run(`
|
||||
<div>
|
||||
<h3 class='-hello'>install</h3>
|
||||
<p>(install)</p>
|
||||
</div>
|
||||
`, $div => {
|
||||
expect($div.find('div.h3-section.-hello').length).toEqual(1)
|
||||
expect($div.find('div.h3-section-list.-hello').length).toEqual(1)
|
||||
}))
|
||||
|
||||
it('multiple h2s', run(`
|
||||
<div>
|
||||
<h2>multiple h2<h2>
|
||||
|
||||
<h3>install</h3>
|
||||
<p>(install)</p>
|
||||
|
||||
<h3>usage</h3>
|
||||
<p>(usage)</p>
|
||||
|
||||
<h2>getting started<h2>
|
||||
|
||||
<h3>first</h3>
|
||||
<p>(first)</p>
|
||||
|
||||
<h3>second</h3>
|
||||
<p>(second)</p>
|
||||
</div>
|
||||
`))
|
||||
|
||||
function run (input, fn) {
|
||||
return function () {
|
||||
const $div = $(input)
|
||||
wrapify($div[0])
|
||||
expect($div[0]).toMatchSnapshot()
|
||||
if (fn) fn($div)
|
||||
}
|
||||
}
|
||||
|
||||
it('h2 + pre', run(`
|
||||
<div>
|
||||
<h2>heading</h2>
|
||||
<pre class='language-markdown'>(code)</pre>
|
||||
</div>
|
||||
`))
|
||||
|
|
@ -1,12 +1,6 @@
|
|||
import matches from 'dom101/matches'
|
||||
import addClass from 'dom101/add-class'
|
||||
import {
|
||||
appendMany,
|
||||
nextUntil,
|
||||
before,
|
||||
findChildren,
|
||||
createDiv
|
||||
} from '../helpers/dom'
|
||||
import { appendMany, nextUntil, before, findChildren, createDiv } from '../helpers/dom'
|
||||
|
||||
/**
|
||||
* Wraps h2 sections into h2-section.
|
||||
|
|
@ -15,16 +9,14 @@ import {
|
|||
* @private
|
||||
*/
|
||||
|
||||
export default function wrapify(root) {
|
||||
export default function wrapify (root) {
|
||||
// These are your H2 sections. Returns a list of .h2-section nodes.
|
||||
const sections = wrapifyH2(root)
|
||||
|
||||
// For each h2 section, wrap the H3's in them
|
||||
sections.forEach((section) => {
|
||||
sections.forEach(section => {
|
||||
const bodies = findChildren(section, '[data-js-h3-section-list]')
|
||||
bodies.forEach((body) => {
|
||||
wrapifyH3(body)
|
||||
})
|
||||
bodies.forEach(body => { wrapifyH3(body) })
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -41,15 +33,14 @@ export default function wrapify(root) {
|
|||
* @private
|
||||
*/
|
||||
|
||||
function wrapifyH2(root) {
|
||||
function wrapifyH2 (root) {
|
||||
return groupify(root, {
|
||||
tag: 'h2',
|
||||
wrapperFn: () => createDiv({ class: 'h2-section' }),
|
||||
bodyFn: () =>
|
||||
createDiv({
|
||||
class: 'body h3-section-list',
|
||||
'data-js-h3-section-list': ''
|
||||
})
|
||||
bodyFn: () => createDiv({
|
||||
class: 'body h3-section-list',
|
||||
'data-js-h3-section-list': ''
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -66,7 +57,7 @@ function wrapifyH2(root) {
|
|||
* @private
|
||||
*/
|
||||
|
||||
function wrapifyH3(root) {
|
||||
function wrapifyH3 (root) {
|
||||
return groupify(root, {
|
||||
tag: 'h3',
|
||||
wrapperFn: () => createDiv({ class: 'h3-section' }),
|
||||
|
|
@ -80,27 +71,27 @@ function wrapifyH3(root) {
|
|||
* @private
|
||||
*/
|
||||
|
||||
export function groupify(el, { tag, wrapperFn, bodyFn }) {
|
||||
export function groupify (el, { tag, wrapperFn, bodyFn }) {
|
||||
const first = el.children[0]
|
||||
let result = []
|
||||
|
||||
// Handle the markup before the first h2
|
||||
if (first && !matches(first, tag)) {
|
||||
const sibs = nextUntil(first, tag)
|
||||
result.push(wrap(first, null, [first, ...sibs]))
|
||||
result.push(wrap(first, null, [ first, ...sibs ]))
|
||||
}
|
||||
|
||||
// Find all h3's inside it
|
||||
const children = findChildren(el, tag)
|
||||
|
||||
children.forEach((child) => {
|
||||
children.forEach(child => {
|
||||
const sibs = nextUntil(child, tag)
|
||||
result.push(wrap(child, child, sibs))
|
||||
})
|
||||
|
||||
return result
|
||||
|
||||
function wrap(pivot, first, sibs) {
|
||||
function wrap (pivot, first, sibs) {
|
||||
const wrap = wrapperFn()
|
||||
|
||||
const pivotClass = pivot.className
|
||||
|
|
@ -1,32 +0,0 @@
|
|||
// Vendor and variables
|
||||
@import 'sanitize.css/sanitize.css';
|
||||
@import '../_sass/2017/variables.scss';
|
||||
@import '../node_modules/modularscale-sass/stylesheets/_modularscale.scss';
|
||||
@import '../_sass/vendor/ionicons-inline/ionicons.scss';
|
||||
|
||||
// Utilities
|
||||
@import '../_sass/2017/utils/carbon-style.scss';
|
||||
@import '../_sass/2017/utils/_font-size.scss';
|
||||
@import '../_sass/2017/utils/gutter.scss';
|
||||
@import '../_sass/2017/utils/heading-style.scss';
|
||||
@import '../_sass/2017/utils/section-gutter.scss';
|
||||
@import '../_sass/2017/utils/section-with-container.scss';
|
||||
|
||||
// Base
|
||||
@import 'sanitize.css/sanitize.css';
|
||||
@import '../_sass/2017/base/base.scss';
|
||||
@import '../_sass/2017/base/fade.scss';
|
||||
|
||||
// Components
|
||||
@import '../_sass/2017/components/attribute-peg.scss';
|
||||
@import '../_sass/2017/components/announcements-item.scss';
|
||||
@import '../_sass/2017/components/announcements-list.scss';
|
||||
@import '../_sass/2017/components/back-button.scss';
|
||||
@import '../_sass/2017/components/body-area.scss';
|
||||
@import '../_sass/2017/components/codefund-sponsor.scss';
|
||||
@import '../_sass/2017/components/page-actions.scss';
|
||||
@import '../_sass/2017/components/pages-list.scss';
|
||||
@import '../_sass/2017/components/search-box.scss';
|
||||
@import '../_sass/2017/components/site-header.scss';
|
||||
@import '../_sass/2017/components/top-nav.scss';
|
||||
@import '../_sass/2017/components/top-sheet.scss';
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
// Vendor
|
||||
@import '../_sass/2017/variables.scss';
|
||||
@import '../node_modules/modularscale-sass/stylesheets/_modularscale.scss';
|
||||
@import '../_sass/vendor/ionicons-inline/ionicons.scss';
|
||||
|
||||
// Utilities
|
||||
@import '../_sass/2017/utils/carbon-style.scss';
|
||||
@import '../_sass/2017/utils/_font-size.scss';
|
||||
@import '../_sass/2017/utils/gutter.scss';
|
||||
@import '../_sass/2017/utils/heading-style.scss';
|
||||
@import '../_sass/2017/utils/section-gutter.scss';
|
||||
@import '../_sass/2017/utils/section-with-container.scss';
|
||||
|
|
@ -1,30 +0,0 @@
|
|||
// Prismjs
|
||||
import 'prismjs'
|
||||
import 'prismjs/plugins/line-highlight/prism-line-highlight.min.js'
|
||||
import 'prismjs/components/prism-jsx.min.js'
|
||||
import 'prismjs/components/prism-bash.min.js'
|
||||
import 'prismjs/components/prism-scss.min.js'
|
||||
import 'prismjs/components/prism-css.min.js'
|
||||
import 'prismjs/components/prism-elixir.min.js'
|
||||
import 'prismjs/components/prism-ruby.min.js'
|
||||
|
||||
// Initializers
|
||||
import './initializers/prism'
|
||||
import './initializers/onmount'
|
||||
|
||||
// Behaviors
|
||||
import './behaviors/anchors'
|
||||
import './behaviors/dismissable'
|
||||
import './behaviors/dismiss'
|
||||
import './behaviors/disqus'
|
||||
import './behaviors/h3-section-list'
|
||||
import './behaviors/main-body'
|
||||
import './behaviors/no-preview'
|
||||
import './behaviors/searchable-header'
|
||||
import './behaviors/searchable-item'
|
||||
import './behaviors/search-form'
|
||||
import './behaviors/search-input'
|
||||
|
||||
// CSS
|
||||
import 'prismjs/plugins/line-highlight/prism-line-highlight.css'
|
||||
import 'hint.css/hint.min.css'
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
@import './_utils.scss';
|
||||
@import './_base.scss';
|
||||
|
||||
// Components
|
||||
@import '../_sass/2017/components/attribute-peg.scss';
|
||||
@import '../_sass/2017/components/announcements-item.scss';
|
||||
@import '../_sass/2017/components/announcements-list.scss';
|
||||
@import '../_sass/2017/components/back-button.scss';
|
||||
@import '../_sass/2017/components/body-area.scss';
|
||||
@import '../_sass/2017/components/codefund-sponsor.scss';
|
||||
@import '../_sass/2017/components/page-actions.scss';
|
||||
@import '../_sass/2017/components/pages-list.scss';
|
||||
@import '../_sass/2017/components/search-box.scss';
|
||||
@import '../_sass/2017/components/site-header.scss';
|
||||
@import '../_sass/2017/components/top-nav.scss';
|
||||
@import '../_sass/2017/components/top-sheet.scss';
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
@import './_utils.scss';
|
||||
@import './_base.scss';
|
||||
|
||||
// Markdown
|
||||
@import '../_sass/2017/markdown/a-em.scss';
|
||||
@import '../_sass/2017/markdown/code.scss';
|
||||
@import '../_sass/2017/markdown/headings.scss';
|
||||
@import '../_sass/2017/markdown/local-anchor.scss';
|
||||
@import '../_sass/2017/markdown/p.scss';
|
||||
@import '../_sass/2017/markdown/table.scss';
|
||||
@import '../_sass/2017/markdown/ul.scss';
|
||||
|
||||
// Components
|
||||
@import '../_sass/2017/components/back-button.scss';
|
||||
@import '../_sass/2017/components/body-area.scss';
|
||||
@import '../_sass/2017/components/codefund-sponsor.scss';
|
||||
@import '../_sass/2017/components/h3-section.scss';
|
||||
@import '../_sass/2017/components/h3-section-list.scss';
|
||||
@import '../_sass/2017/components/main-heading.scss';
|
||||
@import '../_sass/2017/components/page-actions.scss';
|
||||
@import '../_sass/2017/components/top-nav.scss';
|
||||
|
|
@ -1 +0,0 @@
|
|||
window.Prism = require('prismjs')
|
||||
|
|
@ -1,88 +0,0 @@
|
|||
/* eslint-env jest */
|
||||
import wrapify from '../index'
|
||||
|
||||
it(
|
||||
'simple usage',
|
||||
run(
|
||||
`
|
||||
<div>
|
||||
<h2>simple usage<h2>
|
||||
|
||||
<h3>install</h3>
|
||||
<p>(install)</p>
|
||||
|
||||
<h3>usage</h3>
|
||||
<p>(usage)</p>
|
||||
</div>
|
||||
`,
|
||||
(root) => {
|
||||
expect(
|
||||
root.querySelectorAll('.h2-section .h3-section-list .h3-section').length
|
||||
).toEqual(2)
|
||||
}
|
||||
)
|
||||
)
|
||||
|
||||
it(
|
||||
'h3 with class',
|
||||
run(
|
||||
`
|
||||
<div>
|
||||
<h3 class='-hello'>install</h3>
|
||||
<p>(install)</p>
|
||||
</div>
|
||||
`,
|
||||
(root) => {
|
||||
expect(root.querySelectorAll('div.h3-section.-hello').length).toEqual(1)
|
||||
expect(
|
||||
root.querySelectorAll('div.h3-section-list.-hello').length
|
||||
).toEqual(1)
|
||||
}
|
||||
)
|
||||
)
|
||||
|
||||
it(
|
||||
'multiple h2s',
|
||||
run(`
|
||||
<div>
|
||||
<h2>multiple h2<h2>
|
||||
|
||||
<h3>install</h3>
|
||||
<p>(install)</p>
|
||||
|
||||
<h3>usage</h3>
|
||||
<p>(usage)</p>
|
||||
|
||||
<h2>getting started<h2>
|
||||
|
||||
<h3>first</h3>
|
||||
<p>(first)</p>
|
||||
|
||||
<h3>second</h3>
|
||||
<p>(second)</p>
|
||||
</div>
|
||||
`)
|
||||
)
|
||||
|
||||
function run(input, fn) {
|
||||
return function () {
|
||||
const div = document.createElement('div')
|
||||
div.innerHTML = input
|
||||
|
||||
const root = div.children[0]
|
||||
wrapify(root)
|
||||
expect(root).toMatchSnapshot()
|
||||
|
||||
if (fn) fn(root)
|
||||
}
|
||||
}
|
||||
|
||||
it(
|
||||
'h2 + pre',
|
||||
run(`
|
||||
<div>
|
||||
<h2>heading</h2>
|
||||
<pre class='language-markdown'>(code)</pre>
|
||||
</div>
|
||||
`)
|
||||
)
|
||||
|
|
@ -43,7 +43,6 @@
|
|||
margin: 0;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
background: transparent;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,4 @@
|
|||
// Generated by parcel
|
||||
@import '../../assets/packed/app.css';
|
||||
|
||||
@import '../vendor/sanitize.css/sanitize';
|
||||
@import './variables';
|
||||
@import '../vendor/modularscale/modularscale';
|
||||
@import '../vendor/ionicons-inline/ionicons';
|
||||
|
|
|
|||
|
|
@ -80,14 +80,14 @@ $modularscale : () !default;// Parse settings starting with defaults.
|
|||
// This does not support non-integer exponents,
|
||||
// Check and return an error if a non-integer exponent is passed.
|
||||
@if (floor($e) != $e) {
|
||||
// @error '
|
||||
// ======================================================================
|
||||
// Non-integer values are not supported in modularscale by default.
|
||||
@error '
|
||||
======================================================================
|
||||
Non-integer values are not supported in modularscale by default.
|
||||
|
||||
// Try using mathsass in your project to add non-integer scale support.
|
||||
// https://github.com/terkel/mathsass
|
||||
// ======================================================================
|
||||
// '
|
||||
Try using mathsass in your project to add non-integer scale support.
|
||||
https://github.com/terkel/mathsass
|
||||
======================================================================
|
||||
'
|
||||
}
|
||||
|
||||
// Seed the return.
|
||||
|
|
|
|||
|
|
@ -0,0 +1,45 @@
|
|||
const critical = require('critical')
|
||||
|
||||
console.warn('Generating critical path styles into _includes/2017/critical/...')
|
||||
|
||||
const OPTIONS = {
|
||||
base: '_site',
|
||||
width: 1400,
|
||||
height: 900,
|
||||
minify: true,
|
||||
extract: true,
|
||||
ignore: [
|
||||
'@font-face'
|
||||
],
|
||||
include: [
|
||||
// fade-in magic (base/fade)
|
||||
/html\.WithJs/
|
||||
]
|
||||
}
|
||||
|
||||
critical.generate({
|
||||
...OPTIONS,
|
||||
src: 'index.html',
|
||||
dest: '../_includes/2017/critical/home.css',
|
||||
include: [
|
||||
...OPTIONS.include,
|
||||
|
||||
// searchbox with placeholder
|
||||
/\.search-box/
|
||||
]
|
||||
})
|
||||
|
||||
critical.generate({
|
||||
...OPTIONS,
|
||||
src: 'react.html',
|
||||
dest: '../_includes/2017/critical/sheet.css',
|
||||
include: [
|
||||
...OPTIONS.include,
|
||||
|
||||
// sections (and h3 section list), just to be sure
|
||||
/\.h3-section/,
|
||||
|
||||
// eg, -six-column in devhints.io/layout-thrashing
|
||||
/-column/
|
||||
]
|
||||
})
|
||||
|
|
@ -0,0 +1,73 @@
|
|||
const join = require('path').resolve
|
||||
const webpack = require('webpack')
|
||||
|
||||
module.exports = {
|
||||
context: join(__dirname, '..'),
|
||||
entry: {
|
||||
app: './_js/app.js',
|
||||
vendor: [
|
||||
// Large 3rd-party libs
|
||||
'prismjs',
|
||||
|
||||
// Prism plugins
|
||||
'prismjs/plugins/line-highlight/prism-line-highlight.min.js',
|
||||
'prismjs/components/prism-jsx.min.js',
|
||||
'prismjs/components/prism-bash.min.js',
|
||||
'prismjs/components/prism-scss.min.js',
|
||||
'prismjs/components/prism-css.min.js',
|
||||
'prismjs/components/prism-elixir.min.js',
|
||||
'prismjs/components/prism-ruby.min.js',
|
||||
|
||||
// CSS
|
||||
'prismjs/plugins/line-highlight/prism-line-highlight.css',
|
||||
'hint.css/hint.min.css'
|
||||
]
|
||||
},
|
||||
output: {
|
||||
path: join(__dirname, '..', 'assets', 'packed'),
|
||||
filename: '[name].js',
|
||||
devtoolModuleFilenameTemplate: 'webpack:///[absolute-resource-path]'
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: /node_modules/,
|
||||
use: [
|
||||
{ loader: 'babel-loader' }
|
||||
]
|
||||
},
|
||||
{
|
||||
test: /\.css$/,
|
||||
use: [
|
||||
{ loader: 'style-loader' },
|
||||
{ loader: 'css-loader' }
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
resolve: {
|
||||
alias: {
|
||||
// Never bundle jQuery
|
||||
'jquery': join(__dirname, '..', '_js/helpers/noop.js')
|
||||
}
|
||||
},
|
||||
stats: 'minimal',
|
||||
plugins: [
|
||||
// Optimize module ID's for vendor chunks
|
||||
new webpack.HashedModuleIdsPlugin({
|
||||
hashFunction: 'sha256',
|
||||
hashDigest: 'base64',
|
||||
hashDigestLength: 20
|
||||
}),
|
||||
|
||||
// Optimize vendor
|
||||
new webpack.optimize.CommonsChunkPlugin('vendor'),
|
||||
|
||||
// Don't include debug symbols ever
|
||||
new webpack.EnvironmentPlugin({
|
||||
NODE_ENV: 'production'
|
||||
})
|
||||
],
|
||||
devtool: 'source-map'
|
||||
}
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
const join = require('path').resolve
|
||||
const webpack = require('webpack')
|
||||
|
||||
module.exports = {
|
||||
context: join(__dirname, '..'),
|
||||
entry: './_js/critical.js',
|
||||
output: {
|
||||
path: join(__dirname, '..', '_includes', '2017', 'critical'),
|
||||
filename: 'critical.js'
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: /node_modules/,
|
||||
use: [
|
||||
{ loader: 'babel-loader' }
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
stats: 'minimal',
|
||||
plugins: [
|
||||
new webpack.EnvironmentPlugin({
|
||||
NODE_ENV: 'production'
|
||||
})
|
||||
]
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -6,14 +6,11 @@ services:
|
|||
- .:/app
|
||||
- rubygems:/usr/local/bundle
|
||||
- ./node_modules:/app/node_modules
|
||||
- yarn_cache:/root/.cache/yarn
|
||||
ports:
|
||||
- '4001:4001'
|
||||
- '35729:35729'
|
||||
command: >
|
||||
bash -c 'yarn; bundle; env PORT=4001 HOST=0.0.0.0 yarn run dev'
|
||||
command: 'env PORT=4001 HOST=0.0.0.0 yarn run dev'
|
||||
|
||||
volumes:
|
||||
rubygems:
|
||||
node_modules:
|
||||
yarn_cache:
|
||||
|
|
|
|||
16
netlify.toml
16
netlify.toml
|
|
@ -1,16 +0,0 @@
|
|||
[build]
|
||||
command = "yarn build"
|
||||
publish = "_site/"
|
||||
|
||||
[[plugins]]
|
||||
# https://www.npmjs.com/package/netlify-plugin-minify-html
|
||||
package = "netlify-plugin-minify-html"
|
||||
|
||||
[plugins.inputs]
|
||||
contexts = [ 'production', 'branch-deploy', 'deploy-preview' ]
|
||||
|
||||
# https://github.com/kangax/html-minifier#options-quick-reference
|
||||
[plugins.inputs.minifierOptions]
|
||||
removeComments = true
|
||||
minifyCSS = true
|
||||
minifyJS = true
|
||||
93
package.json
93
package.json
|
|
@ -1,54 +1,59 @@
|
|||
{
|
||||
"name": "cheatsheets",
|
||||
"description": "Devhints.io",
|
||||
"version": "1.0.0",
|
||||
"main": "index.js",
|
||||
"repository": "https://github.com/rstacruz/cheatsheets.git",
|
||||
"author": "Rico Sta. Cruz <rstacruz@users.noreply.github.com>",
|
||||
"dependencies": {
|
||||
"autoprefixer": "^9.8.0",
|
||||
"dom101": "^2.2.1",
|
||||
"hint.css": "^2.6.0",
|
||||
"isotope-layout": "^3.0.6",
|
||||
"lodash.noop": "^3.0.1",
|
||||
"modularscale-sass": "^3.0.10",
|
||||
"onmount": "^1.3.0",
|
||||
"postcss-modules": "^2.0.0",
|
||||
"prismjs": "^1.20.0",
|
||||
"sanitize.css": "^11.0.1",
|
||||
"sass": "^1.26.8"
|
||||
},
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.10.2",
|
||||
"@babel/preset-env": "^7.10.2",
|
||||
"jest": "26.0.1",
|
||||
"jest-html": "1.5.0",
|
||||
"netlify-plugin-minify-html": "^0.2.3",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"parcel-bundler": "^1.12.4",
|
||||
"prettier": "^2.0.5",
|
||||
"wait-on": "^5.0.1"
|
||||
"babel-core": "6.26.0",
|
||||
"babel-eslint": "8.0.1",
|
||||
"babel-jest": "21.2.0",
|
||||
"babel-loader": "7.1.2",
|
||||
"babel-preset-env": "1.6.0",
|
||||
"concurrently": "3.5.0",
|
||||
"css-loader": "0.28.7",
|
||||
"eslint-plugin-flowtype": "2.37.0",
|
||||
"jest": "21.2.1",
|
||||
"jest-html": "1.3.5",
|
||||
"npm-run-all": "4.1.1",
|
||||
"standard": "10.0.3",
|
||||
"style-loader": "0.18.2",
|
||||
"uglifyjs-webpack-plugin": "0.4.6",
|
||||
"webpack": "3.6.0"
|
||||
},
|
||||
"homepage": "https://devhints.io/",
|
||||
"jest": {
|
||||
"snapshotSerializers": [
|
||||
"<rootDir>/node_modules/jest-html"
|
||||
"scripts": {
|
||||
"critical": "make critical",
|
||||
"dev": "make dev",
|
||||
"test": "jest",
|
||||
"test:all": "run-s test lint",
|
||||
"lint": "standard -v",
|
||||
"jest-html": "jest-html"
|
||||
},
|
||||
"dependencies": {
|
||||
"babel-polyfill": "6.26.0",
|
||||
"critical": "0.9.1",
|
||||
"dom101": "2.2.1",
|
||||
"hint.css": "2.5.0",
|
||||
"isotope-layout": "3.0.4",
|
||||
"jquery": "3.2.1",
|
||||
"onmount": "1.3.0",
|
||||
"prettier": "1.11.1",
|
||||
"prismjs": "1.8.1",
|
||||
"sanitize.css": "5.0.0"
|
||||
},
|
||||
"standard": {
|
||||
"parser": "babel-eslint",
|
||||
"ignore": [
|
||||
"assets/script.js"
|
||||
],
|
||||
"plugins": [
|
||||
"flowtype"
|
||||
]
|
||||
},
|
||||
"license": "MIT",
|
||||
"main": "index.js",
|
||||
"private": true,
|
||||
"repository": "https://github.com/rstacruz/cheatsheets.git",
|
||||
"scripts": {
|
||||
"build": "run-s -s 'parcel:*:build' jekyll:build",
|
||||
"dev": "run-p -sl jekyll:watch 'parcel:*:watch'",
|
||||
"jekyll:build": "bundle exec jekyll build",
|
||||
"jekyll:watch": "wait-on assets/packed/app.js && bundle exec jekyll serve --safe --trace --drafts --watch --incremental --host ${HOST:-0.0.0.0} --port ${PORT:-3000}",
|
||||
"jest-html": "jest-html",
|
||||
"parcel:app:build": "parcel build '_parcel/app.js' -d assets/packed --no-source-maps --no-autoinstall",
|
||||
"parcel:app:watch": "parcel watch '_parcel/app.js' -d assets/packed --no-source-maps --no-autoinstall",
|
||||
"parcel:build": "run-s -s 'parcel:*:build'",
|
||||
"parcel:critical:build": "parcel build '_parcel/critical*.{js,scss}' -d _includes/2017/critical --no-source-maps --no-autoinstall",
|
||||
"parcel:critical:watch": "parcel watch '_parcel/critical*.{js,scss}' -d _includes/2017/critical --no-source-maps --no-autoinstall",
|
||||
"prettier:format": "prettier --write '_parcel/**/*.{js,scss}'",
|
||||
"test": "jest"
|
||||
"jest": {
|
||||
"snapshotSerializers": [
|
||||
" <rootDir>/node_modules/jest-html"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
module.exports = [
|
||||
require('./_support/webpack.config.js'),
|
||||
require('./_support/webpack.critical.js')
|
||||
]
|
||||
Loading…
Reference in New Issue