@import 'nodes.less';
+@import 'canvas/canvas.less';
+@import 'canvas/container.less';
@import 'canvas/documentElement.less';
@import 'canvas/genericElement.less';
+@import 'canvas/gutter.less';
+@import 'canvas/comments/comments.less';
#rng-module-documentCanvas {
height: 100%;
}
-#rng-module-documentCanvas-mainArea {
- height: 100%;
- margin-bottom: 20px;
-}
-
#rng-module-documentCanvas-contentWrapper {
- border-color: #ddd;
- border-style: solid;
- border-width: 1px;
+ background-color: #ddd;
float:left;
width: 100%;
height: 100%;
overflow-y: scroll;
- padding: 0 10px;
+ &:before {
+ content: "";
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: -15px;
+ right: -15px;
+ box-shadow: inset 0 20px 12px -20px rgba(0,0,0,0.6);
+ pointer-events:none;
+ z-index: 1;
+ }
+
+ &:after {
+ content: "";
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: -15px;
+ right: -15px;
+ box-shadow: inset 0px -20px 12px -20px rgba(0,0,0,0.6);
+ pointer-events:none;
+ z-index: 1;
+ }
+
&::-webkit-scrollbar {
.rng-mixin-scrollbar;
}
.rng-mixin-scrollbar-thumb-window-inactive;
}
- .canvas-wrapper {
+ .root-wrapper {
+ display: table-cell;
+ vertical-align: top;
+ width: 600px;
outline: 0px solid transparent;
+ padding: 0 100px;
+ background-color: white;
+ box-shadow: 0 0 20px rgba(0, 0, 0, 0.2), inset 0 0 10px rgba(0, 0, 0, 0.1);
+ }
+
+ [document-text-element] {
+ outline: none;
}
.current-text-element {