summaryrefslogtreecommitdiff
path: root/fossee_manim/templates
diff options
context:
space:
mode:
authorAkshen2019-06-04 12:23:29 +0530
committerAkshen2019-06-04 12:23:29 +0530
commite58f18c7fd4776977f271dcebf28baf614273fef (patch)
treec2ec28511c3379564bdbbe6a5f60a4d5005b4a5a /fossee_manim/templates
parentc2721dca9f0d62e8889f95ceef6205dbed3db979 (diff)
downloadFOSSEE_animations-e58f18c7fd4776977f271dcebf28baf614273fef.tar.gz
FOSSEE_animations-e58f18c7fd4776977f271dcebf28baf614273fef.tar.bz2
FOSSEE_animations-e58f18c7fd4776977f271dcebf28baf614273fef.zip
UI update on landing page
- Honorarium Tooltip added - index.hmtl modified
Diffstat (limited to 'fossee_manim/templates')
-rw-r--r--fossee_manim/templates/fossee_manim/honorarium.html33
-rw-r--r--fossee_manim/templates/fossee_manim/index.html165
2 files changed, 102 insertions, 96 deletions
diff --git a/fossee_manim/templates/fossee_manim/honorarium.html b/fossee_manim/templates/fossee_manim/honorarium.html
index c9133c5..f669200 100644
--- a/fossee_manim/templates/fossee_manim/honorarium.html
+++ b/fossee_manim/templates/fossee_manim/honorarium.html
@@ -5,6 +5,12 @@
{% endblock %}
{% block content %}
+ <script>
+ $(document).ready(function(){
+ $('[data-toggle="tooltip"]').tooltip();
+ });
+ </script>
+
<br>
<div class="container-fluid">
<h1><center>Honorarium</center></h1>
@@ -12,7 +18,7 @@
<hr>
<h6>The honorarium is assigned based on the contributor’s performance, curation of the video and the final output. If the contributor submits the video in time and with a succinct outline, he/she will receive an amount of Rs 1500 per video.</h6>
<h6>There's also a bonus of Rs 500-1000 Rs per video that might be given if deemed fit by the reviewer. </h6>
- <h6>The rubrics for evaluations is given below.</h6>
+ <h6><strong>The rubrics for evaluations is given below.</strong></h6>
<br>
<table class="table table-striped">
<thead>
@@ -23,25 +29,40 @@
</thead>
<tbody>
<tr>
- <td>Proposal Form 2 (Outline + Sketch)</td>
+ <td>Proposal Form 2 (Outline + Sketch)
+ <i class="fa fa-info-circle" data-toggle="tooltip" title="It consists of the second proposal form's outline,
+ and sketches mentioned under detailed description of your animation (Q6) and rough sketch respectively (Q8)."></i>
+ </td>
<td>200-300</td>
</tr>
<tr>
<td>
- Complexity Of the Topic (Beginner / Intermediate / Advanced)
+ Complexity Of the Topic (Beginner / Intermediate / Advanced)
+ <i class="fa fa-info-circle" data-toggle="tooltip" title="The complexity of the animation classifies the animation to either of the three categories:
+ beginner medium, advanced. This classification rests upon the reviewer's discretion"></i>
+ </td>
</td>
<td>200-300</td>
</tr>
<tr>
- <td>Curation</td>
+ <td>Curation
+ <i class="fa fa-info-circle" data-toggle="tooltip" title="This is perhaps the most essential part of the process.
+ This component deals with how you take a concept and transform into a video. Even a trivial topic can have conscientiously curated video."></i>
+ </td>
<td>350-450</td>
</tr>
<tr>
- <td>Final Output</td>
+ <td>Final Output
+ <i class="fa fa-info-circle" data-toggle="tooltip" title="The final video that the contributor has uploaded.
+ The factors taken into consideration are how concisely it displays the topics, the aesthetics of animations itself, speed of the animation etc."></i>
+ </td>
<td>350-450</td>
</tr>
<tr>
- <td>Quality Bonus</td>
+ <td>Quality Bonus
+ <i class="fa fa-info-circle" data-toggle="tooltip" title="Quality Bonus is optional and is entirely left on the reviewer's discretion.
+ If the reviewer feels that a video is excellently curated/made, then the reviewer may award a quality bonus."></i>
+ </td>
<td>500-1000</td>
</tr>
</tbody>
diff --git a/fossee_manim/templates/fossee_manim/index.html b/fossee_manim/templates/fossee_manim/index.html
index 876dd87..40c355b 100644
--- a/fossee_manim/templates/fossee_manim/index.html
+++ b/fossee_manim/templates/fossee_manim/index.html
@@ -1,13 +1,12 @@
<html>
<head>
<meta charset="utf-8">
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
- <meta name="Akshen Doke" content="PRE, FOSSEE-IITB">
+ <meta name="Akshen Doke" content="FOSSEE-IITB">
<meta name="title" content="Welcome to FOSSEE's Animation for Education">
- <meta name="description" content="The FOSSEE team at IIT Bombay conducts remote-assisted training programs in Python.
- These are interactive workshop sessions with hands-on experience, live assistance, practice sessions and evaluation quizzes.
- These programs can be conducted at your institution / organisation, free of charge.">
+ <meta name="description" content=".">
<meta name="keywords" content="fossee, iit bombay, animation based learning math, manim, python based animations">
<!-- favicon -->
<link rel="shortcut icon" type="image/png" href="{{ URL_ROOT}}/static/img/fevicon_python.png"/>
@@ -32,106 +31,92 @@
<title>Welcome</title>
</head>
+ <style>
+ #circle:hover {
+ color: orange;
+ }
+ </style>
<body>
- <div class="container-fluid" style="height:100%; background-color: #3D5A50;">
- <div class="row" id="r1" style="background-color:#ffffff">
- <div class="col-md-2" id="brand"><img style="padding-top: 5%;" src="{{ URL_ROOT}}/static/img/logo.png"></div>
- <div class="col-md-10" style="text-align:center;" id="tag"><strong>Animation based learning</strong></div>
+ <div class="row" style="background-color: #081130">
+ <div class="col-md-3">
+ <center>
+ <img src="{{ URL_ROOT }}/static/img/logo.png" style="width: 50%; background-color: white; margin: 10 10 10 10;">
+ </center>
</div>
-
- <div class="row" id="r2" style="background-color:#3D5A50">
- <div class="col-md-8">
- <form class="example" id="search_bar" method="POST" action="/search/">
+ <div class="col-md-6">
+ <form class="example" id="search_bar" method="POST" action="/search/" style="margin-bottom: 5%; margin-right: 5%; margin-left: 3%;">
{% csrf_token %}
- <input type="text" id="sbox" name="sbox" type="search" placeholder="Search" id="search_tab">
-
- <button type="submit"><i class="fa fa-search"></i></button>
+ <input type="text" id="sbox" name="sbox" type="search" placeholder="Search" id="search_tab">
+ <button type="submit"><i class="fa fa-search"></i></button>
</form>
- </div>
- <div class="col-md-2" id="btns" style="text-align:center;">
- <a href="{% url 'login' %}"><strong>Login</strong></a>
- </div>
- <div class="col-md-2" id="btns" style="text-align:center;">
- <a href="{% url 'register' %}"><strong>Register</strong></a>
- </div>
</div>
-
- <div class="row" id="r3" style="background-color:ghostwhite">
- <div class="col-md-6">
- <img src="{{URL_ROOT}}/static/img/math_icon.png" style="width: 25%; padding-top: 5%; padding-left: 2%;" alt="">
- <img src="{{URL_ROOT}}/static/img/phy_icon.png" style="width: 25%; padding-top: 5%; padding-left: 2%;" alt="">
- <img src="{{URL_ROOT}}/static/img/aero_icon.png" style="width: 25%; padding-top: 5%; padding-left: 2%;" alt="">
- <img src="{{URL_ROOT}}/static/img/chem_icon.png" style="width: 25%; padding-top: 5%; padding-left: 2%;" alt="">
- </div>
- <div class="col-md-6" style="background-color:#436355;" >
- <iframe width="100%" height="55%"
- src="https://www.youtube.com/embed/JGLfa66Os0Q" frameborder="0" allow="accelerometer;
- encrypted-media; gyroscope; picture-in-picture" allowfullscreen>
- </iframe>
- </div>
+ <div class="col-md-3" >
+ <a href="{% url 'login' %}">
+ <button class="btn btn-default pull-right" style="background: #545B6B; color:white;margin-bottom: 5%;margin-top: 10%;margin-right: 5%;">
+ Login
+ </button>
+ </a>
+ <a href="{% url 'register' %}">
+ <button class="btn btn-default pull-right" style="background: #545B6B; color:white; margin-top: 10%;margin-bottom: 5%;margin-right: 1%; ">
+ Register
+ </button>
+ </a>
</div>
-
- <div class="row" id="r4" style="background-color:ghostwhite">
- <hr style="height:3px;">
- <div class="col-md-3" style="text-align:center;">
- <a href="{% url 'video' anime.0.id %}" >
- <span class="fa fa-play fa-4x" id="play-btn"></span>
- <img height="25%" width="65%" src="{{ anime.0.thumbnail.url }}">
- </a>
+ </div>
+ <div class="row">
+ <div class="col-md-12" style="background-color: #A5C9FF;">
+ <center>
+ <img src="{{ URL_ROOT }}/static/img/logo_center.png" style="width: 20%; margin: 10% 0% 20% 0%; background-color: #A5C9FF;">
+ </center>
+ </div>
+ </div>
+ <div class="row" style="background-color: white;">
+ <div class="col-md-4">
+ <center>
+ <a href="{% url 'guidelines' %}"> <img src="{{ URL_ROOT }}/static/img/guidelines.png" id="circle" style="margin: 5% 0 5% 0"></a>
+ </center>
</div>
- <div class="col-md-3" style="text-align:center;">
- <a href="{% url 'video' anime.1.id %}" >
- <span class="fa fa-play fa-4x" id="play-btn"></span>
- <img height="25%" width="65%" src="{{ anime.1.thumbnail.url }}">
- </a>
+ <div class="col-md-4">
+ <center>
+ <a href="{% url 'faqs' %}"><img src="{{ URL_ROOT }}/static/img/faqs.png" id="circle" style="margin: 5% 0 5% 0"></a>
+ </center>
</div>
- <div class="col-md-3" style="text-align:center;">
- <a href="{% url 'video' anime.2.id %}" >
- <span class="fa fa-play fa-4x" id="play-btn"></span>
- <img height="25%" width="65%" src="{{ anime.2.thumbnail.url }}">
- </a>
+ <div class="col-md-4">
+ <center>
+ <a href="{% url 'login' %}"><img src="{{ URL_ROOT }}/static/img/submit.png" id="circle" style="margin: 5% 0 5% 0"></a>
+ </center>
</div>
- <div class="col-md-3" style="text-align:center;">
- <a href="{% url 'video' anime.3.id %}" >
- <span class="fa fa-play fa-4x" id="play-btn"></span>
- <img height="25%" width="65%" src="{{ anime.3.thumbnail.url }}">
- </a>
+ </div>
+ <div class="row" style="background-color: #E4EBEA;">
+ <div class="col-md-12">
+ <center>
+ <img src="{{ URL_ROOT }}/static/img/info.png" style="width:80%; margin-top: 5%; margin-bottom: 5%;">
+ </center>
</div>
- </div>
-
- <div class="row" id="r5" style="background-color:#436355;">
- <div class="col-md-4" style="text-align:center;">
- <br>
- <img src="{{ URL_ROOT}}/static/img/fossee_logo_iitb.png" >
- </div>
- <div class="col-md-4" style="text-align:center; color:ghostwhite;
- font-size: 100%;
- ">
- <br>
+ </div>
+ <div class="row" style="background-color: #081130;">
+ <div class="col-md-4">
+ <center>
+ <img src="{{ URL_ROOT }}/static/img/fossee_logo_iitb.png" style="margin-top: 5%;">
+ </center>
+ </div>
+ <div class="col-md-4" style="color: white; margin-bottom: 1%;">
+ <br> <br>
FOSSEE,
IIT-Bombay <br>Mumbai, India <br>
Phone: (+91) 22 2576 4133 <br>
- Email: workshops[at]fossee[dot]in
- </div>
- <div class="col-md-4" style="text-align:center;">
- <div id="social">
- <br> <br>
- <a href="https://www.facebook.com/FOSSEENMEICT/" target="_blank" class="fa fa-facebook"></a> &nbsp;
- <a href="https://plus.google.com/u/0/104012350840765676803" target="_blank" class="fa fa-google"></a> &nbsp;
- <a href="https://www.youtube.com/channel/UCMtt6exSCmZI7JU73S6Wz_A" target="_blank" class="fa fa-youtube"></a>
- </div>
- </div>
-
-
- <div class="col-md-12" id="r6" style="background-color:#436355; text-align: center; color:ghostwhite;">
- <hr>
- The FOSSEE project is funded by the National Mission on Education through ICT, MHRD, Government of India. <br>
- This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License
- <br><br>
- </div>
+ Email: animations[at]fossee[dot]in
+ </div>
+ <div class="col-md-4" style="margin-top:3%;">
+ <a style="color:white;" href="https://python.fossee.in/about/" target="_blank">About Us </a>| <a style="color:white;" href="{% url 'honorarium' %}" target="_blank">Honorarium</a>
+ </div>
+ </div>
+ <div class="row" style="background-color: #081130;">
+ <hr style="background-color:grey;">
+ <div class="col-md-12" style="background-color: #081130; color:white; text-align: center; margin-bottom: 1%;">
+ The FOSSEE project is funded by the National Mission on Education through ICT, MHRD, Government of India.
+ This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License
</div>
-
-
</div>
</body>
</html> \ No newline at end of file