Skip to content

Commit

Permalink
Update the header
Browse files Browse the repository at this point in the history
  • Loading branch information
@tudoramariei
tudoramariei committed Jul 4, 2024
1 parent e03aac0 commit f92288f
Show file tree
Hide file tree
Showing 3 changed files with 151 additions and 109 deletions.
1 change: 1 addition & 0 deletions backend/hub/templates/base.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@
<link rel="stylesheet" href="{% static "css/colors.css" %}">
<link rel="stylesheet" href="{% static "css/sizing.css" %}">
<link rel="stylesheet" href="{% static "css/footer.css" %}">
<link rel="stylesheet" href="{% static "css/header.css" %}">
<link rel="stylesheet" href="{% static "css/hub.css" %}">

{% block styles %}{% endblock %}
Expand Down
240 changes: 131 additions & 109 deletions backend/hub/templates/header.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,122 +3,144 @@
{% load hub_tags %}

<div class="navbar-container">
<div class="h-padded-wrapper columns has-background-grey-lighter pt-3 mr-0">
<div class="container column is-12 is-flex is-align-content-center">
<img src="{% static "images/code4romania-black.svg" %}" alt="code-4-ro" width="80"/>
<strong class="px-5">
O soluție Code for Romania.
<a href="https://code4.ro/ro/putem">Află mai multe</a>
</strong>
</div>
<div class="h-padded-wrapper columns pt-3 mr-0 banner">
<div class="container column is-12 is-flex is-align-content-center">
<a
href="https://www.commitglobal.org"
target="_blank"
aria-label="Link către site-ul Commit Global">
<svg
style="height: 32px; min-width: 80px; float: left; margin: 0 1em 0 0; display: block;"
viewBox="0 0 401.5 114.5" xmlns="http://www.w3.org/2000/svg">
<path
d="m87.4 2.4 16.2 2.4 29.6 52.4-29.6 52.5-16.2 2.4 21.4-54.9zm-41.6 0-16.2 2.4-29.6 52.4 29.6 52.5 16.2 2.4-17.5-54.9z"></path>
<path d="m45.8 2.4 20.8-2.4 7.5 31.7-7.5 25.5-24 6.2-28.3-6.2z" fill="#fff8da"></path>
<path d="m45.8 112.1 20.8 2.4 12.2-28.6-12.2-28.7h-52.3z" fill="#ffe46b"></path>
<path d="m87.4 2.4-20.8-2.4v57.2l21.6 6.2 30.6-6.2z" fill="#fff1b5"></path>
<path
d="m376.2 15.6h-8.9v-7.1h8.9zm-143 23.4c0-4.3-.7-7.1-2-8.5a5.6 5.6 0 0 0 -4.1-1.5 5.4 5.4 0 0 0 -4 1.5c-1.4 1.4-2 4.2-2 8.5s.6 7.1 2 8.5a5.4 5.4 0 0 0 4 1.5 5.6 5.6 0 0 0 4.1-1.5c1.3-1.4 2-4.2 2-8.5zm124.9 17.4h-8.7v-21a6.6 6.6 0 0 0 -1.7-4.9 6.1 6.1 0 0 0 -4.1-1.5 6.3 6.3 0 0 0 -4.1 1.5 6.1 6.1 0 0 0 -1.7 4.7v21.2h-8.7v-21a6.6 6.6 0 0 0 -1.7-4.9 6.4 6.4 0 0 0 -8.2 0 6.6 6.6 0 0 0 -1.7 4.9v21h-8.7v-34.8h8.5v3.2a11.5 11.5 0 0 1 8.7-3.6c4 0 7.1 1.4 9.2 4.4a13.8 13.8 0 0 1 10.5-4.4c3.6 0 6.5 1 8.6 3a13.8 13.8 0 0 1 3.8 10zm-58.7 0h-8.7v-21c0-2.2-.5-3.8-1.7-4.9a5.7 5.7 0 0 0 -4-1.5 6.1 6.1 0 0 0 -4.1 1.5c-1.2 1-1.7 2.6-1.7 4.7v21.2h-8.7v-21a6.6 6.6 0 0 0 -1.7-4.9 6.1 6.1 0 0 0 -4.1-1.5 5.9 5.9 0 0 0 -4.1 1.5 6.6 6.6 0 0 0 -1.7 4.9v21h-8.7v-34.8h8.5v3.2a11.5 11.5 0 0 1 8.7-3.6c4 0 7.1 1.4 9.2 4.4a13.7 13.7 0 0 1 10.5-4.4c3.6 0 6.5 1 8.5 3a13.4 13.4 0 0 1 3.8 10zm102.1 0h-4.7c-3.3 0-5.9-.9-7.6-2.9a10.5 10.5 0 0 1 -2.6-7v-17.3h-3.6v-6.6h3.6v-10.3h8.7v10.3h6.2v6.6h-6.2v16.7c0 2.1 1.1 3.2 3.1 3.2h3.1zm-25.4 0h-8.7v-34.8h8.7zm-134.2-17.4a35.6 35.6 0 0 1 -.8 8.1 12.3 12.3 0 0 1 -3.2 5.5q-3.9 4.2-10.8 4.2t-10.8-4.2a13.1 13.1 0 0 1 -3.1-5.5 35.6 35.6 0 0 1 -.8-8.1 35.6 35.6 0 0 1 .8-8.1 12.2 12.2 0 0 1 3.1-5.4c2.7-2.9 6.3-4.3 10.8-4.3s8.2 1.4 10.8 4.3a11.5 11.5 0 0 1 3.2 5.4 35.6 35.6 0 0 1 .8 8.1zm-35.4 2.8a17.7 17.7 0 0 1 -5.9 11.1 18.9 18.9 0 0 1 -24.5-1.3 14.3 14.3 0 0 1 -3.9-7.1 69.6 69.6 0 0 1 -.8-11.9 67.4 67.4 0 0 1 .8-11.8 14.6 14.6 0 0 1 3.9-7.2 18.9 18.9 0 0 1 24.5-1.3 18.3 18.3 0 0 1 5.9 11.1h-9.4c-1.2-4.5-3.8-6.7-8.1-6.7-2.6 0-4.6.8-5.9 2.5a6.6 6.6 0 0 0 -1.9 4 61.8 61.8 0 0 0 -.5 9.4 61.8 61.8 0 0 0 .5 9.4 7.4 7.4 0 0 0 7.8 6.5c4.3 0 6.9-2.2 8.1-6.7z"></path>
<path
d="m241.8 83.2a2.4 2.4 0 0 0 .7-1.8 2.1 2.1 0 0 0 -.7-1.8 2.7 2.7 0 0 0 -2-.7h-4.1v4.9h4.1a3.2 3.2 0 0 0 2-.6zm20.7 6.1-2.6-7.8-2.7 7.8zm-20.4 2.8a2.6 2.6 0 0 0 .7-1.9 2.5 2.5 0 0 0 -.7-1.9 2.8 2.8 0 0 0 -2.1-.7h-4.3v5.2h4.3a2.8 2.8 0 0 0 2.1-.7zm-20.7-2.1a33.8 33.8 0 0 0 .2-4.1 35.9 35.9 0 0 0 -.2-4.2 3.7 3.7 0 0 0 -3.5-3 3.2 3.2 0 0 0 -2.7 1.2 3.1 3.1 0 0 0 -.9 1.8c-.1.8-.1 2.1-.1 4.2a40.2 40.2 0 0 0 .1 4.1 3.8 3.8 0 0 0 .9 1.9 3.4 3.4 0 0 0 2.7 1.1 3.3 3.3 0 0 0 2.6-1.1 3.8 3.8 0 0 0 .9-1.9zm47.8 6.5h-4.3l-1.3-3.7h-7.6l-1.2 3.7h-4.4l7.8-21.3h3.2zm-22.2-6.1a5.8 5.8 0 0 1 -1.8 4.5 6.8 6.8 0 0 1 -4.8 1.6h-8.9v-21.3h8.6a6.6 6.6 0 0 1 4.8 1.6 5.6 5.6 0 0 1 1.8 4.4 5.1 5.1 0 0 1 -.8 2.8 5.6 5.6 0 0 1 -1.9 1.6 4.8 4.8 0 0 1 3 4.8zm-40.4 6.1h-13.9v-21.3h4.2v17.6h9.7zm80.6 0h-13.8v-21.3h4.1v17.6h9.7zm-61.5-13.3c0 .6.1 1.4.1 2.7s-.1 2.1-.1 2.6a18.3 18.3 0 0 1 -.2 2.1 5.8 5.8 0 0 1 -.6 2.1 7 7 0 0 1 -1.3 1.7 8.3 8.3 0 0 1 -11.5 0 6.6 6.6 0 0 1 -1.2-1.7 5.2 5.2 0 0 1 -.7-2.1 20.6 20.6 0 0 1 -.2-2.1v-5.3c0-.5.1-1.2.2-2.1a6.5 6.5 0 0 1 .7-2.1 6.1 6.1 0 0 1 1.2-1.6 8.1 8.1 0 0 1 11.5 0 6.5 6.5 0 0 1 1.3 1.6 6.5 6.5 0 0 1 .6 2.1 18.3 18.3 0 0 1 .2 2.1zm-38.4 4.6a13.8 13.8 0 0 1 -.4 3.8 7.4 7.4 0 0 1 -1.6 2.7 8.6 8.6 0 0 1 -11.8.1 5.9 5.9 0 0 1 -1.7-3.2 24.2 24.2 0 0 1 -.4-5.3 23.6 23.6 0 0 1 .4-5.3 5.6 5.6 0 0 1 1.7-3.2 7.8 7.8 0 0 1 5.8-2.4 8.1 8.1 0 0 1 5.5 1.9 8 8 0 0 1 2.5 4.9h-4.2a3.7 3.7 0 0 0 -3.8-3.1 3.4 3.4 0 0 0 -2.7 1.2 3.7 3.7 0 0 0 -.8 1.8 34.5 34.5 0 0 0 -.2 4.2 32.5 32.5 0 0 0 .2 4.1 3.7 3.7 0 0 0 .8 1.9 3.4 3.4 0 0 0 2.7 1.1 3.7 3.7 0 0 0 2.9-1.2 3.9 3.9 0 0 0 1-2.8v-.9h-3.9v-3.4h8z"></path>
<path d="m87.4 112.1-20.8 2.4v-57.3h52.2z" fill="#ffd209"></path>
</svg>
</a>

<strong class="px-4">
<a href="https://www.commitglobal.org" class="subtle-link" target="_blank">
O soluție Commit Global.
</a>
</strong>
</div>
<div class="h-padded-wrapper">
<div class="container border-b">
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="{% url 'home' %}">
<img src="{% static "images/votong_by_c4ro.svg" %}" alt="VotONg logo" width="200">
</a>

<a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false"
data-target="navbarBasicExample">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-end has-text-centered-touch">
<a href="{% url 'home' %}" class="navbar-item">
{% trans "Home" %}
</a>

<a href="{% url 'about' %}" class="navbar-item">
{% trans "About the platform" %}
</a>

<a href="{% url 'blog-list' %}" class="navbar-item">Blog</a>

<a href="{% url 'ngos' %}" class="navbar-item">
{% trans "Organizations" %}
</a>

<a href="{% url 'candidates' %}" class="navbar-item">
{% trans "VotONG Elections" %}
</a>

<a href="{% url 'history' %}" class="navbar-item">
{% trans "History" %}
</a>

{% if ORG_REGISTRATION_ENABLED %}
<a href="{% url 'ngos-register-request' %}" class="navbar-item">
{% trans "Register your organization" %}
</a>
{% endif %}

<!-- <a href="{% url 'candidates' %}" class="navbar-item">
</div>

<div class="h-padded-wrapper">
<div class="container border-b">
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="{% url 'home' %}">
<img src="{% static "images/votong_by_c4ro.svg" %}" alt="VotONG logo" width="200">
</a>

<a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false"
data-target="navbarBasicExample">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-end has-text-centered-touch">
<a href="{% url 'home' %}" class="navbar-item">
{% trans "Home" %}
</a>

<a href="{% url 'about' %}" class="navbar-item">
{% trans "About the platform" %}
</a>

<a href="{% url 'blog-list' %}" class="navbar-item">Blog</a>

<a href="{% url 'ngos' %}" class="navbar-item">
{% trans "Organizations" %}
</a>

<a href="{% url 'candidates' %}" class="navbar-item">
{% trans "VotONG Elections" %}
</a>

<a href="{% url 'history' %}" class="navbar-item">
{% trans "History" %}
</a>

{% if ORG_REGISTRATION_ENABLED %}
<a href="{% url 'ngos-register-request' %}" class="navbar-item">
{% trans "Register your organization" %}
</a>
{% endif %}

<!-- <a href="{% url 'candidates' %}" class="navbar-item">
{% trans "Candidates" %}
</a> -->

<!-- <a href="{% url 'rules' %}" class="navbar-item">
<!-- <a href="{% url 'rules' %}" class="navbar-item">
{% trans "Metodology" %}
</a> -->

<div class="navbar-item">|</div>

{% if request.user.is_authenticated %}

{% avatar user 50 class="img-circle img-responsive nav-avatar" id="user_avatar" %}

{% if user|in_committee_or_staff_groups %}
<a href="{% url 'committee-ngos' %}" class="navbar-item">
{% elif user.orgs.exists %}
<a href="{% url 'ngo-update' user.orgs.first.id %}" class="navbar-item">
{% else %}
<a href="{% url 'account-password-reset' %}" class="navbar-item">
{% endif %}
{{ user.email|truncatechars:24 }}
</a>

<a href="{% url 'account_logout' %}" class="navbar-item">{% trans "Logout" %}</a>

{% if user.is_impersonate %}
<a href="{% url 'impersonate-stop' %}" class="navbar-item" style="color:red; text-align:center;">
{% trans "STOP IMPERSONATING" %}<br>{{ request.user.email }}
</a>
{% endif %}

{% else %}

{# <a href="{% url 'account_login'%}" class="navbar-item"> #}
<a href="/allauth/amazon-cognito/login/?process=login" class="navbar-item">
{% trans "Login" %}
</a>
{% endif %}


{% comment %}
{% get_available_languages as LANGUAGES %}
{% get_current_language as LANGUAGE_CODE %}
<div class="navbar-item">
<form class="d-inline" action="{% url 'set_language' %}" method="post">
{% csrf_token %}
<input name="next" type="hidden" value="{{ redirect_to }}"/>
<div class="select">
<select id="language" name="language" onchange="this.form.submit()">
{% for language in LANGUAGES %}
<option {% if language.0 == LANGUAGE_CODE %} selected {% endif %} name="language" value="{{language.0}}">{{language.0 | upper}}</option>
{% endfor %}
</select>
</div>
</form>
</div>
{% endcomment %}

</div>
</div>
</nav>
<div class="navbar-item">|</div>

{% if request.user.is_authenticated %}

{% avatar user 50 class="img-circle img-responsive nav-avatar" id="user_avatar" %}

{% if user|in_committee_or_staff_groups %}
<a href="{% url 'committee-ngos' %}" class="navbar-item">
{% elif user.orgs.exists %}
<a href="{% url 'ngo-update' user.orgs.first.id %}" class="navbar-item">
{% else %}
<a href="{% url 'account-password-reset' %}" class="navbar-item">
{% endif %}
{{ user.email|truncatechars:24 }}
</a>

<a href="{% url 'account_logout' %}" class="navbar-item">{% trans "Logout" %}</a>

{% if user.is_impersonate %}
<a href="{% url 'impersonate-stop' %}" class="navbar-item" style="color:red; text-align:center;">
{% trans "STOP IMPERSONATING" %}<br>{{ request.user.email }}
</a>
{% endif %}

{% else %}

{# <a href="{% url 'account_login'%}" class="navbar-item"> #}
<a href="/allauth/amazon-cognito/login/?process=login" class="navbar-item">
{% trans "Login" %}
</a>
{% endif %}


{% comment %}
{% get_available_languages as LANGUAGES %}
{% get_current_language as LANGUAGE_CODE %}
<div class="navbar-item">
<form class="d-inline" action="{% url 'set_language' %}" method="post">
{% csrf_token %}
<input name="next" type="hidden" value="{{ redirect_to }}"/>
<div class="select">
<select id="language" name="language" onchange="this.form.submit()">
{% for language in LANGUAGES %}
<option {% if language.0 == LANGUAGE_CODE %} selected {% endif %} name="language"
value="{{ language.0 }}">{{ language.0 | upper }}</option>
{% endfor %}
</select>
</div>
</form>
</div>
{% endcomment %}

</div>
</div>
</nav>
</div>
</div>
</div>
19 changes: 19 additions & 0 deletions backend/static_extras/css/header.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
.subtle-link {
color: #000;

&:hover {
color: #165ccc;
}
}

.banner {
background-color: #f3f4f6;
}

.banner-content {
padding: 12px 0;
font-size: 14px;
font-weight: 500;
display: flex;
align-items: center;
}

0 comments on commit f92288f

Please sign in to comment.