Skip to content
Snippets Groups Projects
Commit d082ff41 authored by Alexander Pace's avatar Alexander Pace
Browse files

Phase one of visual refresh:

upload new images, rework the base page and navbar to be cleaner
and more mobile-friendly.
parent 98816862
No related branches found
No related tags found
1 merge request!46Refreshed look and feel
Pipeline #91466 passed
...@@ -8,7 +8,8 @@ ...@@ -8,7 +8,8 @@
"jquery-ui": "1.12.1", "jquery-ui": "1.12.1",
"moment-timezone": "0.5.0", "moment-timezone": "0.5.0",
"moment": "2.11.1", "moment": "2.11.1",
"tablesaw": "3.1.2" "tablesaw": "3.1.2",
"materialize": "1.0.0"
}, },
"resolutions": { "resolutions": {
"webcomponentsjs": "^0.6.0" "webcomponentsjs": "^0.6.0"
......
This diff is collapsed.
This diff is collapsed.
gracedb/static/images/kagra.png

13.9 KiB

<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Created with matplotlib (https://matplotlib.org/) -->
<svg height="72pt" version="1.1" viewBox="0 0 72 72" width="72pt" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<style type="text/css">
*{stroke-linecap:butt;stroke-linejoin:round;}
</style>
</defs>
<g id="figure_1">
<g id="patch_1">
<path d="M 0 72
L 72 72
L 72 0
L 0 0
z
" style="fill:none;"/>
</g>
<g id="axes_1">
<g id="line2d_1">
<path clip-path="url(#pea4fd773e2)" d="M 3.272727 34.869788
L 5.11044 35.840476
L 6.708452 36.585684
L 7.715199 36.818489
L 8.594105 36.798364
L 9.441051 36.555805
L 10.351918 36.05312
L 11.438565 35.181559
L 14.538707 32.526636
L 15.305753 32.251361
L 15.976918 32.242904
L 16.632102 32.464321
L 17.319247 32.941851
L 18.118253 33.786725
L 19.15696 35.243008
L 21.841619 39.177834
L 22.544744 39.757634
L 23.120028 39.960942
L 23.615412 39.90996
L 24.110795 39.634544
L 24.670099 39.049108
L 25.325284 38.008905
L 26.14027 36.257208
L 27.418679 32.888578
L 28.888849 29.177694
L 29.623935 27.877153
L 30.167259 27.312997
L 30.598722 27.155482
L 30.982244 27.253978
L 31.381747 27.608748
L 31.84517 28.35028
L 32.404474 29.709879
L 33.091619 32.01765
L 34.018466 35.988239
L 36.383523 46.485447
L 36.990767 48.103267
L 37.42223 48.722235
L 37.741832 48.846326
L 38.013494 48.70617
L 38.317116 48.265356
L 38.700639 47.259787
L 39.164062 45.359452
L 39.739347 41.978091
L 40.474432 36.210129
L 41.800781 23.600473
L 42.775568 15.366228
L 43.334872 12.281826
L 43.718395 11.206752
L 43.958097 11.041547
L 44.133878 11.189356
L 44.357599 11.723331
L 44.661222 13.091582
L 45.060724 16.047993
L 45.572088 21.712287
L 46.243253 31.937439
L 48.464489 68.271092
L 48.832031 70.476711
L 49.039773 70.796202
L 49.151634 70.669738
L 49.327415 70.034613
L 49.583097 68.142478
L 49.934659 63.688407
L 50.414062 54.478895
L 51.197088 34.300011
L 52.187855 9.994247
L 52.651278 3.413108
L 52.954901 1.640164
L 53.066761 1.535647
L 53.098722 1.560686
L 53.226562 1.903854
L 53.434304 3.275552
L 53.737926 6.977137
L 54.201349 15.798978
L 55.895241 51.206179
L 56.230824 53.526312
L 56.406605 53.797126
L 56.422585 53.789961
L 56.534446 53.595137
L 56.726207 52.69577
L 57.02983 49.971771
L 57.525213 43.068991
L 58.707741 26.033912
L 59.091264 23.505375
L 59.330966 23.032373
L 59.458807 23.128339
L 59.634588 23.637265
L 59.90625 25.2027
L 60.337713 29.197776
L 61.839844 44.315691
L 62.175426 45.542716
L 62.383168 45.724239
L 62.542969 45.572855
L 62.76669 44.968091
L 63.118253 43.236201
L 63.741477 38.755694
L 64.636364 32.669725
L 65.067827 31.057322
L 65.371449 30.603555
L 65.57919 30.606896
L 65.802912 30.866097
L 66.138494 31.659588
L 66.761719 33.84686
L 67.528764 36.281657
L 67.928267 36.914553
L 68.215909 37.02041
L 68.471591 36.874248
L 68.727273 36.527629
L 68.727273 36.527629
" style="fill:none;stroke:#ffffff;stroke-linecap:round;stroke-width:2;"/>
</g>
</g>
</g>
<defs>
<clipPath id="pea4fd773e2">
<rect height="72" width="72" x="0" y="0"/>
</clipPath>
</defs>
</svg>
This diff is collapsed.
This diff is collapsed.
...@@ -3,13 +3,20 @@ ...@@ -3,13 +3,20 @@
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head> <head>
{% load static %} {% load static %}
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Import materialize.css-->
<link type="text/css" rel="stylesheet" href="{% static "css/materialize.min.css" %}" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
{% block headcontents %} {% block headcontents %}
{# remove requests for favicon #} {# remove requests for favicon #}
<link rel="icon" href="data:,"> <link rel="icon" href="data:,">
{% block csslink %}
<link rel="stylesheet" href="{% static "css/style.css" %}" />
{% endblock %}
<title>GraceDB | {% block title %}{% endblock %}</title> <title>GraceDB | {% block title %}{% endblock %}</title>
<!-- START TESTING --> <!-- START TESTING -->
<script type="text/javascript"> <script type="text/javascript">
...@@ -28,23 +35,43 @@ function changeTime(obj, label) { ...@@ -28,23 +35,43 @@ function changeTime(obj, label) {
<!-- END TESTING --> <!-- END TESTING -->
{% block jscript %}{% endblock %} {% block jscript %}{% endblock %}
<!-- override other CSS templates as necessary --> <!-- override other CSS templates as necessary
<link rel="stylesheet" href="{% static "css/override.css" %}" /> <link rel="stylesheet" href="{% static "css/override.css" %}" />-->
</head> </head>
<script src="{% static "js/materialize.js" %}"></script>
<body id="{% block pageid %}{% endblock %}"{% block bodyattrs %}{% endblock %}> <body id="{% block pageid %}{% endblock %}"{% block bodyattrs %}{% endblock %}>
<div id="content"> <div class="container">
<div class="card-panel blue darken-3">
<center> <table border="0" cellpadding="0">
<h1> <tbody>
GraceDB &mdash; Gravitational-Wave Candidate Event Database <tr style="border-bottom: 0px ">
{% if config_name %} <td rowspan=2>
<span style="color: red;">({{ config_name }})</span> <a href="/">
{% endif %} <img src="{% static "images/logo.svg" %}" width=56>
</h1> </a>
</center> </td>
<td>
<a href="/">
<span class="light-blue-text text-lighten-5" style="font-weight: bold"><h5>
GraceDB &mdash; </span>
{% if config_name %}
<span class="red-text text-lighten-4">({{ config_name }})</span>
{% endif %}<br>
<span class="light-blue-text text-lighten-5" style="font-weight: 100">
Gravitational-Wave Candidate Event Database
</span></h5>
</a>
</td>
</tr>
</tbody>
</table>
</div>
{% block nav %} {% block nav %}
{% include "navbar_frag.html" %} {% include "navbar_frag.html" %}
...@@ -54,40 +81,24 @@ GraceDB &mdash; Gravitational-Wave Candidate Event Database ...@@ -54,40 +81,24 @@ GraceDB &mdash; Gravitational-Wave Candidate Event Database
{% block content %}{% endblock %} {% block content %}{% endblock %}
</div>
<div id="header">
<!-- Header. Yea, this is actually a footer. It *was* as header once, though. -->
<table align="center" width="90%">
<tr>
<td align="center">
<img width="52" height="36" src="{% static "images/ligo-blue.gif" %}" />
<!-- 673px 487px -->
</td>
<td align="center"> <div class="divider"></div>
<img width="164" height="30" src="{% static "images/Virgo_logo50.png" %}" /> <br>
<!-- 4,829px 884px --> </div>
</td>
<td align="center"> <div id=footer" class="container">
<center>
<img height="36" src="{% static "images/kagra.png" %}" />
<img height="36" src="{% static "images/ligo-blue.gif" %}" />
<img height="36" src="{% static "images/LSC_logo50.png" %}" />
<img height="36" src="{% static "images/Virgo_logo50.png" %}" />
{% if user and user.username == "chad.hanna@LIGO.ORG" %} {% if user and user.username == "chad.hanna@LIGO.ORG" %}
<img width="194" height="37" src="{% static "images/PI_Logo-anim.gif" %}" /> <img width="194" height="37" src="{% static "images/PI_Logo-anim.gif" %}" />
{% else %} {% endif %}
{% if user and user.username == "kipp.cannon@LIGO.ORG" %} {% if user and user.username == "kipp.cannon@LIGO.ORG" %}
<img width="194" height="37" src="{% static "images/CITA_logo-anim.gif" %}" /> <img width="194" height="37" src="{% static "images/CITA_logo-anim.gif" %}" />
{% endif %}
{% endif %} {% endif %}
<!-- 287px 101px --> </center>
</td>
<td align="center">
<img width="87" height="37" src="{% static "images/LSC_logo50.png" %}" />
<!-- 6,261px 2,652px -->
</td>
</tr>
</table>
<!-- End Header -->
</div> </div>
</body> </body>
......
...@@ -3,26 +3,6 @@ ...@@ -3,26 +3,6 @@
{% block heading %}{% endblock %} {% block heading %}{% endblock %}
{% block pageid %}home{% endblock %} {% block pageid %}home{% endblock %}
{% block jscript %} {% block jscript %}
<style>
.question {
font-family: Helvetica, sans-serif;
/*font-variant: small-caps; */
font-style: bold;
font-size: 18px;
padding-bottom: 5px;
}
.answer {
margin-left: 30px;
margin-right: 30px;
font-size: 14px;
background-color: #e2ebf2;
padding-top: 1px;
padding-bottom: 1px;
padding-left: 20px;
padding-right: 20px;
}
</style>
{% endblock %} {% endblock %}
{% block content %} {% block content %}
...@@ -31,9 +11,8 @@ ...@@ -31,9 +11,8 @@
<style> <style>
body { body {
font: 10px sans-serif; font: 12px ;
} }
.axis text { .axis text {
font: 16px sans-serif; font: 16px sans-serif;
/*font-weight: bold; */ /*font-weight: bold; */
...@@ -67,28 +46,25 @@ body { ...@@ -67,28 +46,25 @@ body {
<!-- I find myself needing some more space. --> <!-- I find myself needing some more space. -->
<!-- <br/> --> <!-- <br/> -->
<h2> <div class="section">
{% if title %} <h5>GraceDB Overview</h5>
{{ title }} <div class="divider"></div>
{% else %}
GraceDB Overview
{% endif %}
</h2>
<div class="text">
<p> <p>
The gravitational-wave candidate event database (GraceDB) is a service operated by the <a href="https://www.ligo.org/">LIGO Scientific Collaboration</a>. It provides a centralized location for aggregating and retrieving information about candidate gravitational-wave events. GraceDB provides an <a href="{% url "legacy_apiweb:default:root" %}">API</a> for programmatic access, and a <a href="https://ligo-gracedb.readthedocs.io/">client package</a> is available for interacting with the API. The gravitational-wave candidate event database (GraceDB) is a service operated by the <a href="https://www.ligo.org/">LIGO Scientific Collaboration</a>. It provides a centralized location for aggregating and retrieving information about candidate gravitational-wave events. GraceDB provides an <a href="{% url "legacy_apiweb:default:root" %}">API</a> for programmatic access, and a <a href="https://ligo-gracedb.readthedocs.io/">client package</a> is available for interacting with the API.
</p> </p>
<h3>Useful information</h3> </div>
<ul>
<li><b style="color: red;">*NEW*</b> O3 public alert <a href="{% url "superevents:public-alerts-O3" %}">summary page</a>.</li> <div class="section">
<h5>Useful information</h5>
<div class="divider"></div>
<li>Information about GW alerts and real-time data products is available in the <a href="https://emfollow.docs.ligo.org/userguide/">LIGO/Virgo Public Alert Guide</a>.</li> <li>Information about GW alerts and real-time data products is available in the <a href="https://emfollow.docs.ligo.org/userguide/">LIGO/Virgo Public Alert Guide</a>.</li>
<li><a href="https://monitor.ligo.org/ldg">Real-time status of the LIGO Data Grid</a>.</li>
<li>Found a bug? LIGO/Virgo users can report issues on the GraceDB <a href="https://git.ligo.org/lscsoft/gracedb/issues">Gitlab page</a>.</li> <li>Found a bug? LIGO/Virgo users can report issues on the GraceDB <a href="https://git.ligo.org/lscsoft/gracedb/issues">Gitlab page</a>.</li>
</ul> </ul>
{% if information %} {% if information %}
{{ information|safe }} {{ information|safe }}
{% endif %} {% endif %}
<p><b>Server code version: <a href="https://git.ligo.org/lscsoft/gracedb/tree/gracedb-{{server_version}}">{{server_version}}</a></b></p> <p><b>Server code version: </b> <a href="https://git.ligo.org/lscsoft/gracedb/tree/gracedb-{{server_version}}" style="font-family: 'Courier New'">{{server_version}}</a></p>
</div> </div>
<!--XXX Infrastructure for human signoffs. Hopefully this will not be permanent. --> <!--XXX Infrastructure for human signoffs. Hopefully this will not be permanent. -->
......
<div style="padding-bottom: 30px;"> <!--<div style="padding-bottom: 30px;">
<ul id="nav"> <ul id="nav">
<li id="nav-home"><a href="{% url "home" %}">Home</a></li> <li id="nav-home"><a href="{% url "home" %}">Home</a></li>
<li id="nav-public"><a href="{% url "superevents:public-alerts-O3" %}">Public Alerts</a></li> <li id="nav-public"><a href="{% url "superevents:public-alerts-O3" %}">Public Alerts</a></li>
...@@ -41,4 +41,84 @@ return to the regular GraceDB site. This will ensure that your group memberships ...@@ -41,4 +41,84 @@ return to the regular GraceDB site. This will ensure that your group memberships
are correct the next time you log in. are correct the next time you log in.
</div> </div>
{% endif %} {% endif %}
</div> </div> -->
<nav>
<div class="nav-wrapper blue darken-3" style="padding-left: 15px;">
{% if user.is_authenticated %}
<span class="gray-text" style="font-size:8pt" >Authenticated as:</span>
{% if user.first_name %}
<span class="gray-text" style="font-size:8pt">{{ user.get_full_name }}</span>
{% else %}
<span class="gray-text" style="font-size:8pt">{{ user.username }}</span>
{% endif %}
{% endif %}
<a href="#" data-target="mobile-demo" class="sidenav-trigger"><i class="material-icons">menu</i></a>
<ul class="right hide-on-med-and-down">
<li id="nav-public" style="font-weight: bold"><a href="{% url "superevents:public-alerts-O3" %}">Public Alerts</a></li>
<li id="nav-latest"><a href="{% url "latest" %}">Latest</a></li>
<li id="nav-search"><a href="{% url "mainsearch" %}">Search</a></li>
{% if user_is_internal %}
<li id="nav-alerts"><a href="{% url "alerts:index" %}">Alerts</a></li>
<li id="nav-pipelines"><a href="{% url "manage-pipelines" %}">Pipelines</a></li>
{% elif user_is_lvem %}
<li id="nav-password"><a href="{% url "manage-password" %}">Manage Password</a></li>
{% endif %}
<li id="nav-docs"><a href="{% url "home" %}documentation/">Documentation</a></li>
{% if user %}
{% if user.is_superuser %}
<li id="nav-admin-docs"><a href="{% url "home" %}admin_docs/">Admin Docs</a></li>
{% endif %}
{% endif %}
{% if user.is_authenticated %}
<li id="nav-logout"><a href="{% url "logout" %}?next={{ request.path }}">Logout</a></li>
{% else %}
<li id="nav-login"><a href="{% url "login" %}?next={{ request.path }}">Login</a></li>
{% endif %}
</ul>
</div>
</nav>
<ul class="sidenav" id="mobile-demo">
<li id="nav-public" style="font-weight: bold"><a href="{% url "superevents:public-alerts-O3" %}">Public Alerts</a></li>
<li id="nav-latest"><a href="{% url "latest" %}">Latest</a></li>
<li id="nav-search"><a href="{% url "mainsearch" %}">Search</a></li>
{% if user_is_internal %}
<li id="nav-alerts"><a href="{% url "alerts:index" %}">Alerts</a></li>
<li id="nav-pipelines"><a href="{% url "manage-pipelines" %}">Pipelines</a></li>
{% elif user_is_lvem %}
<li id="nav-password"><a href="{% url "manage-password" %}">Manage Password</a></li>
{% endif %}
<li id="nav-docs"><a href="{% url "home" %}documentation/">Documentation</a></li>
{% if user %}
{% if user.is_superuser %}
<li id="nav-admin-docs"><a href="{% url "home" %}admin_docs/">Admin Docs</a></li>
{% endif %}
{% endif %}
{% if user.is_authenticated %}
<li id="nav-logout"><a href="{% url "logout" %}?next={{ request.path }}">Logout</a></li>
{% else %}
<li id="nav-login"><a href="{% url "login" %}?next={{ request.path }}">Login</a></li>
{% endif %}
</ul>
<script>
options = {
edge: 'left',
draggable: true,
inDuration: 250,
outDuration: 200,
onOpenStart: null,
onOpenEnd: null,
onCloseStart: null,
onCloseEnd: null,
preventScrolling: true
};
document.addEventListener('DOMContentLoaded', function() {
var elems = document.querySelectorAll('.sidenav');
var instances = M.Sidenav.init(elems, options);
});
</script>
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment