Skip to content

Instantly share code, notes, and snippets.

View rafibomb's full-sized avatar

Rafi Benkual rafibomb

82 followers · 1 following
View GitHub Profile
@rafibomb
rafibomb / stack-links
Last active August 29, 2015 14:09
Stacking Inline Links on Mobile - Ink Responsive HTML Email
@rafibomb
rafibomb / 2-column-stacking
Created November 15, 2014 01:20
2 Column Stacking Inline Links on Mobile - Ink Responsive HTML Email
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width"/>
<link rel="stylesheet" href="ink.css"> <!-- For testing only -->
<link type="text/css" rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/foundicons/3.0.0/foundation-icons.css" />
<style type="text/css">
@rafibomb
rafibomb / SassMeister-input-HTML.html
Created January 15, 2015 19:58
Generated by SassMeister.com.
<ul class="custom">
<li>hello</li>
<li>hello</li>
<li>hello</li>
</ul>
@rafibomb
rafibomb / gist:afbd6eaa998cf3764fae
Created March 20, 2015 18:54
A basic example of the new menu-bar component markup
<ul class="menu-bar primary">
<li><a href="#">One</a></li>
<li><a href="#">Two</a></li>
<li><a href="#">Three</a></li>
<li><a href="#">Four</a></li>
</ul>
<ul class="menu-bar align-right primary">
<li><a href="#">One</a></li>
<li><a href="#">Two</a></li>
@rafibomb
rafibomb / gist:cd3e1c2746f12166168f
Created March 20, 2015 18:57
A basic example of the menu-bar icon markup.
<ul class="menu-bar primary">
<li><a href="#"><img src="http://placehold.it/20x20"><span>One</span></a></li>
<li><a href="#"><img src="http://placehold.it/20x20"><span>Two</span></a></li>
<li><a href="#"><img src="http://placehold.it/20x20"><span>Three</span></a></li>
<li><a href="#"><img src="http://placehold.it/20x20"><span>Four</span></a></li>
</ul>
<ul class="menu-bar icon-top primary">
<li><a href="#"><img src="http://placehold.it/20x20"><span>One</span></a></li>
<li><a href="#"><img src="http://placehold.it/20x20"><span>Two</span></a></li>
@rafibomb
rafibomb / SassMeister-input-HTML.html
Created March 25, 2015 20:07
Generated by SassMeister.com.
<div class="custom-panel">
<p>I am text</p>
</div>
@rafibomb
rafibomb / desktop menu partial
Created May 2, 2015 04:17
Using Interchange on a mega-menu
<nav class="mega-menu">
<div class="row collapse">
<div class="medium-3 columns">
<img src="assets/img/duality.png" alt="company logo">
</div>
<div class="medium-7 columns">
<ul class="button-group even-3">
<li><a href="#" class="button" data-dropdown="living" data-options="is_hover:true; hover_timeout:500">Living Room Furniture</a></li>
<li><a href="#" class="button" data-dropdown="bedroom" data-options="is_hover:true; hover_timeout:500">Bedroom Room Furniture</a></li>
<li><a href="#" class="button" data-dropdown="storage" data-options="is_hover:true; hover_timeout:500">Storage<br>Furniture</a></li>
@rafibomb
rafibomb / SassMeister-input-HTML.html
Created May 11, 2015 18:29
Generated by SassMeister.com.
<div class="custom-switch">
<input id="switchName" type="checkbox">
<label for="switchName"></label>
</div>
@rafibomb
rafibomb / SassMeister-input-HTML.html
Created May 11, 2015 21:15
Generated by SassMeister.com.
<div class="my-switch">
<input id="switchName" type="checkbox">
<label for="switchName"></label>
</div>
@rafibomb
rafibomb / SassMeister-input-HTML.html
Created May 11, 2015 21:17
Generated by SassMeister.com.
<nav class="top-bar" data-topbar role="navigation">
<ul class="title-area">
<li class="name">
<h1><a href="#">My Site</a></h1>
</li>
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
</ul>
<section class="top-bar-section">