aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/DocumentDecorations.scss
diff options
context:
space:
mode:
authorLionel Han <47760119+IGoByJoe@users.noreply.github.com>2020-09-04 19:02:50 -0700
committerLionel Han <47760119+IGoByJoe@users.noreply.github.com>2020-09-04 19:02:50 -0700
commite11c71a94016e3fe2529d0523fd62401baf90093 (patch)
tree3364d6a9ab147247b90ce9e390f4aef945afd0c5 /src/client/views/DocumentDecorations.scss
parent4767a10336309c679da60fd244548414c055ac50 (diff)
parent2ef7900d1210bc0e5261e1d1f8fd1ba5f3a0ee4c (diff)
Merge branch 'master' of https://github.com/browngraphicslab/Dash-Web into new_audio
Diffstat (limited to 'src/client/views/DocumentDecorations.scss')
-rw-r--r--src/client/views/DocumentDecorations.scss87
1 files changed, 47 insertions, 40 deletions
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss
index 1e8cfdff4..e02408559 100644
--- a/src/client/views/DocumentDecorations.scss
+++ b/src/client/views/DocumentDecorations.scss
@@ -16,22 +16,12 @@ $linkGap : 3px;
grid-template-columns: 8px 16px 1fr 8px 8px;
pointer-events: none;
- #documentDecorations-centerCont {
+ .documentDecorations-centerCont {
grid-column: 3;
background: none;
}
- .documentDecorations-resizer {
- pointer-events: auto;
- background: $alt-accent;
- opacity: 0.1;
- }
-
- .documentDecorations-resizer:hover {
- opacity: 1;
- }
-
- .documentDecorations-selector {
+ .documentDecorations-levelSelector {
pointer-events: auto;
height: 15px;
width: 15px;
@@ -49,27 +39,43 @@ $linkGap : 3px;
grid-row: 4;
}
- #documentDecorations-topLeftResizer,
- #documentDecorations-leftResizer,
- #documentDecorations-bottomLeftResizer {
+ .documentDecorations-topLeftResizer,
+ .documentDecorations-topRightResizer,
+ .documentDecorations-bottomLeftResizer,
+ .documentDecorations-bottomRightResizer,
+ .documentDecorations-leftResizer,
+ .documentDecorations-topResizer,
+ .documentDecorations-bottomResizer,
+ .documentDecorations-rightResizer {
+ pointer-events: auto;
+ background: $alt-accent;
+ opacity: 0.1;
+ &:hover {
+ opacity: 1;
+ }
+ }
+
+ .documentDecorations-topLeftResizer,
+ .documentDecorations-leftResizer,
+ .documentDecorations-bottomLeftResizer {
grid-column: 1
}
- #documentDecorations-topResizer,
- #documentDecorations-bottomResizer {
+ .documentDecorations-topResizer,
+ .documentDecorations-bottomResizer {
grid-column-start: 2;
grid-column-end: 5;
}
- #documentDecorations-bottomRightResizer,
- #documentDecorations-topRightResizer,
- #documentDecorations-rightResizer {
+ .documentDecorations-bottomRightResizer,
+ .documentDecorations-topRightResizer,
+ .documentDecorations-rightResizer {
grid-column-start: 5;
grid-column-end: 7;
}
- #documentDecorations-rotation,
- #documentDecorations-borderRadius {
+ .documentDecorations-rotation,
+ .documentDecorations-borderRadius {
grid-column: 5;
grid-row: 4;
border-radius: 100%;
@@ -79,6 +85,7 @@ $linkGap : 3px;
top: 12;
position: relative;
pointer-events: all;
+ cursor: grab;
.borderRadiusTooltip {
width: 10px;
@@ -86,69 +93,69 @@ $linkGap : 3px;
position: absolute;
}
}
- #documentDecorations-rotation {
+ .documentDecorations-rotation {
background: transparent;
right: -15;
}
- #documentDecorations-topLeftResizer,
- #documentDecorations-bottomRightResizer {
+ .documentDecorations-topLeftResizer,
+ .documentDecorations-bottomRightResizer {
cursor: nwse-resize;
background: unset;
opacity: 1;
}
- #documentDecorations-topLeftResizer {
+ .documentDecorations-topLeftResizer {
border-left: 2px solid;
border-top: solid 2px;
}
- #documentDecorations-bottomRightResizer {
+ .documentDecorations-bottomRightResizer {
border-right: 2px solid;
border-bottom: solid 2px;
}
- #documentDecorations-topLeftResizer:hover,
- #documentDecorations-bottomRightResizer:hover {
+ .documentDecorations-topLeftResizer:hover,
+ .documentDecorations-bottomRightResizer:hover {
opacity: 1;
}
- #documentDecorations-bottomRightResizer {
+ .documentDecorations-bottomRightResizer {
grid-row: 4;
}
- #documentDecorations-topRightResizer,
- #documentDecorations-bottomLeftResizer {
+ .documentDecorations-topRightResizer,
+ .documentDecorations-bottomLeftResizer {
cursor: nesw-resize;
background: unset;
opacity: 1;
}
- #documentDecorations-topRightResizer {
+ .documentDecorations-topRightResizer {
border-right: 2px solid;
border-top: 2px solid;
}
- #documentDecorations-bottomLeftResizer {
+ .documentDecorations-bottomLeftResizer {
border-left: 2px solid;
border-bottom: 2px solid;
}
- #documentDecorations-topRightResizer:hover,
- #documentDecorations-bottomLeftResizer:hover {
+ .documentDecorations-topRightResizer:hover,
+ .documentDecorations-bottomLeftResizer:hover {
cursor: nesw-resize;
background: dimGray;
opacity: 1;
}
- #documentDecorations-topResizer,
- #documentDecorations-bottomResizer {
+ .documentDecorations-topResizer,
+ .documentDecorations-bottomResizer {
cursor: ns-resize;
}
- #documentDecorations-leftResizer,
- #documentDecorations-rightResizer {
+ .documentDecorations-leftResizer,
+ .documentDecorations-rightResizer {
cursor: ew-resize;
}