Added support for profile pictures

static/css/login.css

@@ -25,14 +25,27 @@ main > h1 {
     justify-content: center;
     align-items: center;
 }
-.userlist li {
+.userlist > li {
     display: flex;
     width: 100%;
     align-items: center;
     justify-content: center;
-    padding: .8rem 1.1rem;
     margin-bottom: .5rem;
+    padding: 0 .5rem;
+}
+.userlist > li > img {
+    margin-right: auto;
+    margin-left: 0;
+    height: 2rem;
+    width: 2rem;
+}
+.userlist > li > div {
+    display: flex;
+    flex-grow: 1;
+    align-items: center;
+    justify-content: center;
     text-align: center;
+    padding: .8rem 1.1rem;
 }
 .userlistButton {
     font-size: 1.1rem;
@@ -102,11 +115,6 @@ form .horizontalButtonList {
     .userlist {
         width: 100%;
     }
-    .userlist li {
-        width: 100%;
-        padding-left: 0;
-        padding-right: 0;
-    }
     .pinpad table tr td button {
         height: 4.2rem;
         width: 4.2rem;

static/css/main.css

@@ -67,10 +67,17 @@ main {
     align-items: center;
     margin-top: 1rem;
     font-size: 1rem;
-    width: 90%;
+    width: 94%;
 }
-.userInfo span {
+.userInfo > span {
     font-size: 1.1rem;
+    vertical-align: middle;
+}
+.userInfo > img {
+    vertical-align: middle;
+    width: 1.8rem;
+    height: 1.8rem;
+    margin: .5rem;
 }
 .userPanel > .horizontalButtonList {
     margin-left: auto;

static/profilepictures/default.svg

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="16"
+   height="16"
+   viewBox="0 0 16 16"
+   version="1.1"
+   id="svg5"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs2" />
+  <g
+     id="layer1">
+    <circle
+       style="fill:#808080;fill-opacity:1;stroke:#fffcfe;stroke-opacity:1"
+       id="path848"
+       cx="8"
+       cy="4.5"
+       r="2.5" />
+    <path
+       style="fill:#7f7f7f;fill-opacity:1;stroke:#fffcff;stroke-opacity:1"
+       id="path3433"
+       d="m -3,-13.499699 a 5,5 0 0 1 -2.5,4.3301274 5,5 0 0 1 -5,0 5,5 0 0 1 -2.5,-4.3301274 h 5 z"
+       transform="scale(-1)" />
+  </g>
+</svg>