blob: 4bffbd1f2755be47b49d975850dfd781fd7b7b26 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
|
{% extends "shared/core/base.html" %}
{% load static %}
{% load tz %}
{% block title %}
<title>{{ post.title }}</title>
{% endblock title %}
{% block head %}
<link rel="stylesheet" href="{% static 'css/core/post_list.css' %}">
<link rel="stylesheet" href="{% static 'css/blog/weblog.css' %}">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css">
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js" onload="renderMath()"></script>
{% endblock head %}
{% block content %}
<div class="weblog-container">
<div class="weblog-title-area">
<h1>
{{ post.title }}
</h1>
<div class="weblog-details">
<div class="author-info">
{% with post.author.userprofile_set.first as authorprofile %}
<img src="{% static 'images/avatars/' %}{{ authorprofile.avatar_url }}.gif" class="post-profile-image" alt="{{ post.author.first_name }}'s Avatar">
{% endwith %}
<a href="#"> {{ post.author.first_name }} {{ post.author.last_name }}</a>
<span>{% if request.LANGUAGE_CODE == 'ja' %}投稿カテゴリー：{% else %}posted in{% endif %}</span>
<a href="#{{ post.category.slug }}">{{ post.category.name }}</a>
<span>{% if request.LANGUAGE_CODE == 'ja' %}投稿日：{% else %}on{% endif %}</span>
<span style="margin-left: 4px;">{% localtime on %}{{ post.date | date:"M d, Y" }}{% endlocaltime %}</span>
</div>
<div class="post-info">
<span>{% if request.LANGUAGE_CODE == 'ja' %}アクセス数：{% else %}Views: {% endif %}{{ post.views }}</span>
<span> | </span>
<span>{% if request.LANGUAGE_CODE == 'ja' %}コメント数：{% else %}Comments: {% endif %}{{ post.comments.all|length }}</span>
</div>
</div>
</div>
<div class="weblog-content">
{{ post.first_paragraph | safe }}
</div>
<div class="weblog-image">
<img src="{{ post.image_url }}" alt="{{ post.title }}">
</div>
<div class="weblog-content" id="weblog-body-content">
{{ post.body | safe }}
</div>
<div class="post-actions">
<div class="post-tags">
{% if request.LANGUAGE_CODE == 'ja' %}タグ: {% else %}Tagged with: {% endif %}
{% for tag in post.tags.all %}
<a class="post-tag" href="#{{ tag.slug }}">{{ tag.name }}</a>
{% endfor %}
</div>
</div>
<div class="comments-section" id="comments">
<h2>{% if request.LANGUAGE_CODE == 'ja' %}コメント{% else %}Comments{% endif %}</h2>
{% for comment in post.comments.all %}
{% if not comment.parent %}
{% include 'partials/_comment.html' with comment=comment %}
{% endif %}
{% endfor %}
{% if post.comments.all|length == 0 %}
<p>{% if request.LANGUAGE_CODE == 'ja' %}コメントはありません。{% else %}No comments yet.{% endif %}</p>
{% endif %}
</div>
</div>
{% endblock content %}
{% block scripts %}
<script>
document.addEventListener('DOMContentLoaded', function() {
const content = document.getElementById('weblog-body-content');
const floatLeftImages = content.querySelectorAll('img:nth-of-type(odd)');
floatLeftImages.forEach(img => {
let currentNode = img.nextElementSibling;
let charCount = 0;
while (currentNode && charCount < 512) {
if (currentNode.tagName === 'UL') {
const wrapper = document.createElement('div');
wrapper.style.display = 'inline-block';
wrapper.style.maxWidth = '418px';
currentNode.parentNode.insertBefore(wrapper, currentNode);
wrapper.appendChild(currentNode);
break;
}
charCount += (currentNode.textContent || '').length;
currentNode = currentNode.nextElementSibling;
}
});
});
function renderMath() {
renderMathInElement(document.querySelector('.weblog-content'), {
delimiters: [
{left: "$", right: "$", display: false},
{left: "$$", right: "$$", display: true}
],
throwOnError: false,
output: 'html'
});
}
function showReplyForm(commentId) {
document.getElementById(`reply-form-${commentId}`).style.display = 'block';
}
function hideReplyForm(commentId) {
document.getElementById(`reply-form-${commentId}`).style.display = 'none';
}
</script>
{% endblock scripts %}
|
