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 }