[IMP] grammar and code review

content/developer/tutorials/website_theme.rst

@@ -27,16 +27,16 @@ You will also need some knowledge in:
    :alt: Airproof homepage.
    :align: center
 
-| In the :file:`README.md` of this `Airproof module
+| In the :file:`README.md` of the `Airproof module
   <https://github.com/odoo/tutorials/tree/{CURRENT_MAJOR_BRANCH}/website_airproof>`_, you can find
-  the various Airproof designs that you will replicate throughout the different exercises of this
+  the various Airproof designs that you will replicate throughout the different exercises in this
   tutorial.
 | You can also find all the code necessary for creating the Airproof website there. You should also
-  obtain this by the end of the tutorial. It is recommended to try to solve the exercices first
+  obtain this by the end of the tutorial. It is recommended to try solving the exercices first
   without looking at the solution!
 
 | **Don't go too fast!**
-| Follow the exercises step by step and you will reach the final design at the end of the exercises.
+| Follow the exercises step by step and you will reach the final design at the end of the tutorial.
 
 Read the documentation linked in the :doc:`How-to guide: Website theme <../howtos/website_themes>`.
 
@@ -50,4 +50,4 @@ Ready? Let's get started!
     website_theme/03_customisation_part1
     website_theme/04_customisation_part2
     website_theme/05_dynamic_templates
-    website_theme/06_going_live
+    website_theme/06_going_live

content/developer/tutorials/website_theme/01_theming.rst

@@ -2,7 +2,7 @@
 Chapter 1 - Theming
 ===================
 
-Now that you have Odoo installed and your server is running locally, it’s time to create your own
+Now that you have Odoo installed and your server is running locally, it's time to create your own
 theme module for your website.
 
 .. _tutorials/website_theme/theming/setup:
@@ -27,7 +27,7 @@ Now that we know everything is working properly, let's start building our module
 | Based on the following structure, start creating your module that will be used as a theme. This is
   where you are going to add your XML pages, SCSS, JS, …
 | Start with the basics : :file:`/data`, :file:`/img`, :file:`/scss`, :file:`/js`
-| Don’t forget to add the :file:`__init__.py` and :file:`__manifest__.py` files
+| Don't forget to add the :file:`__init__.py` and :file:`__manifest__.py` files.
 
 In your :file:`__manifest__.py` file, you can declare your module with the following information:
 
@@ -60,12 +60,12 @@ following elements:
 - Header & Footer : Use one of the default templates for the moment, we will create a custom header
   later.
 
-| Restart your script to already see the application of your changes.
+| Restart your script to immediately see the application of your changes.
 | Don't forget to add the path to your manifest in the script and set your module as the app
   to install.
 
-To ensure your changes are applied correctly, log in to your website and verify that your
-color palette contains your specified colors.
+To ensure your changes are applied correctly, log in to your website and check that your
+color palette includes your specified colors.
 
 .. tip::
    You will need to override more variables to replicate the Airproof design. Remember to add them
@@ -75,7 +75,7 @@ color palette contains your specified colors.
    The font families are from `Google fonts <https://fonts.google.com/>`_.
 
 .. seealso::
-   Documentation on :ref:`theming/module/variables`. And see all the `primary variables
+   Documentation on :ref:`theming/module/variables`, as well as a list of all `primary variables
    <{GITHUB_PATH}/addons/website/static/src/scss/primary_variables.scss>`_ available.
 
 .. spoiler:: Solutions
@@ -119,7 +119,7 @@ Based on the Airproof design, define the following elements:
 .. tip::
    - You will need to override more variables to replicate the Airproof design. Remember to add them
      throughout the creation of your website.
-   - Make it a habit to regularly check locally whether your changes have been successfully applied
+   - Make it a habit to regularly check locally that your changes have been successfully applied
      and have not caused any errors.
 
 .. seealso::

content/developer/tutorials/website_theme/02_build_website.rst

@@ -69,10 +69,10 @@ Add a media
 If you want the client to be able to reuse certain pictures that you are going to add on the
 website, they must be added to the image library.
 
-| To do the test, declare the drone image to add it in the library. You will find the
+| To do the test, declare the drone image to add it to the library. You will find the
   `drone picture here
   <https://github.com/odoo/tutorials/tree/{CURRENT_MAJOR_BRANCH}/website_airproof/static/src/img/content/drone-robin.png>`_.
-| Go to the :guilabel:`website builder`, double click on the :guilabel:`logo`, you will see the
+| Go to the :guilabel:`website builder`, double-click on the :guilabel:`logo`, and you will see the
   drone image in the library.
 
 .. seealso::
@@ -97,13 +97,15 @@ Add building blocks
 Now, let's get into the real work. Start adding content to the pages.
 
 In an Odoo website, we create the content of a page using building blocks. These can be compared to
-snippets editable by the user using the Website Builder. The standard main container of any snippet
+snippets editable by the user in the Website Builder. The standard main container for any snippet
 is a `section`.
 
 Based on the Airproof design, add the following elements to the homepage :
 
 - Create a section with the 3 boxes using the :guilabel:`Big boxes` building block.
 
+.. TODO: cannot be edited?
+
   - Ensure that it cannot be edited via the website builder.
   - Put an opacity filter on the background image of the 3 boxes.
 
@@ -122,7 +124,7 @@ and the `icons here
    To determine the code needed to create your building blocks :
 
    - | Create a test page via the website builder.
-     | Drag & drop the building block that interests you and give it the right design.
+     | Drag & drop the building block that interests you and apply the right design.
      | Use the code generated via :guilabel:`Editor HTML/SCSS` in the menu.
    - You can also find the original building block code in Odoo :
      :file:`odoo/addons/website/views/snippets/**.xml`.

content/developer/tutorials/website_theme/03_customisation_part1.rst

@@ -14,7 +14,7 @@ In :file:`theme.scss`, reproduce the following design elements:
 
 - Add a **green underline** on active nav items.
 - Modify the **arrow** for collapsible nav items.
-- Modify the **slider’s arrows** by adding a green background and changing their design.
+- Modify the **slider's arrows** by adding a green background and changing their design.
 
 You will find the various `media here
 <https://github.com/odoo/tutorials/tree/{CURRENT_MAJOR_BRANCH}/website_airproof/static/src/img/content/icons>`_.
@@ -25,7 +25,7 @@ You will find the various `media here
 .. image:: 03_customisation_part1/slider.png
 
 .. note::
-   | It’s always preferable to include all your SCSS rules in `#wrapwrap`. This ID is applied to the
+   | It's always preferable to include all your SCSS rules in `#wrapwrap`. This ID is applied to the
      div that groups the :guilabel:`header`, :guilabel:`footer`, and :guilabel:`main` content of all
      your pages.
    | So you will be sure that your rules will only have an impact on the website parts.
@@ -66,7 +66,7 @@ Use your JavaScript skills to implement this.
 Create a custom header
 ======================
 
-With variables, presets, and custom SCSS in place, it’s time to refine the layout and add key
+With variables, presets, and custom SCSS in place, it's time to refine the layout and add key
 cross-page elements, starting with the header.
 
 Based on the Airproof design, create a custom header with the following elements:
@@ -92,7 +92,7 @@ and `template illustration <https://github.com/odoo/tutorials/tree/16.0/website_
      :file:`website_templates.xml`, everything related to blog in :file:`website_blog_templates.xml`
      , to event in :file:`website_event_templates.xml`, etc.
    - | To modify the cart icon, you can use an `XPath`.
-     | And since this is linked to eCommerce, place it in a new file called
+     | Since this is linked to eCommerce, place it in a new file called
        :file:`website_sale_templates.xml`.
    - Don't forget to continue making as many modifications as you can through the :file:`Bootstrap
      variables` and :file:`primary variables` (font, colors, size...). You can use them to help you
@@ -214,7 +214,7 @@ cover section on your homepage.
 
    .. image:: 03_customisation_part1/custom-building-block.png
 
-#. Add an option available in the website builder to be able to choose blue or green for the bubble
+#. Add an option in the Website Builder to allow users to choose between a blue or green bubble 
    shadow.
 
    .. image:: 03_customisation_part1/custom-building-block-option.png
@@ -283,7 +283,7 @@ cover section on your homepage.
             </xpath>
          </template>
 
-      As well as the SCSS related to the bubbles in the
+      Additionally, the SCSS related to the bubbles in the
       `s_airproof_carousel/000.scss <https://github.com/odoo/tutorials/tree/16.0/website_airproof/static/src/snippets/s_airproof_carousel/000.scss>`_
       file.
 
@@ -293,13 +293,13 @@ cover section on your homepage.
 
 .. _tutorials/website_theme/customisation_part1/custom_dynamic_template:
 
-Create a template to add in dynamic snippets
-============================================
+Create a new dynamic snippet template
+=====================================
 
-| Useful building blocks are the dynamic snippets. These allow you to fetch information from the
-  backend and display it on the website according to certain filters.
+| Dynamic snippets are useful building blocks. These allow you to fetch information from the backend
+  and display it on the website according to certain filters.
 | There are already several layout templates for displaying dynamic snippets. However, none of the
-  existing templates fully match your client’s needs.
+  existing templates fully match your client's needs.
 
 Based on the Airproof design, create a custom template that you will apply to a product dynamic
 snippet on the homepage.
@@ -315,7 +315,7 @@ snippet on the homepage.
 
    .. image:: 03_customisation_part1/custom-template.png
 
-#. Then add a product dynamic snippet with the template you just created on the homepage.
+#. Then, add a product dynamic snippet with the template you just created to the homepage.
 
 .. tip::
    You can verify in the website builder that your template appears in the list of available
@@ -333,6 +333,6 @@ snippet on the homepage.
       file and `caroussel.scss <https://github.com/odoo/tutorials/tree/16.0/website_airproof/static/src/scss/snippets/caroussel.scss>`_
       file from our example module.
 
-   #. Apply to a product dynamic snippet on the homepage. You can find all the necessary
-      information in the `home.xml <https://github.com/odoo/tutorials/tree/16.0/website_airproof/data/pages/home.xml>`_
+   #. Apply the template to a product dynamic snippet on the homepage. You can find all the 
+      necessary information in the `home.xml <https://github.com/odoo/tutorials/tree/16.0/website_airproof/data/pages/home.xml>`_
       file from our example module.

content/developer/tutorials/website_theme/04_customisation_part2.rst

@@ -7,10 +7,10 @@ Chapter 4 - Customisation, Part II
 Create a custom background shape
 ================================
 
-Shapes are decorative elements that can be applied to backgrounds or images. These are SVG files
+Shapes are decorative elements that can be applied to backgrounds or images. They are SVG files
 that can be animated and customized with different colors.
 
-#. To better align with the website’s desired atmosphere, create a custom background shape that the
+#. To better align with the website's desired atmosphere, create a custom background shape that the
    client can reuse on different blocks.
 
    Create your custom shape using the following setup :
@@ -26,7 +26,7 @@ that can be animated and customized with different colors.
    | **Be careful,** there is a trick!
    | In your shape SVG file, you have to use the colors from the default Odoo palette.
    | Here, I want it to match my primary color 3 (`#CEF8A1`). Therefore, in the SVG file, you must
-     use color 3 from Odoo’s default palette (`#F6F6F6`).
+     use color 3 from Odoo's default palette (`#F6F6F6`).
 
 .. seealso::
    Documentation on :ref:`custom background shapes <website_themes/shapes/bg/custom>`.
@@ -44,7 +44,7 @@ that can be animated and customized with different colors.
    the homepage :
 
    - Ensure the shape is in the right position.
-   - Set its color to the theme’s light blue.
+   - Set its color to the theme's light blue.
 
 .. image:: 04_customisation_part2/shape-section.png
 
@@ -172,7 +172,7 @@ contact form must be properly configured.
    To determine the correct code for your form :
 
    - | Create a test page via the website builder.
-     | Drag & drop the building block that interests you and give it the right design.
+     | Drag & drop the building block that interests you and apply the right design.
      | Use the code generated through :guilabel:`Editor HTML/SCSS`.
    - You can also find the original building block code in Odoo :
      `odoo/addons/website/views/snippets/s_website_form.xml
@@ -185,7 +185,7 @@ contact form must be properly configured.
      - :ref:`website_themes/pages/theme_pages`,
      - :ref:`website_themes/navigation/menu`.
 
-   | And see documentation on :doc:`/developer/howtos/website_themes/forms`.
+   | Also, see documentation on :doc:`/developer/howtos/website_themes/forms`.
 
 .. spoiler:: Solutions
 

content/developer/tutorials/website_theme/05_dynamic_templates.rst

@@ -54,19 +54,20 @@ pages.
 
 Based on the Airproof design below, adapt a few elements including:
 
+.. TODO: list spacing different than the one above?
 - Remove the search bar (if not done with the previous exercise).
 - Remove the quantity selector, Terms and Conditions, and share icons.
 - Update the :guilabel:`Add to cart` button icon.
-- Insert a title above the product specifications. (This section appears only when the product has
-  one variant per attribute.)
+- Insert a title above the product specifications (this section appears only when the product has
+  one variant per attribute).
 - Design the appropriate layout for the carousel.
 - Add a title and apply the previously created product template to the `Alternative products`
-  section. (Ensure alternative products are assigned on the product in the backend for this section
-  to appear.)
+  section (ensure alternative products are assigned on the product in the backend for this section
+  to appear).
 - | Implement a new drop zone below product details, visible on all products.
   | As a use case, add an `Text-Image` building block using the website builder (e.g.: See product
     page screenshot with “*Six reasons to buy…*”).
-
+.. TODO: add screenshot directly here instead?
 .. tip::
    - Make your modifications using presets, XPath, and SCSS. Be sure to comment your code properly
      so you can find your way around.

content/developer/tutorials/website_theme/06_going_live.rst

@@ -14,19 +14,20 @@ is fully adapted to the Airproof design. Amazing!
 
 Now, the client wants the website translated into French.
 
-The easiest way to do it is:
+The easiest way to do this is:
 
 #. | Add French to the website in the settings.
    | Enable the language switcher in the header via presets.
-#. | Translate the content of the homepage carousel through the backend.
+   .. TODO: why translate the carousel in the backend?
+#. | Translate the content of the homepage carousel through the backend. 
    | But for the menu, make the translations through the frontend.
 #. | Export the French :file:`.po` file for your Airproof module.
    | Place it in the :file:`/i18n` translations folder.
-#. If you want you can make more translations directly by editing the :file:`.po` file. (using
-   Poedit software, your code editor, or another translation tool).
+#. If you would like, you can add more translations directly by editing the :file:`.po` file. (using
+   Poedit, your code editor, or another translation tool).
 
 .. note::
-   - Be careful when using Poedit it doesn’t handle tags with style well and it generates an
+   - Be careful when using Poedit, as it doesn't handle tags with styles well and generates an
      :file:`.mo` file.
    - To see the changes made directly via the :file:`.po` file, you will need to manually import the
      file.
@@ -54,7 +55,7 @@ Before that, test the import process on a new database.
    - Ensure the `base_import_module` is installed on the database before the module installation.
    - Verify all required applications are installed.
    - Skip the theme installation steps and start from scratch.
-   - Manually import translations after module installation, as they won’t apply automatically.
+   - Manually import translations after module installation, as they won't apply automatically.
 
 .. seealso::
    Documentation on how to :doc:`deploy a module <../../howtos/website_themes/going_live>` on an
@@ -68,17 +69,18 @@ You've successfully navigated through every stage, from setting up your developm
 launching a fully customized Odoo website theme.
 
 Throughout this journey, you've mastered:
+.. TODO: is it a good practice to add emojis in .rst file?
 
-| ✅ **Theme module creation** – setting up the structure, declaring Odoo and Bootstrap variables.
-| ✅ **Website building** – creating pages, adding media, and constructing dynamic building blocks.
-| ✅ **Advanced customization** – implementing custom SCSS, JavaScript, headers, footers, and unique
+| ✅ **Theme module creation** - setting up the structure, declaring Odoo and Bootstrap variables.
+| ✅ **Website building** - creating pages, adding media, and constructing dynamic building blocks.
+| ✅ **Advanced customization** - implementing custom SCSS, JavaScript, headers, footers, and unique
   design elements.
-| ✅ **Visual enhancements** – designing background shapes, gradients, and animations for an
+| ✅ **Visual enhancements** - designing background shapes, gradients, and animations for an
   engaging user experience.
-| ✅ **eCcommerce optimization** – adapting shop and product templates for a seamless shopping
+| ✅ **eCommerce optimization** - adapting shop and product templates for a seamless shopping
   experience.
-| ✅ **Final preparations** – managing translations and ensuring a smooth module import.
+| ✅ **Final preparations** - managing translations and ensuring a smooth module import.
 
-| With these skills, you’re now to design and develop professional, fully customized website themes.
-  Well done! 🎉
-| We can’t wait to see the amazing themes you’ll create in the future.
+| With these skills, you're now ready to design and develop professional, fully customized website
+  themes. Well done! 🎉
+| We can't wait to see the amazing themes you'll create in the future.