3d335dc77af7fabd24a137b1d94d8489586adc45
[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     background-color: #ddd;
14     float:left;
15     width: 100%;
16     height: 100%;
17     overflow-y: scroll;
18     
19     &:before {
20         content: "";
21         position: absolute;
22         top: 0;
23         bottom: 0;
24         left: -15px;
25         right: -15px;
26         box-shadow: inset 0 20px 12px -20px rgba(0,0,0,0.6);
27         pointer-events:none;
28         z-index: 1;
29     }
30
31     &:after {
32         content: "";
33         position: absolute;
34         top: 0;
35         bottom: 0;
36         left: -15px;
37         right: -15px;
38         box-shadow: inset 0px -20px 12px -20px rgba(0,0,0,0.6);
39         pointer-events:none;
40         z-index: 1;
41     }
42
43     &::-webkit-scrollbar {
44         .rng-mixin-scrollbar;
45     }
46     &::-webkit-scrollbar-track {
47         .rng-mixin-scrollbar-track;
48     }
49     &::-webkit-scrollbar-thumb {
50         .rng-mixin-scrollbar-thumb;
51     }
52     &::-webkit-scrollbar-thumb:window-inactive {
53         .rng-mixin-scrollbar-thumb-window-inactive;
54     }
55     
56     .root-wrapper {
57         display: table-cell;
58         vertical-align: top;
59         width: 600px;
60         outline: 0px solid transparent;
61         padding: 0 100px;
62         background-color: white;
63         box-shadow: 0 0 20px rgba(0, 0, 0, 0.2), inset 0 0 10px rgba(0, 0, 0, 0.1);
64     }
65
66     [document-text-element] {
67         outline: none;
68     }
69
70     .current-text-element {
71     }
72
73     .current-node-element {
74         border-color: lighten(#000, 35%);
75         border-style: solid;
76         border-width: 1px;
77     }
78
79     .current-node-element[wlxml-tag="span"] {
80         border: none;
81     }
82
83     .highlighted-element {
84         border: 1px solid lighten(#000, 15%);
85     }
86     
87     .highlighted-element[wlxml-tag="span"] {
88         border: none;
89     }
90
91     counter-reset: footnote;
92 }
93
94 .rng-module-documentCanvas-currentNode {
95     background: #fffacd;
96     border-color: grey;
97     border-style:dashed;
98     border-width:1px;
99 }
100
101 .rng-module-documentCanvas-hoveredNodeTag {
102     position:absolute;
103     height:20px;
104     top:-20px;
105     left:0;
106     background: #bd362f;
107     color: white;
108     font-size:9px;
109     font-weight: normal;
110     font-style: normal;
111     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
112     padding: 0 5px;
113     text-indent: 0;
114 }
115
116 [document-node-element] {
117     position:relative;
118     border: 1px solid transparent;
119 }