Skip to content

Commit

Permalink
Merge pull request #6338 from OCHA-DAP/feature/HDX-9839-signals-landi…
Browse files Browse the repository at this point in the history 
…ng-page

HDX-9839 update texts & embedded form, move sections, add hero image
  • Loading branch information
@danmihaila
danmihaila authored Jun 3, 2024
2 parents 4051dd1 + 02ec9f1 commit 76fe7e8
Show file tree
Hide file tree
Showing 6 changed files with 47 additions and 38 deletions.
3 changes: 3 additions & 0 deletions ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/bem.blocks/hero.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,9 @@
font-size: 20px;
line-height: 28px;
}
.bem-hero__image {
max-height: 50px;
}
.bem-hero__sections {
color: #000;
font-weight: 400;
Expand Down
Binary file added ...anext/hdx_theme/hdx-styles/src/common/images/landing_pages/logo_hdx_signals.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions ckanext-hdx_theme/ckanext/hdx_theme/hdx-styles/src/common/less/bem.blocks/hero.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,10 @@
line-height: 28px;
}

&__image {
max-height: 50px;
}

&__sections {
color: @black-color;
font-weight: 400;
Expand Down
19 changes: 9 additions & 10 deletions ckanext-hdx_theme/ckanext/hdx_theme/helpers/ui_constants/landing_pages/signals.py
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,12 @@
CONSTANTS = {
'HERO_SECTION_TITLE': '''HDX Signals monitors key datasets and generates automated emails when significant, negative changes are detected''',
'HERO_SECTION_DESCRIPTION': '''HDX Signals is a new product. We are seeking feedback. Please contact us at <a href="{0}" title="Contact us">[email protected]</a>''',
'HERO_SECTION_LABEL': '''HDX Signals''',
'HERO_SECTION_TITLE': '''A new product that monitors key datasets and generates automated emails when significant, negative changes are detected''',
'HERO_SECTION_DESCRIPTION': '''We are seeking feedback. Please contact us at <a href="{0}" title="Contact us">[email protected]</a>''',

'DATA_COVERAGE_SECTION_TITLE': '''Data Coverage''',
'DATA_COVERAGE_SECTION_DESCRIPTION': '''Datasets monitored by HDX signals at the moment are as follows:''',

'SIGNUP_SECTION_TITLE': '''Sign up''',
'SIGNUP_SECTION_DESCRIPTION': '''Sign up below to receive HDX Signals emails. You must select specific datasets, plus regions and/or HRP countries, to receive content that you are interested in.''',
'SIGNUP_SECTION_DESCRIPTION': '''Sign up below to receive HDX Signals emails. To receive the content you are interested in, please make sure you have selected AT LEAST ONE dataset and region or priority humanitarian location from the options below.''',

'RESOURCES_SECTION_TITLE': '''Resources''',
'RESOURCES_SECTION_DESCRIPTION': '''For more information about the datasets monitored by HDX signals as well as information for developers see the following:''',
Expand All @@ -19,9 +18,9 @@
'RESOURCES_CARD_BUTTON_LINK_MAP': '''https://baripembo.github.io/viz-hdx-signals/''',

'RESOURCES_CARD_TITLE_DATASET': '''Download HDX Signals dataset on HDX''',
'RESOURCES_CARD_TEXT_DATASET': '''Preview or download the full HDX Signals dataset''',
'RESOURCES_CARD_TEXT_DATASET': '''Explore the full HDX Signals dataset''',
'RESOURCES_CARD_BUTTON_DATASET': '''Learn more''',
'RESOURCES_CARD_BUTTON_LINK_DATASET': '''#''',
'RESOURCES_CARD_BUTTON_LINK_DATASET': '''https://data.humdata.org/dataset/hdx-signals''',

'RESOURCES_CARD_TITLE_METHODOLOGY': '''Methodology''',
'RESOURCES_CARD_TEXT_METHODOLOGY': '''Read the HDX Signals methodology''',
Expand Down Expand Up @@ -50,7 +49,7 @@
"link": "https://data.humdata.org/organization/acled"
},
{
"title": "Food security",
"title": "Food insecurity",
"organization": "the Integrated Food Security Phase Classification (IPC)",
"link": "https://data.humdata.org/dataset/global-acute-food-insecurity-country-data"
},
Expand All @@ -60,15 +59,15 @@
"link": "https://data.humdata.org/organization/international-displacement-monitoring-centre-idmc"
},
{
"title": "Market monitor",
"title": "Market monitoring",
"organization": "World Food Programme (WFP)",
"link": "https://data.humdata.org/organization/wfp"
"link": "https://data.humdata.org/datasets/global-market-monitor"
},
]

SECTIONS_CONSTANTS = [
{'name': 'Data Coverage', 'url': '#data-coverage'},
{'name': 'Signup', 'url': '#signup'},
{'name': 'Data Coverage', 'url': '#data-coverage'},
{'name': 'Signals map', 'url': 'https://baripembo.github.io/viz-hdx-signals/'},
{'name': 'Resources', 'url': '#resources'},
{'name': 'FAQ', 'url': '#faq'},
Expand Down
3 changes: 3 additions & 0 deletions ckanext-hdx_theme/ckanext/hdx_theme/templates/bem.blocks/hero.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,9 @@
{% if label %}
<p class="bem-hero__label text-uppercase mb-3">{{ label }}</p>
{% endif %}
{% if image %}
<img src="{{ image }}" class="img-fluid bem-hero__image mb-3" alt="hero image">
{% endif %}
<h1 class="bem-hero__title">{{ title }}</h1>
<h2 class="bem-hero__text py-4">{{ text|safe }}</h2>
{% if sections %}
Expand Down
56 changes: 28 additions & 28 deletions ckanext-hdx_theme/ckanext/hdx_theme/templates/landing_pages/signals.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,26 +9,10 @@
{% endblock %}

{% block content %}
{{ h.snippet('bem.blocks/hero.html', title=CONST.HERO_SECTION_TITLE, text=CONST.HERO_SECTION_DESCRIPTION.format('mailto:[email protected]'), label=CONST.HERO_SECTION_LABEL, sections=sections, click_stopper_link_type='signals jump nav', spacing_class="mb-5") }}
{{ h.snippet('bem.blocks/hero.html', title=CONST.HERO_SECTION_TITLE, text=CONST.HERO_SECTION_DESCRIPTION.format('mailto:[email protected]'), image='/images/landing_pages/logo_hdx_signals.png', sections=sections, click_stopper_link_type='signals jump nav', spacing_class="mb-5") }}

<div class="container">

<div class="row" id="data-coverage">
<div class="col-12 mx-auto my-5">
<div class="text-center mb-4">
{{ h.snippet('bem.blocks/heading.html', title=CONST.DATA_COVERAGE_SECTION_TITLE, heading_type=3, spacing_class="mb-1") }}
{{ h.snippet('bem.blocks/paragraph.html', text=CONST.DATA_COVERAGE_SECTION_DESCRIPTION, paragraph_classes=["paragraph__text_font-size-medium", "mt-4"]) }}
</div>
<div class="row">
{% for card in data_coverage %}
<div class="col-6 col-sm-4 mb-3">
{{ h.snippet('bem.blocks/card.html', title=card.title, text=card.organization, button='Learn more', click_stopper_link_type='signals data coverage', click_stopper_link_label=card.title, link=card.link, card_classes=["bem-card_type-slim"]) }}
</div>
{% endfor %}
</div>
</div>
</div>

<div class="row" id="signup">
<div class="col-12 mx-auto my-5">
<div class="text-center mb-4">
Expand Down Expand Up @@ -80,14 +64,14 @@
<li class="form-check">
<input type="checkbox" name="group[4389][128]" class="form-check-input"
id="mce-group[4389]-4389-0" value="">
<label class="form-check-label" for="mce-group[4389]-4389-0">Internal
displacement, conflict - IDMC</label>
<label class="form-check-label" for="mce-group[4389]-4389-0">Conflict-driven
displacement - IDMC</label>
</li>
<li class="form-check">
<input type="checkbox" name="group[4389][256]" class="form-check-input"
id="mce-group[4389]-4389-1" value="">
<label class="form-check-label" for="mce-group[4389]-4389-1">Internal
displacement, disaster - IDMC</label>
<label class="form-check-label" for="mce-group[4389]-4389-1">Disaster-driven
displacement - IDMC</label>
</li>
<li class="form-check">
<input type="checkbox" name="group[4389][1024]" class="form-check-input"
Expand Down Expand Up @@ -123,7 +107,7 @@
<li class="form-check">
<input type="checkbox" name="group[4397][16384]" class="form-check-input"
id="mce-group[4397]-4397-0" value="">
<label class="form-check-label" for="mce-group[4397]-4397-0">All countries in the
<label class="form-check-label" for="mce-group[4397]-4397-0">All locations in the
region</label>
</li>
<li class="form-check">
Expand All @@ -146,7 +130,7 @@
<li class="form-check">
<input type="checkbox" name="group[4405][8388608]" class="form-check-input"
id="mce-group[4405]-4405-0" value="">
<label class="form-check-label" for="mce-group[4405]-4405-0">All countries in the
<label class="form-check-label" for="mce-group[4405]-4405-0">All locations in the
region</label>
</li>
<li class="form-check">
Expand All @@ -164,7 +148,7 @@
<li class="form-check">
<input type="checkbox" name="group[4417][8589934592]" class="form-check-input"
id="mce-group[4417]-4417-0" value="">
<label class="form-check-label" for="mce-group[4417]-4417-0">All countries in the
<label class="form-check-label" for="mce-group[4417]-4417-0">All locations in the
region</label>
</li>
<li class="form-check">
Expand Down Expand Up @@ -208,7 +192,7 @@
<li class="form-check">
<input type="checkbox" name="group[4409][33554432]" class="form-check-input"
id="mce-group[4409]-4409-0" value="">
<label class="form-check-label" for="mce-group[4409]-4409-0">All countries in the
<label class="form-check-label" for="mce-group[4409]-4409-0">All locations in the
region</label>
</li>
<li class="form-check">
Expand Down Expand Up @@ -238,7 +222,7 @@
<li class="form-check">
<input type="checkbox" name="group[4401][65536]" class="form-check-input"
id="mce-group[4401]-4401-0" value="">
<label class="form-check-label" for="mce-group[4401]-4401-0">All countries in the
<label class="form-check-label" for="mce-group[4401]-4401-0">All locations in the
region</label>
</li>
<li class="form-check">
Expand Down Expand Up @@ -276,7 +260,7 @@
<li class="form-check">
<input type="checkbox" name="group[4421][549755813888]" class="form-check-input"
id="mce-group[4421]-4421-0" value="">
<label class="form-check-label" for="mce-group[4421]-4421-0">All countries in the
<label class="form-check-label" for="mce-group[4421]-4421-0">All locations in the
region</label>
</li>
<li class="form-check">
Expand Down Expand Up @@ -331,7 +315,7 @@
<li class="form-check">
<input type="checkbox" name="group[4425][16]" class="form-check-input"
id="mce-group[4425]-4425-0" value="">
<label class="form-check-label" for="mce-group[4425]-4425-0">All countries in the
<label class="form-check-label" for="mce-group[4425]-4425-0">All locations in the
region</label>
</li>
</ul>
Expand Down Expand Up @@ -364,6 +348,22 @@
</div>
</div>

<div class="row" id="data-coverage">
<div class="col-12 mx-auto my-5">
<div class="text-center mb-4">
{{ h.snippet('bem.blocks/heading.html', title=CONST.DATA_COVERAGE_SECTION_TITLE, heading_type=3, spacing_class="mb-1") }}
{{ h.snippet('bem.blocks/paragraph.html', text=CONST.DATA_COVERAGE_SECTION_DESCRIPTION, paragraph_classes=["paragraph__text_font-size-medium", "mt-4"]) }}
</div>
<div class="row">
{% for card in data_coverage %}
<div class="col-6 col-sm-4 mb-3">
{{ h.snippet('bem.blocks/card.html', title=card.title, text=card.organization, button='Learn more', click_stopper_link_type='signals data coverage', click_stopper_link_label=card.title, link=card.link, card_classes=["bem-card_type-slim"]) }}
</div>
{% endfor %}
</div>
</div>
</div>

<div class="row" id="resources">
<div class="col-12 mx-auto my-5">
<div class="text-center">
Expand Down

0 comments on commit 76fe7e8

Please sign in to comment.