Skip to content

Commit 79a92eb

Browse files
ramiyramiy
authored
Merge pull request #11 from ramiy/master
Version 0.9.0
2 parents f33de9f + 4e4c487 commit 79a92eb

13 files changed

Lines changed: 513 additions & 396 deletions

‎README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@
22

33
![GitHub Version](https://img.shields.io/github/v/release/ChartsCSS/charts.css?style=for-the-badge) ![Minified Size](https://img.shields.io/bundlephobia/min/charts.css?style=for-the-badge) ![License](https://img.shields.io/github/license/ChartsCSS/charts.css?style=for-the-badge)
44

5-
**Charts.css is an MIT-licensed open source CSS framework for data visualization.**
5+
**Charts.css is an open source CSS framework for data visualization.**
66

7-
Visualization help end-users to understand data. **Charts.css** help frontend developers to turn data into beautiful charts and graphs using simple **CSS classes**.
7+
Visualization help end-users understand data. **Charts.css** help frontend developers turn data into beautiful charts and graphs using simple **CSS classes**.
88

99
## Documentation
1010

‎dist/charts.css‎

Lines changed: 109 additions & 173 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/charts.css.map‎

Lines changed: 2 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/charts.min.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package-lock.json‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "charts.css",
3-
"version": "0.8.2",
3+
"version": "0.9.0",
44
"description": "Open source CSS framework for data visualization.",
55
"author": "Rami Yushuvaev",
66
"homepage": "https://ChartsCSS.org/",

‎src/charts.scss‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*
2-
* Charts.css v0.8.2 (https://ChartsCSS.org/)
2+
* Charts.css v0.9.0 (https://ChartsCSS.org/)
33
* Copyright 2020 Rami Yushuvaev
44
* Licensed under MIT
55
*/
@@ -13,6 +13,7 @@
1313
@import "components/heading";
1414
@import "components/colors";
1515
@import "components/data";
16+
@import "components/labels";
1617
@import "components/axes";
1718
@import "components/legend";
1819
@import "components/tooltips";

‎src/charts/_area.scss‎

Lines changed: 24 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,6 @@
3131
position: absolute;
3232
right: 0;
3333
left: 0;
34-
justify-content: var(--labels-align, center);
3534
}
3635

3736
td {
@@ -67,38 +66,6 @@
6766
}
6867
}
6968

70-
// Labels
71-
&:not(.show-labels) {
72-
--labels-size: 0;
73-
74-
tbody tr th {
75-
display: none;
76-
}
77-
}
78-
&.show-labels {
79-
--labels-size: 1.5rem;
80-
81-
tbody tr th {
82-
display: flex;
83-
align-items: center;
84-
}
85-
}
86-
&.labels-align-start {
87-
tbody tr th {
88-
justify-content: var(--labels-align, flex-start);
89-
}
90-
}
91-
&.labels-align-end {
92-
tbody tr th {
93-
justify-content: var(--labels-align, flex-end);
94-
}
95-
}
96-
&.labels-align-center {
97-
tbody tr th {
98-
justify-content: var(--labels-align, center);
99-
}
100-
}
101-
10269
// Orientation
10370
&:not(.reverse) {
10471
tbody {
@@ -165,7 +132,12 @@
165132
align-items: flex-end;
166133

167134
&::before {
168-
clip-path: polygon(0% calc(100% * (1 - var(--start, var(--size)))), 100% calc(100% * (1 - var(--size))), 100% 100%, 0% 100%);
135+
clip-path: polygon(
136+
0% calc(100% * (1 - var(--start, var(--size)))),
137+
100% calc(100% * (1 - var(--size))),
138+
100% 100%,
139+
0% 100%
140+
);
169141
}
170142

171143
.data {
@@ -183,7 +155,12 @@
183155
align-items: flex-start;
184156

185157
&::before {
186-
clip-path: polygon(0% calc(100% * (1 - var(--size))), 100% calc(100% * (1 - var(--start, var(--size)))), 100% 100%, 0% 100%);
158+
clip-path: polygon(
159+
0% calc(100% * (1 - var(--size))),
160+
100% calc(100% * (1 - var(--start, var(--size)))),
161+
100% 100%,
162+
0% 100%
163+
);
187164
}
188165

189166
.data {
@@ -203,7 +180,12 @@
203180
align-items: flex-end;
204181

205182
&::before {
206-
clip-path: polygon(0% 0%, 100% 0%, 100% calc(100% * var(--size)), 0% calc(100% * var(--start, var(--size))));
183+
clip-path: polygon(
184+
0% 0%,
185+
100% 0%,
186+
100% calc(100% * var(--size)),
187+
0% calc(100% * var(--start, var(--size)))
188+
);
207189
}
208190

209191
.data {
@@ -221,7 +203,12 @@
221203
align-items: flex-start;
222204

223205
&::before {
224-
clip-path: polygon(0% 0%, 100% 0%, 100% calc(100% * var(--start, var(--size))), 0% calc(100% * var(--size)));
206+
clip-path: polygon(
207+
0% 0%,
208+
100% 0%,
209+
100% calc(100% * var(--start, var(--size))),
210+
0% calc(100% * var(--size))
211+
);
225212
}
226213

227214
.data {

‎src/charts/_bar.scss‎

Lines changed: 0 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -46,38 +46,6 @@
4646
}
4747
}
4848

49-
// Labels
50-
&:not(.show-labels) {
51-
--labels-size: 0;
52-
53-
tbody tr th {
54-
display: none;
55-
}
56-
}
57-
&.show-labels {
58-
--labels-size: 80px;
59-
60-
tbody tr th {
61-
display: flex;
62-
align-items: center;
63-
}
64-
}
65-
&.labels-align-start {
66-
tbody tr th {
67-
align-items: var(--labels-align, flex-start);
68-
}
69-
}
70-
&.labels-align-end {
71-
tbody tr th {
72-
align-items: var(--labels-align, flex-end);
73-
}
74-
}
75-
&.labels-align-center {
76-
tbody tr th {
77-
align-items: var(--labels-align, center);
78-
}
79-
}
80-
8149
// Orientation
8250
&:not(.reverse) {
8351
tbody {
@@ -88,7 +56,6 @@
8856
th {
8957
left: calc(-1 * var(--labels-size) - var(--primary-axis-width));
9058
width: var(--labels-size);
91-
justify-content: var(--labels-align, flex-start);
9259
}
9360

9461
td {
@@ -106,7 +73,6 @@
10673
th {
10774
right: calc(-1 * var(--labels-size) - var(--primary-axis-width));
10875
width: var(--labels-size);
109-
justify-content: var(--labels-align, flex-end);
11076
}
11177

11278
td {

‎src/charts/_column.scss‎

Lines changed: 0 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,6 @@
3131
position: absolute;
3232
right: 0;
3333
left: 0;
34-
justify-content: var(--labels-align, center);
3534
}
3635

3736
td {
@@ -47,38 +46,6 @@
4746
}
4847
}
4948

50-
// Labels
51-
&:not(.show-labels) {
52-
--labels-size: 0;
53-
54-
tbody tr th {
55-
display: none;
56-
}
57-
}
58-
&.show-labels {
59-
--labels-size: 1.5rem;
60-
61-
tbody tr th {
62-
display: flex;
63-
align-items: center;
64-
}
65-
}
66-
&.labels-align-start {
67-
tbody tr th {
68-
justify-content: var(--labels-align, flex-start);
69-
}
70-
}
71-
&.labels-align-end {
72-
tbody tr th {
73-
justify-content: var(--labels-align, flex-end);
74-
}
75-
}
76-
&.labels-align-center {
77-
tbody tr th {
78-
justify-content: var(--labels-align, center);
79-
}
80-
}
81-
8249
// Orientation
8350
&:not(.reverse) {
8451
tbody {

0 commit comments

Comments
 (0)