Andrew Solomon andysolomon

## jEOzRE.markdown

      
              3 files
            
          
              0 forks
            
          
                0 comments
              
            
              0 stars
            
          
                andysolomon
                / jEOzRE.markdown
            
            
              Last active
              August 29, 2015 14:09
            
              
                A Pen by Andrew Solomon.
              
          
    jEOzRE

A Pen by Andrew Solomon on CodePen.
License.

  
## SassMeister-input-HTML.html
<!DOCTYPE html>
<html>
  <head>
    <title></title>
  </head>
  <body>
    <h1>
      MUI-SPLITS
    </h1>
    <section class="content">

## index.html
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-git.js"></script>
<script src="http://code.jquery.com/jquery-compat-git.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
<style id="jsbin-css">
body { font-family: sans-serif; }

## MUI-TABS
<h1>MUI-TABS</h1>


<section class="content">
  <h2>Standard Tabs</h2>
  <div class="mui-tabs">
    <ul class="mui-tabs__controls">
  <li class="mui-tabs__item">
    <a class="mui-tabs__link" href="#css">CSS</a>
  </li>

## List Abstractions
<h1>List Abstractions</h1>

<section class="content">
  <h2>List -- Vertical</h2>
<ul class="mui-list">
  <li>CSS</li>
  <li>XHTML</li>
  <li>Semantics</li>
  <li>Accessibility</li>
  <li>Usability</li>

## SassMeister-input.sass
// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// ----

%hand
  background: #ccc
%foot
  background: #B0c
%brain

## SassMeister-input.scss
// ----
// Sass (v3.3.8)
// Compass (v1.0.0.alpha.19)
// ----

// Hacking made easy
// ---
// A couple of Sass functions
// To ease the pain of dealing
// With special values for IE

## SassMeister-input.sass
// ----
// Sass (v3.3.14)
// Compass (v1.0.0.rc.1)
// ----


@for $i from 1 through 5
  .col-#{$i}
    width: #{$i}px

## SassMeister-input-HTML.haml
.hexagon
  .hexTop
  .hexBottom

## SassMeister-input-HTML.haml
.box
  .icon
.box
  .regular
	<!DOCTYPE html>
	<html>
	<head>
	<title></title>
	</head>
	<body>
	<h1>
	MUI-SPLITS
	</h1>
	<section class="content">
	<h1>MUI-TABS</h1>


	<section class="content">
	<h2>Standard Tabs</h2>
	<div class="mui-tabs">
	<ul class="mui-tabs__controls">
	<li class="mui-tabs__item">
	<a class="mui-tabs__link" href="#css">CSS</a>
	</li>
	<h1>List Abstractions</h1>

	<section class="content">
	<h2>List -- Vertical</h2>
	<ul class="mui-list">
	<li>CSS</li>
	<li>XHTML</li>
	<li>Semantics</li>
	<li>Accessibility</li>
	<li>Usability</li>
	// ----
	// Sass (v3.4.7)
	// Compass (v1.0.1)
	// ----

	%hand
	background: #ccc
	%foot
	background: #B0c
	%brain
	// ----
	// Sass (v3.3.8)
	// Compass (v1.0.0.alpha.19)
	// ----

	// Hacking made easy
	// ---
	// A couple of Sass functions
	// To ease the pain of dealing
	// With special values for IE
	// ----
	// Sass (v3.3.14)
	// Compass (v1.0.0.rc.1)
	// ----


	@for $i from 1 through 5
	.col-#{$i}
	width: #{$i}px