Merge pull request #67 from SciCatProject/add-dectris

Add Dectris Cloud

Author: nitrosx

_config.yml

@@ -105,6 +105,12 @@ facilities:
         email: [email protected]
 
 
+partners:
+  - name: DECTRIS CLOUD
+    image: /assets/images/partners/dectris_cloud.svg
+    url: https://www.dectris.cloud/
+
+
 team:
   leaders:
     - name: Max Novelli
@@ -128,7 +134,7 @@ team:
       role: ScicatLive Leader
       url: https://github.com/minottic
     - name: Despina Adamopoulou 
-      company: EMPA Material Science and Technology
+      company: EMPA Materials Science and Technology
       role: Website Leader
       url: https://github.com/despadam
     - name: Open Position

_includes/nav.html

@@ -4,6 +4,7 @@
     mission: "nav-link-mission",
     news: "nav-link-news",
     facilities: "nav-link-facilities",
+    partners: "nav-link-partners",
     team: "nav-link-team",
     repositories: "nav-link-repositories",
     documentation: "nav-link-documentation",
@@ -18,11 +19,13 @@
     }
   }
 
-  // Given a specific element Id, check if the element is currenty visible on the screen
+  // Given a specific element Id, check if more than 50% of the element is currently visible on the screen
   function isElementVisible(elemId) {
     let elm = document.getElementById(elemId).getBoundingClientRect();
     let viewHeight = Math.max(document.documentElement.clientHeight, window.innerHeight);
-    return !(elm.bottom < 0 || elm.top - viewHeight >= 0);
+    let elementHeight = elm.height || (elm.bottom - elm.top);
+    let visibleHeight = Math.min(elm.bottom, viewHeight) - Math.max(elm.top, 0);
+    return visibleHeight > elementHeight / 2;
   }
 
   /*
@@ -85,6 +88,9 @@
     </li>
     <li class="nav-item mx-lg-3">
      <a class="page-scroll nav-link" id="nav-link-facilities" href="{{'#facilities' | relative_url }}" onclick="onClick(event);">Facilities</a>
+    </li>
+      <li class="nav-item mx-lg-3">
+     <a class="page-scroll nav-link" id="nav-link-partners" href="{{'#partners' | relative_url }}" onclick="onClick(event);">Industry Partners</a>
     </li>
     <li class="nav-item mx-lg-3">
      <a class="page-scroll nav-link" id="nav-link-team" href="{{'#team' | relative_url }}" onclick="onClick(event);">Team</a>

_includes/partners.html

@@ -0,0 +1,14 @@
+<section id="partners" class="partners text-center bg-light">
+  <div class="container mb-3">
+    <h1 class="mt-5 mb-5">Industry Partners</h1>
+    <div class="row justify-content-center">
+      {% for partner in site.partners %}
+        <div class="partner col-lg-4 card">
+          <a href="{{ partner.url }}" target="_blank">
+            <img class="partner-logo" src="{{ partner.image }}" alt="{{ partner.name }}">
+          </a>
+        </div>
+      {% endfor %}
+    </div>
+  </div>
+</section>

_includes/team.html

@@ -10,6 +10,10 @@ <h1 class="mt-5 mb-5">Team</h1>
    </div>
    {% endfor %}
   </div>
+  <aside class="secondary-breaker">
+    <div class="container text-center">
+    </div>
+  </aside>
   <h2 class="mt-5 mb-4">Contributors</h2>
   <div class="row contributors">
     <div id="loading" style="display: none;">

_layouts/home.html

@@ -19,6 +19,8 @@
   {% include release.html %}
   {% include facilities.html %}
   {% include breaker.html %}
+  {% include partners.html %}
+  {% include breaker.html %}
   {% include team.html %}
   {% include breaker.html %}
   {% include repositories.html %}

_sass/base.scss

@@ -67,7 +67,13 @@ div.container {
 .section-breaker {
   background-color: #041526;
   opacity: 0.9;
-  height: 0.3rem !important;
+  height: 0.2rem !important;
+}
+
+.secondary-breaker {
+  background-color: #0415263b;
+  opacity: 0.9;
+  height: 0.1rem !important;
 }
 
 .show-all-button {
@@ -107,13 +113,13 @@ div.container {
   .navbar-menu {
     padding-left: 120px;
     padding-right: 120px;
-  }
 
-  @media (max-width: 1300px) {
-    .navbar-menu {
+    @media (max-width: 1360px) {
       padding: 5px 20px;
     }
-  
+  }
+
+  @media (max-width: 1360px) {
     li {
       text-align: center;
     }
@@ -281,6 +287,17 @@ header.masthead:before {
   }
 }
 
+// ========= Industry Partners =========
+
+.partner {
+  width: 400px;
+  min-height: 180px;
+
+  .partner-logo {
+    height: 150px;
+  }
+}
+
 // ========= Team =========
 
 .team {