add compiled files for bower availability

infowrap · Jul 24, 2013 · 0a1832d · 0a1832d
1 parent 1babd2f
commit 0a1832d
Show file tree

Hide file tree

Showing 16 changed files with 537 additions and 5 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,5 +1,2 @@
 bower_components
-css
-index.html
-js
 node_modules
diff --git a/README.md b/README.md
@@ -10,6 +10,21 @@ Add jQuery and then ..
       $(".infowrap-breadcrumbs").infowrapBreadcrumbs();
     });
 
+Options ..
+
+    // the maximum number of visible collapsed crumbs counting from the left
+    maxCollapsedCrumbs: 3
+
+    // the minimum width of a crumb when collapsed
+    minWidth: 30
+
+    // width of the shader block that is hidden in pixels. it is in the crumb
+    // object, but is pushed far right and hidden by the crumb's `overflow: hidden`
+    shaderWidth: 44
+
+    // the distance of your css shadow antumbra in pixels
+    shaderAntumbra: 25
+
 
 ## Examples
 

diff --git a/bower.json b/bower.json
@@ -1,4 +1,7 @@
 {
+  "name": "infowrap-breadcrumbs",
+  "version": "0.1.0",
+  "main": "js/breadcrumbs.min.js",
   "dependencies": {
     "jquery": "~2.0.3"
   }

diff --git a/css/boilerplate/template.css b/css/boilerplate/template.css
@@ -0,0 +1,17 @@
+* {
+  -webkit-font-smoothing: antialiased;
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+}
+html,
+body {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+}
+html {
+  font-size: 15px;
+}
+.container {
+  padding: 100px 30px;
+}
diff --git a/css/breadcrumbs.css b/css/breadcrumbs.css
@@ -0,0 +1,48 @@
+.infowrap-breadcrumbs {
+  color: #fff;
+  background-color: orange;
+  overflow: hidden;
+  position: relative;
+  height: 44px;
+}
+.infowrap-breadcrumbs .crumbs {
+  *zoom: 1;
+  -webkit-transition: all 0.5s ease;
+  -moz-transition: all 0.5s ease;
+  -o-transition: all 0.5s ease;
+  transition: all 0.5s ease;
+  position: absolute;
+  top: 0;
+  left: 0;
+  font-weight: bold;
+  width: 999999px;
+  overflow: hidden;
+}
+.infowrap-breadcrumbs .crumbs:before,
+.infowrap-breadcrumbs .crumbs:after {
+  display: table;
+  content: "";
+}
+.infowrap-breadcrumbs .crumbs:after {
+  clear: both;
+}
+.infowrap-breadcrumbs .crumbs .crumb {
+  line-height: 44px;
+  padding: 0 15px;
+  float: left;
+  display: inline-block;
+  position: relative;
+  overflow: hidden;
+  white-space: nowrap;
+}
+.infowrap-breadcrumbs .crumbs .crumb:last-child .shader {
+  box-shadow: none;
+}
+.infowrap-breadcrumbs .crumbs .crumb .shader {
+  width: 44px;
+  height: 44px;
+  position: absolute;
+  top: 0;
+  right: -88px;
+  box-shadow: 0 0 60px 0px #000;
+}
diff --git a/css/breadcrumbs.min.css b/css/breadcrumbs.min.css
diff --git a/css/styles.min.css b/css/styles.min.css
diff --git a/css/template.css b/css/template.css
@@ -0,0 +1,17 @@
+* {
+  -webkit-font-smoothing: antialiased;
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+}
+html,
+body {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+}
+html {
+  font-size: 15px;
+}
+.container {
+  padding: 100px 30px;
+}
diff --git a/css/template.min.css b/css/template.min.css
diff --git a/index.html b/index.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html><!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7"><![endif]--><!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]--><!--[if IE 8]><html class="no-js lt-ie9"><![endif]-->
+<!--[if gt IE 8]><!-->
+<html class="no-js">
+  <!--<![endif]-->
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <title></title>
+    <meta name="description" content="">
+    <meta name="viewport" content="width=device-width">
+    <link rel="stylesheet" href="css/styles.min.css">
+  </head>
+  <body><!--[if lt IE 7]>
+    <p class="chromeframe">You are using an&nbsp;<strong>outdated</strong>&nbsp;browser. Please&nbsp;<a href="http://browsehappy.com/">upgrade your browser</a>&nbsp;or&nbsp;<a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a>&nbsp;to improve your experience.</p><![endif]-->
+    <div class="container">
+      <div class="infowrap-breadcrumbs">
+        <div class="crumbs">
+          <div class="crumb">Files</div>
+          <div class="crumb">Vehicula Tortor</div>
+          <div class="crumb">Nullam Vestibulum Amet</div>
+          <div class="crumb">Ullamcorper</div>
+          <div class="crumb">Cras Magna</div>
+          <div class="crumb">Ornare Dapibus</div>
+          <div class="crumb">Parturient Fusce Lorem</div>
+        </div>
+      </div>
+    </div>
+    <script src="js/combined.min.js"></script>
+  </body>
+</html>