diff --git a/lib/classes/Icon.class.php b/lib/classes/Icon.class.php
index 41bd48bb1e7737a7a9696b7f6adaa3cd3b36fd26..6f20f7ba11ccf265841cc1af245c5eb88e630ab7 100644
--- a/lib/classes/Icon.class.php
+++ b/lib/classes/Icon.class.php
@@ -36,16 +36,10 @@ class Icon
     const ROLE_SORT          = 'sort';
     const ROLE_STATUS_YELLOW = 'status-yellow';
 
-
-    protected $shape;
-    protected $role;
-    protected $attributes = [];
-
-
     /**
      * This is the magical Role to Color mapping.
      */
-    private static $roles_to_colors = [
+    const ROLES_TO_COLORS = [
         self::ROLE_INFO          => 'black',
         self::ROLE_CLICKABLE     => 'blue',
         self::ROLE_ACCEPT        => 'green',
@@ -60,13 +54,18 @@ class Icon
         self::ROLE_STATUS_YELLOW => 'yellow'
     ];
 
+
+    protected $shape;
+    protected $role;
+    protected $attributes = [];
+
     // return the color associated to a role
-    private static function roleToColor($role)
+    public static function roleToColor($role)
     {
-        if (!isset(self::$roles_to_colors[$role])) {
+        if (!isset(self::ROLES_TO_COLORS[$role])) {
             throw new \InvalidArgumentException('Unknown role: "' . $role . '"');
         }
-        return self::$roles_to_colors[$role];
+        return self::ROLES_TO_COLORS[$role];
     }
 
     // return the roles! associated to a color
@@ -75,7 +74,7 @@ class Icon
         static $colors_to_roles;
 
         if (!$colors_to_roles) {
-            foreach (self::$roles_to_colors as $r => $c) {
+            foreach (self::ROLES_TO_COLORS as $r => $c) {
                 $colors_to_roles[$c][] = $r;
             }
         }
@@ -169,7 +168,7 @@ class Icon
     {
 
         // only defined roles
-        if (!isset(self::$roles_to_colors[$role])) {
+        if (!isset(self::ROLES_TO_COLORS[$role])) {
             throw new \InvalidArgumentException('Creating an Icon without proper role: "' . $role . '"');
         }
 
@@ -227,7 +226,7 @@ class Icon
      */
     public function signalsAttention()
     {
-        return $this->roleToColor($this->role) === 'red';
+        return self::roleToColor($this->role) === 'red';
     }
 
     /**
@@ -436,7 +435,7 @@ class Icon
             $result['alt'] = '';
         }
 
-        $classNames = 'icon-role-' . $this->role;
+        $classNames = 'icon-role-' . str_replace('_', '-', $this->role);
 
         if (!self::isStatic($this->shape)) {
             $classNames .= ' icon-shape-' . $this->shape;
diff --git a/resources/assets/stylesheets/studip.less b/resources/assets/stylesheets/studip.less
index 6c6cd33ff6f5751f99c90cf836f85158331ec340..921b82e50386531ea84fe696c579d83a6229a04e 100644
--- a/resources/assets/stylesheets/studip.less
+++ b/resources/assets/stylesheets/studip.less
@@ -299,7 +299,8 @@ div.overdiv {
             p { color: #000; }
         }
     }
-    img {
+    img,
+    svg {
         height: calc(100% - 20px);
         position: absolute;
         top: 10px;