Skip to content

Commit

Permalink
0.10.0-beta.15
Browse files Browse the repository at this point in the history
New:
- Improved color legend (focus on click, toggle on icon click or CTRL+click; reset button).
- Raise smaller bars over bigger.

Fixed:
- Pointer events loss.
- Tooltip content width limit.
  • Loading branch information
alexanderby committed Feb 8, 2017
1 parent cd4fa6d commit d96c4c3
Show file tree
Hide file tree
Showing 19 changed files with 3,030 additions and 144 deletions.
2 changes: 1 addition & 1 deletion bower.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "taucharts",
"version": "0.10.0-beta.14",
"version": "0.10.0-beta.15",
"homepage": "https://github.com/TargetProcess/tauCharts",
"description": "D3 based data-focused charting library",
"keywords": [
Expand Down
3 changes: 1 addition & 2 deletions build/development/css/tauCharts.css
Original file line number Diff line number Diff line change
Expand Up @@ -492,8 +492,7 @@
transition: stroke-opacity 0.2s ease;
}
.graphical-report__bar {
opacity: 0.7;
shape-rendering: auto;
shape-rendering: geometricPrecision;
stroke-opacity: 0.5;
stroke-width: 1;
stroke: #fff;
Expand Down
3 changes: 1 addition & 2 deletions build/development/css/tauCharts.dark.css
Original file line number Diff line number Diff line change
Expand Up @@ -492,8 +492,7 @@
transition: stroke-opacity 0.2s ease;
}
.graphical-report__bar {
opacity: 0.7;
shape-rendering: auto;
shape-rendering: geometricPrecision;
stroke-opacity: 0.5;
stroke-width: 1;
stroke: #fff;
Expand Down
3 changes: 1 addition & 2 deletions build/development/css/tauCharts.default.css
Original file line number Diff line number Diff line change
Expand Up @@ -492,8 +492,7 @@
transition: stroke-opacity 0.2s ease;
}
.graphical-report__bar {
opacity: 0.7;
shape-rendering: auto;
shape-rendering: geometricPrecision;
stroke-opacity: 0.5;
stroke-width: 1;
stroke: #fff;
Expand Down
81 changes: 80 additions & 1 deletion build/development/plugins/tauCharts.legend.css
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,14 @@
/* endregion */
.graphical-report__legend {
padding: 20px 0 10px 10px;
position: relative;
margin-right: 30px;
width: 160px;
box-sizing: border-box;
}
.graphical-report__legend__wrap {
margin-bottom: 30px;
position: relative;
}
.graphical-report__legend__wrap:last-child {
margin-bottom: 0px;
Expand All @@ -22,6 +24,41 @@
font-weight: 600;
font-size: 13px;
}
.graphical-report__legend__reset {
background-color: #fff;
border: 1px solid #b3b3b3;
border-radius: 12px;
color: #b3b3b3;
cursor: pointer;
font-size: 13px;
height: 1em;
line-height: 1em;
margin-top: -4px;
padding: 4px;
position: absolute;
right: 0;
top: 0;
z-index: 2;
}
.graphical-report__legend__reset:hover {
border-color: #333;
color: #333;
}
.graphical-report__legend__reset.disabled {
display: none;
}
.graphical-report__legend__reset::before {
border: 2px solid #fff;
border-radius: 14px;
content: "";
display: block;
height: calc(100% + 2px);
left: -3px;
position: absolute;
top: -3px;
width: calc(100% + 2px);
z-index: 1;
}
.graphical-report__legend__item {
padding: 10px 20px 8px 40px;
position: relative;
Expand Down Expand Up @@ -67,7 +104,7 @@
width: 16px;
height: 16px;
}
.graphical-report__legend__guide__guide--size {
.graphical-report__legend__guide--size {
stroke: #6FA1D9;
fill: #6FA1D9;
}
Expand All @@ -79,6 +116,48 @@
stroke: #6FA1D9;
fill: #6FA1D9;
}
.graphical-report__legend__guide--color__overlay {
background-color: transparent;
height: 36px;
left: -12px;
position: absolute;
top: -12px;
width: 36px;
}
.graphical-report__legend__guide--color::before {
content: "";
display: none;
height: 2px;
left: 3px;
pointer-events: none;
position: absolute;
top: 6px;
width: 8px;
}
.graphical-report__legend__guide--color::after {
content: "";
display: none;
height: 8px;
left: 6px;
pointer-events: none;
position: absolute;
top: 3px;
width: 2px;
}
.graphical-report__legend__item .graphical-report__legend__guide--color:hover::before,
.graphical-report__legend__item .graphical-report__legend__guide--color:hover::after {
background-color: #fff;
display: inline-block;
transform: rotate(45deg);
}
.graphical-report__legend__item.disabled .graphical-report__legend__guide--color:hover {
background: #fff;
}
.graphical-report__legend__item.disabled .graphical-report__legend__guide--color:hover::before,
.graphical-report__legend__item.disabled .graphical-report__legend__guide--color:hover::after {
background-color: #333;
transform: none;
}
.graphical-report__legend__item .color20-1 {
background: #6FA1D9;
border: 1px solid #6FA1D9;
Expand Down
81 changes: 80 additions & 1 deletion build/development/plugins/tauCharts.legend.dark.css
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,14 @@
/* endregion */
.graphical-report__legend {
padding: 20px 0 10px 10px;
position: relative;
margin-right: 30px;
width: 160px;
box-sizing: border-box;
}
.graphical-report__legend__wrap {
margin-bottom: 30px;
position: relative;
}
.graphical-report__legend__wrap:last-child {
margin-bottom: 0px;
Expand All @@ -22,6 +24,41 @@
font-weight: 600;
font-size: 13px;
}
.graphical-report__legend__reset {
background-color: #000;
border: 1px solid #606060;
border-radius: 12px;
color: #606060;
cursor: pointer;
font-size: 13px;
height: 1em;
line-height: 1em;
margin-top: -4px;
padding: 4px;
position: absolute;
right: 0;
top: 0;
z-index: 2;
}
.graphical-report__legend__reset:hover {
border-color: #fff;
color: #fff;
}
.graphical-report__legend__reset.disabled {
display: none;
}
.graphical-report__legend__reset::before {
border: 2px solid #000;
border-radius: 14px;
content: "";
display: block;
height: calc(100% + 2px);
left: -3px;
position: absolute;
top: -3px;
width: calc(100% + 2px);
z-index: 1;
}
.graphical-report__legend__item {
padding: 10px 20px 8px 40px;
position: relative;
Expand Down Expand Up @@ -67,7 +104,7 @@
width: 16px;
height: 16px;
}
.graphical-report__legend__guide__guide--size {
.graphical-report__legend__guide--size {
stroke: #6FA1D9;
fill: #6FA1D9;
}
Expand All @@ -79,6 +116,48 @@
stroke: #6FA1D9;
fill: #6FA1D9;
}
.graphical-report__legend__guide--color__overlay {
background-color: transparent;
height: 36px;
left: -12px;
position: absolute;
top: -12px;
width: 36px;
}
.graphical-report__legend__guide--color::before {
content: "";
display: none;
height: 2px;
left: 3px;
pointer-events: none;
position: absolute;
top: 6px;
width: 8px;
}
.graphical-report__legend__guide--color::after {
content: "";
display: none;
height: 8px;
left: 6px;
pointer-events: none;
position: absolute;
top: 3px;
width: 2px;
}
.graphical-report__legend__item .graphical-report__legend__guide--color:hover::before,
.graphical-report__legend__item .graphical-report__legend__guide--color:hover::after {
background-color: #000;
display: inline-block;
transform: rotate(45deg);
}
.graphical-report__legend__item.disabled .graphical-report__legend__guide--color:hover {
background: #000;
}
.graphical-report__legend__item.disabled .graphical-report__legend__guide--color:hover::before,
.graphical-report__legend__item.disabled .graphical-report__legend__guide--color:hover::after {
background-color: #fff;
transform: none;
}
.graphical-report__legend__item .color20-1 {
background: #6FA1D9;
border: 1px solid #6FA1D9;
Expand Down
81 changes: 80 additions & 1 deletion build/development/plugins/tauCharts.legend.default.css
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,14 @@
/* endregion */
.graphical-report__legend {
padding: 20px 0 10px 10px;
position: relative;
margin-right: 30px;
width: 160px;
box-sizing: border-box;
}
.graphical-report__legend__wrap {
margin-bottom: 30px;
position: relative;
}
.graphical-report__legend__wrap:last-child {
margin-bottom: 0px;
Expand All @@ -22,6 +24,41 @@
font-weight: 600;
font-size: 13px;
}
.graphical-report__legend__reset {
background-color: #fff;
border: 1px solid #b3b3b3;
border-radius: 12px;
color: #b3b3b3;
cursor: pointer;
font-size: 13px;
height: 1em;
line-height: 1em;
margin-top: -4px;
padding: 4px;
position: absolute;
right: 0;
top: 0;
z-index: 2;
}
.graphical-report__legend__reset:hover {
border-color: #333;
color: #333;
}
.graphical-report__legend__reset.disabled {
display: none;
}
.graphical-report__legend__reset::before {
border: 2px solid #fff;
border-radius: 14px;
content: "";
display: block;
height: calc(100% + 2px);
left: -3px;
position: absolute;
top: -3px;
width: calc(100% + 2px);
z-index: 1;
}
.graphical-report__legend__item {
padding: 10px 20px 8px 40px;
position: relative;
Expand Down Expand Up @@ -67,7 +104,7 @@
width: 16px;
height: 16px;
}
.graphical-report__legend__guide__guide--size {
.graphical-report__legend__guide--size {
stroke: #6FA1D9;
fill: #6FA1D9;
}
Expand All @@ -79,6 +116,48 @@
stroke: #6FA1D9;
fill: #6FA1D9;
}
.graphical-report__legend__guide--color__overlay {
background-color: transparent;
height: 36px;
left: -12px;
position: absolute;
top: -12px;
width: 36px;
}
.graphical-report__legend__guide--color::before {
content: "";
display: none;
height: 2px;
left: 3px;
pointer-events: none;
position: absolute;
top: 6px;
width: 8px;
}
.graphical-report__legend__guide--color::after {
content: "";
display: none;
height: 8px;
left: 6px;
pointer-events: none;
position: absolute;
top: 3px;
width: 2px;
}
.graphical-report__legend__item .graphical-report__legend__guide--color:hover::before,
.graphical-report__legend__item .graphical-report__legend__guide--color:hover::after {
background-color: #fff;
display: inline-block;
transform: rotate(45deg);
}
.graphical-report__legend__item.disabled .graphical-report__legend__guide--color:hover {
background: #fff;
}
.graphical-report__legend__item.disabled .graphical-report__legend__guide--color:hover::before,
.graphical-report__legend__item.disabled .graphical-report__legend__guide--color:hover::after {
background-color: #333;
transform: none;
}
.graphical-report__legend__item .color20-1 {
background: #6FA1D9;
border: 1px solid #6FA1D9;
Expand Down
Loading

0 comments on commit d96c4c3

Please sign in to comment.