embeded pandora mobile view

app/templates/item.html

@@ -0,0 +1,77 @@
+{% extends "base.html" %}
+{% block head %}
+<style>
+    body {
+        margin: 0;
+        padding: 0;
+        background: turquoise;
+    }
+    .add-comment {
+        width: 100%;
+        height: 30vh;
+        text-align: center;
+    }
+    .add-comment input {
+        width: 100px;
+    }
+    .add-comment textarea {
+        width: 80%;
+        display: block;
+        background: black;
+        color: white;
+        margin: auto;
+        padding: 0;
+        border: 0;
+    }
+    .add-comment button {
+        background: red;
+        border: 0;
+    }
+
+    .comment .text {
+        white-space: pre-line;
+    }
+
+</style>
+<link rel="stylesheet" href="/static/css/reset.css"></link>
+<link rel="stylesheet" href="/static/css/style.css"></link>
+{% endblock %}
+{% block main %}
+    <div class="content">
+    </div>
+    <div class="add-comment" style="display: none">
+        {% if request.user.is_anonymous %}
+        <input name="name" type="text" placeholder="your name"></input>
+        <input name="email" type="email" placeholder="your email"></input>
+        <br>
+        {% endif %}
+        {% csrf_token %}
+        <textarea name="text" placeholder="your comment"></textarea>
+        <button id="add-comment">Add comment</button>
+    </div>
+{% endblock %}
+{% block end %}
+<script>
+    var comments = {{ item.public_comments_json|safe }};
+</script>
+<script src="/static/js/utils.js"></script>
+<script src="/static/js/api.js"></script>
+<script src="/static/js/icons.js"></script>
+<script src="/static/js/VideoElement.js"></script>
+<script src="/static/js/VideoPlayer.js"></script>
+<script src="/static/js/documents.js"></script>
+<script src="/static/js/edits.js"></script>
+<script src="/static/js/item.js"></script>
+<script src="/static/js/render.js"></script>
+
+<script>
+    pandora.url = new URL('{{ item.url|escapejs }}');
+    pandora.comment = '{{ item.id | escapejs }}';
+    pandora.hostname = pandora.url.hostname
+    pandoraURL = `https://${pandora.hostname}`
+</script>
+<script src="/static/js/overwrite.js"></script>
+
+<script src="/static/js/main.js"></script>
+<script src="/static/js/comments.js"></script>
+{% endblock %}