Skip to content

Instantly share code, notes, and snippets.

@AdamHjerpe
AdamHjerpe / SassMeister-input-HTML.html
Created March 12, 2014 01:17
Generated by SassMeister.com.
<section class="container">
<h1 class="section-title">Releases</h1>
<div class="test-col">Test! #1</div>
<div class="test-col">Test! #2</div>
<div class="test-col">Test! #3</div>
<div class="test-col">Test! #4</div>
<div class="test-col">Test! #5</div>
<div class="test-col">Test! #6</div>
<div class="test-col">Test! #7</div>
<div class="test-col">Test! #8</div>
@AdamHjerpe
AdamHjerpe / _grid.scss
Last active December 22, 2015 20:29
Base grid
@mixin base-grid {
$width: 100% !default;
$gutter: 1.4% !default;
$columns: 12 !default;
$column_width: $width / $columns;
$prefix: true !default;
$push: true !default;
body {
min-width: $width;
} // body
@AdamHjerpe
AdamHjerpe / _typography.scss
Created September 11, 2013 18:16
Basic Typography Styling
// ////////////////////////////////////
// // Import of fonts for bread text //
// ////////////////////////////////////
// @import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700);
// ///////////////////////////////////////////////////////////////
// // Change p-font variable to match imported font family name //
// ///////////////////////////////////////////////////////////////
@AdamHjerpe
AdamHjerpe / _responsive-font-size.scss
Created September 11, 2013 18:19
Making the base font-size reponsive
///////////////
// Variables //
///////////////
// Breakpoints
$break-small: 840px;
$break-large: 1024px;
////////////////
// Font-sizes //
@AdamHjerpe
AdamHjerpe / css_arrow_mixin.scss
Created October 7, 2013 20:32
CSS Arrow Mixin
// --------------------------------------------------------
// arrows
// --------------------------------------------------------
// $direction: top, left, right, bottom, top-left, top-right, bottom-left, bottom-right
// $color: hex, rgb or rbga
// $size: px or em
// @example
// .element{
// @include arrow(top, #000, 50px);
// }
@AdamHjerpe
AdamHjerpe / Package Control.json
Last active December 25, 2015 15:39
Package Control package settings for Sublime
{
"installed_packages":
[
"AdvancedNewFile",
"BracketHighlighter",
"CSScomb",
"CSSLint",
"DashDoc",
"DocBlockr",
"EJS",
@AdamHjerpe
AdamHjerpe / Preferences.json
Last active December 25, 2015 15:39
Preferences Sublime Text 3
{
"auto_match_enabled": true,
"bold_folder_labels": true,
"caret_style": "phase",
"color_scheme": "Packages/Theme - Spacegray/base16-ocean.dark.tmTheme",
"enable_tab_scrolling": true,
"font_face": "Inconsolata",
"font_size": 16,
"highlight_line": true,
"highlight_modified_tabs": true,
@AdamHjerpe
AdamHjerpe / _flatuicolors.scss
Created October 17, 2013 21:35
All the colors from flatuicolors.com put into variables with RGBA default and HEX fallback.
//////////////////////////////////////////////////////
// All colors courtesy of http://flatuicolors.com/ //
// Colors can be seen at that url too :) //
// Order goes: Light color first, darker second //
//////////////////////////////////////////////////////
// Green-Blue
$turquoise: #1abc9c rgba(26, 188, 156,1.0);
$green-sea: #16a085 rgba(22, 160, 133,1.0);
// Green
@AdamHjerpe
AdamHjerpe / _switch.scss
Last active December 28, 2015 02:49
Simple little switch
//
// Use following jQuery:
//
// <script type="text/javascript">
// $(document).ready( function(){
// $(".switch").click( function() {
// $(".switch").toggleClass("on");
// });
// });
// </script>
@AdamHjerpe
AdamHjerpe / _round-button.scss
Created November 17, 2013 01:45
Weird round button that centers on the bottom border of an image. TODO: Convert to mixin and placeholder class
// Markup
// <figure>
// <img src="http://placekitten.com/g/350/244" />
// <a href="#"></a>
// </figure>
figure {
$button-size: 3rem;