Views creation for all the needed pages + update of css file

ippisite/ippidb/static/css/ippidb.css

@@ -205,6 +205,8 @@ div.tabs {
 
 #mainnav{
 	overflow: hidden;
+    border-bottom: 1px solid #AEB7C0;
+    background-color: #F9F9F9;
 }
 
 .main-nav{
@@ -213,6 +215,7 @@ div.tabs {
 	position: relative;
 	width: 600px;
 	text-align: center;
+    height: 35px;
 }
 
 .main-nav ul {
@@ -233,7 +236,7 @@ div.tabs {
 .main-nav ul li a{
 	font-size: 12px;
 	font-family: "BrandonGrotesqueBlk";
-	color:#636060;
+	color:#000;
 	text-transform: uppercase;
 	text-decoration: none;
 	padding: 5px 0px;
@@ -294,6 +297,228 @@ div.tabs {
 	display: inline-block;
 }
 
+/* -- Secondary Menu -- */
+
+.secondary-nav {
+background: #F0F3F4 none repeat scroll 0% 0%;
+padding: 15px 0px;
+text-align: center;
+}
+
+.secondary-nav ul {
+    list-style: outside none none;
+    margin: 0px;
+    padding: 0px;
+    border: 0px none;
+}
+
+.secondary-nav ul li {
+    margin: 0px 35px;
+    display: inline-block;
+}
+
+.secondary-nav ul li a {
+    font-size: 11px;
+    font-family: "BrandonGrotesqueBlk";
+    color:#414144;
+    text-transform: uppercase;
+    text-decoration: none;
+    padding: 0px 0px;
+    position: relative;
+    display: inline-block;
+}
+
+.secondary-nav ul li a:focus::after {
+    content: "";
+    position: absolute;
+    bottom: 0px;
+    left: 0px;
+    right: 0px;
+    height: 2px;
+    background: #414144 none repeat scroll 0% 0%;
+    text-decoration: none;
+}
+
+.secondary-nav ul li a:active::after {
+    content: "";
+    position: absolute;
+    bottom: 0px;
+    left: 0px;
+    right: 0px;
+    height: 2px;
+    background: #414144 none repeat scroll 0% 0%;
+    text-decoration: none;
+}
+
+.secondary-nav ul li a:hover::after {
+    content: "";
+    position: absolute;
+    bottom: 0px;
+    left: 0px;
+    right: 0px;
+    height: 2px;
+    background: #414144 none repeat scroll 0% 0%;
+    text-decoration: none;
+}
+
+/* -- Breadcrumb -- */
+
+
+.inner-wrap .breadcrumb:first-child {
+    margin-top: 10px;
+}
+
+.main__inner .breadcrumb {
+    position: absolute;
+    z-index: 1;
+    top: 10px;
+    left: 10px;
+    color: #fff;
+}
+
+.breadcrumb {
+    color: #C6C5C6;
+    max-width: 1200px;
+}
+
+.breadcrumb a {
+    color: #C6C5C6;
+    text-decoration: underline;
+}
+
+.breadcrumb span:last-child {
+    font-weight: bold;
+    color: #1D1D1B;
+}
+
+.breadcrumb > .breadcrumb-label {
+    position: absolute !important;
+    clip: rect(1px,1px,1px,1px);
+    padding: 0 !important;
+    border: 0 !important;
+    height: 1px !important;
+    width: 1px !important;
+    overflow: hidden;
+}
+
+.breadcrumb > .breadcrumb-label + div {
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}
+
+.main__inner .breadcrumb a {
+    color: #fff;
+    text-shadow: 1px 1px 3px rgba(0,0,0,0.5);
+}
+
+.breadcrumb span::before {
+    content: '>';
+    margin: 0 5px;
+}
+
+.main__inner .breadcrumb span:last-child {
+    font-weight: bold;
+    color: #fff;
+}
+
+/* -- Page Header -- */
+
+.adv-page__header{
+    margin-left: -50px;
+    margin-right: -50px;
+box-shadow: 0px 0px 0px 1500px rgba(0, 0, 0, 0.1) inset;
+min-height: 260px;
+line-height: 260px;
+background-repeat: no-repeat;
+background-size: cover;
+position: relative;
+text-align:center;
+background-image:url("https://research.pasteur.fr/wp-content/uploads/2015/03/Facebook-offers-its-Proxygen-server-on-Open-Source-Platform-for-developers-1000x300.jpg")
+
+}
+
+.header__inner {
+    display: inline-block;
+    vertical-align: middle;
+    line-height: 1.2;
+    min-width: 450px;
+font-size: 42px;
+    font-family: "BrandonGrotesqueBlk";
+    color:#fff;
+    text-transform: uppercase;
+}   
+
+.node-fiche-page--full .node__title {
+    font-weight: 800;
+    text-transform: uppercase;
+    text-align: center;
+    line-height: 1.2;
+    margin: 0px;
+    font-size: 58px;
+    padding-top: 150px;
+    color: #FFF;
+}
+
+.node-fiche-page--full {
+    background-repeat: no-repeat;
+    background-position: 50% top;
+    background-size: 100% auto;
+    position: relative;
+    background-color: #fff;
+}
+
+.header__bg {
+    box-shadow: 0px 0px 0px 1500px rgba(0, 0, 0, 0.15) inset;
+    background-size: 100%;
+    background-repeat: no-repeat;
+}
+
+.node-fiche-page--full .header__bg {
+    position: absolute;
+}
+
+.node-fiche-page--full header {
+    position: relative;
+    min-height: 345px;
+}
+
+.node-fiche-page--full .content {
+    background: #FFF none repeat scroll 0% 0%;
+    padding: 15px 65px;
+}
+
+.page-title {
+    margin: 0px 0px 30px;
+    text-transform: uppercase;
+    text-align: center;
+    font-size: 42px;
+    line-height: 1.2;
+    color: #1D1D1B;
+    font-family:"BrandonGrotesqueBlk";
+}
+
+.page-intro {
+    color:#414144;
+    margin-top: 30px;
+    font-size: 20px;
+    font-weight: normal;
+    line-height: 1.4;
+    text-align: justify;
+    margin: 40px auto;
+    padding-top: 40px;
+}
+
+.page-intro ul {
+    margin-left: 30px;
+}
+
+.page-intro ul li {
+    font-size: 20px;
+    font-weight: normal;
+    line-height: 1.4;
+}
+
 button {
 font-family:"BrandonGrotesqueReg";
 }
@@ -353,10 +578,20 @@ display:block;
     text-decoration: none;
 }
 
+/*   FORMS   */
+
+#Form{
+    width: 70%;
+    border: 1px solid;
+    padding: 10px;
+    min-height: 150px;
+}
+
 /* CONTENT */
 
 #content{
 	min-height: 400px;
+    margin-bottom: 50px;
 }
 
 

ippisite/ippidb/static/ippidb.css

-#home div.jumbotron{
-    background: url('/static/banner.png');
-    background-repeat: no-repeat;
-}

ippisite/ippidb/templates/about.html

+{% extends "base.html" %}
+
+    
+{% block title %}inhibitors of Protein-Protein Interaction Database{% endblock %}
+
+{% block content %}
+Here some details on iPPI-DB website
+{% endblock %}

ippisite/ippidb/templates/add.html

+{% extends "base.html" %}
+
+    
+{% block title %}inhibitors of Protein-Protein Interaction Database{% endblock %}
+
+{% block content %}
+<div id="mainnav">
+    <nav class="secondary-nav">
+        <div class="inner-wrap">
+            <ul>
+            	<li>
+                    <a hfref="/admin/view">View Content</a>
+                </li>
+                <li>
+                    <a href="/admin/add">Add New Content</a>
+                </li>
+                <li>
+                    <a hfref="/admin/update">Update Content</a>
+                </li>
+            </ul>
+        </div>
+    </nav>
+</div>
+<div class="inner-wrap">
+    <nav class="breadcrumb" role="navigation">
+        <div id="breadcrumb-label" class="breadcrumb-label">Vous êtes ici</div>
+        <div aria-labelledby="breadcrumb-label">
+        		Fonction Fil d'Arianne
+        </div>
+    </nav>
+	<div id="main-wrapper" class="page">
+		<div id="main">
+			<div id="content" class="main-content">
+				<div class="section">
+					<main role="main">
+						<h1 class="page-title"> ADD NEW CONTENT </h1>
+						<div class="tabs"></div>
+						<div class="main__inner">
+							<div class="region region-content">
+								<div class="page-intro">
+								By selecting ADD NEW CONTENT you are about to add all or any of the following information to iPPI-DB:</br>
+								New publications, New pharmacological data, New PPI modulators, New PPI targets, New cytotoxic or pharmacokine2c data.</br>
+								Please prepare yourself to fill some information within this web application.</br>
+								To achieve this process, you need : </br>
+									<ul>
+										<li> Your bibliographic source (PubMed article or Patents), </li>
+										<li> Its ID number (e.g Pubmed ID), </li>
+										<li> And a reference PDB code that contains the structure of the macromolecular complex of the PPI target for which you have data. </li>
+									</ul>
+								E.g for a heterodimer, the structure needs to contain both partners. This will help you to describe the PPI architecture. </br>
+								Most of the information you need to provide will come both from the PDB structure, and the bibliographic source. The rest will be automatically filled and will just require your approval.
+								</div>
+								<div class="color-wrap">
+									<div class="region region-content">
+										<div class="block block-system block-system-main">
+											<div class="content">
+												<div class="view-content">
+													<div id="Form">
+														ICI Formulaires
+													</div>
+												</div>
+											</div>
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>
+					</main><!-- .site-main -->
+				</div>
+			</div>
+		</div><!-- div main -->
+	</div>
+</div>
+{% endblock %}

ippisite/ippidb/templates/admin.html

+{% extends "base.html" %}
+
+    
+{% block title %}inhibitors of Protein-Protein Interaction Database{% endblock %}
+
+{% block content %}
+Here the template of admin session
+{% endblock %}

ippisite/ippidb/templates/base.html

@@ -19,7 +19,7 @@
                                 <a href="https://www.pasteur.fr/fr">Research</a>
                             </li>
                             <li>
-                                <a hfre="https://www.pasteur.fr/en/education">Education</a>
+                                <a hfref="https://www.pasteur.fr/en/education">Education</a>
                             </li>
                             <li>
                                 <a href="https://www.pasteur.fr/en/international-en">International</a>
@@ -42,13 +42,14 @@
             </div><!-- /.container-fluid -->
         </div>
         <div id="mainnav">
-                <nav class="main-nav">
+            <nav class="main-nav">
+                <div>
                    <ul>
                         <li>
                             <a href="/">Home</a>
                         </li>
                         <li>
-                            <a hfre="/other">About</a>
+                            <a href="/about">About</a>
                         </li>
                         <li>
                             <a href="/submit">Submit</a>
@@ -60,7 +61,8 @@
                             <a href="/admin">Admin</a>
                         </li>
                     </ul>
-                </nav>
+                </div>
+            </nav>
         </div>
         <div id="content">
             {% block content %}{% endblock %}

ippisite/ippidb/templates/index.html

@@ -4,4 +4,5 @@
 {% block title %}inhibitors of Protein-Protein Interaction Database{% endblock %}
 
 {% block content %}
+Welcome to the homepage
 {% endblock %}

ippisite/ippidb/templates/submit.html

+{% extends "base.html" %}
+
+    
+{% block title %}inhibitors of Protein-Protein Interaction Database{% endblock %}
+
+{% block content %}
+Here you can submit request to iPPI-DB 
+{% endblock %}

ippisite/ippidb/templates/tutorials.html

+{% extends "base.html" %}
+
+    
+{% block title %}inhibitors of Protein-Protein Interaction Database{% endblock %}
+
+{% block content %}
+Here all the tutorials to get a full iPPI-DB experience 
+{% endblock %}

ippisite/ippidb/urls.py

 from django.conf.urls import url
-from .views import index
+from . import views
 
 urlpatterns = [
-    url(r'^$', index, name='index')
+    url(r'^$', views.index, name='index'),
+    url(r'^about$', views.about, name='about'),
+    url(r'^submit$', views.submit, name='submit'),
+    url(r'^tutorials$', views.tutorials, name='tutorials'),
+    url(r'^admin/add$', views.add, name='add'),
 ]

ippisite/ippidb/views.py

@@ -2,3 +2,17 @@ from django.shortcuts import render
 
 def index(request):
     return render(request, 'index.html')
+
+
+def about(request):
+    return render(request, 'about.html')
+
+def submit(request):
+    return render(request, 'submit.html')
+
+def tutorials(request):
+    return render(request, 'tutorials.html')
+
+def add(request):
+    return render(request, 'add.html')
+