src/css/ext6-pmx.css

   1 .pmx-clear-trigger {
   2     background-image: url(../images/pmx-clear-trigger.png);
   3 }
   4
   5 .pmx-hint {
   6     background-color: LightYellow;
   7 }
   8
   9 .x-mask-msg-text {
  10     text-align: center;
  11 }
  12
  13 .proxmox-disabled-row, .proxmox-disabled-row td {
  14     /*color: #a0a0a0;*/
  15     color: #666665;
  16 }
  17
  18 .proxmox-invalid-row {
  19     background-color: #f3d6d7;
  20 }
  21
  22 .proxmox-warning-row {
  23     background-color: #f5e5d8;
  24 }
  25
  26 /* some icons have to be color manually */
  27 .black {
  28     color: #000;
  29 }
  30
  31 .normal {
  32     color: #c2ddf2;
  33 }
  34
  35 .faded {
  36     color: #cfcfcf;
  37 }
  38
  39 .good {
  40     color: #21BF4B;
  41 }
  42
  43 .warning {
  44     color: #fc0;
  45 }
  46
  47 .critical {
  48     color: #FF6C59;
  49 }
  50
  51 .info-blue {
  52     color: #3892d4;
  53 }
  54
  55 .pwt-eol-icon {
  56     position: relative;
  57     float: left;
  58     margin-right: 5px;
  59     font-size: 1.3em;
  60     color: #FF6C59;
  61 }
  62
  63 /* reduce chart legend space usage to something more sane */
  64 .x-legend-item {
  65         padding: 0.4em 0.8em 0.4em 1.8em;
  66 }
  67
  68 .x-legend-item-marker {
  69         left: 0.5em;
  70         top: 0.6em;
  71 }
  72
  73 /* for info widget */
  74 div.left-aligned {
  75     float: left;
  76 }
  77
  78 div.right-aligned {
  79     float: right;
  80 }
  81
  82 .x-progress.critical .x-progress-bar{
  83     background-color: #FF8888;
  84 }
  85
  86 .x-progress.warning .x-progress-bar{
  87     background-color: #FFCC00;
  88 }
  89
  90 .x-treelist-item-icon {
  91     color: #000;
  92     font-size: 14px;
  93 }
  94
  95 .x-btn-icon-el-default-toolbar-small {
  96     font-size: 14px;
  97 }
  98 .x-btn-icon-el-default-small {
  99     font-size: 14px;
 100 }
 101
 102 .x-tab-icon-el-default {
 103     color: #000;
 104     font-size: 14px;
 105     margin-top: 2px;
 106 }
 107
 108 .pmx-icon {
 109     height: 16px;
 110     background-position: bottom;
 111     vertical-align: bottom;
 112     padding: 0;
 113 }
 114
 115 .pmx-itype-icon-memory,
 116 .pmx-itype-icon-processor,
 117 .pmx-itype-icon /* NOTE: use this one instead of adding new specific ones! */
 118 {
 119     background-repeat: no-repeat;
 120     background-position:3px center;
 121     padding-left: 20px;
 122 }
 123
 124 .pmx-itype-icon-memory {
 125     background-image:url(../images/icon-ram.png);
 126 }
 127
 128 .pmx-itype-icon-processor {
 129     background-image:url(../images/icon-cpu.png);
 130 }
 131
 132 .pmx-itype-icon-debian-swirl {
 133     padding-left: 22px;
 134     background-size: 16px 16px; /* Chrom* needs both as else it gets cut-off due do non 1:1 ratio */
 135     background-image:url(../images/debian-swirl-openlogo.svg);
 136 }
 137 .pmx-itype-icon-proxmox-x {
 138     padding-left: 22px;
 139     background-size: 16px 16px; /* Not really required here, as here WxH is 1:1 but cannot hurt */
 140     background-image:url(../images/proxmox-symbol-x.svg);
 141 }
 142
 143 .pmx-itype-icon-openid-logo {
 144     padding-left: 22px;
 145     background-size: 16px 16px;
 146     background-image:url(../images/openid-icon-100x100.png);
 147 }
 148
 149 /* change font for config panel back to fontawesome */
 150 .x-treelist-item-expanded > * > * > .x-treelist-item-expander::after,
 151 .x-treelist-item-expander::after {
 152     font: 16px/1 FontAwesome;
 153 }
 154
 155 .x-treelist-pve-nav {
 156     background-color: #f5f5f5;
 157 }
 158
 159 /* fix padding for legend in header */
 160 .x-legend-inner {
 161     padding: 0;
 162 }
 163
 164 .proxmox-apt-repos .x-grid-group-hd {
 165     color: #000000;
 166     background-color: #f5f5f5;
 167 }
 168 .proxmox-apt-repos .x-grid-group-title {
 169     color: #333;
 170 }
 171
 172 /* some general helper classes */
 173 .centered-flex-column {
 174     display: flex;
 175     justify-content: center;
 176     flex-direction: column;
 177     width: 100%;
 178     height: 100%;
 179 }
 180
 181 /* rules for the markdown content, prefix with the .pmx-md class */
 182 .pmx-md {
 183     font-size: 1.0em;
 184     line-height: 1.25em;
 185 }
 186 .pmx-md p {
 187     margin-top: 0.75em;
 188     margin-bottom: 0.75em;
 189 }
 190 .pmx-md :is(h1, h2, h3, h4, h5, h6) {
 191     margin-top: 0.9em;
 192     margin-bottom: 0.75em;
 193 }
 194 .pmx-md h1 { font-size: 175%; }
 195 .pmx-md h2 { font-size: 150%; }
 196 .pmx-md h3 { font-size: 125%; }
 197 .pmx-md h4 { font-size: 110%; }
 198 .pmx-md h5 { font-size: 100%; }
 199 .pmx-md h6 { font-size: 100%; }
 200
 201 .pmx-md code {
 202     white-space: pre;
 203     background-color: #f5f5f5;
 204     padding: 1px;
 205 }
 206 .pmx-md pre code {
 207     display: inline-block;
 208     padding: 5px;
 209     border-left: 3px solid #e0e0e0;
 210 }
 211 .pmx-md strong {
 212     font-weight: bold;
 213 }
 214 .pmx-md blockquote {
 215     border-left: 1px solid #666666;
 216     padding-left: 4px;
 217     margin: 10px 2ch;
 218 }
 219 /* markdown tables */
 220 .pmx-md table {
 221     border-spacing: 0;
 222     border-collapse: collapse;
 223 }
 224 .pmx-md td, .pmx-md th {
 225     padding: 5px;
 226 }
 227 .pmx-md td[align="center"] {
 228     text-align: center;
 229 }
 230 .pmx-md td[align="right"] {
 231     text-align: right;
 232 }
 233 .pmx-md tbody td {
 234     border-bottom: 1px solid #e0e0e0;
 235 }
 236 .pmx-md tbody tr:nth-of-type(even) {
 237     background-color: #f5f5f5;
 238 }
 239 .pmx-md tbody tr:last-of-type td {
 240     border-bottom: 1px solid #666666;
 241 }
 242 .pmx-md tbody tr:hover td {
 243     background-color: #e0e0e0;
 244 }
 245 /* markdown tables end */
 246
 247 /* markdown content end */