editor: styling gutter comments
[fnpeditor.git] / src / editor / modules / documentCanvas / documentCanvas.less
1 @import 'nodes.less';
2 @import 'canvas/canvas.less';
3 @import 'canvas/documentElement.less';
4 @import 'canvas/genericElement.less';
5 @import 'canvas/gutter.less';
6 @import 'canvas/comments/comments.less';
7
8 #rng-module-documentCanvas {
9    height: 100%;
10 }
11
12 #rng-module-documentCanvas-contentWrapper {
13     border-color: #ddd;
14     border-style: solid;
15     border-width: 1px;
16     float:left;
17     width: calc(~'100% - 20px');
18     height: 100%;
19     overflow-y: scroll;
20     padding: 0 10px;
21     
22     &::-webkit-scrollbar {
23         .rng-mixin-scrollbar;
24     }
25     &::-webkit-scrollbar-track {
26         .rng-mixin-scrollbar-track;
27     }
28     &::-webkit-scrollbar-thumb {
29         .rng-mixin-scrollbar-thumb;
30     }
31     &::-webkit-scrollbar-thumb:window-inactive {
32         .rng-mixin-scrollbar-thumb-window-inactive;
33     }
34     
35     .root-wrapper {
36         display: table-cell;
37         vertical-align: top;
38         width:800px;
39         outline: 0px solid transparent;
40     }
41
42     .current-text-element {
43     }
44
45     .current-node-element {
46         border-color: lighten(#000, 35%);
47         border-style: solid;
48         border-width: 1px;
49     }
50
51     .current-node-element[wlxml-tag="span"] {
52         border: none;
53     }
54
55     .highlighted-element {
56         border: 1px solid lighten(#000, 15%);
57     }
58     
59     .highlighted-element[wlxml-tag="span"] {
60         border: none;
61     }
62
63     counter-reset: footnote;
64 }
65
66 .rng-module-documentCanvas-currentNode {
67     background: #fffacd;
68     border-color: grey;
69     border-style:dashed;
70     border-width:1px;
71 }
72
73 .rng-module-documentCanvas-hoveredNodeTag {
74     position:absolute;
75     height:20px;
76     top:-20px;
77     left:0;
78     background: #bd362f;
79     color: white;
80     font-size:9px;
81     font-weight: normal;
82     font-style: normal;
83     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
84     padding: 0 5px;
85     text-indent: 0;
86 }
87
88 [document-node-element] {
89     position:relative;
90     border: 1px solid transparent;
91 }