summaryrefslogtreecommitdiff
path: root/index.html
diff options
context:
space:
mode:
authorTimotej Lazar <timotej.lazar@fri.uni-lj.si>2016-09-09 10:45:21 +0200
committerTimotej Lazar <timotej.lazar@fri.uni-lj.si>2016-09-09 10:45:21 +0200
commit6337a155b61e6c1cf3dc29923b2d9509d3edaec2 (patch)
treef1652975b22731b8ec16ed5adc65f77785770f91 /index.html
parent47cfa1b9c8abdd96e4aa9c02daf2e735c3a24024 (diff)
Declare HTML5 doctype and fix related issues
Also ensure the topbar stays fixed regardless of the content scrollbar.
Diffstat (limited to 'index.html')
-rw-r--r--index.html227
1 files changed, 104 insertions, 123 deletions
diff --git a/index.html b/index.html
index 004d0e7..4b5a697 100644
--- a/index.html
+++ b/index.html
@@ -1,6 +1,7 @@
+<!DOCTYPE html>
<html>
<head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+ <meta charset="utf-8" />
<!--meta name="viewport" content="width=device-width, target-densitydpi=device-dpi"-->
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name='HandheldFriendly' content='True'>
@@ -104,9 +105,9 @@
</div>
</div>
- <!-- login screen -->
- <div class="container" id="screen-login" style="display: none;">
- <div class="row">
+ <div id="content">
+ <!-- login screen -->
+ <div class="container" id="screen-login" style="display: none;">
<div class="col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1">
<div class="panel panel-default">
<div class="panel-heading">
@@ -153,21 +154,15 @@
</div>
</div>
</div>
- </div>
- <!-- AAI login -->
- <div class="container-fluid" id="screen-aai-login" style="display: none;">
- <div class="row">
- <div class="col-md-12" style="padding: 0;">
- <button type="button" class="pull-right" id="cancel-aai-login" style="position: absolute; top:10px; left:10px;" data-tkey="go_back">Go back</button>
- <iframe width="100%" height="100%" frameborder="0" scrolling="yes" allowtransparency="true" src="" id="aai-iframe"></iframe>
- </div>
+ <!-- AAI login -->
+ <div class="container-fluid" id="screen-aai-login" style="display: none;">
+ <button type="button" class="pull-right" id="cancel-aai-login" style="position: absolute; top:10px; left:10px;" data-tkey="go_back">Go back</button>
+ <iframe frameborder="0" scrolling="yes" allowtransparency="true" src="" id="aai-iframe"></iframe>
</div>
- </div>
- <!--Sign up screen-->
- <div class="container" id="screen-signup" style="display: none;">
- <div class="row">
+ <!--Sign up screen-->
+ <div class="container" id="screen-signup" style="display: none;">
<div class="col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1">
<div class="panel panel-default">
<div class="panel-heading">
@@ -229,11 +224,9 @@
</div>
</div>
</div>
- </div>
- <!-- change password screen -->
- <div class="container" id="screen-change-password" style="display: none;">
- <div class="row">
+ <!-- change password screen -->
+ <div class="container" id="screen-change-password" style="display: none;">
<div class="col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1">
<div class="panel panel-default">
<div class="panel-heading">
@@ -267,11 +260,9 @@
</div>
</div>
</div>
- </div>
- <!-- upgrade account to AAI screen -->
- <div class="container" id="screen-upgrade-to-aai" style="display: none;">
- <div class="row">
+ <!-- upgrade account to AAI screen -->
+ <div class="container" id="screen-upgrade-to-aai" style="display: none;">
<div class="col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1">
<div class="panel panel-default">
<div class="panel-heading">
@@ -307,11 +298,9 @@
</div>
</div>
</div>
- </div>
- <!-- about screen -->
- <div class="container" id="screen-about" style="display: none;">
- <div class="row">
+ <!-- about screen -->
+ <div class="container" id="screen-about" style="display: none;">
<div class="col-md-12">
<h2 data-tkey="about">About</h2>
<div class="btn-group">
@@ -323,11 +312,9 @@
</div>
</div>
</div>
- </div>
- <!-- main screen: programming language selection, settings, etc. -->
- <div class="container" id="screen-language" style="text-align: center; display: none;">
- <div class="row">
+ <!-- main screen: programming language selection, settings, etc. -->
+ <div class="container" id="screen-language" style="text-align: center; display: none;">
<div class="col-lg-4">
<a href="#" id="choose-prolog" style="display: block;" tabindex="100">
<img class="img-circle" src=res/prolog.png alt="Generic placeholder image" width="140" height="140">
@@ -347,14 +334,12 @@
</a>
</div>
</div>
- </div>
- <!-- problem selection screen for a specific language: groups of problems, with descriptions -->
- <div class="container" id="screen-problem-list" style="display: none;"></div>
+ <!-- problem selection screen for a specific language: groups of problems, with descriptions -->
+ <div class="container" id="screen-problem-list" style="display: none;"></div>
- <!-- screen to display all user solutions for a given langauge -->
- <div class="container" id="screen-solutions" style="display: none;">
- <div class="row">
+ <!-- screen to display all user solutions for a given langauge -->
+ <div class="container" id="screen-solutions" style="display: none;">
<div class="col-md-12">
<h2 data-tkey="your_solutions">Your solutions</h2>
<div class="btn-group">
@@ -364,106 +349,104 @@
<div class="solutions"></div>
</div>
</div>
- </div>
- <!-- problem screen: prolog -->
- <div class="container-fluid quadrants" id="screen-prolog" style="display: none;">
- <div class="row">
- <div class="col-lg-4 col-md-4 col-sm-12 block block-left">
- <div class="description-container">
- <h1 class="title" data-dict="prolog" data-tkey="name"></h1>
- <div class="description" data-dict="prolog" data-tkey="description"></div>
- </div>
- <div class="hints"></div>
- </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 block-editor">
- <div class="toolbar">
- <button type="button" class="btn btn-default btn-plan" data-tkey="btn_plan">Plan</button>
- <button type="button" class="btn btn-default ladda-button btn-test" data-style="slide-up" data-spinner-color="blue"><span class="ladda-label" data-tkey="btn_test">Test</span></button>
+ <!-- problem screen: prolog -->
+ <div class="container-fluid quadrants" id="screen-prolog" style="display: none;">
+ <div class="row">
+ <div class="col-lg-4 col-md-4 col-sm-12 block block-left">
+ <div class="description-container">
+ <h1 class="title" data-dict="prolog" data-tkey="name"></h1>
+ <div class="description" data-dict="prolog" data-tkey="description"></div>
</div>
- <div class="code-editor"></div>
- <div class="statusbar"></div>
- <div class="block-label" data-tkey="code">Code</div>
+ <div class="hints"></div>
</div>
- <div class="col-lg-6 col-md-12 col-sm-12 block block-console">
- <div class="console"></div>
- <div class="block-label" data-tkey="console">Console</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 block-editor">
+ <div class="toolbar">
+ <button type="button" class="btn btn-default btn-plan" data-tkey="btn_plan">Plan</button>
+ <button type="button" class="btn btn-default ladda-button btn-test" data-style="slide-up" data-spinner-color="blue"><span class="ladda-label" data-tkey="btn_test">Test</span></button>
+ </div>
+ <div class="code-editor"></div>
+ <div class="statusbar"></div>
+ <div class="block-label" data-tkey="code">Code</div>
+ </div>
+ <div class="col-lg-6 col-md-12 col-sm-12 block block-console">
+ <div class="console"></div>
+ <div class="block-label" data-tkey="console">Console</div>
+ </div>
</div>
</div>
</div>
- </div>
- <!-- problem screen: python -->
- <div class="container-fluid quadrants" id="screen-python" style="display: none;">
- <div class="row">
- <div class="col-lg-4 col-md-4 col-sm-12 block block-left">
- <div class="description-container">
- <h1 class="title" data-dict="python" data-tkey="name"></h1>
- <div class="description" data-dict="python" data-tkey="description"></div>
- </div>
- <div class="hints"></div>
- </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 block-editor">
- <div class="toolbar">
- <button type="button" class="btn btn-default btn-plan" data-tkey="btn_plan">Plan</button>
- <button type="button" class="btn btn-default ladda-button btn-test" data-style="slide-up" data-spinner-color="blue"><span class="ladda-label" data-tkey="btn_test">Test</span></button>
- <button type="button" class="btn btn-default btn-run" data-tkey="btn_run">Run</button>
- <button type="button" class="btn btn-default btn-stop" data-tkey="btn_stop">Stop</button>
+ <!-- problem screen: python -->
+ <div class="container-fluid quadrants" id="screen-python" style="display: none;">
+ <div class="row">
+ <div class="col-lg-4 col-md-4 col-sm-12 block block-left">
+ <div class="description-container">
+ <h1 class="title" data-dict="python" data-tkey="name"></h1>
+ <div class="description" data-dict="python" data-tkey="description"></div>
</div>
- <div class="code-editor"></div>
- <div class="statusbar"></div>
- <div class="block-label" data-tkey="code">Code</div>
+ <div class="hints"></div>
</div>
- <div class="col-lg-6 col-md-12 col-sm-12 block block-console">
- <div class="console"></div>
- <div class="block-label" data-tkey="console">Console</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 block-editor">
+ <div class="toolbar">
+ <button type="button" class="btn btn-default btn-plan" data-tkey="btn_plan">Plan</button>
+ <button type="button" class="btn btn-default ladda-button btn-test" data-style="slide-up" data-spinner-color="blue"><span class="ladda-label" data-tkey="btn_test">Test</span></button>
+ <button type="button" class="btn btn-default btn-run" data-tkey="btn_run">Run</button>
+ <button type="button" class="btn btn-default btn-stop" data-tkey="btn_stop">Stop</button>
+ </div>
+ <div class="code-editor"></div>
+ <div class="statusbar"></div>
+ <div class="block-label" data-tkey="code">Code</div>
+ </div>
+ <div class="col-lg-6 col-md-12 col-sm-12 block block-console">
+ <div class="console"></div>
+ <div class="block-label" data-tkey="console">Console</div>
+ </div>
</div>
</div>
</div>
- </div>
- <!-- problem screen: robot -->
- <div class="container-fluid quadrants" id="screen-robot" style="display: none;">
- <div class="row">
- <div class="col-lg-4 col-md-4 col-sm-12 block block-left">
- <div class="description-container">
- <h1 class="title" data-dict="robot" data-tkey="name"></h1>
- <div class="description" data-dict="robot" data-tkey="description"></div>
- </div>
- <div class="hints"></div>
- </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 block-editor">
- <div class="toolbar">
- <button type="button" class="btn btn-default btn-plan" data-tkey="btn_plan">Plan</button>
- <button type="button" class="btn btn-default ladda-button btn-hint" data-style="slide-up" data-spinner-color="blue"><span class="ladda-label" data-tkey="btn_hint">Hint</span></button>
- <button type="button" class="btn btn-default btn-run" data-tkey="btn_run">Run</button>
- <button type="button" class="btn btn-default btn-stop" data-tkey="btn_stop">Stop</button>
+ <!-- problem screen: robot -->
+ <div class="container-fluid quadrants" id="screen-robot" style="display: none;">
+ <div class="row">
+ <div class="col-lg-4 col-md-4 col-sm-12 block block-left">
+ <div class="description-container">
+ <h1 class="title" data-dict="robot" data-tkey="name"></h1>
+ <div class="description" data-dict="robot" data-tkey="description"></div>
</div>
- <div class="code-editor"></div>
- <div class="statusbar"></div>
- <div class="block-label" data-tkey="code">Code</div>
+ <div class="hints"></div>
</div>
- <div class="col-lg-6 col-md-12 col-sm-12 block block-console">
- <div class="console"></div>
- <div class="status"></div>
- <div class="block-label" data-tkey="console">Console</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 block-editor">
+ <div class="toolbar">
+ <button type="button" class="btn btn-default btn-plan" data-tkey="btn_plan">Plan</button>
+ <button type="button" class="btn btn-default ladda-button btn-hint" data-style="slide-up" data-spinner-color="blue"><span class="ladda-label" data-tkey="btn_hint">Hint</span></button>
+ <button type="button" class="btn btn-default btn-run" data-tkey="btn_run">Run</button>
+ <button type="button" class="btn btn-default btn-stop" data-tkey="btn_stop">Stop</button>
+ </div>
+ <div class="code-editor"></div>
+ <div class="statusbar"></div>
+ <div class="block-label" data-tkey="code">Code</div>
+ </div>
+ <div class="col-lg-6 col-md-12 col-sm-12 block block-console">
+ <div class="console"></div>
+ <div class="status"></div>
+ <div class="block-label" data-tkey="console">Console</div>
+ </div>
</div>
</div>
</div>
- </div>
- <!-- profile screen -->
- <div class="container" id="screen-profile" style="display: none;">
- <h2 data-tkey="profile">Profile</h2>
- <div class="btn-group">
- <button type="button" id="profile-change-password" class="btn btn-default saml-login-hide" data-tkey="change_pass">Change Password</button>
- <button type="button" id="profile-back" class="btn btn-default" data-tkey="go_back">Go back</button>
- </div>
- <hr />
- <div class="row">
+ <!-- profile screen -->
+ <div class="container" id="screen-profile" style="display: none;">
+ <h2 data-tkey="profile">Profile</h2>
+ <div class="btn-group">
+ <button type="button" id="profile-change-password" class="btn btn-default saml-login-hide" data-tkey="change_pass">Change Password</button>
+ <button type="button" id="profile-back" class="btn btn-default" data-tkey="go_back">Go back</button>
+ </div>
+ <hr />
<div class="col-lg-12 col-md-12">
<div class="panel panel-default">
<div class="panel-heading">
@@ -483,11 +466,9 @@
</div>
</div>
</div>
- </div>
- <!-- Settings screen -->
- <div class="container" id="screen-settings" style="display: none;">
- <div class="row">
+ <!-- Settings screen -->
+ <div class="container" id="screen-settings" style="display: none;">
<div class="col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1">
<div class="panel panel-default">
<div class="panel-heading">