From 4106b88993eb1db2651a639718076d787ce7d846 Mon Sep 17 00:00:00 2001
From: ahmishra <umasaryan@gmail.com>
Date: Sat, 3 Jul 2021 11:53:00 +0530
Subject: [PATCH] UI FIXES

---
 main/__pycache__/forms.cpython-37.pyc  | Bin 5266 -> 5337 bytes
 main/__pycache__/models.cpython-37.pyc | Bin 3417 -> 3343 bytes
 main/__pycache__/routes.cpython-37.pyc | Bin 9973 -> 9973 bytes
 main/forms.py                          |   3 +-
 main/models.py                         |   6 +--
 main/static/main.css                   |  10 +++++
 main/templates/new-post.html           |   4 +-
 main/templates/post-detail.html        |  14 +++++-
 main/templates/post-update.html        |   4 +-
 main/templates/posts.html              |  57 +++++++++++++++++++------
 10 files changed, 74 insertions(+), 24 deletions(-)

diff --git a/main/__pycache__/forms.cpython-37.pyc b/main/__pycache__/forms.cpython-37.pyc
index 8cdffe9d4215f76fd45ce031924730c752ebf0d9..cabeb1589e69a158ef3c3fdfdc21b1059f4bc0e9 100644
GIT binary patch
delta 322
zcmbQFc~g_uiI<m)0SKJF-A{P2k#`pdW5{GdCh5tKIaH)l*i$$%8B;iWnWDH-xl_2B
z8KZboxPuuqc_yoKwkF7hWR&J6<t1k3DEJqYWaj53<|t@*<|d}6Duf34Xx`#3$Vp62
z&B)J5NiC{Ub;~bONKMyM$S5f(D7MnqFUU+TF3r^|$jC3rFV;6THq$pYHPK{@;w(zd
z18RuRE}wjmvqX#s=r#^^7A7%9F-8_f9>yX=pg{6OLD9`|TvAMoxsxk-8pX|lVu?Up
z%mGy`!pOl?WWHIDx13SZ0w`7sk_7n^WRw)pAQ`42i_Hu9W-u|%+iWEm&d9iG@+6^F
w##@smgbi6OfeQO4`w2@jT29UozRe9Xz6fMYk>zAVVe!eSA{wkh0x|+Z02qr;1^@s6

delta 288
zcmcbqIZ2b(iI<m)0SJUu?k6nS$h(V!F>10Pll0`r94ZQ_tj!FmY$?pmjOk1%EWJ!o
zT&dhC?9Gf(JSiN(44Ryi6**hwL_#u3bCdECGjlXNa}(236+(l2G;gs4<QJFtY4T1M
z5LTXS#N{CZvV?=3g-MJN1d9xT+~kRZqMMg;Nii|zOg_NVC~gK6O90|x4j=(iE5gXZ
zRAja}g14Me(i|vO1CoRpB*n<WD8p1_zWD{;3?|08n;Qkg85vhjZWI)r{6?q<=!<w^
zLwO6Jjy{ks0U!Y~Qi@RoXuSl`U=E%li^=PSZ*zmJEdm)2<lkcxpS(sygH=#KMnDJv
Da|S$M

diff --git a/main/__pycache__/models.cpython-37.pyc b/main/__pycache__/models.cpython-37.pyc
index 0645ae693c8500de2682608abec16a614751b909..2f9d1c0ee032e42f565a5d9f96ad6744017c029e 100644
GIT binary patch
delta 138
zcmca9)i1^C#LLUY00dHB?kDhX<o(aVcxy5*XFp@l<hh&<;!G)Qy-ZPDsVrHnK+K)O
zn#z;Ko5C^q8>gZq=R(F5R-im{lu!y+3U>=blyC}9FoP!VWCN~JmM@G943l4TeP+y=
ne4pEk(R#8Lj~b)R<Uk%*J^`S09PBJi0*oSzB21H4@vH{`*;gVi

delta 212
zcmeB|x+%r$#LLUY00gO0_Y>+j^8V*wjGD~L+0WQFc`m1eBx?#s3TH2K6jv%s7Ap{Q
zr?95-WbvkOPX5BFD9N>uF@-gS4Ja>^!kxm?!Vo2#!W+z>$v0V#tJLiUGXq1FLq<tS
zL9vy-eoAU_W_n(6Mq+ZdUS4X6etCgza(-S(YF>$cX+chYVoI@oK~7?FYDRueN@|gA
zW^Q77s$M}}`sC$YpBW1#&*t`Gw3_^kTaD3rGB1y-h#1hx9PBJi0*oSzEQ}nCOpF}N
JlM{H>0|43;J23zN

diff --git a/main/__pycache__/routes.cpython-37.pyc b/main/__pycache__/routes.cpython-37.pyc
index d384e3fc38d068c69c22fabea7bb3f5139853d8b..a0ceb3c4d65bdc184bd7913db5759f35aefb1cd1 100644
GIT binary patch
delta 26
gcmezB`_-4riI<m)0SG>R+{hKj!sxO&lch%q0CHCd2LJ#7

delta 26
gcmezB`_-4riI<m)0SJ0^Hgd(WFs5wIWa&`?0A$Ao{r~^~

diff --git a/main/forms.py b/main/forms.py
index 5e89155..634b58b 100644
--- a/main/forms.py
+++ b/main/forms.py
@@ -87,7 +87,8 @@ class NewPostForm(FlaskForm):
 
     title = StringField('Title', validators=[DataRequired(), Length(3)])
     content = TextAreaField('Content', validators=[DataRequired(), Length(3)])
-    thumbnail = StringField('Thumbnail(Image URL)', validators=[DataRequired(), Length(3)])
+    thumbnail = StringField('Thumbnail Optional (Image URL)', render_kw={
+                            "placeholder": "For eg. https://picsum.photos/536/354"})
     submit = SubmitField('Post')
 
 
diff --git a/main/models.py b/main/models.py
index 8a3c9d6..e4bac57 100644
--- a/main/models.py
+++ b/main/models.py
@@ -99,11 +99,7 @@ class Post(db.Model):
 
     id = db.Column(db.Integer, primary_key=True)
     title = db.Column(db.String(100), nullable=False)
-    thumbnail = db.Column(
-        db.String(1000),
-        nullable=False,
-        default="https://designshack.net/wp-content/uploads/placeholder-image.png"
-    )
+    thumbnail = db.Column(db.String(500), nullable=True)
 
     date_posted = db.Column(db.DateTime, nullable=False, default=datetime.utcnow)
     content = db.Column(db.Text, nullable=False)
diff --git a/main/static/main.css b/main/static/main.css
index dedea35..09730d7 100644
--- a/main/static/main.css
+++ b/main/static/main.css
@@ -226,6 +226,16 @@ body {
 }
 
 
+/* Class to add elipsis to text */
+.elipsis {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	display: -webkit-box;
+	-webkit-line-clamp: 11;
+	-webkit-box-orient: vertical;
+}
+
+
 /* Bounce Animation */
 @keyframes bounce{
     from { transform: translate3d(0, 0, 0);}
diff --git a/main/templates/new-post.html b/main/templates/new-post.html
index 1a6fed7..61db299 100644
--- a/main/templates/new-post.html
+++ b/main/templates/new-post.html
@@ -15,7 +15,7 @@
 
             <div class="row">
 
-                <div class="col-7">
+                <div class="col-5">
                     <!-- TITLE -->
                     <div class="form-group">
                         {{ form.title.label(class="form-control-label") }}
@@ -33,7 +33,7 @@
                     </div>
                 </div>
 
-                <div class="col-3">
+                <div class="col-5">
                     <!-- THUMBNAIL -->
                     <div class="form-group">
                         {{ form.thumbnail.label(class="form-control-label") }}
diff --git a/main/templates/post-detail.html b/main/templates/post-detail.html
index 334dcfd..e0cce50 100644
--- a/main/templates/post-detail.html
+++ b/main/templates/post-detail.html
@@ -27,10 +27,20 @@
 
         <!-- Displaying the post's content -->
         <h2 style="font-weight: 700;">{{ post.title }}</h2>
-        <b>Posted By- <a href="{{ url_for('user_info', username=post.author.username) }}">{{ post.author.username }}</a></b>
+        <div class="card-body" style="margin: 0; padding: 0;">
+            <a href="" style="text-decoration: none; color: orangered; font-weight: bolder;">
+                <img src="{{ url_for('static', filename='profile_pics/' ~ post.author.profile_picture) }}" alt="DP" width="32"
+                height="32">&ensp;{{ post.author.username }}
+            </a>
+        </div>
+
+        <br>
 
-        <p>{{ post.content|markdown }}</p>
         <small class="text-muted">{{ post.date_posted.replace(microsecond = 0) }}</small>
+
+        <br>
+
+        <p>{{ post.content|markdown }}</p>
         
     </div>
 
diff --git a/main/templates/post-update.html b/main/templates/post-update.html
index 3b6fd48..120a215 100644
--- a/main/templates/post-update.html
+++ b/main/templates/post-update.html
@@ -15,7 +15,7 @@
 
             <div class="row">
 
-                <div class="col-7">
+                <div class="col-5">
                     <!-- TITLE -->
                     <div class="form-group">
                         {{ form.title.label(class="form-control-label") }}
@@ -33,7 +33,7 @@
                     </div>
                 </div>
 
-                <div class="col-3">
+                <div class="col-5">
                     <!-- THUMBNAIL -->
                     <div class="form-group">
                         {{ form.thumbnail.label(class="form-control-label") }}
diff --git a/main/templates/posts.html b/main/templates/posts.html
index 0512e8d..68e218a 100644
--- a/main/templates/posts.html
+++ b/main/templates/posts.html
@@ -5,7 +5,7 @@
 
 {% block content %}
 <div class="container">
-    <div class="row">
+    <div class="row no-gutters">
         <div class="text-center">
             <a href="{{ url_for('new_post') }}">
                 <button class="btn btn-primary btn-primary btn-lg rainbow-button">Post A New Blog</button>
@@ -18,21 +18,54 @@
         {% if posts.items != [] %}
             {% for i in posts.items %}
                 <!-- Displaying the posts if exists -->
-                <a href="{{ url_for('post_detail', primary_key=i.id) }}" class="col-4" style="text-decoration: none; color: white;">
-                    <div class="col-4">
-                        <div class="card cards" style="box-shadow: 1px 1px 30px black; border: none;">
-                            <img src="{{ i.thumbnail }}" alt="Image Support" style="border-radius: 25px; height: 18rem;">
-                            <div class="card-body">
-                                <h5 class="card-title" style="font-weight: 600;">
-                                    {{ i.title }}
-                                </h5>
-                                <h6 class="card-subtitle mb-2 text-muted">
-                                    Author: {{ i.author.username }} &emsp; Posted On: {{ i.date_posted.date() }}
-                                </h6>
+                {% if i.thumbnail %}
+                <a href="{{ url_for('post_detail', primary_key=i.id) }}" class="col-auto" style="text-decoration: none; color: white;">
+                    <div class="col-auto">
+                        <div class="card cards" style="box-shadow: 1px 1px 30px black; border: none; width: 612px; height: 18rem;">
+                            <div class="card-body" style="margin: 0; padding: 0;">
+                                <img src="{{ url_for('static', filename='profile_pics/' ~ i.author.profile_picture) }}" alt="DP" width="32"
+                                    height="32">&ensp;{{ i.author.username }}
                             </div>
+
+                            <br>
+
+                            <span class="text-muted" style="margin-bottom: 10px;">Posted On: {{ i.date_posted.date() }}</span>
+                            <img src="{{ i.thumbnail }}" alt="Image Support" style="border-radius: 25px;">
+
+                            <br>
+
+                            <h5 class="card-title" style="font-weight: 600;">
+                                {{ i.title }}
+                            </h5>
+                        </div>
+                    </div>
+                </a>
+                {% else %}
+                <a href="{{ url_for('post_detail', primary_key=i.id) }}" class="col-auto" style="text-decoration: none; color: white;">
+                    <div class="col-auto">
+                        <div class="card cards" style="box-shadow: 1px 1px 30px black; border: none; width: 612px; height: 18rem;">
+                            <div class="card-body" style="margin: 0; padding: 0;">
+                                <img src="{{ url_for('static', filename='profile_pics/' ~ i.author.profile_picture) }}" alt="DP"
+                                    width="32" height="32">&ensp;{{ i.author.username }}
+                            </div>
+                
+                            <br>
+                
+                            <span class="text-muted" style="margin-bottom: 10px;">Posted On: {{ i.date_posted.date() }}</span>
+                
+                            <br>
+                
+                            <h5 class="card-title" style="font-weight: 600;">
+                                {{ i.title }}
+                            </h5>
+
+                            <p class="elipsis" style="height: 17rem;">
+                                {{ i.content }}
+                            </p>
                         </div>
                     </div>
                 </a>
+                {% endif %}
             {% endfor %}
         {% else %}
             <!-- Messaging the user that no posts exists -->