Skip to content

Instantly share code, notes, and snippets.

View justincarroll's full-sized avatar

Justin Carroll justincarroll

View GitHub Profile
@justincarroll
justincarroll / bootstrap-masonry-template.htm
Last active August 15, 2020 16:48
This is my template for using Masonry 3 with Bootstrap 3. For those of you who follow this gist a lot has changed since Bootstrap 2.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap Masonry Template</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=PT+Sans+Caption:400,700">
@justincarroll
justincarroll / off-canvas-bootstrap-template.htm
Last active December 19, 2015 13:08
This is a quick pattern for doing off-canvas panel type functionality with Bootstrap. The panel really isn't structured with Bootstrap per say, it's given its own width, but this is how I'd approach a solution.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Off-Canvas Bootstrap Template</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" href="style.css">
@justincarroll
justincarroll / wordpress-functions-template.php
Last active December 18, 2015 16:49
This is an ongoing list of my most-used WordPress snippets for functions.php files. Take the meat, spit out the bones! The eating references in these descriptions are mounting.
<?php
/* Updates jQuery manually */
function update_jquery() {
if (!is_admin()) {
wp_deregister_script("jquery");
wp_register_script("jquery", "http://code.jquery.com/jquery.js", false, "11.11.1");
@justincarroll
justincarroll / jquery-smooth-scroll-no-plugin.htm
Last active December 17, 2015 09:19
Bloated smooth-scroll jQuery plugins beware! jQuery has the inherent ability to smooth-scroll the page to a certain location with one line of code. The more you know...
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>jQuery Smooth Scroll Without a Plugin</title>
<style>p { height: 3000px; }</style>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="script.js"></script>
</head>
@justincarroll
justincarroll / css3-cross-browser-cheat-sheet.css
Last active December 17, 2015 08:38
This is basically a forked version of http://css3please.com/ stripped down and formatted the way I want it - meat and potatoes please.
.box_round {
-webkit-border-radius: 12px;
border-radius: 12px;
}
.box_shadow {
-webkit-box-shadow: 0px 0px 4px 0px #ffffff;
box-shadow: 0px 0px 4px 0px #ffffff;
}
@justincarroll
justincarroll / bootstrap-centered-navbar.htm
Last active December 17, 2015 08:38
This basically fakes a 3-column layout by positioning the middle column (absolutely) and using .pull-right on the last column. The first column, .brand goes unaffected. If you're planning to have a lot of list items in .nav.centered you'll want to tweak this solution with additional styling.
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap Centered Navbar</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" href="style.css">
@justincarroll
justincarroll / bootstrap-navbar-css-reset.css
Last active March 2, 2018 15:25
This is a CSS reset for the Bootstrap Navbar component. In the future I'd like to see them deploy an .unstyled class. Until then this'll do.
.navbar-inner,
.navbar-fixed-top .navbar-inner,
.navbar-fixed-bottom .navbar-inner,
.navbar-static-top .navbar-inner {
background: none;
border: none;
-webkit-border-radius: 0;
border-radius: 0;
-moz-box-shadow: none;
-webkit-box-shadow: none;
@justincarroll
justincarroll / bootstrap-basic-template.htm
Last active May 11, 2018 04:43
This is my personal Bootstrap 3 and Font Awesome 4 basic HTML template.
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap Basic Template</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" href="style.css">