Update column definitions in index table of section 14 to only have 3 columns.

Author: jslvtr

curriculum/section14/lectures/06_create_form_with_wtforms/README.md

@@ -11,11 +11,7 @@ excerpt: Learn how to use WTForms to create a form that you can easily render us
 draft: true
 ---
 
-- [ ] Set metadata above
-- [ ] Start writing!
-- [ ] Create `start` folder
-- [ ] Create `end` folder
-- [ ] Write TL;DR
+
 - [ ] Create per-file diff between `end` and `start` (use "Compare Folders")
 
 
@@ -32,9 +28,9 @@ pip install flask-wtf
 
 ### What is a CSRF token?
 
-Cross-Site Request Forgery (CSRF)[^csrf] is a web security vulnerability. Essentially it allows an attacker to go back to a previously-submitted form, and re-submit it.
+Cross-Site Request Forgery (CSRF)[^csrf] is a web security vulnerability. It allows an attacker to trick the browser into submitting a form that sends data to your application, without the user noticing it.
 
-By including a unique token generated by the Flask server in all requests, it prevents the possibility of a CSRF attack because the attacker can't just load the previously-visited page and re-submit the form. They must re-load the page first, for which they'll need to log-in.
+By including a unique token generated by the Flask server in all requests, it prevents the possibility of a CSRF attack because the attacker will need the server to generate the form, which comes with the whole HTML page and usually requires the user to log-in first.
 
 ## Create a WTForm Class
 Let's create a new file called `movie_library/forms.py`. There, we will create a Python class that represents our form.

curriculum/section14/lectures/07_render_wtform_with_jinja_macros/README.md

@@ -45,9 +45,7 @@ Note that I've made it be able to receive `GET` and `POST` requests. The templat
 
 For now, the `POST` request does nothing. Let's render our form first, and handle receiving the data in the next lecture.
 
-## Render the WTForms form in the template
-
-### How to render a WTForms field
+## How to render a WTForms field
 
 First things first, let's create our `templates/new_form.html` file. This is where our form will live:
 
@@ -109,7 +107,8 @@ A field consists of three parts:
 
 You can pass CSS classes to the label and field with the `class_` keyword argument.
 
-### Extract the rendering of a field into a macro
+## Extract the rendering of a field into a macro
+
 We have three fields in our form: `title`, `director`, and `year`. All three fields will be rendered in exactly the same way: with `field.label()`, `field()`, and a list of errors.
 
 Therefore this is a perfect candidate for a Jinja macro!
@@ -147,7 +146,7 @@ Now we can just import that from `templates/new_form.html` and use it three time
 {% endblock %}
 ```
 
-### Render all the form fields
+## Render all the form fields (including CSRF field)
 
 There are two more fields we need to include in our form: the CSRF protection field, and the submit button.
 

curriculum/section14/lectures/09_display_table_of_all_movies/README.md

@@ -47,10 +47,9 @@ First we'll start with creating the table and defining the columns and their siz
     {% if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
 
@@ -72,10 +71,9 @@ Next, we'll define the headers:
     {% if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
                 <th class="table__cell table__cell--header">Title</th>
@@ -101,10 +99,9 @@ And finally, with a `for` loop, put the data in the table:
     {% if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
                 <tr class="table__header">
@@ -141,10 +138,9 @@ Let's add some text in there to tell users to add a new movie when that happens:
     {% if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
                 <tr class="table__header">
@@ -181,10 +177,9 @@ Finally, we also need a way to add new movies even if there is already a movie i
     {% if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
                 <tr class="table__header">

curriculum/section14/lectures/09_display_table_of_all_movies/end/movie_library/templates/index.html

@@ -8,10 +8,9 @@
     {% if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
                 <tr class="table__header">

curriculum/section14/lectures/10_create_page_movie_details/end/movie_library/templates/index.html

@@ -9,10 +9,9 @@
     {%- if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
                 <tr class="table__header">

curriculum/section14/lectures/10_create_page_movie_details/start/movie_library/templates/index.html

@@ -9,10 +9,9 @@
     {%- if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
                 <tr class="table__header">

curriculum/section14/lectures/11_setting_movie_rating/README.md

@@ -79,7 +79,7 @@ Now we've got this, but the icons are not filled even if the rating of the movie
 
 To change the styling of some icons but not others we'll need to give them an additional CSS class, which I'll call `.star--filled`.
 
-### Jinja `loop` variables
+### CSS classes in the loop
 
 Since the Jinja loop goes from 0 to 4, what we need to do is:
 
@@ -148,7 +148,7 @@ So what we can do is, in each link, include a `rating` query string parameter eq
 Here's how to do that:
 
 ```jinja2
-% for i in range(5) %}
+{% for i in range(5) %}
     <a class="rating__link" href="{{ url_for('pages.rate_movie', _id=movie._id, rating=i+1) }}">
         {{ star("star " + ("star--filled" if movie.rating > i else "")) }}
     </a>

curriculum/section14/lectures/11_setting_movie_rating/end/movie_library/templates/index.html

@@ -9,10 +9,9 @@
     {%- if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
                 <tr class="table__header">

curriculum/section14/lectures/11_setting_movie_rating/start/movie_library/templates/index.html

@@ -9,10 +9,9 @@
     {%- if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
                 <tr class="table__header">

curriculum/section14/lectures/12_setting_movie_watched_date/end/movie_library/templates/index.html

@@ -9,10 +9,9 @@
     {%- if movies_data %}
         <table class="table">
             <colgroup>
-                <col style="width: 55%">
-                <col style="width: 20%">
+                <col style="width: 60%">
+                <col style="width: 25%">
                 <col style="width: 15%">
-                <col style="width: 10%">
             </colgroup>
             <thead>
                 <tr class="table__header">