Merge pull request #125 from CartoDB/remove-infoloader

Remove boxloader and infobox
This commit is contained in:
Buti 2016-06-07 11:08:47 +02:00
commit 9ef35729de
3 changed files with 2 additions and 184 deletions

View File

@ -4,6 +4,7 @@
### Installation ### Installation
As easy as: As easy as:
- ```npm install --global grunt-cli``` [Grunt installation](http://gruntjs.com/getting-started)
- ```npm install --global gulp-cli``` [Gulp installation](https://github.com/gulpjs/gulp) - ```npm install --global gulp-cli``` [Gulp installation](https://github.com/gulpjs/gulp)
- ```npm install -g markdown-styleguide-generator``` [StyleGenerator installation](https://www.npmjs.com/package/markdown-styleguide-generator#install) - ```npm install -g markdown-styleguide-generator``` [StyleGenerator installation](https://www.npmjs.com/package/markdown-styleguide-generator#install)
- ```npm install``` - ```npm install```

View File

@ -29,6 +29,7 @@
"node": ">= 0.8.0" "node": ">= 0.8.0"
}, },
"devDependencies": { "devDependencies": {
"grunt": "~0.4.5",
"jquery": "~2.2.0", "jquery": "~2.2.0",
"highlight.js": "~9.1.0", "highlight.js": "~9.1.0",
"markdown-styleguide-generator": "~2.0.4", "markdown-styleguide-generator": "~2.0.4",
@ -48,9 +49,6 @@
"grunt-shell": "1.1.2", "grunt-shell": "1.1.2",
"load-grunt-tasks": "*" "load-grunt-tasks": "*"
}, },
"peerDependencies": {
"grunt": "~0.4.5"
},
"keywords": [ "keywords": [
"library", "library",
"CartoDB", "CartoDB",

View File

@ -40,184 +40,3 @@
.CDB-Box-modalHeaderItem--paddingVertical { .CDB-Box-modalHeaderItem--paddingVertical {
padding: $baseSize + 4 0; padding: $baseSize + 4 0;
} }
/* SG
# Boxes/Loader
```
<div class="CDB-BoxLoader">
<ul class="CDB-BoxLoader-inner">
<li class="CDB-BoxLoader-item">
<div class="CDB-Shape u-rSpace--m">
<div class="CDB-Shape-CircleItem is-green is-medium">
<div class="CDB-Shape-tick is-medium is-green"></div>
</div>
</div>
<div class="CDB-BoxLoader-info">
<p class="CDB-Text CDB-Size-medium">Query applied. Showing 2,561 rows, Query applied. Showing 2,561 rows, Query applied. Showing 2,561 rows Query applied. Showing 2,561 rowsQuery applied. Showing 2,561 rows Query applied. Showing 2,561 rows</p>
</div>
<div class="CDB-BoxLoader-actions">
<div class="CDB-Shape">
<div class="CDB-Shape-threePoints is-small is-blue">
<div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div>
</div>
</div>
</div>
</li>
</ul>
</div>
<br/>
<br/>
<br/>
<br/>
<br/>
<div class="CDB-BoxLoader">
<ul class="CDB-BoxLoader-inner">
<li class="CDB-BoxLoader-item">
<div class="CDB-Shape u-rSpace--m">
<div class="CDB-Shape-CircleItem is-green is-medium">
<div class="CDB-Shape-tick is-medium is-green"></div>
</div>
</div>
<div class="CDB-BoxLoader-info">
<p class="CDB-Text CDB-Size-medium">Finished importing <a href="#">populated_places_2</a></p>
</div>
</li>
<li class="CDB-BoxLoader-item is-working">
<div class="CDB-LoaderIcon u-rSpace--m">
<div class="CDB-LoaderIcon-item"></div>
</div>
<div class="CDB-BoxLoader-info">
<p class="CDB-Text CDB-Size-medium">Geocoding populated_places_2 (28%)</p>
</div>
<div class="CDB-BoxLoader-actions">
<div class="CDB-Shape">
<div class="CDB-Shape-close is-blue is-large"></div>
</div>
</div>
</li>
</ul>
<ul class="CDB-BoxLoader-inner">
<li class="CDB-BoxLoader-item">
<div class="CDB-Shape u-rSpace--m">
<div class="CDB-Shape-CircleItem is-green is-medium">
<div class="CDB-Shape-tick is-medium is-green"></div>
</div>
</div>
<div class="CDB-BoxLoader-info">
<p class="CDB-Text CDB-Size-medium">Finished importing <a href="#">populated_places_2</a></p>
</div>
</li>
</ul>
</div>
<br/>
<br/>
<br/>
<br/>
<br/>
<div class="CDB-BoxLoader">
<ul class="CDB-BoxLoader-inner">
<li class="CDB-BoxLoader-item">
<div class="CDB-Shape u-rSpace--m">
<div class="CDB-Shape-CircleItem is-red">
<div class="CDB-Shape-close is-medium is-red"></div>
</div>
</div>
<div class="CDB-BoxLoader-info">
<p class="CDB-Text CDB-Size-medium">Error in query. Data might be outdated</p>
</div>
<div class="CDB-BoxLoader-actions">
<div class="CDB-Shape">
<div class="CDB-Shape-threePoints is-small is-blue">
<div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div>
<div class="CDB-Shape-threePointsItem"></div>
</div>
</div>
</div>
</li>
</ul>
</div>
```
*/
.CDB-BoxLoader {
padding: 0 $baseSize * 3;
border-top: 1px solid $cMainLine;
}
.CDB-BoxLoader-inner {
padding: $baseSize + 4 0;
border-top: 1px solid $cMainLine;
&:first-child {
border-top: 0;
}
}
.CDB-BoxLoader-item {
@include display-flex();
padding: $baseSize 0;
color: $cSecondaryText;
&.is-working {
color: $cAltText;
}
}
.CDB-BoxLoader-info {
@include flex(1);
padding-right: $baseSize * 2;
}
/* SG
# Boxes/Info Boxes
```
<div class="CDB-InfoBox">
<h2 class="CDB-Text is-semibold CDB-Size-small u-bSpace--m">ABOUT PREVIEW MODE</h2>
<p class="CDB-Text CDB-Size-medium u-bSpace--m">He's a queer man, Captain Ahab—so some thinkbut a good one. Oh, thou'lt like him well enough; no fear, no fear</p>
<p class="CDB-Text is-semibold CDB-Size-small"><a href="#">CLOSE</a></p>
</div>
<br/>
<br/>
<br/>
<div class="CDB-InfoBox is-alert">
<h2 class="CDB-Text is-semibold CDB-Size-small u-bSpace--m">ABOUT PREVIEW MODE</h2>
<p class="CDB-Text CDB-Size-medium u-bSpace--m">He's a queer man, Captain Ahab—so some thinkbut a good one. Oh, thou'lt like him well enough; no fear, no fear</p>
<ul class="CDB-InfoBox-footer">
<li class="CDB-InfoBox-footerItem">
<p class="CDB-Text is-semibold CDB-Size-small"><a href="#">CLOSE</a></p>
</li>
<li class="CDB-InfoBox-footerItem CDB-InfoBox-footerItem--right">
<button class="CDB-Button CDB-Button--secondary CDB-Button--small">
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
</button>
</li>
</ul>
</div>
```
*/
.CDB-InfoBox {
padding: 12px 16px;
border-radius: 4px;
background: $cThirdBackground;
&.is-alert {
background: rgba($cHighlightYellow, 0.6);
}
}
.CDB-InfoBox-footer {
@include display-flex();
@include align-items(center);
}
.CDB-InfoBox-footerItem {
@include flex(1);
}
.CDB-InfoBox-footerItem--right {
text-align: right;
}