Skip to content

Commit

Permalink
Inner pages style and burger menu logic
Browse files Browse the repository at this point in the history
  • Loading branch information
@narduin @jeanbaptistemora
narduin authored and jeanbaptistemora committed Jun 29, 2020
1 parent 7c85476 commit 7f5bda0
Show file tree
Hide file tree
Showing 17 changed files with 481 additions and 261 deletions.
158 changes: 103 additions & 55 deletions main/templates/base.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<meta name="description"
content="{% block meta_description %}OpenCOVID 2019 survey does XYZ{% endblock meta_description %}">

<title>{% block head_title %}Open COVID19 Survey{% endblock head_title %}</title>
<title>{% block head_title %}Covid-Open survey{% endblock head_title %}</title>

{% comment %}
<link href='https://cdnjs.cloudflare.com/ajax/libs/metrics-graphics/2.11.0/metricsgraphics.min.css' rel='stylesheet'
Expand All @@ -28,7 +28,7 @@
</head>

<body>
<header id="header" class="isVisible">
<header id="header" class="header isVisible">
<a class="logo" href="/">
<img class="logo__image" src="{% static 'img/icon-192x192.png' %}">
</a>
Expand All @@ -38,56 +38,52 @@
aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span>X</span>
</button>
<ul class="navbar" id="navbar">
<li class="navbar__item">
<a class="nav-link" href="{% url 'about' %}">{% trans "Citizen Science" %}</a>
</li>
<li class="navbar__item">
<a class="nav-link" href="{% url 'data' %}">{% trans "Data" %}</a>
</li>
<li class="navbar__item">
<a class="nav-link" href="{% url 'team' %}">{% trans "Team" %}</a>
</li>
<li class="navbar__item">
<a class="nav-link" href="{% url 'faq' %}">{% trans "FAQ" %}</a>
</li>
<ul class="navbar" id="navbar">
<li class="navbar__item">
<a class="header__link" href="{% url 'about' %}">{% trans "Citizen Science" %}</a>
</li>
<li class="navbar__item">
<a class="header__link" href="{% url 'data' %}">{% trans "Data" %}</a>
</li>
<li class="navbar__item">
<a class="header__link" href="{% url 'team' %}">{% trans "Team" %}</a>
</li>
<li class="navbar__item">
<a class="header__link" href="{% url 'faq' %}">{% trans "FAQ" %}</a>
</li>

<li>
<form action="{% url 'set_language_custom' %}" method="post" class="">
{% csrf_token %}
<div class="form-group">
<select name="language" class="custom-select" onchange="this.form.submit()">
{% get_current_language as LANGUAGE_CODE %}
{% get_available_languages as LANGUAGES %}
{% get_language_info_list for LANGUAGES as languages %}
{% for language in languages %}
<option value="{{ language.code }}" {% if language.code == LANGUAGE_CODE %}selected{% endif %}>
{{ language.name_local|title }}
</option>
{% endfor %}
</select>
</div>
</form>
</li>

<li class="navbar__item">
<a class="nav-link" href="#"></a>
</li>
{% if not request.user.is_authenticated %}
<li class="">
<a href="{{ request.openhumans_login_url }}" class="">
{% trans "Log in" %}
</a>
</li>
{% else %}
<li>
<form class="navbar__item" action="{% url 'logout' %}" method="post">
{% csrf_token %}
<button class="" type="submit">{% trans "Log out" %}</button>
</form>
</li>
{% endif %}
</ul>
<li class="navbar__item">
<form action="{% url 'set_language_custom' %}" method="post" class="">
{% csrf_token %}
<div class="form-group">
<select name="language" class="custom-select" onchange="this.form.submit()">
{% get_current_language as LANGUAGE_CODE %}
{% get_available_languages as LANGUAGES %}
{% get_language_info_list for LANGUAGES as languages %}
{% for language in languages %}
<option value="{{ language.code }}" {% if language.code == LANGUAGE_CODE %}selected{% endif %}>
{{ language.name_local|title }}
</option>
{% endfor %}
</select>
</div>
</form>
</li>
{% if not request.user.is_authenticated %}
<li>
<a href="{{ request.openhumans_login_url }}" class="header__link">
{% trans "Log in" %}
</a>
</li>
{% else %}
<li>
<form class="navbar__item" action="{% url 'logout' %}" method="post">
{% csrf_token %}
<button class="" type="submit">{% trans "Log out" %}</button>
</form>
</li>
{% endif %}
</ul>
</nav>
</header>

Expand All @@ -114,10 +110,62 @@
{% endblock main %}
</main>

<footer class="">
<div class="container">
<div class="">
<a href="https://github.com/gedankenstuecke/opensurvey/">{% trans "view our code" %}</a>
<footer class="footer">
<div class="u-hidden" aria-hidden="true">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<symbol viewBox="0 0 146.74 36.86" id="logo-inserm">
<title>logo inserm</title>
<g fill="#ffffff">
<path
d="M38.73 0h6.02v24.15h-6.02zM54.84 8.38a7.7 7.7 0 012-1.69 6.05 6.05 0 013-.8 6.83 6.83 0 013.18.72c1.88 1 2.36 2.59 2.36 5.36v12.18h-5.2v-10a7 7 0 00-.24-2.66 2.38 2.38 0 00-2.36-1.36c-2.78 0-2.78 2.21-2.78 4.43v9.62h-5.24V6.35h5.28zM70.84 18.16a8.08 8.08 0 005.42 2.44c1.27 0 3.21-.41 3.21-1.74a1.09 1.09 0 00-.69-1 12 12 0 00-3.08-.68 20.85 20.85 0 01-2.41-.54 6.72 6.72 0 01-3-1.54A4.77 4.77 0 0169 11.73c0-2.93 2.53-6 7.55-6a13.4 13.4 0 018 2.55l-3 3.07a8.27 8.27 0 00-4.86-1.73c-2.07 0-2.55.82-2.55 1.33 0 1 1.14 1.23 2.86 1.53 3.61.65 7.76 1.61 7.76 5.84s-4.22 6.25-8.45 6.25a12.18 12.18 0 01-8.8-3.39zM100.68 18.09a4.46 4.46 0 01-4.51 2.7c-2.84 0-4.11-2.24-4.07-4.48h12.76c-.07-2-.21-5.5-2.54-8a8.69 8.69 0 00-6.66-2.56c-7 0-8.93 5.53-8.93 9.83 0 5.87 3.45 9.21 9 9.21a9.8 9.8 0 007-2.42 11.87 11.87 0 002.15-2.73zM92.13 13a4.57 4.57 0 011.06-2.34 3.6 3.6 0 012.67-1.16 3.76 3.76 0 012.57 1 4.29 4.29 0 011 2.52zM112.93 8.38a8.27 8.27 0 015.16-2.29v4.67l-1.74.27c-2.53.44-3.28 1.3-3.28 3.55v9.57h-5.25V6.28h5.11zM125.89 8.38A6.16 6.16 0 01131 5.89 5.82 5.82 0 01135.94 8a7.51 7.51 0 015.34-2.09c2.94 0 4.44 1.47 5 2.57a10 10 0 01.48 4.09v11.6h-5.18v-9.36a13.2 13.2 0 00-.21-3 2.32 2.32 0 00-2.31-1.6 2.82 2.82 0 00-1.72.54c-1 .79-1 1.81-1 3.75v9.69h-5.18V13.61a4.59 4.59 0 00-.51-2.52 2.63 2.63 0 00-2.07-.92 2.72 2.72 0 00-1.45.41c-1.18.78-1.21 2.21-1.21 3.42v10.15h-5.18V6.35h5.18z" />
</g>
<path d="M42.66 28.88a4 4 0 103 3 4 4 0 00-3-3" fill="#e64011" />
<path fill="#ffffff" d="M21.12 7.99h2.96v12.25h-2.96z" />
<path fill="#ffffff" d="M15.84 1.27h2.97v12.25h-2.97z" />
<path fill="#ffffff" d="M15.84 14.69h2.97v12.25h-2.97z" />
<path fill="#ffffff" d="M10.56.01h2.97v12.25h-2.97z" />
<path fill="#ffffff" d="M10.56 15.95h2.97V28.2h-2.97z" />
<path fill="#ffffff" d="M5.28 1.27h2.97v12.25H5.28z" />
<path fill="#ffffff" d="M5.28 14.69h2.97v12.25H5.28z" />
<path fill="#ffffff" d="M0 7.99h2.97v12.25H0z" />
</symbol>
</svg>
</div>
<div class="container footer__content">
<div class="footer__logos">
<a href="#" class="footer__logo">
<svg width="146.74" height="36.86" focusable="false" aria-hidden="true">
<use xlink:href="#logo-inserm" />
</svg>
</a>
<a href="#" class="footer__logo">
<svg width="146.74" height="36.86" focusable="false" aria-hidden="true">
<use xlink:href="#logo-inserm" />
</svg>
</a>
<a href="#" class="footer__logo">
<svg width="146.74" height="36.86" focusable="false" aria-hidden="true">
<use xlink:href="#logo-inserm" />
</svg>
</a>
<a href="#" class="footer__logo">
<svg width="146.74" height="36.86" focusable="false" aria-hidden="true">
<use xlink:href="#logo-inserm" />
</svg>
</a>
</div>
<nav class="footer__nav">
<a href="/" class="footer__link">{% trans "Home" %}</a>
<a href="/about" class="footer__link">{% trans "About" %}</a>
<a href="/data" class="footer__link">{% trans "Data" %}</a>
<a href="/team" class="footer__link">{% trans "Team" %}</a>
<a href="/faq" class="footer__link">{% trans "FAQ" %}</a>
<a href="#" class="footer__link">{% trans "Privacy Policy" %}</a>
</nav>
<div class="footer__links">
<a href="https://github.com/gedankenstuecke/opensurvey/" class="footer__link" target="_blank"
rel="noopener noreferer">{% trans "view our code" %}</a>
<a href="#" class="footer__link" target="_blank" rel="noopener noreferer">{% trans "Twitter" %}</a>
</div>
</div>
</footer>
Expand Down
39 changes: 28 additions & 11 deletions main/templates/main/about.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,12 @@
<h1>{% trans "About" %}</h1>
<p>
{% blocktrans %}
The OpenCovid survey was created by a team of scientists at the Center for Research and Interdisciplinarity (CRI) in
Paris, with collaborating researchers from the USA, Australia, Canada, Costa Rica, India and more! We are interested
The OpenCovid survey was created by a team of scientists at the Center for Research and Interdisciplinarity (CRI)
in
Paris, with collaborating researchers from the USA, Australia, Canada, Costa Rica, India and more! We are
interested
in bringing in minds from all over the world, yours included, to come up with great ideas to research this virus.
{% endblocktrans %}
{% endblocktrans %}
</p>
<p>
<a href="/team">Meet the team!</a>
Expand All @@ -27,13 +29,18 @@ <h2>{% trans "Citizen Science" %}</h2>
<h3>{% trans "Be part of the team." %}</h3>
<p>
{% blocktrans %}
When it comes to science, we believe in harnessing the ingenuity of all citizens. We want you to contribute your own survey items according to your research questions and interests. This will not only help us develop the study to cover the needs and interests of the cohort, but will also help us understand key questions and concerns that citizens outside of Academia have regarding the pandemic.
When it comes to science, we believe in harnessing the ingenuity of all citizens. We want you to contribute your
own survey items according to your research questions and interests. This will not only help us develop the study
to cover the needs and interests of the cohort, but will also help us understand key questions and concerns that
citizens outside of Academia have regarding the pandemic.
{% endblocktrans %}
</p>
<h3>{% trans "How it works." %}</h3>
<p>
{% blocktrans %}
You will need to access the OpenHumans forum, where a dedicated section for suggestions has been created. Your personal information will be anonymized for your suggestions. You can also create and engage in topics of discussions directly on the forum, as well as vote for suggestions others have made!
You will need to access the OpenHumans forum, where a dedicated section for suggestions has been created. Your
personal information will be anonymized for your suggestions. You can also create and engage in topics of
discussions directly on the forum, as well as vote for suggestions others have made!
{% endblocktrans %}
</p>
<h3>{% trans "What to tell us:" %}</h3>
Expand All @@ -48,7 +55,10 @@ <h3>{% trans "What to tell us:" %}</h3>
<h3>{% trans "How we review it." %}</h3>
<p>
{% blocktrans %}
Every 2 weeks, our team will go through your suggestions, and decide on a few that we could incorporate into our next iteration of the survey. We then send the new set of questions to be reviewed by the Institutional Review Board, to make sure it doesn’t go against any legal or ethical regulations. Once we get the green light, we move to code it into the survey.
Every 2 weeks, our team will go through your suggestions, and decide on a few that we could incorporate into our
next iteration of the survey. We then send the new set of questions to be reviewed by the Institutional Review
Board, to make sure it doesn’t go against any legal or ethical regulations. Once we get the green light, we move
to code it into the survey.
{% endblocktrans %}
</p>
</article>
Expand All @@ -57,21 +67,28 @@ <h2>{% trans "Our approach" %}</h2>
<h3>{% trans "What we do." %}</h3>
<p>
{% blocktrans %}
The OpenCovid survey is a 5 minute questionnaire created for people who want to help fight the COVID-19 virus from the comfort of their home. It consists of a short questionnaire, followed by a daily check-in on how you feel. A wide variety of questions are asked, some of which can be answered daily, others that appear on a rolling basis, so as to always keep it fresh!
The OpenCovid survey is a 5 minute questionnaire created for people who want to help fight the COVID-19 virus from
the comfort of their home. It consists of a short questionnaire, followed by a daily check-in on how you feel. A
wide variety of questions are asked, some of which can be answered daily, others that appear on a rolling basis,
so as to always keep it fresh!
{% endblocktrans %}
</p>
<p>
{% blocktrans %}
Our goal? Better understand the virus’ transmission patterns and its effect on physical and mental health. We want to understand how the virus spreads, who it affects most, and how it impacts your daily life. We hope this may guide public health decisions and medication repurposing in the future.
Our goal? Better understand the virus’ transmission patterns and its effect on physical and mental health. We want
to understand how the virus spreads, who it affects most, and how it impacts your daily life. We hope this may
guide public health decisions and medication repurposing in the future.
{% endblocktrans %}
</p>
<h3>{% trans "How we do it." %}</h3>
<p>
{% blocktrans %}
All data collected is anonymized and goes through the OpenHuman platform. From there, you can view what is happening around you. We also seek to promote citizen science and give you the option to contribute research hypotheses that could be implemented in our fast-evolving survey.
All data collected is anonymized and goes through the OpenHuman platform. From there, you can view what is
happening around you. We also seek to promote citizen science and give you the option to contribute research
hypotheses that could be implemented in our fast-evolving survey.
{% endblocktrans %}
</p>

<p>
{% trans "These are our starting research aims that we’re trying to answer:" %}
<ul>
Expand All @@ -88,4 +105,4 @@ <h3>{% trans "How we do it." %}</h3>
<p>
</article>
</section>
{% endblock main %}
{% endblock main %}
25 changes: 13 additions & 12 deletions main/templates/main/data.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,22 +9,23 @@
<h1>{% trans "Access the Data" %}</h1>
<p>
{% blocktrans %}
Your data belongs to you! If you want to get a transcript with your past responses to the survey, <a href="#">click here!</a> You will be redirected to our OpenHumans server which stores your data securely.
Your data belongs to you! If you want to get a transcript with your past responses to the survey, <a
href="#">click here!</a> You will be redirected to our OpenHumans server which stores your data securely.
{% endblocktrans %}
</p>
</div>
</section>
{% endblock intro %}

{% block main %}
<section>
<article>
<p>
{% blocktrans %}
As the survey just launched, we are waiting a few days to have enough data points to show you the trends! Come
back later and see what’s happening around you!
{% endblocktrans %}
</p>
</article>
</section>
{% endblock main %}
<section>
<article>
<p>
{% blocktrans %}
As the survey just launched, we are waiting a few days to have enough data points to show you the trends! Come
back later and see what’s happening around you!
{% endblocktrans %}
</p>
</article>
</section>
{% endblock main %}
Loading

0 comments on commit 7f5bda0

Please sign in to comment.