dox-sequence-diagram-ui/src/main/webapp/res/ecomp/asdc/sequencer/sequencer-editor.scss

   1 .asdcs-control {
   2
   3     div.asdcs-editor {
   4
   5         $asdcsEditorResizeWidth: 6px;
   6         $asdcsEditorToolbarPadding: 4px;
   7
   8         box-sizing: border-box;
   9         float: left;
  10         height: 100%;
  11         width: $asdcsEditorWidth;
  12         overflow-x: hidden;
  13         overflow-y: auto;
  14         position: relative;
  15         padding-right: $asdcsEditorResizeWidth;
  16
  17         div.asdcs-editor-toolbar {
  18
  19             display: none;
  20
  21             height: 40px;
  22             width: 100%;
  23
  24             background-color: $asdcsColorOneDark;
  25             text-align: center;
  26
  27             .asdcs-editor-toolbar-demo {
  28                 padding: $asdcsEditorToolbarPadding;
  29                 display: inline;
  30                 float: left;
  31             }
  32
  33             .asdcs-editor-toolbar-toggle {
  34                 padding: $asdcsEditorToolbarPadding;
  35                 display: inline;
  36                 float: right;
  37             }
  38
  39             button {
  40
  41                 &.asdcs-button-mode {
  42
  43                     padding-left: 8px;
  44                     padding-right: 8px;
  45
  46                     &.asdcs-button-toggle-left {
  47                         border-top-right-radius: 0;
  48                         border-bottom-right-radius: 0;
  49                         margin-right: -4px;
  50                     }
  51
  52                     &.asdcs-button-toggle-right {
  53                         border-top-left-radius: 0;
  54                         border-bottom-left-radius: 0;
  55                         margin-left: -4px;
  56                     }
  57
  58                     &.asdcs-button-toggle-center {
  59                         border-radius: 0;
  60                         border-right: 1px solid lighten($asdcsColorOneDark, 3%);
  61                         border-left: 1px solid lighten($asdcsColorOneDark, 3%);
  62                     }
  63
  64                     &.asdcs-active {
  65                         background-color: $asdcsColorButtonBGHover;
  66                     }
  67
  68                     &:hover {
  69                         border-color: transparent;
  70                         @include transition(border-color $asdcsTransitionTime ease);
  71                     }
  72                 }
  73
  74                 svg {
  75                     height: $asdcsSmallIconSize;
  76                     width: $asdcsSmallIconSize;
  77                     fill: $asdcsColorWhitish;
  78                 }
  79             }
  80         }
  81
  82         div.asdcs-editor-content {
  83
  84             height: 100%;
  85             width: 100%;
  86             overflow-x: hidden;
  87             overflow-y: auto;
  88
  89             div.asdcs-editor-code {
  90                 display:none;
  91                 height: 100%;
  92                 width: 100%;
  93                 background-color: $asdcsColorWhitish;
  94                 textarea {
  95                     height: 100%;
  96                 }
  97                 .CodeMirror {
  98                     height: 100%;
  99                 }
 100             }
 101
 102             div.asdcs-editor-designer {
 103                 height: 100%;
 104                 width: 100%;
 105
 106                 .asdcs-designer-accordion {
 107                     height: 100%;
 108                 }
 109             }
 110
 111         }
 112
 113         div.asdcs-editor-resize-handle {
 114             background-color: $asdcsColorOne;
 115             position: absolute;
 116             top: 0;
 117             right: 0;
 118             height: 100%;
 119             width: $asdcsEditorResizeWidth;
 120             cursor: e-resize;
 121             @include drop-shadow();
 122
 123         }
 124     }
 125 }