avator in story page

static/css/ordinary.css

@@ -164,3 +164,15 @@ a:focus, .btn-link:focus {
   margin: 10px 0 0;
   float: bottom;
 }
+
+.story-box h1 {
+  margin: -8px -5px 20px;
+  text-align: center;
+}
+
+.story-box img {
+  width: 80%;
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}

templates/story.html

@@ -36,10 +36,12 @@
     </div>
 
     <div class="part1 col-md-6">
-      <div class="qbox part-box">
-        <h1 style="margin: -8px -5px 20px">{{story.title}}</h1>
+      <div class="story-box qbox part-box">
+        <h1>{{story.title}}</h1>
+        <p class="story-text" title="{{paragraph_part[0].author}}, {{paragraph_part[0].create_at}}, {{paragraph_part[0].like_num}}">{{paragraph_part[0].text}}</p>
+        <img src="{{story.avatar}}" style="width: 80%">
         <hr>
-        {% for p in paragraph_part %}
+        {% for p in paragraph_part[1:] %}
           <p class="story-text" title="{{p.author}}, {{p.create_at}}, {{p.like_num}}">{{p.text}}</p>
         {% endfor %}
       </div>