Skip to content

Instantly share code, notes, and snippets.

View jackabox's full-sized avatar
🛠️
Available for Hire

Jack Whiting jackabox

🛠️
Available for Hire
View GitHub Profile
@jackabox
jackabox / phpunit.xml
Created June 4, 2019 10:14
Disable telescope on phpunit.xml
...
<php>
...
<env name="TELESCOPE_ENABLED" value="false"/>
</php>
...
@jackabox
jackabox / ProgressBar.vue
Last active March 20, 2023 18:50
Vue/Nuxt window on scroll event
<template>
<div class="progress-bar">
<div class="filled-bar" :style="{ transform: `translate3d(-${100-value}%, 0, 0)` }"></div>
</div>
</template>
<script>
export default {
props: ['value']
}
@jackabox
jackabox / nuxt.config.js
Created May 23, 2019 15:34
scroll views to top
router: {
scrollBehavior: function(to, from, savedPosition) {
return { x: 0, y: 0 }
}
}
@jackabox
jackabox / typography-alt.css
Last active May 1, 2019 10:06
Responsive Scaling Font with min font-size.
p,
font-size: 16px;
@screen xlarge {
font-size: 1.042vw;
}
@media (max-width: calc(20 / 1.042 * 100 * 1px)) and (min-width: theme('screens.xlarge')) {
font-size: 20px;
}
@jackabox
jackabox / gist:15373469493c5f8922a07cd68b0733d8
Created January 22, 2019 11:20
Enable vue config devtools
Vue.config.devtools = true
{% for year in now.year .. firstEntryEver.postDate.year %}
{{ year }}
{% endfor %}
@jackabox
jackabox / filter.twig
Last active August 14, 2018 14:38
Querying based on request params in Craft 3
{# Set up the request params and queries. #}
{% set req = craft.request %}
{% set params = ['date', 'category'] %}
{% set query = {} %}
{% set search = [] %}
{% for param in params %}
{% set key = param | camel %}
{% set value = req.getParam(param) %}
@jackabox
jackabox / script.js
Created August 13, 2018 08:49
Craft 3 Contact Form Ajax.
/*
Ajax submission of contact form within craft. ES6, vanilla js.
*/
let contactForm = document.getElementById('footer_contact');
if (contactForm) {
contactForm.addEventListener('submit', e => {
e.preventDefault();
let formData = new FormData(contactForm);
@jackabox
jackabox / index.twig
Created August 8, 2018 09:33
Pure JS map foreach with html data-attr
<div class="map-holder" data-lat="{{ office.map.lat }}" data-lng="{{ office.map.lng }}" data-zoom="{{ office.map.zoom }}">
@jackabox
jackabox / firebase.js
Created June 28, 2018 13:12
firebase switch config based on env
const prodConfig = {
apiKey: YOUR_API_KEY,
authDomain: YOUR_AUTH_DOMAIN,
databaseURL: YOUR_DATABASE_URL,
projectId: YOUR_PROJECT_ID,
storageBucket: '',
messagingSenderId: YOUR_MESSAGING_SENDER_ID,
}
const devConfig = {