src/editor/modules/documentCanvas/documentCanvas.less

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