Add Whitepaper as iframe #11

.vuepress/components/Whitepaper.vue

@@ -0,0 +1 @@
+ 

.vuepress/theme/Layout.vue

@@ -19,7 +19,7 @@
 
     <v-content>
 
-      <v-alert type="error" value="true" id="in-development-alert" class="pt-5 pb-5 ma-0">
+      <v-alert type="error" value="true" id="in-development-alert" class="pt-4 pb-4 ma-0">
         <strong>This website is in beta.</strong> We are actively developing this website to showcase and teach about the LBRY protocol. All things may not work as expected!<br/>This website is open source and you can <a href="https://github.com/lbryio/lbry.tech" target="_blank">contribute to it on Github</a>.</v-alert>
       </v-alert>
 
@@ -45,6 +45,12 @@
 
       </template>
 
+      <template v-else-if="$page.path == '/whitepaper.html'">
+
+        <Content custom></Content>
+
+      </template>
+
       <template v-else>
 
         <v-container>

documentation.md

@@ -4,6 +4,8 @@ title: Documentation
 
 # Documentation lives here!
 
+[Whitepaper](/whitepaper.html)
+
 ## Second level header
 
 ## Another second level header

whitepaper.md

@@ -0,0 +1,27 @@
+<template>
+  <iframe src="https://lbry-whitepaper.herokuapp.com/" id="whitepaper" v-bind:style="{height: iframeHeight}"></iframe>
+</template>
+
+<script>
+
+export default {
+  data () {
+    return {
+      iframeHeight: '10vh'
+    }
+  },
+  mounted () {
+    this.iframeHeight = (window.innerHeight - document.getElementById('whitepaper').offsetTop - 10) + 'px';
+  },
+  name: 'Whitepaper'
+}
+</script>
+
+<style lang="scss">
+
+#whitepaper {
+  width: 100%;
+  border: 0;
+}
+
+</style>