Skip to content

Instantly share code, notes, and snippets.

View gpessia's full-sized avatar
🏠
Working from home

gpessia gpessia

🏠
Working from home
View GitHub Profile
@gpessia
gpessia / 10 SASS (SCSS) mixins
Last active May 19, 2022 17:19
10 SASS (SCSS) mixins you should be using in your projects | Engage
/* ==========================================================================
10 SASS (SCSS) mixins you should be using in your projects | Engage
http://engageinteractive.co.uk/blog/top-10-scss-mixins
========================================================================== */
/* ==========================================================================
To quickly centre a block element without having to worry about if there is any top or bottom margin already applied.
========================================================================== */
@gpessia
gpessia / gist:67e10664b3a32b5d0367
Created January 20, 2016 10:13 — forked from benoitboucart/gist:f80090c87fa97f4e4098
How to use Jekyll with Gulp
/**
* For more information see this tutorial: http://blog.webbb.be/use-jekyll-with-gulp/
*
* Libs import
* --> How to install? npm install --save-dev gulp-minify-html
* @type {[type]}
*/
var gulp = require('gulp'),
path = require('path'),
@gpessia
gpessia / csshr.css
Last active October 1, 2015 08:17
Simple Styles for <hr>'s
/* ex. https://css-tricks.com/examples/hrs/ */
/* Gradient color1 - color2 - color1 */
hr.style-one {
border: 0;
height: 1px;
background: #333;
background-image: linear-gradient(to right, #ccc, #333, #ccc);
}
@gpessia
gpessia / dummy-gene.html
Last active August 29, 2015 14:26 — forked from peace098beat/dummy-gene.html
ダミージェネレータ | unsplash.it
<a href="https://unsplash.it/">dummy generator<a/>
<img src="https://unsplash.it/200/300" alt="...">
<img src="https://unsplash.it/200/300?random" alt="...">
<img src="https://unsplash.it/200/300/list" alt="...">
<img src="https://unsplash.it/200/300?image=0" alt="...">
<img src="https://unsplash.it/200/300?blur" alt="...">
<img src="https://unsplash.it/200/300?gravity=east" alt="...">
<img src="https://unsplash.it/200/300?gravity=north" alt="...">
<img src="https://unsplash.it/200/300?gravity=south" alt="...">
@gpessia
gpessia / unsplash.sh
Last active August 29, 2015 14:26 — forked from chrismdp/unsplash.sh
Script to grab one of the 10 more recent images from Unsplash, and tint and blur it for use as an iTerm background using Solarized Dark
#!/bin/bash
# NOTE: requires ImageMagick
# NOTE: will tint to the Solarized Dark default background scheme, as the iTerm background blend option didn't lower the contrast enough for me
# NOTE: Optimised for a 1280x800 point screen (my 13" Retina MBP)
set -e
index=$[ 1 + $[ RANDOM % 10 ]]
img=`curl https://unsplash.com/rss/ | xmllint --xpath '/rss/channel/item['$index']/image/url/text()' -`
curl "$img" > ~/unsplash-latest.jpg &&
@gpessia
gpessia / Helvetica Neue stack
Created January 24, 2014 11:28
Helvetica Neue CSS font-family stack. Is there a web-safe Helvetica Neue CSS font-family stack? - See more at: http://rachaelmoore.name/posts/design/css/web-safe-helvetica-font-stack/#sthash.lt6rYYGz.dpuf
/**
* Helvetica Neue Normal (No Stretch)
*/
/* Helvetica Neue Black Font Stack */
.{font-family: "HelveticaNeueBlack", "HelveticaNeue-Black", "Helvetica Neue Black", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosBold', "Arial Black", sans-serif; font-weight:800; font-stretch:normal;}
/* Helvetica Neue Heavy Font Stack */
.{font-family: "HelveticaNeueHeavy", "HelveticaNeue-Heavy", "Helvetica Neue Heavy", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosBold', "Arial Black", sans-serif; font-weight:700; font-stretch:normal;}
[
//{ "keys": ["super+shift+w"], "command": "insert_snippet", "args": {"name": "Packages/User/w-md.sublime-snippet" }}
{ "keys": ["super+shift+w"], "command": "insert_snippet", "args": {"contents": "${1:p}$SELECTION${1:p}" }},
// Bold & Italic for Markdown Sintax
{ "keys": ["super+shift+i"], "command": "insert_snippet", "args": {"contents": "*${SELECTION}*" },"context":[{"key": "selector", "operator": "equal", "operand": "text.html.markdown", "match_all": true }]},
{ "keys": ["super+shift+b"], "command": "insert_snippet", "args": {"contents": "**${SELECTION}**" },"context":[{"key": "selector", "operator": "equal", "operand": "text.html.markdown", "match_all": true }]},
// Bold & Italic for HTML Sintax
{ "keys": ["super+shift+i"], "command": "insert_snippet", "args": {"contents": "<em>${SELECTION}</em>" },"context":[{"key": "selector", "operator": "equal", "operand": "text.html", "match_all": true }]},
@gpessia
gpessia / minimal-css-reset.css
Last active December 16, 2015 22:39
Minimal CSS Reset
/* Reset */
html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, dl,
dt, dd, blockquote, address{
margin: 0;
padding: 0;
}
<!-- copy this to YOUR_THEME.tmTheme-->
<dict>
<key>name</key>
<string>diff: deleted</string>
<key>scope</key>
<string>markup.deleted</string>
<key>settings</key>
<dict>
<key>background</key>
<string>#EAE3CA</string>