cartodb4/CartoAssets
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Updates

Browse Source
This commit is contained in:
xavijam
2016-05-09 09:32:58 +02:00
parent 19df7df525
commit e00badce65
6 changed files with 193 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
css/cartostyles.css
View File

File diff suppressed because one or more lines are too long

BIN
fonts/cartoIcon.eot
View File

Binary file not shown.

179
fonts/cartoIcon.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 190 KiB

After

Width:  |  Height:  |  Size: 189 KiB

BIN
fonts/cartoIcon.ttf
View File

Binary file not shown.

BIN
fonts/cartoIcon.woff
View File

Binary file not shown.

159
styleguide/index.html
View File

@@ -10130,9 +10130,6 @@ return jQuery;
</ul>
</li>
<li>
<a class="sectionlink" href="#Carousel" data-section="Carousel">Carousel</a>
</li>
<li>
<a class="submenulink" href="#Colors" data-section="Colors">Colors</a>
<ul class="submenu" data-submenu="Colors">
<li><a href="#Colors-line">line</a></li>
@@ -11692,40 +11689,6 @@ hsla(120, 100%, 50%, 1);</pre></div>
</pre>
</div>
</div>
<div class="section" id="Carousel-" data-section="Carousel" data-heading="">
<div class="comment">
<h1>Carousel</h1>
</div>
<div class="result">
<div>
<ul class="CDB-Carousel">
<li class="CDB-CarouselItem is-selected"></li>
<li class="CDB-CarouselItem"></li>
<li class="CDB-CarouselItem"></li>
<li class="CDB-CarouselItem"></li>
<li class="CDB-CarouselItem"></li>
</ul>
</div>
</div>
<div class="markup hljs">
<pre>
&lt;div&gt;
&lt;ul <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-Carousel"</span>&gt;
&lt;<span class="hljs-keyword">li</span> <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-CarouselItem is-selected"</span>&gt;&lt;/<span class="hljs-keyword">li</span>&gt;
&lt;<span class="hljs-keyword">li</span> <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-CarouselItem"</span>&gt;&lt;/<span class="hljs-keyword">li</span>&gt;
&lt;<span class="hljs-keyword">li</span> <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-CarouselItem"</span>&gt;&lt;/<span class="hljs-keyword">li</span>&gt;
&lt;<span class="hljs-keyword">li</span> <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-CarouselItem"</span>&gt;&lt;/<span class="hljs-keyword">li</span>&gt;
&lt;<span class="hljs-keyword">li</span> <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-CarouselItem"</span>&gt;&lt;/<span class="hljs-keyword">li</span>&gt;
&lt;/ul&gt;
&lt;/div&gt;
</pre>
</div>
</div>
<div class="section" id="Colors-line" data-section="Colors" data-heading="line">
@@ -12594,6 +12557,28 @@ hsla(120, 100%, 50%, 1);</pre></div>
</ul>
</div>
</div>
<br>
<br>
<br>
<div class="CDB-Select" style="height: 250px;">
<div class="CDB-InputText CDB-Text">DejaVu Sans</div>
<div class="CDB-Box-Modal CDB-SelectItem">
<ul class="CDB-Text CDB-Size-medium">
<li class="CDB-ListDecoration-Item"><a href="#" class="CDB-ListDecoration-ItemLink">Hide</a></li>
<li class="CDB-ListDecoration-Item"><a href="#" class="CDB-ListDecoration-ItemLink">Rename</a></li>
<li class="CDB-ListDecoration-Item"><a href="#" class="CDB-ListDecoration-ItemLink">Change source dataset&#x2026;</a></li>
<li class="CDB-ListDecoration-Item"><a href="#" class="CDB-ListDecoration-ItemLink">Delete this layer&#x2026;</a></li>
</ul>
</div>
</div>
<div class="CDB-InputText CDB-Text is-cursor is-disabled">DejaVu Sans</div>
<br>
<div class="CDB-InputText CDB-Text is-cursor is-empty">DejaVu Sans</div>
<br>
<select name="select" class="CDB-SelectFake CDB-Text">
<option value="value1" selected>Choose an option</option>
<option value="value2">Hide</option>
@@ -12616,6 +12601,28 @@ hsla(120, 100%, 50%, 1);</pre></div>
&lt;/ul&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;br&gt;
&lt;br&gt;
&lt;br&gt;
&lt;div <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-Select"</span> style=<span class="hljs-string">"height: 250px;"</span>&gt;
&lt;div <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-InputText CDB-Text"</span>&gt;DejaVu Sans&lt;/div&gt;
&lt;div <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-Box-Modal CDB-SelectItem"</span>&gt;
&lt;ul <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-Text CDB-Size-medium"</span>&gt;
&lt;li <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-ListDecoration-Item"</span>&gt;&lt;a href=<span class="hljs-string">"#"</span> <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-ListDecoration-ItemLink"</span>&gt;Hide&lt;/a&gt;&lt;/li&gt;
&lt;li <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-ListDecoration-Item"</span>&gt;&lt;a href=<span class="hljs-string">"#"</span> <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-ListDecoration-ItemLink"</span>&gt;Rename&lt;/a&gt;&lt;/li&gt;
&lt;li <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-ListDecoration-Item"</span>&gt;&lt;a href=<span class="hljs-string">"#"</span> <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-ListDecoration-ItemLink"</span>&gt;Change source dataset&amp;<span class="hljs-preprocessor">#x2026;&lt;/a&gt;&lt;/li&gt;</span>
&lt;li <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-ListDecoration-Item"</span>&gt;&lt;a href=<span class="hljs-string">"#"</span> <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-ListDecoration-ItemLink"</span>&gt;Delete <span class="hljs-keyword">this</span> layer&amp;<span class="hljs-preprocessor">#x2026;&lt;/a&gt;&lt;/li&gt;</span>
&lt;/ul&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-InputText CDB-Text is-cursor is-disabled"</span>&gt;DejaVu Sans&lt;/div&gt;
&lt;br&gt;
&lt;div <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-InputText CDB-Text is-cursor is-empty"</span>&gt;DejaVu Sans&lt;/div&gt;
&lt;br&gt;
&lt;<span class="hljs-keyword">select</span> name=<span class="hljs-string">"select"</span> <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-SelectFake CDB-Text"</span>&gt;
&lt;option <span class="hljs-keyword">value</span>=<span class="hljs-string">"value1"</span> selected&gt;Choose an option&lt;/option&gt;
&lt;option <span class="hljs-keyword">value</span>=<span class="hljs-string">"value2"</span>&gt;Hide&lt;/option&gt;
@@ -13311,13 +13318,37 @@ hsla(120, 100%, 50%, 1);</pre></div>
<div class="result">
<div style="padding: 20px;">
<div class="CDB-LoaderIcon">
<div class="CDB-LoaderIcon-item"></div>
<div class="CDB-LoaderIcon-item">
<span class="CDB-LoaderIcon-itemClose"></span>
<span class="CDB-LoaderIcon-itemCircle"></span>
</div>
</div>
</div>
<div style="padding: 20px; background: #F9F9F9;">
<div class="CDB-LoaderIcon is-grey">
<div class="CDB-LoaderIcon-item">
<span class="CDB-LoaderIcon-itemClose"></span>
<span class="CDB-LoaderIcon-itemCircle"></span>
</div>
</div>
</div>
<div style="padding: 20px; background: #2E3C43;">
<div class="CDB-LoaderIcon is-grey">
<div class="CDB-LoaderIcon-item is-grey"></div>
<div class="CDB-LoaderIcon is-dark">
<div class="CDB-LoaderIcon-item">
<span class="CDB-LoaderIcon-itemClose"></span>
<span class="CDB-LoaderIcon-itemCircle"></span>
</div>
</div>
</div>
<div style="padding: 20px; background: #E27D61;">
<div class="CDB-LoaderIcon is-bg">
<div class="CDB-LoaderIcon-item">
<span class="CDB-LoaderIcon-itemClose" style="background: #E27D61"></span>
<span class="CDB-LoaderIcon-itemCircle" style="background: #E27D61"></span>
</div>
</div>
</div>
</div>
@@ -13326,13 +13357,37 @@ hsla(120, 100%, 50%, 1);</pre></div>
<pre>
&lt;<span class="hljs-keyword">div</span> style=<span class="hljs-string">"padding: 20px;"</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon"</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-item"</span>&gt;&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-item"</span>&gt;
&lt;span <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-itemClose"</span>&gt;&lt;/span&gt;
&lt;span <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-itemCircle"</span>&gt;&lt;/span&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;<span class="hljs-keyword">div</span> style=<span class="hljs-string">"padding: 20px; background: #F9F9F9;"</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon is-grey"</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-item"</span>&gt;
&lt;span <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-itemClose"</span>&gt;&lt;/span&gt;
&lt;span <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-itemCircle"</span>&gt;&lt;/span&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;<span class="hljs-keyword">div</span> style=<span class="hljs-string">"padding: 20px; background: #2E3C43;"</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon is-grey"</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-item is-grey"</span>&gt;&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon is-dark"</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-item"</span>&gt;
&lt;span <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-itemClose"</span>&gt;&lt;/span&gt;
&lt;span <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-itemCircle"</span>&gt;&lt;/span&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;<span class="hljs-keyword">div</span> style=<span class="hljs-string">"padding: 20px; background: #E27D61;"</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon is-bg"</span>&gt;
&lt;<span class="hljs-keyword">div</span> <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-item"</span>&gt;
&lt;span <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-itemClose"</span> style=<span class="hljs-string">"background: #E27D61"</span>&gt;&lt;/span&gt;
&lt;span <span class="hljs-type">class</span>=<span class="hljs-string">"CDB-LoaderIcon-itemCircle"</span> style=<span class="hljs-string">"background: #E27D61"</span>&gt;&lt;/span&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
&lt;/<span class="hljs-keyword">div</span>&gt;
</pre>
@@ -15290,6 +15345,9 @@ hsla(120, 100%, 50%, 1);</pre></div>
</button>
<button class="CDB-Tag is-private CDB-Text is-semibold CDB-Size-small u-iBlock">
PRIVATE
</button>
<button class="CDB-Tag CDB-Text is-semibold CDB-Size-small u-iBlock">
TAG
</button>
</div>
@@ -15307,6 +15365,9 @@ hsla(120, 100%, 50%, 1);</pre></div>
<span class="hljs-tag">&lt;<span class="hljs-title">button</span> <span class="hljs-attribute">class</span>=<span class="hljs-value">"CDB-Tag is-private CDB-Text is-semibold CDB-Size-small u-iBlock"</span>&gt;</span>
PRIVATE
<span class="hljs-tag">&lt;/<span class="hljs-title">button</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-title">button</span> <span class="hljs-attribute">class</span>=<span class="hljs-value">"CDB-Tag CDB-Text is-semibold CDB-Size-small u-iBlock"</span>&gt;</span>
TAG
<span class="hljs-tag">&lt;/<span class="hljs-title">button</span>&gt;</span>
</pre>
</div>
@@ -15457,12 +15518,6 @@ hsla(120, 100%, 50%, 1);</pre></div>
</div>
<div class="box">
<i class="CDB-IconFont CDB-IconFont-pencilMenu Size-large"></i>
<h4 class="Text Size-small">pencilMenu</h4>
</div>
<div class="box">
<i class="CDB-IconFont CDB-IconFont-wizard Size-large"></i>
<h4 class="Text Size-small">wizard</h4>
@@ -16095,12 +16150,6 @@ hsla(120, 100%, 50%, 1);</pre></div>
&lt;/div&gt;
&lt;div <span class="hljs-keyword">class</span>=<span class="hljs-string">"box"</span>&gt;
&lt;i <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-IconFont CDB-IconFont-pencilMenu Size-large"</span>&gt;&lt;/i&gt;
&lt;h4 <span class="hljs-keyword">class</span>=<span class="hljs-string">"Text Size-small"</span>&gt;pencilMenu&lt;/h4&gt;
&lt;/div&gt;
&lt;div <span class="hljs-keyword">class</span>=<span class="hljs-string">"box"</span>&gt;
&lt;i <span class="hljs-keyword">class</span>=<span class="hljs-string">"CDB-IconFont CDB-IconFont-wizard Size-large"</span>&gt;&lt;/i&gt;
&lt;h4 <span class="hljs-keyword">class</span>=<span class="hljs-string">"Text Size-small"</span>&gt;wizard&lt;/h4&gt;