Merge pull request #13 from keitaroinc/search-image

Search image

ckanext/alisea/assets/css/alisea.css

@@ -119,6 +119,15 @@ a.tag:hover {
     background-color: #197EA3 !important;
 }
 
+.logo {
+    width: 100%;
+    max-width: 350px;
+}
+
+.logo img {
+    width: 100%;
+}
+
 .alisea-logo {
     width: 160px;
     height: 76px;
@@ -131,8 +140,26 @@ a.tag:hover {
     .alisea-logo {
         display: none;
     }
+
+    .hero-section-title {
+        max-width: none !important;
+        font-size: 2rem !important;
+    }
+
+    .map-conatiner {
+        width: 100% !important;
+    }
+
+    .title-container{
+        width: 100% !important;
+    }
+
+    .hero-section-description {
+        max-width: none !important;
+    }
 }
 
+
 .navbar-nav li a {
     font-weight: 700;
     font-size: 1rem !important;
@@ -147,3 +174,61 @@ a.tag:hover {
     padding: 20px;
     min-width: 160px;
 }
+
+.hero-section {
+    margin-bottom: 2rem;
+}
+
+.account {
+    display: flex;
+    align-items: center;
+    padding: 10px;
+}
+
+.account .form-group {
+    margin-bottom: 0;
+    max-width: 150px;
+    margin-right: 10px;
+}
+
+.account .form-group label {
+    display: none;
+}
+
+.module-narrow #dataset-map-container {
+    height: 100% !important;
+    min-height: 500px !important;
+}
+
+.hero-section-title {
+    font-size: 3rem;
+    max-width: 300px;
+    font-weight: 900 !important;
+    margin-bottom: 2rem;
+    color:#2D7C3D;
+}
+
+.hero-section-description {
+    font-size: 1.2rem;
+    font-weight: 600;
+    color: #2D7C3D;
+    max-width: 350px;
+}
+
+.account .list-unstyled li a {
+    color: #2D7C3D !important;
+}
+
+.account .list-unstyled li a:hover {
+    background-color: #2D7C3D !important;
+    color: white !important;
+}
+
+.account-masthead .account ul li {
+    border-color: darkgray;
+}
+
+.module-heading .action {
+    color: #ffff !important;
+    text-decoration: none !important;
+}

ckanext/alisea/templates/footer.html

@@ -1,5 +1,5 @@
 <footer class="site-footer pt-5">
-    <div class="col-xl-10 offset-xl-1">
+    <div class="col-xl-10 offset-xl-1 px-4">
       <div class="row mb-4">
         <div class="d-flex col-12 align-items-center text-white">
           <h1 class="fw-bold me-2 footer-main-title">ALiSEA</h1>
@@ -8,7 +8,7 @@ <h3 class="text-uppercase fw-medium footer-secondary-title">Knowledge hub</h3>
       </div>
       {% block footer_content %}
 
-      <div class="row mb-5 justify-content-between">
+      <div class="d-flex flex-wrap mb-4 justify-content-between px-2">
         {% include "/snippets/footer_left.html" %}
         {% include "/snippets/footer_right.html" %}
       </div>

ckanext/alisea/templates/page.html

@@ -18,7 +18,18 @@
   {# The content block allows you to replace the content of the page if needed #}
   {%- block content %}
     {% block maintag %}<div class="main">{% endblock %}
-      <div id="content" class="container">
+      <div id="content" class="container-fluid col-xl-10 offset-xl-1">
+        <div class="d-flex flex-wrap align-items-center mb-4 hero-section">
+          {% if request.path == "/dataset/" %}
+          <div class="col-md-4 col-sm-12 col-xs-12 title-container">
+            <h1 class="hero-section-title">Agroecology Library</h1>
+            <p class="hero-section-description">Our repository of literature on agroecology on Southeast Asia includes more than 750 documents.</p>
+          </div>
+          <div class="col-md-8 col-sm-12 map-conatiner">
+            {% snippet "spatial/snippets/spatial_query.html", default_extent= [[2.62, 85.21], [24.92, 113.00]] %}
+          </div>
+          {% endif %}
+        </div>
         {% block main_content %}
           {% block flash %}
             <div class="flash-messages">

ckanext/alisea/templates/snippets/language_selector.html

@@ -0,0 +1,16 @@
+{% set current_lang = request.environ.CKAN_LANG %}
+<form class="lang-select" action="{% url_for 'util.internal_redirect' %}" data-module="select-switch" method="POST">
+  {{ h.csrf_input() }} 
+  <div class="form-group">
+    <select id="field-lang-select" name="url" data-module="autocomplete" data-module-dropdown-class="lang-dropdown" data-module-container-class="lang-container">
+      {% for locale in h.get_available_locales() %}
+        <option value="{% url_for h.current_url(), locale=locale.short_name %}" {% if locale.short_name == current_lang %}selected="selected"{% endif %}>
+          {{ locale.display_name or locale.english_name }}
+        </option>
+      {% endfor %}
+    </select>
+  </div>
+  <button class="btn btn-default d-none " type="submit">{{ _('Go') }}</button>
+</form>
+
+