diff --git a/indra/assemblers/html/templates/indra/template.html b/indra/assemblers/html/templates/indra/template.html index f9ba93d47e..39843ef510 100644 --- a/indra/assemblers/html/templates/indra/template.html +++ b/indra/assemblers/html/templates/indra/template.html @@ -61,14 +61,56 @@ padding-right: 1em; } - .left { - width: 20em; - left: 0; + /* The footer */ + .footer { + position: fixed; /* Make sure the footer is always visible at the bottom */ + bottom: 0; /* Stick it to the bottom of the page */ + left: 0; + right: 20em; + color: #606060; + text-align: left; + padding: 0.5em; + box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); + height: 110px; + } + + .footer h4, .footer p, .footer a { + font-size: 9pt; + line-height: 1.3; + margin: 0; /* Reduces vertical spacing */ + } + + .side-info-block { + padding: 0em 8px 0em 8px; + margin-bottom: 0; + } + + /* Footer links */ + .il-nav-link { + display: block; + margin: 5px 0; + color: #256DC5; /* Blue color */ + text-decoration: none; + } + + .il-nav-link:hover { + text-decoration: underline; + color: #007bff; + } + + #about-this-project p, #about-this-project a { + font-size: 9pt; + margin-bottom: 0; } .right { - width: 20em; - right: 0; + width: 20em; /* Sidebar width */ + right: 0; + position: fixed; /* Make sure the sidebar stays on the right */ + top: 0; + bottom: 0; + background-color: #fff; /* White background */ + overflow-y: auto; /* Allow scrolling if content overflows */ } /* The navigation menu links */ @@ -79,19 +121,25 @@ } .side-info h4 { - font-size: 14pt; + font-size: 10pt; display: block; text-decoration: none; + margin-bottom: 0; } - .side-info-block { - padding: 1em 8px 1em 16px; + #sources-explanation { + font-size: 10pt; } .source-desc { border-radius: 4px; - padding: 0.25em 0.5em 0.25em 0.5em; - margin: 4px; + padding: 0em 0em; + font-size: 0.6em; + margin: 1px; + } + + h3.bg-white { + font-size: 13pt; } {% for category, data in source_colors %} @@ -109,18 +157,19 @@ {% if not simple %} .content { padding-top:85px; + padding-bottom: 110px } @media (max-width: 1800px) { - .left { - display: none; - } .right { - width: 20%; + width: 15%; } .container { float: left; } + .footer { + right: 15%; + } } @media (max-width: 1500px) { @@ -130,13 +179,18 @@ .right { width: 15%; } + .footer { + right: 15%; + } } @media (max-width: 1100px) { .right { display: none; } - } + .footer { + right: 0em; + } {% endif %} @@ -173,37 +227,6 @@ {% endblock %} - -
-
-

Other Services

- EMMAA - Bob with Bioagents -
- -
-

- This Service -

-
- {% block header_desc %} - {% endblock %} -
- - -

- This Project -

-
-

INDRA is developed by indralabs, - a part of the Harvard Medical School Laboratory of Systems Pharmacology.

- {% block additional_footer %} - {% endblock %} -
-
-
{% endif %} @@ -225,17 +248,31 @@

{{ title }}

{% if not simple %} + + + +

- Our Sources: + INDRA sources:

-

- INDRA allows us to combine the results from a multitude of sources. In - particular, the INDRA Database draws on the following... +

+ Colored badges next to statement headings correspond to evidence counts + from knowledge sources, as shown below. Badges to the left of the | separator + correspond to curated knowledge base sources, and badges to the + right of it correspond to machine reading systems.

{% for category, data in source_colors %}