Add border around longer radiobutton answers

UI/FullScreenMessageBoxHandler.ts

@@ -14,11 +14,8 @@ export class FullScreenMessageBox extends UIElement {
     private readonly returnToTheMap: UIElement;
 
     constructor(onClear: (() => void)) {
-        super(undefined);
-
+        super();
         const self = this;
-
-        
         State.state.fullScreenMessage.addCallbackAndRun(uiElement => {
             this._uielement = new Combine([State.state.fullScreenMessage.data]).SetStyle(
                 "display:block;"+

UI/TagRendering.ts

@@ -294,8 +294,15 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
                 (t0, t1) => t0.isEquivalent(t1)
             );
         }
-        return new FixedInputElement(this.ApplyTemplate(mapping.txt), mapping.k,
+        
+        let txt = this.ApplyTemplate(mapping.txt);
+        if(txt.Render().indexOf("<img") >= 0){
+            txt.SetClass("question-option-with-border");
+        }
+        const inputEl = new FixedInputElement(txt, mapping.k,
             (t0, t1) => t1.isEquivalent(t0));
+        
+        return inputEl;
     }
 
 

UI/UIElement.ts

@@ -185,14 +185,21 @@ export abstract class UIElement extends UIEventSource<string> {
     public SetClass(clss: string): UIElement {
         this.dumbMode = false;
         if (clss === "" && this.clss.length > 0) {
-            this.clss = [];
-            this.Update();
+            throw "Use RemoveClass instead";
         } else if (this.clss.indexOf(clss) < 0) {
             this.clss.push(clss);
             this.Update();
         }
         return this;
     }
+    public RemoveClass(clss: string): UIElement {
+        const i = this.clss.indexOf(clss);
+        if (i >= 0) {
+            this.clss.splice(i, 1);
+            this.Update();
+        }
+        return this;
+    }
 
 
     public SetStyle(style: string): UIElement {

index.css

@@ -127,7 +127,6 @@ body {
 }
 
 
-
 #searchbox {
     display: inline-block;
     text-align: left;
@@ -196,7 +195,6 @@ body {
 }
 
 
-
 /**************************************/
 
 
@@ -364,7 +362,6 @@ body {
 }
 
 
-
 .infoboxcontents {
     margin: 1em 0.5em 0.5em;
 
@@ -399,6 +396,19 @@ body {
     font-weight: normal;
 }
 
+.question-option-with-border{
+    border: 2px solid lightgray;
+    border-radius: 0.5em;
+    display: inline-block;
+    width: 90%;
+    box-sizing: border-box;
+    padding: 1em;   
+}
+
+input:checked+label .question-option-with-border{
+    border: 2px solid black;
+}
+
 
 /**** The save button *****/