BookStack Code Mirror - bookstack/blob - resources/sass/_editor.scss

   1 // Main UI elements
   2 .editor-toolbar-main {
   3   display: flex;
   4 }
   5
   6 // Buttons
   7 .editor-button {
   8   border: 1px solid #DDD;
   9   font-size: 12px;
  10   padding: 4px 6px;
  11   color: #444;
  12 }
  13 .editor-button:hover {
  14   background-color: #EEE;
  15   cursor: pointer;
  16   color: #000;
  17 }
  18 .editor-button-active, .editor-button-active:hover {
  19   background-color: #ceebff;
  20   color: #000;
  21 }
  22 .editor-button-format-preview {
  23   padding: 4px 6px;
  24   display: block;
  25 }
  26
  27 // Containers
  28 .editor-dropdown-menu-container {
  29     position: relative;
  30 }
  31 .editor-dropdown-menu {
  32   position: absolute;
  33   background-color: #FFF;
  34   box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.15);
  35   z-index: 99;
  36   min-width: 120px;
  37 }
  38 .editor-menu-list {
  39   display: flex;
  40   flex-direction: column;
  41 }
  42 .editor-menu-list > .editor-button {
  43   border-bottom: 0;
  44   text-align: start;
  45 }
  46
  47 .editor-format-menu .editor-dropdown-menu {
  48   min-width: 320px;
  49 }
  50
  51 // Modals
  52 .editor-modal-wrapper {
  53   position: fixed;
  54   display: flex;
  55   align-items: center;
  56   justify-content: center;
  57   z-index: 999;
  58   background-color: rgba(0, 0, 0, 0.5);
  59   width: 100%;
  60   height: 100%;
  61 }
  62 .editor-modal {
  63   background-color: #FFF;
  64   border: 1px solid #DDD;
  65   padding: 1rem;
  66   border-radius: 4px;
  67 }
  68 .editor-modal-header {
  69   display: flex;
  70   justify-content: space-between;
  71   margin-bottom: 1rem;
  72 }
  73 .editor-modal-title {
  74   font-weight: 700;
  75 }