Skip to content

Instantly share code, notes, and snippets.

View coliff's full-sized avatar
coding and coffee

Christian Oliff coliff

coding and coffee
View GitHub Profile
@landsman
landsman / draft.js
Last active December 6, 2022 18:06
automatic convert bootstrap v. 3 to bootstrap v. 4 idea ... more on https://github.com/twbs/bootstrap/blob/v4-dev/docs/4.0/migration.md, http://upgrade-bootstrap.bootply.com/
let gulp = require('gulp'),
replace = require('gulp-batch-replace'),
filesExist = require('files-exist');
gulp.task('bt4', () =>
{
let diff = {
'@media (min-width: $screen-xs-min) and (max-width: $screen-sm-max)': '@media (min-width: map-get($grid-breakpoints, xs)) and (max-width: map-get($grid-breakpoints, xs))',
'@media (min-width: $screen-xs) and (max-width: ($screen-md-min - 1))': '@media (min-width: map-get($grid-breakpoints, xs)) and (max-width: map-get($grid-breakpoints, md)-1)',
@gijsbotje
gijsbotje / display-utilities.csv
Last active January 22, 2021 04:15
bootstrap v4 migration table for hidden-* and visible-*
Old New
.hidden .d-none
.hidden-xs-up .d-none
.hidden-xs .d-none .d-sm-[value]
.visible-xs .d-sm-none
.visible-xs-block .d-block .d-sm-none
.visible-xs-inline .d-inline .d-sm-none
.visible-xs-inline-block .d-inline-block .d-sm-none
.hidden-xs-down .d-none .d-sm-[value]
.hidden-sm .d-sm-none .d-md-[value]
@anschaef
anschaef / bootstrap-4-sass-mixins-cheat-sheet.scss
Last active April 12, 2024 08:49
Bootstrap 4 Sass Mixins [Cheat sheet with examples]
/* -------------------------------------------------------------------------- */
// All Bootstrap 4 Sass Mixins [Cheat sheet]
// Updated to Bootstrap v4.5.x
// @author https://anschaef.de
// @see https://github.com/twbs/bootstrap/tree/master/scss/mixins
/* -------------------------------------------------------------------------- */
/*
// ########################################################################## */
// New cheat sheet for Bootstrap 5:
@primaryobjects
primaryobjects / commit.png
Last active May 31, 2023 09:34
How to setup prettier as a pre-commit hook for Git commits.
commit.png
@samthor
samthor / safari-nomodule.js
Last active February 14, 2024 02:54
Safari 10.1 `nomodule` support
// UPDATE: In 2023, you should probably stop using this! The narrow version of Safari that
// does not support `nomodule` is probably not being used anywhere. The code below is left
// for posterity.
/**
* Safari 10.1 supports modules, but does not support the `nomodule` attribute - it will
* load <script nomodule> anyway. This snippet solve this problem, but only for script
* tags that load external code, e.g.: <script nomodule src="nomodule.js"></script>
*
* Again: this will **not** prevent inline script, e.g.:
@ericelliott
ericelliott / manifest.json
Created November 8, 2016 00:35
Sample manifest.json
{
"name": "My Progressive Web Application",
"short_name": "Progressive",
"start_url": "/?home=true",
"icons": [
{
"src": "/icons/icon36.png",
"sizes": "36x36",
"type": "image/png"
},
@zeux
zeux / why-surfacebook.md
Last active January 3, 2017 04:06
Surface Book vs Mac Book vs other Windows laptops

Since several people asked me why I chose Surface Book, here's why!

Why not a MacBook?

I've used a MacBook as my only laptop for several years now. When I switched from a Windows laptop, I immediately loved a very solid build, great touchpad, good hardware (for its time) and first-class Unix integration.

A month ago I significantly damaged my MBP screen (for the second time...), to the point where I can't really use it as a laptop. I eagerly waited for Apple's announcement, hoping to get a new MBP. As obvious from many posts, it was a letdown for many of us - here are the

@ffoodd
ffoodd / improved-sr-only.markdown
Last active May 16, 2024 23:15
Improved .sr-only

Improved .sr-only

Theorically bulletproof CSS class for visually hide anything and keep it accessible to ATs.

A Pen by ffoodd on CodePen.

License.

@coliff
coliff / jquery-conditional-with-fallback.htm
Last active April 13, 2018 08:55
Conditional statement to give IE 8 and lower jQuery 1.x and all other browsers jQuery 3.x
<!--[if gte IE 9]><!-->
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<!--<![endif]-->
<!--[if lt IE 9]>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<![endif]-->
@leofavre
leofavre / getEventPath.js
Last active August 23, 2021 06:50
This function serves as a polyfill for Event.composedPath()
/**
* Returns an array with all DOM elements affected by an event.
* The function serves as a polyfill for
* [`Event.composedPath()`](https://dom.spec.whatwg.org/#dom-event-composedpath).
*
* @category Event
* @param {Event} evt The triggered event.
* @return {Array.<HTMLElement>} The DOM elements affected by the event.
*
* @example