Skip to content

Instantly share code, notes, and snippets.

View jonathanpath's full-sized avatar

Jonathan Path jonathanpath

82 followers · 89 following
View GitHub Profile
@jonathanpath
jonathanpath / comment-title1.sublime-snippet
Last active August 29, 2015 13:59
SublimeText Comment Title Snippet
<snippet>
<content><![CDATA[
/* ==|====================
$1/$2
======================= */
]]></content>
<tabTrigger>comment-h1</tabTrigger>
</snippet>
@jonathanpath
jonathanpath / _ui-autocomplete.scss
Last active August 29, 2015 14:18
Simple border radius styling for jQuery UI autocomplete
.ui-autocomplete {
border-radius: 4px;
padding: 0;
.ui-menu-item {
margin: 0;
padding: 10px 20px;
border-bottom: solid 1px #eee;
&:first-child {
@jonathanpath
jonathanpath / _z-index.scss
Last active June 23, 2018 10:51
Z-index Sass scale
// ----------------------
// == Z-index scale (inspired by https://gist.github.com/fat/1f6da6b3bd0311a1f8a0)
// ----------------------
// Z-Index Scale (private vars)
// --------------------------------------------------
$zindex-1: 100;
$zindex-2: 200;
$zindex-3: 300;
$zindex-4: 400;
@jonathanpath
jonathanpath / _tag-editor.scss
Last active August 29, 2015 14:20
jQuert tag editor with bootstrap style
.tag-editor {
border-radius: 3px;
border-color: #ddd;
padding-top: 3px;
padding-bottom: 3px;
}
@jonathanpath
jonathanpath / _btn-social.scss
Last active August 29, 2015 14:20
Facebook and Twitter buttons (any framework override)
// Facebook
.btn-facebook {
background-color: #44619d !important;
color: #fff !important;
}
// Twitter
.btn-twitter {
background-color: #55acee !important;
color: #fff !important;
@jonathanpath
jonathanpath / _animations.scss
Last active August 29, 2015 14:20
Sass keyframes animations
// Slide In From The Bottom To The Top
// -------------------------------
@-webkit-keyframes slideInUp {
0% { -webkit-transform: translate3d(0, 100%, 0); }
100% { -webkit-transform: translate3d(0, 0, 0); }
}
@-moz-keyframes slideInUp {
0% { -moz-transform: translate3d(0, 100%, 0); }
100% { -moz-transform: translate3d(0, 0, 0); }
@jonathanpath
jonathanpath / bs-small.sublime-snippet
Last active August 29, 2015 14:20
Bootstrap media query small snippet sublime text
<snippet>
<content><![CDATA[
@media (min-width: \$screen-sm-min) {
}
]]></content>
<tabTrigger>bs-xsmall</tabTrigger>
<scope>source.scss</scope>
</snippet>
@jonathanpath
jonathanpath / materialize-medium.sublime-snippet
Created May 13, 2015 13:13
Materialize media query medium
<snippet>
<content><![CDATA[
@media #{\$medium-and-up} {
}
]]></content>
<tabTrigger>materialize query medium</tabTrigger>
<scope>source.scss</scope>
</snippet>
@jonathanpath
jonathanpath / share.js
Last active June 8, 2016 13:35
Share Twitter/Facebook/Googleplus Custom
$('a.js-share-facebook').click(function(e){
e.preventDefault();
var loc = encodeURIComponent($(this).attr('href'));
window.open('https://www.facebook.com/sharer/sharer.php?&u=' + loc, 'twitterwindow', 'height=450, width=550, top='+($(window).height() - 450)/2 +', left='+($(window).width() - 550)/2 +', toolbar=0, location=0, menubar=0, directories=0, scrollbars=0');
});
$('a.js-share-tweet').click(function(e){
e.preventDefault();
var loc = $(this).attr('href');
var text = $(this).data('text'); // Need title encoding http://stackoverflow.com/questions/10771728/encoding-get-the-title-for-twitter-share-url
@jonathanpath
jonathanpath / .main-title2.scss
Created May 28, 2015 17:19
Title with line in the vertical middle
.main-title2 {
text-align: center;
border-bottom: solid 1px #ddd;
margin-bottom: 50px;
span {
background-color: #fff;
padding: 5px 20px;
display: inline-block;
position: relative;