Updated container.scss to be a 'pointer' on timeline events

This commit is contained in:
xdrm-brackets 2017-11-11 18:50:01 +01:00
parent b73f71c652
commit 172f1e5935
2 changed files with 19 additions and 8 deletions

View File

@ -550,24 +550,30 @@ svg > circle[class^=svg_]{
} }
/* (2) Middle circles -> scale+ on hover */ /* (2) Set cursor to pointer */
svg > circle[class^=svg_]:not(.op_svg){
cursor: pointer;
}
/* (3) Middle circles -> scale+ on hover */
svg > circle[class^=svg_]:not(.op_svg):hover{ svg > circle[class^=svg_]:not(.op_svg):hover{
-webkit-transform: scale(1.2); -webkit-transform: scale(1.2);
transform: scale(1.2); transform: scale(1.2);
} }
/* (3) Avoid icons inside middle circles to block :hover */ /* (4) Avoid icons inside middle circles to block :hover */
svg > circle[class^=svg_]:not(.op_svg) + image{ svg > circle[class^=svg_]:not(.op_svg) + image{
-webkit-pionter-events: none; -webkit-pionter-events: none;
pointer-events: none; pointer-events: none;
} }
/* (4) Make around circles a bit transparent */ /* (5) Make around circles a bit transparent */
svg > circle.op_svg{ svg > circle.op_svg{
opacity: .6; opacity: .6;
} }
/* (5) Set circle colors according to action type */ /* (6) Set circle colors according to action type */
svg > circle.svg_start{ fill: #2cde8b; } svg > circle.svg_start{ fill: #2cde8b; }
svg > circle.svg_stop{ fill: #3a3a3a; } svg > circle.svg_stop{ fill: #3a3a3a; }
svg > circle.svg_lock{ fill: #e04343; } svg > circle.svg_lock{ fill: #e04343; }

View File

@ -705,24 +705,29 @@ svg > circle[class^=svg_] {
transition: transform .2s ease-in-out; transition: transform .2s ease-in-out;
} }
/* (2) Middle circles -> scale+ on hover */ /* (2) Set cursor to pointer */
svg > circle[class^=svg_]:not(.op_svg) {
cursor: pointer;
}
/* (3) Middle circles -> scale+ on hover */
svg > circle[class^=svg_]:not(.op_svg):hover { svg > circle[class^=svg_]:not(.op_svg):hover {
-webkit-transform: scale(1.2); -webkit-transform: scale(1.2);
transform: scale(1.2); transform: scale(1.2);
} }
/* (3) Avoid icons inside middle circles to block :hover */ /* (4) Avoid icons inside middle circles to block :hover */
svg > circle[class^=svg_]:not(.op_svg) + image { svg > circle[class^=svg_]:not(.op_svg) + image {
-webkit-pionter-events: none; -webkit-pionter-events: none;
pointer-events: none; pointer-events: none;
} }
/* (4) Make around circles a bit transparent */ /* (5) Make around circles a bit transparent */
svg > circle.op_svg { svg > circle.op_svg {
opacity: .6; opacity: .6;
} }
/* (5) Set circle colors according to action type */ /* (6) Set circle colors according to action type */
svg > circle.svg_start { svg > circle.svg_start {
fill: #2cde8b; fill: #2cde8b;
} }