css: add centered-flex-column class

[proxmox-widget-toolkit.git] / src / css / ext6-pmx.css

diff --git a/src/css/ext6-pmx.css b/src/css/ext6-pmx.css
index 850dbb04c6180149e22f71fde5baaea17746bb66..ff035734d131b8d0bebf7787c83627a266774b1e 100644 (file)
--- a/src/css/ext6-pmx.css
+++ b/src/css/ext6-pmx.css
@@ -105,23 +105,39 @@ div.right-aligned {
 }
 
 .pmx-itype-icon-memory,
-.pmx-itype-icon-processor
+.pmx-itype-icon-processor,
+.pmx-itype-icon /* NOTE: use this one instead of adding new specific ones! */
 {
     background-repeat: no-repeat;
     background-position:3px center;
     padding-left: 20px;
 }
 
-.pmx-itype-icon-memory
-{
+.pmx-itype-icon-memory {
     background-image:url(../images/icon-ram.png);
 }
 
-.pmx-itype-icon-processor
-{
+.pmx-itype-icon-processor {
     background-image:url(../images/icon-cpu.png);
 }
 
+.pmx-itype-icon-debian-swirl {
+    padding-left: 22px;
+    background-size: 16px 16px; /* Chrom* needs both as else it gets cut-off due do non 1:1 ratio */
+    background-image:url(../images/debian-swirl-openlogo.svg);
+}
+.pmx-itype-icon-proxmox-x {
+    padding-left: 22px;
+    background-size: 16px 16px; /* Not really required here, as here WxH is 1:1 but cannot hurt */
+    background-image:url(../images/proxmox-symbol-x.svg);
+}
+
+.pmx-itype-icon-openid-logo {
+    padding-left: 22px;
+    background-size: 16px 16px;
+    background-image:url(../images/openid-icon-100x100.png);
+}
+
 /* change font for config panel back to fontawesome */
 .x-treelist-item-expanded > * > * > .x-treelist-item-expander::after,
 .x-treelist-item-expander::after {
@@ -145,6 +161,15 @@ div.right-aligned {
     color: #333;
 }
 
+/* some general helper classes */
+.centered-flex-column {
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+    width: 100%;
+    height: 100%;
+}
+
 /* rules for the markdown content, prefix with the .pmx-md class */
 .pmx-md {
     font-size: 1.0em;