Add iframe top menu

okfn · Oct 20, 2023 · a82d10d · a82d10d
1 parent 03168d2
commit a82d10d
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 0 deletions.
diff --git a/assets/scss/_colours.scss b/assets/scss/_colours.scss
@@ -6,3 +6,4 @@ $purple: #E077FF;
 $red: #FF80DB;
 $green: #AEFFEC;
 $orange: #FF6200;
+$dark-grey: #2D2D2D;
diff --git a/assets/scss/_ok-ribbon.scss b/assets/scss/_ok-ribbon.scss
@@ -0,0 +1,14 @@
+#ok-panel {
+    border-color: $dark-grey;
+}
+
+#ok-panel-wrapper {
+    float: right;
+}
+
+#ok-panel-wrapper:not([data-breakpoint*='px'])>.ok-ribbon {
+    margin-top: 0;
+    background-color: $dark-grey;
+    margin-bottom: 1.5em;
+    background-color: transparent;
+}
diff --git a/assets/scss/main.scss b/assets/scss/main.scss
@@ -1,5 +1,6 @@
 @import "colours";
 @import "type";
+@import 'ok-ribbon';
 @import "sizes";
 @import "mixins";
 @import "description_list";

diff --git a/templates/layout.html b/templates/layout.html
@@ -6,10 +6,24 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <link href="https://fonts.cdnfonts.com/css/hk-groteks" rel="stylesheet">
   <link rel="stylesheet" href="{{ '/css/style.css'|url }}">
+  <!-- okf ribbon -->
+  <link rel="stylesheet" href="https://a.okfn.org/html/oki/panel/assets/css/frontend.css"/>
   <link href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.53.0/mapbox-gl.css" rel="stylesheet" />
   <script defer data-domain="opendataday.org" src="https://plausible.io/js/plausible.js"></script>
 </head>
 <body class="{{ this._model }}">
+  <!-- OKF Panel -->
+  <div id="ok-panel" class="closed">
+    <div class="container">
+      <iframe src="https://a.okfn.org/html/oki/panel/panel.html" scrolling="no"></iframe>
+    </div>
+  </div>
+  <div id="ok-panel-wrapper">
+    <a class="white ok-ribbon" href="https://okfn.org/">
+      <img src="https://a.okfn.org/html/oki/panel/assets/images/oki-ribbon.png" alt="Open Knowledge">
+    </a>
+  </div>
+  <!-- End OKF Panel -->
 
   {% block body %}{% endblock %}
 
@@ -68,5 +82,6 @@
       });
     });
   </script>
+  <script src="https://a.okfn.org/html/oki/panel/assets/js/frontend.js" type="text/javascript"></script>
 </body>
 </html>