Initial commit

This commit is contained in:
zhongjin
2020-06-15 10:58:47 +08:00
commit 4f1dfe7564
8590 changed files with 1516878 additions and 0 deletions
@@ -0,0 +1,10 @@
## How to start developing in the CartoDB.js landing page
- Install node.js, from 0.10 version (http://nodejs.org/download/).
- Install grunt, ```npm install -g grunt-cli```.
- Install dependencies ```npm install```.
- Choose your desired ruby version and ```bundle install``` (necessary for compass gem).
- Install bower: ```npm install -g bower```
- Install bower dependencies: ```bower install```
- Start the server: ```grunt serve```.
- Happy editing!
@@ -0,0 +1,187 @@
// Header
// --------------------------------------------------
.Header {
background: url('/img/header-bg.png') center;
background-size: cover;
text-align: center;
color: #fff;
}
.Header-inner {
width: 400px;
}
.Header-title {
position: relative;
margin-bottom: 40px;
font-weight: 100;
font-size: 40px;
text-transform: uppercase;
&:after {
content: "";
display: block;
position: absolute;
left: 50%;
bottom: -20px;
margin-left: -36px;
width: 72px;
height: 1px;
background: rgba(#fff, .5);
}
strong {
font-weight: 700;
}
}
.Header-description {
margin-bottom: 30px;
font-size: 15px;
line-height: 22px;
}
// TabPanes
// --------------------------------------------------
.TabPanes {
margin: 20px 0 40px;
}
// Tabs
// --------------------------------------------------
.Tabs {
margin-bottom: 5px;
}
.Tab {
margin-left: 5px;
&:first-child {
margin-left: 0;
}
&.is-selected,
&:hover {
.Tab-link {
background: #666;
color: #fff;
text-decoration: none;
}
}
}
.Tab-link {
display: block;
padding: 0 10px;
border: 1px solid #666;
font: 13px/23px "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #666;
text-decoration: none;
border-radius: 2px;
transition: all .15s;
}
// Panes
// --------------------------------------------------
.CodeMirror {
height: auto !important;
font: 13px Consolas, Menlo, Courier, monospace;
padding: 2px;
margin: 0;
border: 1px solid #ddd;
background-color: #f8f8f8;
color: #666;
border-radius: 4px;
}
pre {
overflow: auto;
line-height: 19px;
margin-bottom: 24px;
padding: 18px;
}
// Examples
// --------------------------------------------------
.Examples {
margin-left: -10px;
margin-right: -10px;
}
.Example {
width: 300px;
}
.Example-inner {
display: block;
overflow: hidden;
margin: 10px;
border: 1px solid #ddd;
border-radius: 4px;
box-shadow: 0 0 8px rgba(#000, .15);
transition: all .15s;
&:hover {
text-decoration: none;
box-shadow: 0 0 8px rgba(#000, .2);
}
}
.Example-content {
border-top: 1px solid rgba(#000, .15);
padding: 10px 20px 20px;
}
.Example-img {
display: block;
border-radius: 4px 4px 0 0;
}
.Example-title {
width: 50%;
margin-bottom: 10px;
font-size: 15px;
line-height: 1.4;
color: #111;
}
.Example-description {
font-size: 13px;
line-height: 1.4;
color: #999;
}
.Example-type {
display: inline-block;
float: right;
max-width: 50%;
padding: 0 10px;
font-size: 11px;
line-height: 22px;
background: #999;
color: #fff;
border-radius: 12px;
text-transform: uppercase;
}
// Components
// --------------------------------------------------
.Components {
padding-left: 82px;
}
.Component-item {
float: left;
margin-left: -82px;
}
@@ -0,0 +1,264 @@
/* BASICS */
.CodeMirror {
/* Set height, width, borders, and global font properties here */
font-family: monospace;
height: 300px;
}
.CodeMirror-scroll {
/* Set scrolling behaviour here */
overflow: auto;
}
/* PADDING */
.CodeMirror-lines {
padding: 4px 0; /* Vertical padding around content */
}
.CodeMirror pre {
padding: 0 4px; /* Horizontal padding of content */
}
.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
background-color: white; /* The little square between H and V scrollbars */
}
/* GUTTER */
.CodeMirror-gutters {
border-right: 1px solid #ddd;
background-color: #f7f7f7;
white-space: nowrap;
}
.CodeMirror-linenumbers {}
.CodeMirror-linenumber {
padding: 0 3px 0 5px;
min-width: 20px;
text-align: right;
color: #999;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
/* CURSOR */
.CodeMirror div.CodeMirror-cursor {
border-left: 1px solid black;
z-index: 3;
}
/* Shown when moving in bi-directional text */
.CodeMirror div.CodeMirror-secondarycursor {
border-left: 1px solid silver;
}
.CodeMirror.cm-keymap-fat-cursor div.CodeMirror-cursor {
width: auto;
border: 0;
background: #7e7;
z-index: 1;
}
/* Can style cursor different in overwrite (non-insert) mode */
.CodeMirror div.CodeMirror-cursor.CodeMirror-overwrite {}
.cm-tab { display: inline-block; }
.CodeMirror-ruler {
border-left: 1px solid #ccc;
position: absolute;
}
/* DEFAULT THEME */
.cm-s-default .cm-keyword {color: #708;}
.cm-s-default .cm-atom {color: #219;}
.cm-s-default .cm-number {color: #164;}
.cm-s-default .cm-def {color: #00f;}
.cm-s-default .cm-variable {color: black;}
.cm-s-default .cm-variable-2 {color: #05a;}
.cm-s-default .cm-variable-3 {color: #085;}
.cm-s-default .cm-property {color: black;}
.cm-s-default .cm-operator {color: black;}
.cm-s-default .cm-comment {color: #a50;}
.cm-s-default .cm-string {color: #a11;}
.cm-s-default .cm-string-2 {color: #f50;}
.cm-s-default .cm-meta {color: #555;}
.cm-s-default .cm-qualifier {color: #555;}
.cm-s-default .cm-builtin {color: #30a;}
.cm-s-default .cm-bracket {color: #997;}
.cm-s-default .cm-tag {color: #170;}
.cm-s-default .cm-attribute {color: #00c;}
.cm-s-default .cm-header {color: blue;}
.cm-s-default .cm-quote {color: #090;}
.cm-s-default .cm-hr {color: #999;}
.cm-s-default .cm-link {color: #00c;}
.cm-negative {color: #d44;}
.cm-positive {color: #292;}
.cm-header, .cm-strong {font-weight: bold;}
.cm-em {font-style: italic;}
.cm-link {text-decoration: underline;}
.cm-s-default .cm-error {color: #f00;}
.cm-invalidchar {color: #f00;}
div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;}
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
.CodeMirror-activeline-background {background: #e8f2ff;}
/* STOP */
/* The rest of this file contains styles related to the mechanics of
the editor. You probably shouldn't touch them. */
.CodeMirror {
line-height: 1;
position: relative;
overflow: hidden;
background: white;
color: black;
}
.CodeMirror-scroll {
/* 30px is the magic margin used to hide the element's real scrollbars */
/* See overflow: hidden in .CodeMirror */
margin-right: -30px;
padding-bottom: 30px;
height: 93%;
outline: none; /* Prevent dragging from highlighting the element */
position: relative;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.CodeMirror-sizer {
position: relative;
border-right: 30px solid transparent;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
/* The fake, visible scrollbars. Used to force redraw during scrolling
before actuall scrolling happens, thus preventing shaking and
flickering artifacts. */
.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
position: absolute;
z-index: 6;
display: none;
}
.CodeMirror-vscrollbar {
right: 0; top: 0;
overflow-x: hidden;
overflow-y: scroll;
}
.CodeMirror-hscrollbar {
bottom: 0; left: 0;
overflow-y: hidden;
overflow-x: scroll;
}
.CodeMirror-scrollbar-filler {
right: 0; bottom: 0;
}
.CodeMirror-gutter-filler {
left: 0; bottom: 0;
}
.CodeMirror-gutters {
position: absolute; left: 0; top: 0;
padding-bottom: 30px;
z-index: 3;
}
.CodeMirror-gutter {
white-space: normal;
height: 100%;
-moz-box-sizing: content-box;
box-sizing: content-box;
padding-bottom: 30px;
margin-bottom: -32px;
display: inline-block;
/* Hack to make IE7 behave */
*zoom:1;
*display:inline;
}
.CodeMirror-gutter-elt {
position: absolute;
cursor: default;
z-index: 4;
}
.CodeMirror-lines {
cursor: text;
}
.CodeMirror pre {
/* Reset some styles that the rest of the page might have set */
-moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
border-width: 0;
background: transparent;
font-family: inherit;
font-size: inherit;
margin: 0;
white-space: pre;
word-wrap: normal;
line-height: inherit;
color: inherit;
z-index: 2;
position: relative;
overflow: visible;
}
.CodeMirror-wrap pre {
word-wrap: break-word;
white-space: pre-wrap;
word-break: normal;
}
.CodeMirror-linebackground {
position: absolute;
left: 0; right: 0; top: 0; bottom: 0;
z-index: 0;
}
.CodeMirror-linewidget {
position: relative;
z-index: 2;
overflow: auto;
}
.CodeMirror-widget {}
.CodeMirror-wrap .CodeMirror-scroll {
overflow-x: hidden;
}
.CodeMirror-measure {
position: absolute;
width: 100%;
height: 0;
overflow: hidden;
visibility: hidden;
}
.CodeMirror-measure pre { position: static; }
.CodeMirror div.CodeMirror-cursor {
position: absolute;
visibility: hidden;
border-right: none;
width: 0;
}
.CodeMirror-focused div.CodeMirror-cursor {
visibility: visible;
}
.CodeMirror-selected { background: #d9d9d9; }
.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
.cm-searching {
background: #ffa;
background: rgba(255, 255, 0, .4);
}
/* IE7 hack to prevent it from returning funny offsetTops on the spans */
.CodeMirror span { *vertical-align: text-bottom; }
@media print {
/* Hide the cursor when printing */
.CodeMirror div.CodeMirror-cursor {
visibility: hidden;
}
}
@@ -0,0 +1,181 @@
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\000034}}
.Header {
background: url("/img/header-bg.png") center;
background-size: cover;
text-align: center;
color: #fff;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000311}}
.Header-inner {
width: 400px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000315}}
.Header-title {
position: relative;
margin-bottom: 40px;
font-weight: 100;
font-size: 40px;
text-transform: uppercase;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000322}}
.Header-title:after {
content: "";
display: block;
position: absolute;
left: 50%;
bottom: -20px;
margin-left: -36px;
width: 72px;
height: 1px;
background: rgba(255, 255, 255, 0.5);
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000334}}
.Header-title strong {
font-weight: 700;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000339}}
.Header-description {
margin-bottom: 30px;
font-size: 15px;
line-height: 22px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000349}}
.TabPanes {
margin: 20px 0 40px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000357}}
.Tabs {
margin-bottom: 5px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000361}}
.Tab {
margin-left: 5px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000364}}
.Tab:first-child {
margin-left: 0;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000370}}
.Tab.is-selected .Tab-link, .Tab:hover .Tab-link {
background: #666;
color: #fff;
text-decoration: none;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000378}}
.Tab-link {
display: block;
padding: 0 10px;
border: 1px solid #666;
font: 13px/23px "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #666;
text-decoration: none;
border-radius: 2px;
transition: all .15s;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\0000393}}
.CodeMirror {
height: auto !important;
font: 13px Consolas, Menlo, Courier, monospace;
padding: 2px;
margin: 0;
border: 1px solid #ddd;
background-color: #f8f8f8;
color: #666;
border-radius: 4px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003104}}
pre {
overflow: auto;
line-height: 19px;
margin-bottom: 24px;
padding: 18px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003115}}
.Examples {
margin-left: -10px;
margin-right: -10px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003120}}
.Example {
width: 300px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003124}}
.Example-inner {
display: block;
overflow: hidden;
margin: 10px;
border: 1px solid #ddd;
border-radius: 4px;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
transition: all .15s;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003133}}
.Example-inner:hover {
text-decoration: none;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003139}}
.Example-content {
border-top: 1px solid rgba(0, 0, 0, 0.15);
padding: 10px 20px 20px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003144}}
.Example-img {
display: block;
border-radius: 4px 4px 0 0;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003149}}
.Example-title {
width: 50%;
margin-bottom: 10px;
font-size: 15px;
line-height: 1.4;
color: #111;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003157}}
.Example-description {
font-size: 13px;
line-height: 1.4;
color: #999;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003163}}
.Example-type {
display: inline-block;
float: right;
max-width: 50%;
padding: 0 10px;
font-size: 11px;
line-height: 22px;
background: #999;
color: #fff;
border-radius: 12px;
text-transform: uppercase;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003180}}
.Components {
padding-left: 82px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/main\.scss}line{font-family:\00003184}}
.Component-item {
float: left;
margin-left: -82px;
}
@@ -0,0 +1,547 @@
/* BASICS */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\000033}}
.CodeMirror {
/* Set height, width, borders, and global font properties here */
font-family: monospace;
height: 300px;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\000038}}
.CodeMirror-scroll {
/* Set scrolling behaviour here */
overflow: auto;
}
/* PADDING */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000315}}
.CodeMirror-lines {
padding: 4px 0;
/* Vertical padding around content */
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000318}}
.CodeMirror pre {
padding: 0 4px;
/* Horizontal padding of content */
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000322}}
.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
background-color: white;
/* The little square between H and V scrollbars */
}
/* GUTTER */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000328}}
.CodeMirror-gutters {
border-right: 1px solid #ddd;
background-color: #f7f7f7;
white-space: nowrap;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000334}}
.CodeMirror-linenumber {
padding: 0 3px 0 5px;
min-width: 20px;
text-align: right;
color: #999;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000343}}
.CodeMirror-guttermarker {
color: black;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000344}}
.CodeMirror-guttermarker-subtle {
color: #999;
}
/* CURSOR */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000348}}
.CodeMirror div.CodeMirror-cursor {
border-left: 1px solid black;
}
/* Shown when moving in bi-directional text */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000352}}
.CodeMirror div.CodeMirror-secondarycursor {
border-left: 1px solid silver;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000355}}
.CodeMirror.cm-fat-cursor div.CodeMirror-cursor {
width: auto;
border: 0;
background: #7e7;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000360}}
.CodeMirror.cm-fat-cursor div.CodeMirror-cursors {
z-index: 1;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000364}}
.cm-animate-fat-cursor {
width: auto;
border: 0;
-webkit-animation: blink 1.06s steps(1) infinite;
-moz-animation: blink 1.06s steps(1) infinite;
animation: blink 1.06s steps(1) infinite;
}
@-moz-keyframes blink {
0% {
background: #7e7;
}
50% {
background: none;
}
100% {
background: #7e7;
}
}
@-webkit-keyframes blink {
0% {
background: #7e7;
}
50% {
background: none;
}
100% {
background: #7e7;
}
}
@keyframes blink {
0% {
background: #7e7;
}
50% {
background: none;
}
100% {
background: #7e7;
}
}
/* Can style cursor different in overwrite (non-insert) mode */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000390}}
.cm-tab {
display: inline-block;
text-decoration: inherit;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000392}}
.CodeMirror-ruler {
border-left: 1px solid #ccc;
position: absolute;
}
/* DEFAULT THEME */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\0000399}}
.cm-s-default .cm-keyword {
color: #708;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003100}}
.cm-s-default .cm-atom {
color: #219;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003101}}
.cm-s-default .cm-number {
color: #164;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003102}}
.cm-s-default .cm-def {
color: #00f;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003107}}
.cm-s-default .cm-variable-2 {
color: #05a;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003108}}
.cm-s-default .cm-variable-3 {
color: #085;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003109}}
.cm-s-default .cm-comment {
color: #a50;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003110}}
.cm-s-default .cm-string {
color: #a11;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003111}}
.cm-s-default .cm-string-2 {
color: #f50;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003112}}
.cm-s-default .cm-meta {
color: #555;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003113}}
.cm-s-default .cm-qualifier {
color: #555;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003114}}
.cm-s-default .cm-builtin {
color: #30a;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003115}}
.cm-s-default .cm-bracket {
color: #997;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003116}}
.cm-s-default .cm-tag {
color: #170;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003117}}
.cm-s-default .cm-attribute {
color: #00c;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003118}}
.cm-s-default .cm-header {
color: blue;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003119}}
.cm-s-default .cm-quote {
color: #090;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003120}}
.cm-s-default .cm-hr {
color: #999;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003121}}
.cm-s-default .cm-link {
color: #00c;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003123}}
.cm-negative {
color: #d44;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003124}}
.cm-positive {
color: #292;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003125}}
.cm-header, .cm-strong {
font-weight: bold;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003126}}
.cm-em {
font-style: italic;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003127}}
.cm-link {
text-decoration: underline;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003128}}
.cm-strikethrough {
text-decoration: line-through;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003130}}
.cm-s-default .cm-error {
color: #f00;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003131}}
.cm-invalidchar {
color: #f00;
}
/* Default styles for common addons */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003135}}
div.CodeMirror span.CodeMirror-matchingbracket {
color: #0f0;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003136}}
div.CodeMirror span.CodeMirror-nonmatchingbracket {
color: #f22;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003137}}
.CodeMirror-matchingtag {
background: rgba(255, 150, 0, 0.3);
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003138}}
.CodeMirror-activeline-background {
background: #e8f2ff;
}
/* STOP */
/* The rest of this file contains styles related to the mechanics of
the editor. You probably shouldn't touch them. */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003145}}
.CodeMirror {
line-height: 1;
position: relative;
overflow: hidden;
background: white;
color: black;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003153}}
.CodeMirror-scroll {
/* 30px is the magic margin used to hide the element's real scrollbars */
/* See overflow: hidden in .CodeMirror */
margin-bottom: -30px;
margin-right: -30px;
padding-bottom: 30px;
height: 100%;
outline: none;
/* Prevent dragging from highlighting the element */
position: relative;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003164}}
.CodeMirror-sizer {
position: relative;
border-right: 30px solid transparent;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
/* The fake, visible scrollbars. Used to force redraw during scrolling
before actuall scrolling happens, thus preventing shaking and
flickering artifacts. */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003174}}
.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
position: absolute;
z-index: 6;
display: none;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003179}}
.CodeMirror-vscrollbar {
right: 0;
top: 0;
overflow-x: hidden;
overflow-y: scroll;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003184}}
.CodeMirror-hscrollbar {
bottom: 0;
left: 0;
overflow-y: hidden;
overflow-x: scroll;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003189}}
.CodeMirror-scrollbar-filler {
right: 0;
bottom: 0;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003192}}
.CodeMirror-gutter-filler {
left: 0;
bottom: 0;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003196}}
.CodeMirror-gutters {
position: absolute;
left: 0;
top: 0;
padding-bottom: 30px;
z-index: 3;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003201}}
.CodeMirror-gutter {
white-space: normal;
height: 100%;
-moz-box-sizing: content-box;
box-sizing: content-box;
padding-bottom: 30px;
margin-bottom: -32px;
display: inline-block;
/* Hack to make IE7 behave */
*zoom: 1;
*display: inline;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003213}}
.CodeMirror-gutter-wrapper {
position: absolute;
z-index: 4;
height: 100%;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003218}}
.CodeMirror-gutter-elt {
position: absolute;
cursor: default;
z-index: 4;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003224}}
.CodeMirror-lines {
cursor: text;
min-height: 1px;
/* prevents collapsing before first draw */
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003228}}
.CodeMirror pre {
/* Reset some styles that the rest of the page might have set */
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
border-width: 0;
background: transparent;
font-family: inherit;
font-size: inherit;
margin: 0;
white-space: pre;
word-wrap: normal;
line-height: inherit;
color: inherit;
z-index: 2;
position: relative;
overflow: visible;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003244}}
.CodeMirror-wrap pre {
word-wrap: break-word;
white-space: pre-wrap;
word-break: normal;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003250}}
.CodeMirror-linebackground {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 0;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003256}}
.CodeMirror-linewidget {
position: relative;
z-index: 2;
overflow: auto;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003264}}
.CodeMirror-wrap .CodeMirror-scroll {
overflow-x: hidden;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003268}}
.CodeMirror-measure {
position: absolute;
width: 100%;
height: 0;
overflow: hidden;
visibility: hidden;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003275}}
.CodeMirror-measure pre {
position: static;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003277}}
.CodeMirror div.CodeMirror-cursor {
position: absolute;
border-right: none;
width: 0;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003283}}
div.CodeMirror-cursors {
visibility: hidden;
position: relative;
z-index: 3;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003288}}
.CodeMirror-focused div.CodeMirror-cursors {
visibility: visible;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003292}}
.CodeMirror-selected {
background: #d9d9d9;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003293}}
.CodeMirror-focused .CodeMirror-selected {
background: #d7d4f0;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003294}}
.CodeMirror-crosshair {
cursor: crosshair;
}
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003296}}
.cm-searching {
background: #ffa;
background: rgba(255, 255, 0, 0.4);
}
/* IE7 hack to prevent it from returning funny offsetTops on the spans */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003302}}
.CodeMirror span {
*vertical-align: text-bottom;
}
/* Used to force a border model for a node */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003305}}
.cm-force-border {
padding-right: .1px;
}
@media print {
/* Hide the cursor when printing */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003309}}
.CodeMirror div.CodeMirror-cursors {
visibility: hidden;
}
}
/* See issue #2901 */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003315}}
.cm-tab-wrap-hack:after {
content: '';
}
/* Help users use markselection to safely style text background */
@media -sass-debug-info{filename{font-family:file\:\/\/\/Users\/matallo\/workspace\/cartodb\.js\/www\/_scss\/vendor\/codemirror\.scss}line{font-family:\00003318}}
span.CodeMirror-selectedtext {
background: none;
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 113 B

@@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="24px" height="15px" viewBox="0 0 24 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch Beta 3.2 (9790) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch Beta.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<rect id="Rectangle-2" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="6" width="24" height="3"></rect>
<rect id="Rectangle-4" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="24" height="3"></rect>
<rect id="Rectangle-3" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="12" width="24" height="3"></rect>
</g>
</svg>

After

Width:  |  Height:  |  Size: 894 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 72 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 151 KiB

@@ -0,0 +1,245 @@
<!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 name="viewport" content="width=device-width initial-scale=1" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>CartoDB JavaScript library</title>
<meta name="description" content="CartoDB offers a simple unified JavaScript library called CartoDB.js that let you interact with the CartoDB service.">
<meta name="keywords" content="cartodb, cartodb.js, javascript, map, library, framework, leaflet, service">
<link href="img/favicon.ico" rel="shortcut icon" type="image/x-icon">
<meta property="og:site_name" content="CartoDB.js" />
<meta property="og:title" content="CartoDB.js" />
<meta property="og:type" content="development" />
<meta property="og:url" content="" />
<meta property="og:image" content="" />
<meta property="og:locale" content="EN-us" />
<meta property="og:description" content="" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@cartodb" />
<meta name="twitter:title" content="" />
<meta name="twitter:description" content="" />
<meta name="twitter:image" content="" />
<meta name="twitter:url" content="" />
<!-- build:css(www) /css/main.css -->
<link href="../bower_components/cdbui/dist/css/cdbui-lib.css" rel="stylesheet" />
<link href="css/vendor/codemirror.css" rel="stylesheet" />
<link href="css/main.css" rel="stylesheet" />
<!-- endbuild -->
<!-- build:js(www) /js/vendor/modernizr.js -->
<script src='../bower_components/modernizr/modernizr.js'></script>
<!-- endbuild -->
</head>
<body>
<div class="js-Offcanvas Offcanvas">
<div class="Offcanvas-inner">
<div class="Offcanvas-collapse">
<div class="Offcanvas-collapseInner">
<div class="Offcanvas-menu">
<ul>
<li class="Offcanvas-item"><a href="#quickstart" class="Offcanvas-link">Quick Start</a></li>
</ul>
</div>
<div class="Offcanvas-menu">
<ul>
<li class="Offcanvas-item"><a href="#examples" class="Offcanvas-link">Examples</a></li>
</ul>
</div>
<div class="Offcanvas-menu">
<ul>
<li class="Offcanvas-item"><a href="http://docs.cartodb.com/cartodb-platform/cartodb-js.html" class="Offcanvas-link">Documentation</a></li>
</ul>
</div>
<div class="Offcanvas-menu">
<ul>
<li class="Offcanvas-item"><a href="#components" class="Offcanvas-link">Components</a></li>
</ul>
</div>
</div>
</div>
<header class="Header js-Header h-valign">
<a href="/#menu" class="Header-menu js-Header-menu"></a>
<a href="https://github.com/CartoDB/cartodb.js" class="Header-link Btn Btn--m Btn--white"><span>GitHub</span></a>
<div class="Header-inner h-malign h-iblock">
<h1 class="Header-title">CartoDB<strong>&lt;js&gt;</strong></h1>
<p class="Header-description">CartoDB offers a simple unified JavaScript library called CartoDB.js that let you interact with the CartoDB service.</p>
<a href="https://github.com/CartoDB/cartodb.js/archive/<%= last_bugfixing_version %>.zip" class="Header-downloadLink h-iblock Btn Btn--l Btn--highlight"><span>Download v<%= last_minor_version %></span></a>
</div>
</header>
<nav class="Navbar js-Navbar">
<div class="inner">
<div class="Navbar-inner">
<div class="Navbar-inner h-valign h-left">
<a href="/#menu" class="Navbar-menu js-Header-menu h-iblock h-malign"></a>
<a href="/" class="Navbar-title h-iblock h-malign">CartoDB<strong>&lt;js&gt;</strong></a>
</div>
<div class="Navbar-inner h-valign h-right">
<a href="https://github.com/CartoDB/cartodb.js" class="Btn Btn--m Btn--white h-iblock h-malign h-tupper"><span>GitHub</span></a>
</div>
</div>
</div>
</nav>
<div class="Content">
<div class="inner">
<section class="Section" id="quickstart">
<h2 class="Title">Quick start</h2>
<p class="Section-description">To start using CartoDB.js just paste this piece of code within the HEAD tags of your HTML:</p>
<div class="TabPanes js-TabPanes">
<div class="Tabs js-Tabs">
<ul class="inb-list">
<li class="Tab js-Tab js-Tab-http h-iblock"><a href="#/http" class="Tab-link js-Tab-link">HTTP</a></li>
<li class="Tab js-Tab js-Tab-https is-selected h-iblock"><a href="#/https" class="Tab-link js-Tab-link">HTTPS</a></li>
</ul>
</div>
<div class="Panes js-Panes">
<div class="Pane js-Pane js-Pane js-Pane-http">
<textarea id="Highlight-0" class="js-Highlight">
<link rel="stylesheet" href="http://libs.cartocdn.com.s3.amazonaws.com/cartodb.js/v3/<%= last_minor_version %>/themes/css/cartodb.css" />
<script src="http://libs.cartocdn.com.s3.amazonaws.com/cartodb.js/v3/<%= last_minor_version %>/cartodb.js"></script></textarea>
</div>
<div class="Pane js-Pane js-Pane js-Pane-https">
<textarea id="Highlight-1" class="js-Highlight">
<link rel="stylesheet" href="https://libs.cartocdn.com.s3.amazonaws.com/cartodb.js/v3/<%= last_minor_version %>/themes/css/cartodb.css" />
<script src="https://libs.cartocdn.com.s3.amazonaws.com/cartodb.js/v3/<%= last_minor_version %>/cartodb.js"></script></textarea>
</div>
</div>
</div>
<p class="Section-description">Create a map and add a CartoDB layer:</p>
<div class="TabPanes">
<div class="Panes">
<div class="Pane">
<textarea id="Highlight-2" class="js-Highlight">
<link rel="stylesheet" href="http://libs.cartocdn.com.s3.amazonaws.com/cartodb.js/v3/<%= last_minor_version %>/themes/css/cartodb.css" />
<script src="http://libs.cartocdn.com.s3.amazonaws.com/cartodb.js/v3/<%= last_minor_version %>/cartodb.js"></script></textarea>
</div>
</div>
</div>
</section>
<section class="Section" id="examples">
<h2 class="Title">Examples</h2>
<!--ul class="Examples inb-list">
<% _.each(examples, function(item, i) { %>
<li class="Example h-iblock">
<a href="http://jsfiddle.net/gh/get/mootools/1.3/cartodb/cartodb.js/tree/master/examples/<%= item.dir %>" class="Example-inner">
<div class="Example-content">
<span class="Example-type">timeslider</span>
<h3 class="Example-title"><%= item.name %></h3>
<p class="Example-description"><%= item.description %></p>
</div>
</a>
</li>
<% }) %>
</ul-->
</section>
<section class="Section" id="components">
<h2 class="Title">Components</h2>
<ul class="Components">
<li class="Component">
<div class="Component-item">
<img src="/img/component.png" alt="component" /> <!-- TODO: Move to actual html -->
</div>
<div class="TabPanes js-TabPanes">
<div class="Tabs js-Tabs">
<ul class="inb-list">
<li class="Tab js-Tab js-Tab-html is-selected h-iblock"><a href="#/html" class="Tab-link js-Tab-link">HTML</a></li>
<li class="Tab js-Tab js-Tab-css h-iblock"><a href="#/css" class="Tab-link js-Tab-link">CSS</a></li>
<li class="Tab js-Tab js-Tab-js h-iblock"><a href="#/js" class="Tab-link js-Tab-link">JS</a></li>
</ul>
</div>
<div class="Panes js-Panes">
<div class="Pane js-Pane js-Pane-html">
<textarea id="Highlight-3" class="js-Highlight">
<div class="cdb-Zoom">
<ul>
<li>
<a href="#" class="icon icon-medium iconFont-zoom-in"></a>
</li>
<li>
<a href="#" class="icon icon-medium iconFont-zoom-out"></a>
</li>
</ul>
</div></textarea>
</div>
<div class="Pane js-Pane js-Pane js-Pane-css">
<textarea id="Highlight-4" class="js-Highlight">
.cdb-Zoom li {
display: inline-block;
margin-left: -5px;
border-left: 1px solid rgba(#000, .1);
}
.cdb-Zoom li:first-child {
border-left: 0;
margin: 0;
}</textarea>
</div>
<div class="Pane js-Pane js-Pane js-Pane-js">
<textarea id="Highlight-5" class="js-Highlight">
vis.addOverlay({ type: 'zoom' });</textarea>
</div>
</div>
</div>
</li>
</ul>
</section>
</div>
</div>
<footer class="Footer">
<div class="inner">
<p class="Footer-description">developed by <a href="http://cartodb.com/" class="Footer-brand"></a></p>
</div>
</footer>
</div>
</div>
<!-- build:js(www) /js/vendor.js -->
<script src="../bower_components/jquery/dist/jquery.js"></script>
<script src="../bower_components/underscore/underscore.js"></script>
<script src="../bower_components/backbone/backbone.js"></script>
<script src="../bower_components/cdbui/dist/js/cdbui-lib.js"></script>
<script src="js/vendor/codemirror.js"></script>
<!-- endbuild -->
<!-- build:js(www) /js/main.js -->
<script src="js/app.js"></script>
<script src="js/main.js"></script>
<!-- endbuild -->
<!-- script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-20934186-21', 'cartodb.github.io');
ga('send', 'pageview');
</script -->
</body>
</html>
@@ -0,0 +1,6 @@
window.App = {
Models: {},
Collections: {},
Views: {},
Routers: {}
};
@@ -0,0 +1,125 @@
App.Views.Index = Backbone.View.extend({
el: document.body,
events: {
'click .js-Tab-link': '_onClickTabLink'
},
initialize: function() {
this.$header = this.$('.js-Header');
this.$navbar = this.$('.js-Navbar');
this._initBindings();
this._initViews();
},
_initBindings: function() {
var _this = this;
$(window)
.on('load', function() {
_this.$header.css({
height: window.innerHeight
});
});
$(window)
.on('resize', function() {
_this.$header.css({
height: window.innerHeight
});
_this._onScroll();
});
$(window)
.on('scroll', function() {
_this._onScroll();
});
},
_onScroll: function() {
var pos = $(window).scrollTop();
if (pos < this.$('.Header').outerHeight()) {
if (this.$navbar.hasClass('is-scrolled')) {
this.$navbar.removeClass('is-scrolled');
this.$navbar.animate({
top: '-90px'
}, 50);
}
} else {
if (!this.$navbar.hasClass('is-scrolled')) {
this.$navbar.addClass('is-scrolled');
this.$navbar.animate({
top: 0,
}, 50);
}
}
},
_initViews: function() {
this._initOffcanvas();
this._initCodeMirror();
this._initTabPanes();
},
_onClickTabLink: function(e) {
e.preventDefault();
var $target = $(e.target).closest('a');
var href = $target.attr('href');
var name = href.replace('#/', '#').split('#')[1];
var tabpane = $target.closest('.js-TabPanes');
this._activatePane(name, tabpane);
},
_initTabPanes: function() {
var _this = this;
_.each(this.$('.js-TabPanes'), function(tabpane, i) {
_.each($(tabpane).find('.js-Tab'), function(tab, i) {
if ($(tab).hasClass('is-selected')) {
var $target = $(tab).find('a');
var href = $target.attr('href');
var name = href.replace('#/', '#').split('#')[1];
_this._activatePane(name, tabpane);
}
});
});
},
_activatePane: function(name, tabpane) {
$(tabpane).find('.js-Tab').removeClass('is-selected');
$(tabpane).find('.js-Pane').hide();
$(tabpane).find('.js-Tab-'+name).addClass('is-selected');
$(tabpane).find('.js-Pane-'+name).show();
},
_initCodeMirror: function() {
_.each(this.$('.js-Highlight'), function(el, i) {
CodeMirror.fromTextArea(document.getElementById('Highlight-' + i), {
mode: 'text/html',
lineNumbers: true,
readOnly: true
});
});
},
_initOffcanvas: function() {
this.offcanvas = new CDBUILIB.Views.Offcanvas({
el: this.$('.js-Offcanvas')
})
}
});
$(function() {
window.index = new App.Views.Index();
});
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,2 @@
User-agent: *
Disallow: