Skip to content

Instantly share code, notes, and snippets.

Avatar

Jack Sleight jacksleight

View GitHub Profile
@jacksleight
jacksleight / CustomNav.php
Last active May 10, 2021
Statamic Nav Performance Experiment
View CustomNav.php
<?php
namespace App\Tags;
use Statamic\Tags\Tags;
use Statamic\Contracts\Structures\Structure as StructureContract;
use Statamic\Facades\Site;
use Statamic\Facades\URL;
use Statamic\Structures\TreeBuilder;
use Statamic\Facades\Data;
@jacksleight
jacksleight / cp-name.blade.php
Created Mar 25, 2021
Statamic Automatic Custom CP Logo
View cp-name.blade.php
<svg width="280" height="32" xmlns="http://www.w3.org/2000/svg">
<style>
text {
font-family: Inter UI,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue;
font-size: 18px;
fill: #19292f;
}
</style>
<text x="0" y="22">{{ config('statamic.cp.custom_cms_name') }}</text>
</svg>
View non-shadow-slot.js
import { LitElement, html } from 'lit-element';
import { templateContent } from 'lit-html/directives/template-content';
class MyElement extends LitElement {
createRenderRoot() {
return this;
}
connectedCallback() {
super.connectedCallback();
this.originalChildren = document.createElement('template');
@jacksleight
jacksleight / _Permanent-Google-API-OAuth-access-token.md
Last active Aug 22, 2016
Permanent Google API OAuth access token
View _Permanent-Google-API-OAuth-access-token.md

This code demonstrates how to use the PHP google/apiclient package to generate an OAuth refresh token, which you can then use indefinietly to generate access tokens for Google's APIs without any additional authentication.

The example uses the Picasa Web Albums API scope, but at the time of writing google/apiclient does not support this API. You can however use access tokens generated via this method to access that API, like so:

$data = file_get_contents("https://picasaweb.google.com/data/feed/api/user/default?access_token={$accessToken}");
@jacksleight
jacksleight / SassMeister-input.scss
Created Feb 25, 2016
Generated by SassMeister.com.
View SassMeister-input.scss
// ----
// libsass (v3.2.5)
// ----
.block {
$s: &;
color: red;
&_element {
border: 1px;
}
@jacksleight
jacksleight / _prefixed-event-names.js
Last active Aug 29, 2015
Prefixed transition and animation event names
View _prefixed-event-names.js
var transitionEnd = {
'WebkitTransition': 'webkitTransitionEnd',
'MozTransition' : 'transitionend',
'OTransition' : 'oTransitionEnd',
'msTransition' : 'MSTransitionEnd',
'transition' : 'transitionend'
}[Modernizr.prefixed('transition')];
var animationStart = {
'WebkitAnimation' : 'webkitAnimationStart',
@jacksleight
jacksleight / _change-css-without-transition.js
Last active Aug 29, 2015
Change CSS values without transition (jQuery)
View _change-css-without-transition.js
$.fn.reflow = function() {
this[0].offsetHeight;
return this;
};
$.fn.cssStatic = function(name, value) {
return this
.css('transition', 'none')
.css(name, value)
.reflow()
@jacksleight
jacksleight / _dynamic-z-index.scss
Last active Aug 29, 2015
Sass help function to dynamicly set z-index values based on number and order of layers
View _dynamic-z-index.scss
$layers:
modal,
nav,
header,
base;
@function layer($name) {
@return (length($layers) - index($layers, $name)) * 10;
}
@jacksleight
jacksleight / _bem-nearest-block.scss
Last active Aug 29, 2015
Sass helper function to get the nearest block in the current selector (if you *need* to nest them)
View _bem-nearest-block.scss
@function b() {
$selector: &;
@each $a in $selector {
@each $b in $a {
$selector: $b;
}
}
@each $type in '_', '__' {
@if str-index($selector, $type) {
$selector: str-slice($selector, 0, str-index($selector, $type) - 1);
@jacksleight
jacksleight / _bem-block.scss
Last active Sep 1, 2017
Sass helper function to get the block in the current selector
View _bem-block.scss
@function b() {
$selector: str-slice(inspect(&), 2, -2);
@each $type in '__', '--' {
@if str-index($selector, $type) {
$selector: str-slice($selector, 0, str-index($selector, $type) - 1);
}
}
@return $selector;
}