index.rst: Display header according to logo.html

logo.html: Display header according to screen width Now bear-header is rendered according to screen-width. Closes coala/landing-frontend#299
coala · Jan 28, 2019 · 35c9aa2 · 35c9aa2
1 parent a247a76
commit 35c9aa2
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 3 deletions.
diff --git a/_static/logo.html b/_static/logo.html
@@ -0,0 +1,34 @@
+<meta charset="UTF-8"> 
+<style>
+  .coala-logo-doc {
+    width: 632.5px; 
+    height: 187.5px;
+}
+
+@media only screen and (max-device-width: 632px) {
+      .coala-logo-doc-header {
+        display: none;
+      }
+      .coala-logo-doc-low {
+        display: block;
+      }
+    }
+
+ @media only screen and (min-device-width: 633px) {
+  .coala-logo-doc-header {
+        display: block;
+    }
+    .coala-logo-doc-low {
+      display: none;
+      height: auto;
+    }
+  }
+</style>
+<body>
+    <div class="coala-logo-doc-header">
+      <img width="632.5px" height="187.5px" src="_static/images/coala-header.png">
+    </div>
+    <div class="coala-logo-doc-low">
+      <img width="187.5px" height="187.5px" src="_static/images/coala_logo.svg">
+  </div>
+</body>
diff --git a/index.rst b/index.rst
@@ -46,9 +46,8 @@ Welcome to the coala documentation!
 
 You might also want to look at `our website <http://coala.io/>`_.
 
-.. image:: _static/images/coala-header.png
-   :scale: 50
-   :align: center
+.. raw:: html
+   :file: _static/logo.html
 
 coala: Language Independent Code Analysis
 -----------------------------------------