summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorMarko Pušnik <marko.pusnik@guru.si>2015-10-02 01:47:11 +0200
committerMarko Pušnik <marko.pusnik@guru.si>2015-10-02 01:47:11 +0200
commit96aa5efb5ea5eb282029ca915637ad90348481f5 (patch)
tree8f260735942ca4fb3a8213f2952873b4635a139b
parent05684471913aee3b3289b90072c6f55d630e7225 (diff)
B type problem screen ... so far only for Python
-rw-r--r--css/codeq.css70
-rw-r--r--index.html58
2 files changed, 97 insertions, 31 deletions
diff --git a/css/codeq.css b/css/codeq.css
index a701d5c..44901f0 100644
--- a/css/codeq.css
+++ b/css/codeq.css
@@ -51,8 +51,8 @@ body {
/* screen problems*/
.block {
- border-right: 1px solid #e5e5e5;
- border-bottom: 1px solid #e5e5e5;
+ /*border-right: 1px solid #e5e5e5;
+ border-bottom: 1px solid #e5e5e5;*/
padding: 0;
min-height: 4em;
overflow: hidden;
@@ -63,11 +63,17 @@ body {
padding: 0.5em 0.5em 20px 0.5em;
}
-/* info */
+.block.block1 {
+ border-bottom: 1px solid #ddd;
+}
+
+
+/* hints */
.block > .hints {
padding: 0.5em 0.5em 20px 0.5em;
}
+
/* code_editor */
.block > .code_editor {
}
@@ -82,6 +88,7 @@ body {
background: black;
font-size: 14px;
padding: 0;
+ min-height: 4em;
}
.block-label {
@@ -156,6 +163,17 @@ body {
min-height: 100%; height: 100%;
}
+ /* code_editor */
+ #screen_python .block.block2 {
+ min-height: 100%; height: 100%;
+ }
+
+ /* console */
+ #screen_python .block.block3 {
+ min-height: 100%; height: 100%;
+ }
+
+
}
/* md */
@@ -170,12 +188,31 @@ body {
min-height: 50%; height: 50%;
}
+ .quadrants#screen_python > * > .block {
+ overflow: auto;
+ min-height: 100%; height: 100%;
+ }
+
+ /* code_editor */
+ #screen_python .block.block2 {
+ min-height: 50%; height: 50%;
+ }
+
+ /* console */
+ #screen_python .block.block3 {
+ min-height: 50%; height: 50%;
+ }
+
}
/* md & ld */
@media (min-width: 992px) {
- /* description */
- .block > .description {
+ .block-left, .block-right {
+ min-height: 100%; height: 100%;
+ }
+
+ .block-left {
+ border-right: 1px solid #ddd;
}
/* info */
@@ -184,6 +221,20 @@ body {
overflow-y: auto;
}
+ .block.block1 {
+ border-right: 1px solid #ddd;
+ }
+
+ #screen_python .block.block1 {
+ min-height: 30%; height: 30%;
+ border-right: 0;
+ }
+
+ /* hints */
+ #screen_python .block.block4 {
+ min-height: 70%; height: 70%;
+ }
+
/* code_editor */
.block > .code_editor {
min-height: 100%;
@@ -214,6 +265,15 @@ body {
@media (max-width: 767px) {
}
+/* xs & sm */
+@media (max-width: 991px) {
+
+ /* info */
+ .block.block4 {
+ border-bottom: 1px solid #ddd;
+ }
+
+}
/* codeq hints */
diff --git a/index.html b/index.html
index b5c7126..8df08cf 100644
--- a/index.html
+++ b/index.html
@@ -192,36 +192,42 @@
<!-- problem screen: python -->
<div class="container-fluid quadrants block1" id="screen_python" style="display: none;">
<div class="row">
- <div class="col-lg-3 col-md-6 col-sm-12 block block1">
- <div class="description">
- <h2 class="title translatable" data-dict="python" data-tkey="slug"></h2>
- <div class="translatable" data-dict="python" data-tkey="description"></div>
+ <div class="col-lg-4 col-md-4 col-sm-12 block block-left">
+ <div class="col-lg-12 col-md-12 col-sm-12 block block1">
+ <div class="scrollable-content-container">
+ <div class="description">
+ <h2 class="title translatable" data-dict="python" data-tkey="slug"></h2>
+ <div class="translatable" data-dict="python" data-tkey="description"></div>
+ </div>
+ </div>
+ <div class="block-label">Instructions</div>
</div>
- <div class="block-label">Instructions</div>
- </div>
- <div class="col-lg-3 col-md-6 col-sm-12 block block2">
- <nav class="navbar navbar-default block-toolbar">
- <div class="container-fluid">
- <button type="button" class="btn btn-default navbar-btn btn-plan" data-tkey="btn_plan">Plan</button>
- <button type="button" class="btn btn-default navbar-btn btn-hint" data-tkey="btn_hint">Hint</button>
- <button type="button" class="btn btn-default navbar-btn btn-test" data-tkey="btn_test">Test</button>
- <button type="button" class="btn btn-default navbar-btn btn-run" data-tkey="btn_run">Run</button>
- <button type="button" class="btn btn-default navbar-btn btn-stop" data-tkey="btn_stop">Stop</button>
+ <div class="col-lg-12 col-md-12 col-sm-12 block block4">
+ <div class="scrollable-content-container">
+ <div class="hints"></div>
</div>
- </nav>
- <div class="code_editor"></div>
- <div class="block-statusbar"></div>
- <div class="block-label">Code</div>
- </div>
- <div class="col-lg-3 col-md-6 col-sm-12 block block3">
- <div class="console"></div>
- <div class="block-label">Console</div>
+ <div class="block-label">Hints</div>
+ </div>
</div>
- <div class="col-lg-3 col-md-6 col-sm-12 block block4">
- <div class="scrollable-content-container">
- <div class="hints"></div>
+ <div class="col-lg-8 col-md-8 col-sm-12 block block-right ">
+ <div class="col-lg-6 col-md-12 col-sm-12 block block2">
+ <nav class="navbar navbar-default block-toolbar">
+ <div class="container-fluid">
+ <button type="button" class="btn btn-default navbar-btn btn-plan" data-tkey="btn_plan">Plan</button>
+ <button type="button" class="btn btn-default navbar-btn btn-hint" data-tkey="btn_hint">Hint</button>
+ <button type="button" class="btn btn-default navbar-btn btn-test" data-tkey="btn_test">Test</button>
+ <button type="button" class="btn btn-default navbar-btn btn-run" data-tkey="btn_run">Run</button>
+ <button type="button" class="btn btn-default navbar-btn btn-stop" data-tkey="btn_stop">Stop</button>
+ </div>
+ </nav>
+ <div class="code_editor"></div>
+ <div class="block-statusbar"></div>
+ <div class="block-label">Code</div>
+ </div>
+ <div class="col-lg-6 col-md-12 col-sm-12 block block3">
+ <div class="console"></div>
+ <div class="block-label">Console</div>
</div>
- <div class="block-label">Hints</div>
</div>
</div><!--/row-->
</div><!--container-->