Skip to content

Instantly share code, notes, and snippets.

Georgios Kaleadis georgiee

Block or report user

Report or block georgiee

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@whoisryosuke
whoisryosuke / add-codepen-script-to-react-gatsby.js
Created Jul 9, 2018
ReactJS / GatsbyJS - Add a Codepen script to your blog posts. To see Codepens show in your posts, add the embed code into your Markdown files without the external Codepen JS script. Make sure to add this to the component you use to `createPage()` blog posts in `gatsby-node.js`
View add-codepen-script-to-react-gatsby.js
export default class BlogPost extends Component {
constructor(props) {
super(props);
this.state = {
'codepen': false
};
}
@cecilemuller
cecilemuller / 2018-https-localhost.md
Last active Oct 13, 2019
How to create an HTTPS certificate for localhost domains
View 2018-https-localhost.md

How to create an HTTPS certificate for localhost domains

This focuses on generating the certificates for loading local virtual hosts hosted on your computer, for development only.

Do not use self-signed certificates in production ! For online certificates, use Let's Encrypt instead (tutorial).

@krigersergei
krigersergei / accessibility.md
Last active Jul 15, 2019
Info collected about accessibility topics.
@jayphelps
jayphelps / package.json
Last active Oct 14, 2019
TypeScript output es2015, esm (ES Modules), CJS, UMD, UMD + Min + Gzip. Assumes you install typescript (tsc), rollup, uglifyjs either globally or included as devDependencies
View package.json
{
"scripts": {
"build": "npm run build:es2015 && npm run build:esm && npm run build:cjs && npm run build:umd && npm run build:umd:min",
"build:es2015": "tsc --module es2015 --target es2015 --outDir dist/es2015",
"build:esm": "tsc --module es2015 --target es5 --outDir dist/esm",
"build:cjs": "tsc --module commonjs --target es5 --outDir dist/cjs",
"build:umd": "rollup dist/esm/index.js --format umd --name YourLibrary --sourceMap --output dist/umd/yourlibrary.js",
"build:umd:min": "cd dist/umd && uglifyjs --compress --mangle --source-map --screw-ie8 --comments --o yourlibrary.min.js -- yourlibrary.js && gzip yourlibrary.min.js -c > yourlibrary.min.js.gz",
}
}
View workstation.md
@praveenpuglia
praveenpuglia / shadow-dom.md
Last active Oct 14, 2019
Everything you need to know about Shadow DOM
View shadow-dom.md

I am moving this gist to a github repo so more people can contribute to it. Also, it makes it easier for me to version control.

Please go to - https://github.com/praveenpuglia/shadow-dom-in-depth for latest version of this document. Also, if you find the document useful, please shower your love, go ⭐️ it. :)

Shadow DOM

Heads Up! It's all about the V1 Spec.

In a nutshell, Shadow DOM enables local scoping for HTML & CSS.

View faceapp.py
#!/usr/bin/python2
import requests
import os
import sys
import random
import string
FILTERS = [
"smile",
"smile_2",
@jonico
jonico / Jenkinsfile
Last active Oct 13, 2019
Example for a full blown Jenkins pipeline script with multiple stages, kubernetes templates, shared volumes, input steps, injected credentials, heroku deploy, sonarqube and artifactory integration, Docker containers, multiple Git commit statuses, PR merge vs branch build detection, REST API calls to GitHub deployment API, stage timeouts, stage c…
View Jenkinsfile
#!groovy
import groovy.json.JsonOutput
import groovy.json.JsonSlurper
def label = "mypod-${UUID.randomUUID().toString()}"
podTemplate(label: label, yaml: """
spec:
containers:
- name: mvn
image: maven:3.3.9-jdk-8-alpine
@ebidel
ebidel / fancy-tabs-demo.html
Last active Sep 11, 2019
Fancy tabs web component - shadow dom v1, custom elements v1, full a11y
View fancy-tabs-demo.html
<script>
function execPolyfill() {
(function(){
// CustomElementsV1.min.js v1 polyfill from https://github.com/webcomponents/webcomponentsjs/tree/v1/src/CustomElements/v1.
/*
Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
@paulirish
paulirish / what-forces-layout.md
Last active Oct 15, 2019
What forces layout/reflow. The comprehensive list.
View what-forces-layout.md

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Element

Box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
  • elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
  • elem.getClientRects(), elem.getBoundingClientRect()
You can’t perform that action at this time.