Browse Source

Chapter 11: Rich text blog posts with Flask-PageDown (11e)

T. Meissner 1 year ago
parent
commit
f7110f653e
5 changed files with 35 additions and 1 deletions
  1. 3
    0
      app/__init__.py
  2. 2
    1
      app/main/forms.py
  3. 24
    0
      app/static/styles.css
  4. 5
    0
      app/templates/index.html
  5. 1
    0
      requirements/common.txt

+ 3
- 0
app/__init__.py View File

@@ -4,6 +4,7 @@ from flask_mail import Mail
4 4
 from flask_moment import Moment
5 5
 from flask_sqlalchemy import SQLAlchemy
6 6
 from flask_login import LoginManager
7
+from flask_pagedown import PageDown
7 8
 from config import config
8 9
 
9 10
 
@@ -11,6 +12,7 @@ bootstrap = Bootstrap()
11 12
 mail = Mail()
12 13
 moment = Moment()
13 14
 db = SQLAlchemy()
15
+pagedown = PageDown()
14 16
 
15 17
 
16 18
 login_manager = LoginManager()
@@ -27,6 +29,7 @@ def create_app(config_name):
27 29
     moment.init_app(app)
28 30
     db.init_app(app)
29 31
     login_manager.init_app(app)
32
+    pagedown.init_app(app)
30 33
 
31 34
     from .main import main as main_blueprint
32 35
     app.register_blueprint(main_blueprint)

+ 2
- 1
app/main/forms.py View File

@@ -3,6 +3,7 @@ from wtforms import StringField, SubmitField, TextAreaField, BooleanField, \
3 3
     SelectField
4 4
 from wtforms.validators import DataRequired, Length, Email, Regexp
5 5
 from wtforms import ValidationError
6
+from flask_pagedown.fields import PageDownField
6 7
 from ..models import Role, User
7 8
 
8 9
 
@@ -51,5 +52,5 @@ class EditProfileAdminForm(FlaskForm):
51 52
 
52 53
 
53 54
 class PostForm(FlaskForm):
54
-    body = TextAreaField("What's on your mind?", validators=[DataRequired()])
55
+    body = PageDownField("What's on your mind?", validators=[DataRequired()])
55 56
     submit = SubmitField('Submit')

+ 24
- 0
app/static/styles.css View File

@@ -37,3 +37,27 @@ div.pagination {
37 37
     padding: 0px;
38 38
     margin: 0px;
39 39
 }
40
+div.flask-pagedown-preview {
41
+     margin: 10px 0px 10px 0px;
42
+     border: 1px solid #e0e0e0;
43
+     padding: 4px;
44
+ }
45
+ div.flask-pagedown-preview h1 {
46
+     font-size: 140%;
47
+ }
48
+ div.flask-pagedown-preview h2 {
49
+     font-size: 130%;
50
+ }
51
+ div.flask-pagedown-preview h3 {
52
+     font-size: 120%;
53
+ }
54
+ .post-body h1 {
55
+     font-size: 140%;
56
+ }
57
+ .post-body h2 {
58
+     font-size: 130%;
59
+ }
60
+ .post-body h3 {
61
+     font-size: 120%;
62
+ }
63
+ 

+ 5
- 0
app/templates/index.html View File

@@ -23,3 +23,8 @@
23 23
  </div>
24 24
  {% endif %}
25 25
 {% endblock %}
26
+
27
+{% block scripts %}
28
+{{ super() }}
29
+{{ pagedown.include_pagedown() }}
30
+{% endblock %}

+ 1
- 0
requirements/common.txt View File

@@ -8,6 +8,7 @@ Flask-Login==0.4.1
8 8
 Flask-Mail==0.9.1
9 9
 Flask-Migrate==2.2.1
10 10
 Flask-Moment==0.6.0
11
+Flask-PageDown==0.2.2
11 12
 Flask-SQLAlchemy==2.3.2
12 13
 Flask-WTF==0.14.2
13 14
 itsdangerous==0.24