add black divider to project page

liqd · Jul 29, 2016 · d84d653 · d84d653
1 parent 7e998c9
commit d84d653
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 10 deletions.
diff --git a/euth/projects/templates/euth_projects/project_detail.html b/euth/projects/templates/euth_projects/project_detail.html
@@ -34,19 +34,37 @@ <h1>{{ view.project.name }}</h1>
 </nav>
 <div class="container">
     <div class="container-narrow">
-      <article id="panel-info" class="tab-panel">
+        <article id="panel-info" class="tab-panel">
         <h3>{% trans "info" %}</h3>
-
         {{ view.project.description }}
-
-
-      </article>
-      <article id="panel-participation" class="tab-panel">
+        </article>
+        <article id="panel-participation" class="tab-panel">
         {% block phase_content %}{% endblock %}
-      </article>
-      <article id="panel-offline" class="tab-panel">
-      </article>
-      {% include "euth_projects/includes/project_carousel.html" with projects=project.other_projects %}
+        </article>
+        <article id="panel-offline" class="tab-panel">
+        </article>
     </div>
 </div>
+{% if view.project.other_projects %}
+<div class="project-other-projects">
+    <div class="black-divider">
+        <div class="container">
+            <div class="container-narrow">
+                <div class="black-divider-text">
+                    <span>
+                        {% trans 'other projects from this organisation'%}
+                    </span>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="container">
+        <div class="container-narrow">
+            {% include "euth_projects/includes/project_carousel.html" with projects=view.project.other_projects %}
+        </div>
+    </div>
+</div>
+{% endif %}
+
+
 {% endblock %}
diff --git a/euth_wagtail/static/scss/components/_projects.scss b/euth_wagtail/static/scss/components/_projects.scss
@@ -132,3 +132,15 @@
 .size-1of2 {
     width: 50%;
 }
+
+.project-other-projects {
+
+    & .black-divider {
+        @include rem(margin, 224px 0px 10px 0px);
+
+        & .black-divider-text {
+            text-align: center;
+
+        }
+    }
+}