Fix layout for Robot problem screen

1 files changed, 51 insertions, 10 deletions

diff --git a/css/codeq.css b/css/codeq.css
index f7ec93b..c3b1043 100644
--- a/css/codeq.css
+++ b/css/codeq.css
@@ -275,30 +275,41 @@ div.vertical-line{
         min-height: 100%; height: 100%;
     }
 
+    /* prolog */
     /* code_editor */
     .line-layout#screen_prolog .block.block2 {
         min-height: 100%; height: 100%;
         min-width: 50%; width: 50%;
     }
-
     /* console */
     .line-layout#screen_prolog .block.block3 {
         min-height: 100%; height: 100%;
         min-width: 50%; width: 50%;
     }
 
+    /* python */
     /* code_editor */
     .line-layout#screen_python .block.block2 {
         min-height: 100%; height: 100%;
         min-width: 50%; width: 50%;
     }
-
     /* console */
     .line-layout#screen_python .block.block3 {
         min-height: 100%; height: 100%;
         min-width: 50%; width: 50%;
     }
 
+    /* robot */
+    /* code_editor */
+    .line-layout#screen_robot .block.block2 {
+        min-height: 100%; height: 100%;
+        min-width: 50%; width: 50%;
+    }
+    /* console */
+    .line-layout#screen_robot .block.block3 {
+        min-height: 100%; height: 100%;
+        min-width: 50%; width: 50%;
+    }
 
     /*~~ square-layout ~~*/
     .quadrants.square-layout > * > .block:not(.block-left):not(.block-right) {/*the not-s are important here, because else the height of the surrounding divs will be set to 50% and the entire page will only be for half the screen*/
@@ -306,11 +317,11 @@ div.vertical-line{
         min-height: 50%; height: 50%;
     }
 
+    /* prolog */
     .quadrants.square-layout#screen_prolog > * > .block {
         overflow: auto;
         min-height: 100%; height: 100%;
     }
-
     /* instructions+hints */
     .square-layout#screen_prolog .block-left {
         min-width: 33%; width: 33%;
@@ -319,24 +330,22 @@ div.vertical-line{
     .square-layout#screen_prolog .block-right {
         min-width: 67%; width: 67%;
     }
-
     /* code_editor */
     .square-layout#screen_prolog .block.block2 {
         min-height: 50%; height: 50%;
         min-width: 100%; width: 100%;
     }
-
     /* console */
     .square-layout#screen_prolog .block.block3 {
         min-height: 50%; height: 50%;
         min-width: 100%; width: 100%;
     }
 
+    /* python */
     .quadrants.square-layout#screen_python.prof2 > * > .block {
         overflow: auto;
         min-height: 100%; height: 100%;
     }
-
     /* instructions+hints */
     .square-layout#screen_python .block-left {
         min-width: 33%; width: 33%;
@@ -345,18 +354,40 @@ div.vertical-line{
     .square-layout#screen_python .block-right {
         min-width: 67%; width: 67%;
     }
-
     /* code_editor */
     .square-layout#screen_python .block.block2 {
         min-height: 50%; height: 50%;
         min-width: 100%; width: 100%;
     }
-
     /* console */
     .square-layout#screen_python .block.block3 {
         min-height: 50%; height: 50%;
         min-width: 100%; width: 100%;
     }
+
+    /* robot */
+    .quadrants.square-layout#screen_robot.prof2 > * > .block {
+        overflow: auto;
+        min-height: 100%; height: 100%;
+    }
+    /* instructions+hints */
+    .square-layout#screen_robot .block-left {
+        min-width: 33%; width: 33%;
+    }
+    /* code_editor + console */
+    .square-layout#screen_robot .block-right {
+        min-width: 67%; width: 67%;
+    }
+    /* code_editor */
+    .square-layout#screen_robot .block.block2 {
+        min-height: 50%; height: 50%;
+        min-width: 100%; width: 100%;
+    }
+    /* console */
+    .square-layout#screen_robot .block.block3 {
+        min-height: 50%; height: 50%;
+        min-width: 100%; width: 100%;
+    }
     /* END layouts */
 
 
@@ -379,26 +410,36 @@ div.vertical-line{
         border-right: 1px solid #ddd;
     }
 
+    /* prolog */
     #screen_prolog .block.block1 {
         min-height: 50%; height: 50%;
         border-right: 0;
     }
-
     /* hints */
     #screen_prolog .block.block4 {
         min-height: 50%; height: 50%;
     }
 
+    /* python */
     #screen_python .block.block1 {
         min-height: 50%; height: 50%;
         border-right: 0;
     }
-
     /* hints */
     #screen_python .block.block4 {
         min-height: 50%; height: 50%;
     }
 
+    /* robot */
+    #screen_robot .block.block1 {
+        min-height: 50%; height: 50%;
+        border-right: 0;
+    }
+    /* hints */
+    #screen_robot .block.block4 {
+        min-height: 50%; height: 50%;
+    }
+
     /* code_editor */
     .block > .code_editor {
         min-height: 100%;