diff options
| author | yipstanley <stanley_yip@brown.edu> | 2019-03-17 14:23:00 -0400 |
|---|---|---|
| committer | yipstanley <stanley_yip@brown.edu> | 2019-03-17 14:23:00 -0400 |
| commit | 3d337129f112425345436aa69a95fcf03ad830d7 (patch) | |
| tree | f156445b8f5afad577e4038a849290d755a8d552 /src/client/views/DocumentDecorations.scss | |
| parent | b4dc598ff08c7c684daa4b75508e17213d29d8e5 (diff) | |
| parent | 47da497aded0bafdc5c85c8a79a9a06d0d401e92 (diff) | |
Merge branch 'master' of https://github.com/browngraphicslab/Dash-Web into view_doc_impl
Diffstat (limited to 'src/client/views/DocumentDecorations.scss')
| -rw-r--r-- | src/client/views/DocumentDecorations.scss | 94 |
1 files changed, 90 insertions, 4 deletions
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss index e8b93a18b..11595aa01 100644 --- a/src/client/views/DocumentDecorations.scss +++ b/src/client/views/DocumentDecorations.scss @@ -1,17 +1,18 @@ +@import "global_variables"; #documentDecorations-container { position: absolute; display: grid; z-index: 1000; - grid-template-rows: 20px 1fr 20px; - grid-template-columns: 20px 1fr 20px; + grid-template-rows: 8px 1fr 8px 30px; + grid-template-columns: 8px 1fr 8px; pointer-events: none; #documentDecorations-centerCont { background: none; } .documentDecorations-resizer { pointer-events: auto; - background: lightblue; - opacity: 0.4; + background: $alt-accent; + opacity: 0.8; } #documentDecorations-topLeftResizer, #documentDecorations-bottomRightResizer { @@ -29,4 +30,89 @@ #documentDecorations-rightResizer { cursor: ew-resize; } +} + +// position: absolute; +// display: grid; +// z-index: 1000; +// grid-template-rows: 20px 1fr 20px 0px; +// grid-template-columns: 20px 1fr 20px; +// pointer-events: none; +// #documentDecorations-centerCont { +// background: none; +// } +// .documentDecorations-resizer { +// pointer-events: auto; +// background: lightblue; +// opacity: 0.4; +// } +// #documentDecorations-topLeftResizer, +// #documentDecorations-bottomRightResizer { +// cursor: nwse-resize; +// } +// #documentDecorations-topRightResizer, +// #documentDecorations-bottomLeftResizer { +// cursor: nesw-resize; +// } +// #documentDecorations-topResizer, +// #documentDecorations-bottomResizer { +// cursor: ns-resize; +// } +// #documentDecorations-leftResizer, +// #documentDecorations-rightResizer { +// cursor: ew-resize; +// } +// } +.linkFlyout { + grid-column: 1/4 +} + +.linkButton-empty:hover { + background: $main-accent; + transform: scale(1.05); + cursor: pointer; +} + +.linkButton-nonempty:hover { + background: $main-accent; + transform: scale(1.05); + cursor: pointer; +} + +.linkButton-empty { + height: 20px; + width: 20px; + margin-top: 10px; + border-radius: 50%; + opacity: 0.9; + pointer-events: auto; + background-color: $dark-color; + color: $light-color; + text-transform: uppercase; + letter-spacing: 2px; + font-size: 75%; + transition: transform 0.2s; + text-align: center; + display: flex; + justify-content: center; + align-items: center; +} + +.linkButton-nonempty { + height: 20px; + width: 20px; + margin-top: 10px; + border-radius: 50%; + opacity: 0.9; + pointer-events: auto; + background-color: $dark-color; + color: $light-color; + text-transform: uppercase; + letter-spacing: 2px; + font-size: 75%; + transition: transform 0.2s; + text-align: center; + display: flex; + justify-content: center; + align-items: center; }
\ No newline at end of file |