skyquake/framework/widgets/JSONViewer/JSONViewer.scss

   1 .JSONViewer {
   2         /*
   3         copied from node_modules/prismjs/themes/prismjs.css
   4 */
   5         :not(pre) > code[class*="language-"],
   6         pre[class*="language-"] {
   7                 font-size: 12px;
   8                 /* border: 1px solid rgba(220, 220, 220, 0.5);*/
   9                 border-radius: 4px;
  10                 background-color: rgba(255, 255, 255, .25);
  11                 overflow:auto;
  12         }
  13
  14         /* Inline code */
  15         :not(pre) > code[class*="language-"] {
  16                 padding: .1em;
  17         }
  18
  19         .token.comment,
  20         .token.prolog,
  21         .token.doctype,
  22         .token.cdata {
  23                 color: slategray;
  24         }
  25
  26         .token.punctuation {
  27                 color: #333;
  28         }
  29
  30         .namespace {
  31                 opacity: .7;
  32         }
  33
  34         .token.property,
  35         .token.tag,
  36         .token.boolean,
  37         .token.number,
  38         .token.constant,
  39         .token.symbol,
  40         .token.deleted {
  41                 color: #905;
  42         }
  43
  44         .token.selector,
  45         .token.attr-name,
  46         .token.string,
  47         .token.char,
  48         .token.builtin,
  49         .token.inserted {
  50                 color: #df5000;
  51         }
  52
  53         .token.operator,
  54         .token.entity,
  55         .token.url,
  56         .language-css .token.string,
  57         .style .token.string {
  58                 color: #a67f59;
  59                 background: none !important;
  60         }
  61
  62         .token.atrule,
  63         .token.attr-value,
  64         .token.keyword {
  65                 color: #07a;
  66         }
  67
  68         .token.function {
  69                 color: #DD4A68;
  70         }
  71
  72         .token.regex,
  73         .token.important,
  74         .token.variable {
  75                 color: #e90;
  76         }
  77
  78         .token.important,
  79         .token.bold {
  80                 font-weight: bold;
  81         }
  82         .token.italic {
  83                 font-style: italic;
  84         }
  85
  86         .token.entity {
  87                 cursor: help;
  88         }
  89 }
  90
  91 .composerPopout {
  92         background-color: #f1f1f1;
  93         h1 {
  94                         height: 51px;
  95                         line-height: 51px;
  96                         margin-left: 80px;
  97                         padding-left: 118px;
  98                         position: absolute;
  99                         left: 0;
 100                         text-transform: uppercase;
 101                         font-size: 1.625rem;
 102                         font-weight: normal;
 103         }
 104 }