Skip to content

Instantly share code, notes, and snippets.

View ClementParis016's full-sized avatar
🐿️
Stretching some <div>s to make them flex

Clément Paris ClementParis016

🐿️
Stretching some <div>s to make them flex
36 followers · 28 following
View GitHub Profile
@ClementParis016
ClementParis016 / index.html
Created March 25, 2015 20:19
Sticky footer
<!doctype html>
<html>
<head></head>
<body>
<header>...</header>
<div>...</div>
<footer>...</footer>
@ClementParis016
ClementParis016 / ajax-helper.js
Created April 1, 2015 20:21
AJAX request helper (plain Javascript)
var ajax = {
newRequest: function(method, url, params, callback, context) {
this.context = context;
this.req = new XMLHttpRequest();
this.req.open(method, url, true);
if(params) {
this.params = this.encodeParams(params);
} else {
@ClementParis016
ClementParis016 / gulpfile.js
Last active August 29, 2015 14:20
Simple Gulp config
// Gulp plugins
var gulp = require('gulp'),
$ = require('gulp-load-plugins')();
browserSync = require('browser-sync'),
reload = browserSync.reload;
// Config
var AUTOPREFIXER_BROWSERS = ['last 2 versions'];
var SCSS_DIR = 'app/styles/scss/';
var STYLES_DIR = 'app/styles/';
@ClementParis016
ClementParis016 / Preferences.sublime-settings
Created December 9, 2015 11:21
Sublime Text 3 custom settings
{
// System
"folder_exclude_patterns": [],
"ignored_packages": [
"SublimeLinter",
"Vintage"
],
// Formatting
"tab_size": 4,
"tabs_small": true,
@ClementParis016
ClementParis016 / style.css
Created February 9, 2016 15:04
Fullscreen video background
video {
position: fixed; /* or absolute if fullscreen in parent */
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
-ms-transform: translateX(-50%) translateY(-50%);
@ClementParis016
ClementParis016 / _font-face.scss
Created August 3, 2016 17:16
A SCSS mixin for @font-face declarations with support for font-weight, font-style and font-stretch
@mixin font-face($name, $file, $weight, $style, $stretch) {
@font-face {
font-family: $name;
src: url('#{$file}.woff') format('woff'); // Add more of these if need multiple font formats for broader browser support
font-weight: $weight;
font-style: $style;
font-stretch: $stretch;
}
}
@ClementParis016
ClementParis016 / script.js
Last active July 10, 2024 14:09
TinyMCE characters counter plugin
tinymce.init({
plugins: 'charactercount',
elementpath: false
});
@ClementParis016
ClementParis016 / .editorconfig
Created September 6, 2016 15:56
My favorite .editorconfig
root = true
[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
indent_style = space
indent_size = 2
@ClementParis016
ClementParis016 / httpd.conf
Last active November 29, 2018 14:45
Load missing local WordPress uploads from the production server
# From https://stevegrunwell.github.io/wordpress-git/#/13
<IfModule mod_rewrite.c>
RewriteEngine on
# Attempt to load files from production if
# they're not in our local version
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule wp-content/uploads/(.*) \
@ClementParis016
ClementParis016 / index.html
Created November 23, 2016 11:33
Avoid text wrapping around floatted image
<div class="container">
<img class="floatted-image" src="http://placehold.it/350x150" alt="Dummy image">
<p class="no-wrapping-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas dapibus magna elit, a posuere lacus malesuada sed. Fusce ante metus, congue vel odio vitae, eleifend placerat metus. Suspendisse tempus dapibus mauris id faucibus. Curabitur augue erat, aliquet facilisis sem non, ultrices sollicitudin nulla. Etiam condimentum a nisl ut bibendum. Aliquam tellus nisi, ultrices at ligula eget, euismod tempus leo. Donec pellentesque, tortor et fringilla tincidunt, ex neque ullamcorper risus, quis sollicitudin elit nulla a nulla.</p>
</div>