diff --git a/css/style.css b/css/style.css
index d10f4e4c4da99e322d57fdfe3f224105a0cfe376..107e60a9d4241f44383a57bb4b5ab44c48a65c67 100644
--- a/css/style.css
+++ b/css/style.css
@@ -116,7 +116,7 @@ html {
<!------------------------------Dashboard------------------------------------ -->
-.level-label, .progress, .questionbuttons, #timelinechartdata, #piechartdata{
+.level-label, .progress, .questionbuttons, #timelinechart, #piechart{
position: relative;
clear: both;
margin-left: 5px;
@@ -127,7 +127,6 @@ html {
padding-bottom: 5px;
padding-left: 5px;
}
-
.amcharts-graph-g1 .amcharts-graph-fill {
filter: url(#blur);
}
@@ -143,3 +142,17 @@ html {
.solves-chart{
position: absolute;
}
+
+<!------------------------------Learn------------------------------------ -->
+
+.questions {
+ position: absolute;
+ top:20%;
+ left:200px;
+ margin-left:15%;
+ color: #cccccc;
+}
+
+@media print {
+div {page-break-before: always;}
+}
\ No newline at end of file
diff --git a/learn.html b/learn.html
index 5b1999a70a57ea90367deecae6ed0471d277c565..3e1ea23f06ace87680a71eac5267f7df802b1fce 100644
--- a/learn.html
+++ b/learn.html
@@ -8,13 +8,12 @@
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="font-awesome-4.7.0/css/font-awesome.min.css">
- <script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
- <script src="https://www.amcharts.com/lib/3/serial.js"></script>
- <script type="text/javascript" src="https://www.amcharts.com/lib/3/pie.js"></script>
- <script type="text/javascript" src="https://www.amcharts.com/lib/3/themes/black.js"></script>
- <script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
- <link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
- <script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
+ <script src="amcharts/amcharts/amcharts.js"></script>
+ <script src="amcharts/amcharts/serial.js"></script>
+ <script src="amcharts/amcharts/pie.js"></script>
+ <script src="amcharts/amcharts/themes/black.js"></script>
+ <script src="amcharts/amcharts/plugins/export/export.min.js"></script>
+ <link rel="stylesheet" href="amcharts/amcharts/plugins/export/export.css" type="text/css" media="all" />
<script src="timelinechartdata.js"></script>
<script src="piechartdata.js"></script>
<title>HODOR | Learn</title>
@@ -31,3 +30,107 @@
<a href="#" id="docs" data-toggle="modal" data-target="#doc-modal">Documentation & help <i class="fa fa-info fa-lg"></i></a><br>
<a href="#" id="logout" data-toggle="modal" data-target="#logout-modal">Logout<i style="color:#d9534f !important;" class="fa fa-power-off fa-lg"></i></a>
</div>
+
+ <div id="profile-modal" class="modal fade" role="dialog">
+ <div class="modal-dialog">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal">×</button>
+ <div class="modalhead" style="text-align: center">
+ <img src="img/img_avatar.png" alt="Avatar" style="border-radius: 50%;width: 75px;"> Name</div>
+ </div>
+ <div class="modal-body">
+ <ul class="nav nav-pills nav-justified">
+ <li class="active"><a data-toggle="pill" href="#home">View Profile</a></li>
+ <li><a data-toggle="pill" href="#menu2">Edit Profile</a></li>
+ </ul>
+
+ <div class="tab-content">
+ <div id="home" class="tab-pane fade in active">
+ <h3>Name</h3>
+ <p>Sabhariesh</p>
+ <h3>Username</h3>
+ <p>frozenfire</p>
+ <h3>Email-ID</h3>
+ <p>sabbhy1996@gmail.com</p>
+ <h3>Github</h3>
+ <p>@shariharasudan</p>
+ <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
+ </div>
+ <div id="menu2" class="tab-pane fade">
+ <form>
+ <div class="form-group">
+ <label for="name">Name</label>
+ <input type="text" class="form-control" id="name">
+ </div>
+ <div class="form-group">
+ <label for="uname">Username</label>
+ <input type="text" class="form-control" id="uname">
+ </div> <div class="form-group">
+ <label for="email">Email address:</label>
+ <input type="email" class="form-control" id="email">
+ </div>
+ <div class="form-group">
+ <label for="pwd">Current Password:</label>
+ <input type="password" class="form-control" id="pwd">
+ <label for="pwd">New Password:</label>
+ <input type="password" class="form-control" id="npwd">
+ <label for="rnpwd"> Re-enter new Password:</label>
+ <input type="password" class="form-control" id="rnpwd">
+ </div>
+ <button type="submit" class="btn btn-success" style="align-self: center">Submit</button>
+ <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
+ </form>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="logout-modal" role="dialog">
+ <div class="modal-dialog modal-sm">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal">×</button>
+ </div>
+ <div class="modal-body">
+ <p>Are you sure you want to logout?</p>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-success" data-dismiss="modal">Yes</button>
+ <button type="button" class="btn btn-danger" data-dismiss="modal">No</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div id="doc-modal" class="modal fade" role="dialog">
+ <div class="modal-dialog modal-lg">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal">×</button>
+ <h4 class="modal-title" style="text-align: center">Documentation & Help</h4>
+ </div>
+ <div class="modal-body">
+ Visit our gitlab page for documentation and any other help required!<br><br>
+ <div class="gitbutton text-center">
+ <a href="https://git.amrita.edu/hodorsec/" class="btn btn-info" role="button" style="align-self: center">Go to Gitlab</a>
+ </div>
+ </div>
+ </div>
+
+ </div>
+ </div>
+ <div class="questions" style="position: absolute;left: 10%;right: 2%;">
+ <br><br><br><h3>Challenge Name</h3><br>
+ <p>x points --- Category</p>
+ <hr>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ <hr>
+ <p> All materials to be uploaded and links will be provided here.</p>
+ <hr>
+ <input type="text" name="flag" placeholder="Enter the flag here."><input type="submit" value="Submit"><br><hr>
+ </div>
+
+</div>
\ No newline at end of file