Andres Morey amorey

## appbar-example.html
<!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">
    <!-- load MUI -->
    <link href="//cdn.octodev:5000/mui-0.1.12/css/mui.min.css" rel="stylesheet" type="text/css" />
    <script src="//cdn.octodev:5000/mui-0.1.12/js/mui.min.js"></script>
  </head>

## input-animation-example.html
<!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">
    <!-- load MUI -->
    <link href="//cdn.muicss.com/mui-0.1.4/css/mui.min.css" rel="stylesheet" type="text/css" />
    <script src="//cdn.muicss.com/mui-0.1.4/js/mui.min.js"></script>
    <!-- custom css -->

## gist:25689b839441008003b2
<nav class="mui-appbar" role="navigation">
  <div class="mui-container">
    <table id="appbar-inner">
      <tr class="mui-appbar-height">
        <td>
          <a id="appbar-sidenav-toggle"><i class="icon-menu"></i></a>
          <a class="appbar-brand" href="/">MUI</a>
        </td>
        <td id="appbar-cell-right">
          <a href="/docs/v1/getting-started/introduction" class="mui-hidden-xs">Documentation</a>

## gist:283a4236a1b2e0b29d50
<!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">
    <!-- load MUI -->
    <link href="//cdn.muicss.com/mui-0.1.2/css/mui.min.css" rel="stylesheet" type="text/css" />
    <script src="//cdn.muicss.com/mui-0.1.2/js/mui.min.js"></script>
    <!-- Sidenav CSS -->

## gist:ba26bf4c48aac5b9e0a5
function showSidenav() {
  // show overlay
  var $overlayEl = $(mui.overlay('on'));

  // show element
  $sidenav
    .appendTo($overlayEl)
    .show()
    .animate({left: '0px'}, 150);
};
	<!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">
	<!-- load MUI -->
	<link href="//cdn.octodev:5000/mui-0.1.12/css/mui.min.css" rel="stylesheet" type="text/css" />
	<script src="//cdn.octodev:5000/mui-0.1.12/js/mui.min.js"></script>
	</head>
	<nav class="mui-appbar" role="navigation">
	<div class="mui-container">
	<table id="appbar-inner">
	<tr class="mui-appbar-height">
	<td>
	<a id="appbar-sidenav-toggle"><i class="icon-menu"></i></a>
	<a class="appbar-brand" href="/">MUI</a>
	</td>
	<td id="appbar-cell-right">
	<a href="/docs/v1/getting-started/introduction" class="mui-hidden-xs">Documentation</a>
	function showSidenav() {
	// show overlay
	var $overlayEl = $(mui.overlay('on'));

	// show element
	$sidenav
	.appendTo($overlayEl)
	.show()
	.animate({left: '0px'}, 150);
	};