clang-tools-extra/pseudo/tool/HTMLForest.css

   1 body {
   2   position: absolute;
   3   top: 0;
   4   bottom: 0;
   5   right: 0;
   6   left: 0;
   7
   8   display: flex;
   9   align-items: stretch;
  10   margin: 0;
  11   font-family: sans-serif;
  12   white-space: nowrap;
  13   height: 100%;
  14 }
  15 body > * {
  16   overflow-y: auto; /* Scroll sections independently*/
  17   margin: 0;
  18 }
  19
  20 #code {
  21   font-size: 18px;
  22   line-height: 36px;
  23   flex-grow: 1;
  24   padding-right: 10em; /* Leave space for #info */
  25 }
  26 #code span {
  27   padding: 9px 0; /* No "gaps" between lines due to line-height */
  28 }
  29 .node.ambiguous::before, .ancestors.ambiguous::after, .tree-node.ambiguous > header::after {
  30   content: /*the thinking man's emoji*/'\01F914';
  31 }
  32
  33 #info {
  34   position: fixed;
  35   right: 2em;
  36   top: 1em;
  37   width: 25em;
  38   border: 1px solid black;
  39   min-height: 20em;
  40   background-color: whiteSmoke;
  41   overflow-x: clip;
  42   box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
  43 }
  44 #info header {
  45   background-color: black;
  46   color: white;
  47   font-size: larger;
  48   padding: 0.5em;
  49 }
  50 #info.ambiguous header { background-color: #803; }
  51 #info.sequence header { background-color: darkBlue; }
  52 #info.terminal header { background-color: darkGreen; }
  53 #info.opaque header { background-color: orangeRed; }
  54 #i_kind {
  55   float: right;
  56   font-size: small;
  57 }
  58 #info section {
  59   padding: 0.5em;
  60   border-top: 1px solid lightGray;
  61   overflow-x: auto;
  62 }
  63 #i_ancestors { font-size: small; }
  64
  65 #tree {
  66   flex-grow: 0;
  67   min-width: 20em;
  68   margin-right: 1em;
  69   border-right: 1px solid darkGray;
  70   background-color: azure;
  71   font-size: small;
  72   overflow-x: auto;
  73   resize: horizontal;
  74 }
  75 #tree ul {
  76   margin: 0;
  77   display: inline-block;
  78   padding-left: 6px;
  79   border-left: 1px solid rgba(0,0,0,0.2);
  80   list-style: none;
  81 }
  82 #tree > ul { border-left: none; }
  83 .tree-node.selected > header .name { font-weight: bold; }
  84 .tree-node.terminal .name { font-family: monospace; }
  85 .tree-node.ambiguous > header .name { color: #803; font-weight: bold; }
  86 .tree-node.sequence > header .name { color: darkBlue; }
  87 .tree-node.terminal > header .name { color: darkGreen; }
  88 .tree-node.opaque > header .name { color: orangeRed; }
  89
  90 .selected { outline: 1px dashed black; }
  91 .abbrev { opacity: 50%; }
  92 .abbrev::after { content: '~'; }
  93 .opaque { background-color: bisque; }