diff options
| author | bob <bcz@cs.brown.edu> | 2019-04-03 11:45:15 -0400 |
|---|---|---|
| committer | bob <bcz@cs.brown.edu> | 2019-04-03 11:45:15 -0400 |
| commit | bb7d5a26ec68f283c5adb42d4d6554253de7176f (patch) | |
| tree | 7efa817102ba54e916601611f608dd4bd761a437 /src/client/views/DocumentDecorations.scss | |
| parent | 43a0768690caa89c606dd5d296d3cc8825c1702b (diff) | |
| parent | c406c8d123ce0aa9d63fb8a4dd90adfe83d2889d (diff) | |
merged with master
Diffstat (limited to 'src/client/views/DocumentDecorations.scss')
| -rw-r--r-- | src/client/views/DocumentDecorations.scss | 100 |
1 files changed, 96 insertions, 4 deletions
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss index 9bafbda44..272ea9e5d 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 20px 1fr 20px; - grid-template-columns: 20px 1fr 20px; + grid-template-rows: 20px 8px 1fr 8px; + 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 { @@ -35,4 +36,95 @@ grid-column-end: 4; pointer-events: auto; } +} + +.documentDecorations-background { + background:lightblue; + position: absolute; + opacity: 0.1; +} + +// 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 |
