From 6fbdab365c6df53c8e7d8394062e1532f3e87cba Mon Sep 17 00:00:00 2001 From: xavijam Date: Thu, 14 Jan 2016 22:15:32 +0100 Subject: [PATCH] Updates --- cartostyles.css | 1 + styleguide/index.html | 10251 ++++++++++++++++++++++++++++++++++++++++ 2 files changed, 10252 insertions(+) create mode 100644 cartostyles.css create mode 100644 styleguide/index.html diff --git a/cartostyles.css b/cartostyles.css new file mode 100644 index 0000000..6da7e6b --- /dev/null +++ b/cartostyles.css @@ -0,0 +1 @@ +.CDB-Shape-lens:hover,.CDB-Shape-threePoints:hover{cursor:pointer}.CDB-Loader{-webkit-animation:loader-progress 1s linear 1;-khtml-animation:loader-progress 1s linear 1;-moz-animation:loader-progress 1s linear 1;-ms-animation:loader-progress 1s linear 1;-o-animation:loader-progress 1s linear 1;animation:loader-progress 1s linear 1;opacity:0;filter:alpha(opacity=0);-webkit-transition:opacity,1s;-khtml-transition:opacity,1s;-moz-transition:opacity,1s;-ms-transition:opacity,1s;-o-transition:opacity,1s;transition:opacity,1s;position:absolute;top:0;left:0;width:100%;height:2px;background:#3aa9e3;z-index:10}.CDB-Loader.is-visible{-webkit-animation:loader-progress 2s linear infinite;-khtml-animation:loader-progress 2s linear infinite;-moz-animation:loader-progress 2s linear infinite;-ms-animation:loader-progress 2s linear infinite;-o-animation:loader-progress 2s linear infinite;animation:loader-progress 2s linear infinite;opacity:1;filter:alpha(opacity=100)}@-webkit-keyframes loader-progress{0%{width:0}100%{width:100%}}@-moz-keyframes loader-progress{0%{width:0}100%{width:100%}}@-ms-keyframes loader-progress{0%{width:0}100%{width:100%}}@-o-keyframes loader-progress{0%{width:0}100%{width:100%}}@keyframes loader-progress{0%{width:0}100%{width:100%}}.CDB-Shape-dot{display:inline-block;width:8px;min-width:8px;height:8px;border-radius:8px}.CDB-Shape-threePoints{display:inline-block;position:relative;width:3px;height:16px;margin-right:-7px;margin-left:6px;padding:0 7px 0 10px;text-align:center;vertical-align:middle}legend,td,th{padding:0}.CDB-Shape-threePoints:after,.CDB-Shape-threePoints:before{display:inline-block;position:absolute;width:3px;height:3px;border-radius:50%;content:'';z-index:1}.CDB-Shape-threePoints:before{top:0;right:7px}.CDB-Shape-threePoints:after{right:7px;bottom:1px}.CDB-Shape-threePointsItem{display:block;position:absolute;top:6px;left:7px;width:3px;height:3px;border-radius:50%}.CDB-Shape-lens{display:inline-block;position:relative;width:16px;height:16px}.CDB-Shape-lens:after,.CDB-Shape-lens:before{position:absolute;content:''}.CDB-Shape-lens:after{top:0;left:0;width:8px;height:8px;border:1px solid transparent;border-radius:10px}.CDB-Shape-lens:before{-webkit-transform:rotate(45deg);-khtml-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);right:3px;bottom:5px;width:6px;height:1px}.CDB-Shape-hamburguer{display:inline-block;position:relative;width:16px;height:2px;border:0;background:#FFF;vertical-align:middle}.CDB-Shape-hamburguer:after,.CDB-Shape-hamburguer:before{display:block;position:absolute;width:16px;height:2px;background:#FFF;content:''}.CDB-Shape-hamburguer:before{top:-6px}.CDB-Shape-hamburguer:after{bottom:-6px}.CDB-Shape-magnify{display:block;position:relative;width:32px;height:32px}.CDB-Shape-magnify:before{display:block;position:absolute;top:10px;left:10px;width:7px;height:7px;border:1px solid #636D72;border-radius:50%;content:''}.CDB-Shape-Arrow,.CDB-Shape-magnify:after{display:block;position:absolute;width:1px}img,legend{border:0}.CDB-Shape-magnify:after{top:17px;left:19px;height:6px;transform:rotate(314deg);background:#636D72;content:''}.CDB-Shape-Arrow{height:8px;background:#32A8E6}.CDB-Shape-Arrow:after,.CDB-Shape-Arrow:before{display:block;position:absolute;top:2px;width:5px;height:1px;background:#32A8E6;content:''}.CDB-Shape-Arrow:before{left:0;transform:rotate(45deg)}.CDB-Shape-Arrow:after{left:-4px;transform:rotate(-45deg)}.CDB-Shape-Arrow--top{top:6px;right:9px;transform:rotate(45deg)}.CDB-Shape-Arrow--bottom{top:13px;left:46px;transform:rotate(-135deg)}@font-face{font-family:'Open Sans';font-style:normal;font-weight:300;src:local("Open Sans Light"),local("OpenSans-Light"),url(//themes.googleusercontent.com/static/fonts/opensans/v6/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format("truetype")}@font-face{font-family:'Open Sans';font-style:normal;font-weight:400;src:local("Open Sans"),local("OpenSans"),url(//themes.googleusercontent.com/static/fonts/opensans/v6/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format("truetype")}@font-face{font-family:'Open Sans';font-style:normal;font-weight:600;src:local("Open Sans Semibold"),local("OpenSans-Semibold"),url(//themes.googleusercontent.com/static/fonts/opensans/v6/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format("truetype")}.u-tSpace{margin-top:4px}.u-tSpace-xl{margin-top:12px}.u-rSpace{margin-right:4px}.u-rSpace--m{margin-right:8px}.u-rSpace--xl{margin-right:12px}.u-lSpace{margin-left:4px}.u-lSpace--xl{margin-left:12px}.u-iBlock{display:inline-block;vertical-align:middle}.u-showDesktop{display:block!important}.u-showMobile{display:none!important}@media only screen and (max-width:600px){.u-showDesktop{display:none!important}.u-showMobile{display:block!important}}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,optgroup,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre,textarea{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}table{border-collapse:collapse;border-spacing:0} \ No newline at end of file diff --git a/styleguide/index.html b/styleguide/index.html new file mode 100644 index 0000000..81f9624 --- /dev/null +++ b/styleguide/index.html @@ -0,0 +1,10251 @@ + + + + + + + +
+ +
+ +
+
+ +
+

Loader

+

This is the generic loader for widgets, maps, components, ... +There is only one state 'is-visible', in order to make it visible.

+
+ +
+
+
+ +
+
+<div class="CDB-Loader is-visible"></div>
+
+
+ +
+
+ +
+

Shapes/arrow

+

Description

+
+ +
+
+
+ +
+
+<div></div>
+
+
+ +
+
+ +
+

Shapes/dot

+

You may resize and change the colors of the icons with the glyph--classes. Available sizes and colors listed:

+
+ +
+ + +
+ +
+
+<button class="CDB-Shape-dot CDB-Widget-dot--navigation is-selected" data-page="3"></button>
+<button class="CDB-Shape-dot CDB-Widget-dot--navigation" data-page="3"></button>
+
+
+ +
+
+ +
+

Shapes/hamburguer

+

Description

+
+ +
+
+
+ +
+
+<div></div>
+
+
+ +
+
+ +
+

Shapes/lens

+

Description

+
+ +
+
+
+ +
+
+<div></div>
+
+
+ +
+
+ +
+

Shapes/magnify

+

Description

+
+ +
+
+
+ +
+
+<div></div>
+
+
+ +
+
+ +
+

Shapes/threePoints

+

Description

+
+ +
+
+
+ +
+
+<div></div>
+
+
+ +
+