Skip to content

Commit a8fdef9

Browse files
djthorpedjthorpe
committed
Added maps, icons and tags
1 parent 71b5bac commit a8fdef9

File tree

13 files changed

+778
-11
lines changed

13 files changed

+778
-11
lines changed

‎example/index.html

Lines changed: 49 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,16 +10,61 @@
1010
</head>
1111

1212
<body>
13-
<!-- Load data.json every 5 seconds -->
1413
<js-container>
15-
PROVIDER
16-
<js-provider id="provider" interval="5"></js-provider>
14+
<js-tag transform="uppercase">Provider</js-tag>
15+
<js-provider id="provider"></js-provider>
1716
</js-container>
1817
<js-button textTransform="uppercase">Reload</js-button>
1918
<js-container>
20-
TABLE
19+
<js-tag transform="uppercase">Table</js-tag>
2120
<js-table-body id="table"></js-table-body>
2221
</js-container>
22+
23+
<js-container>
24+
<js-tag transform="uppercase"><js-icon size="small">compass</js-icon></js-tag>
25+
<js-map id="map" accessToken="pk.eyJ1IjoiZGp0aG9ycGUiLCJhIjoiY2x5ZnJhZjAzMDJsYTJqcjd6eWQ3cjRvcSJ9.LvoT_wihG5VQtv008P-MPw">
26+
<js-mapsource type="geojson" data="{}"></js-mapsource>
27+
</js-map>
28+
</js-container>
29+
30+
<js-container>
31+
TAG COLOR
32+
<js-tag color="primary" texttransform="uppercase">Primary</js-tag>
33+
<js-tag color="secondary" texttransform="uppercase">Secondary</js-tag>
34+
<js-tag color="success" texttransform="uppercase">Success</js-tag>
35+
<js-tag color="warning" texttransform="uppercase">Warning</js-tag>
36+
<js-tag color="error" texttransform="uppercase">Error</js-tag>
37+
<js-tag color="light" texttransform="uppercase">Light</js-tag>
38+
<js-tag color="dark" texttransform="uppercase">Dark</js-tag>
39+
<js-tag color="white" texttransform="uppercase">White</js-tag>
40+
<js-tag color="black" texttransform="uppercase">Black</js-tag>
41+
42+
TAG SIZE
43+
<js-tag color="light" size="small" texttransform="lowercase">Small</js-tag>
44+
<js-tag color="light" size="medium" texttransform="lowercase">Medium</js-tag>
45+
<js-tag color="light" size="large" texttransform="lowercase">Large</js-tag>
46+
<js-tag color="light" size="xlarge" texttransform="lowercase">XLarge</js-tag>
47+
</js-container>
48+
49+
<js-container>
50+
ICON COLOR
51+
<js-tag color="primary" texttransform="uppercase"><js-icon></js-icon></js-tag>
52+
<js-tag color="secondary" texttransform="uppercase"><js-icon></js-icon></js-tag>
53+
<js-tag color="success" texttransform="uppercase"><js-icon></js-icon></js-tag>
54+
<js-tag color="warning" texttransform="uppercase"><js-icon></js-icon></js-tag>
55+
<js-tag color="error" texttransform="uppercase"><js-icon></js-icon></js-tag>
56+
<js-tag color="light" texttransform="uppercase"><js-icon></js-icon></js-tag>
57+
<js-tag color="dark" texttransform="uppercase"><js-icon></js-icon></js-tag>
58+
<js-tag color="white" texttransform="uppercase"><js-icon></js-icon></js-tag>
59+
<js-tag color="black" texttransform="uppercase"><js-icon></js-icon></js-tag>
60+
61+
ICON SIZE
62+
<js-tag color="light" size="small"><js-icon size="small"></js-icon> small</js-tag>
63+
<js-tag color="light" size="medium"><js-icon size="medium"></js-icon> medium</js-tag>
64+
<js-tag color="light" size="large"><js-icon size="large"></js-icon> large</js-tag>
65+
<js-tag color="light" size="xlarge"><js-icon size="xlarge"></js-icon> xlarge</js-tag>
66+
</js-container>
67+
2368
</body>
2469

2570
</html>

‎example/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
// Components
44
import '../src/core/core';
55
import '../src/element/element';
6+
import '../src/mapbox/mapbox';
67

78
// Styles
89
import '../src/core/core.css';

0 commit comments

Comments
 (0)