:show-content:
:hide-page-toc:

=============
How-to guides
=============

.. toctree::
    :titlesonly:

    howtos/scss_tips
    howtos/website
    howtos/backend
    howtos/web_services
    howtos/company
    howtos/accounting_localization
    howtos/translations

.. raw:: html

   <div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 row-cols-xxl-4 g-4 mb-4">

       <a class="o_toctree_card col" href="howtos/scss_tips.html">
           <div class="card h-100">
               <div class="card-body pb-0">
                   <h4 class="card-title text-primary mb-1">Write lean easy-to-maintain CSS</h4>
                   <p class="card-text text-dark fw-normal">
                       Follow this guide to keep the technical debt of your CSS code under control.
                   </p>
               </div>
               <div class="card-footer border-0">
               </div>
           </div>
       </a>

       <!-- Small card with badge rounded-pill -->
       <a class="o_toctree_card col" href="howtos/website.html">
           <div class="card h-100">
               <div class="card-body pb-0">
                   <h4 class="card-title text-primary mb-1">Building a website</h4>
                   <p class="card-text text-dark fw-normal">
                       Build your first website modules with Odoo.
                   </p>
               </div>
               <div class="card-footer border-0">
                   <span class="badge rounded-pill bg-dark mt-auto mb-2">Beginner</span>
               </div>
           </div>
       </a>

       <a class="o_toctree_card col" href="howtos/web_services.html">
           <div class="card h-100 pb-0">
               <div class="card-body">
                   <h4 class="card-title text-primary mb-1">Web services</h4>
                   <p class="card-text text-dark fw-normal">
                       Learn more about Odoo's web services.
                   </p>
               </div>
               <div class="card-footer border-0"></div>
           </div>
       </a>

       <a class="o_toctree_card col" href="howtos/company.html">
           <div class="card h-100 pb-0">
               <div class="card-body">
                   <h4 class="card-title text-primary mb-1">Multi-company guidelines</h4>
                   <p class="card-text text-dark fw-normal">
                       Learn how to manage multiple companies and deal with the records-related
                       specificities of a multi-company environment.
                   </p>
               </div>
               <div class="card-footer border-0"></div>
           </div>
       </a>

       <a class="o_toctree_card col" href="howtos/accounting_localization.html">
           <div class="card h-100 pb-0">
               <div class="card-body">
                   <h4 class="card-title text-primary mb-1">Accounting localization</h4>
                   <p class="card-text text-dark fw-normal">
                       Learn how to build a localization module, create bank operation models and
                       dynamic reports.
                   </p>
               </div>
               <div class="card-footer border-0"></div>
           </div>
       </a>

       <a class="o_toctree_card col" href="howtos/translations.html">
           <div class="card h-100 pb-0">
               <div class="card-body">
                   <h4 class="card-title text-primary mb-1">Translating modules</h4>
                   <p class="card-text text-dark fw-normal">
                       Learn how to provide translation abilities to your module.
                   </p>
               </div>
               <div class="card-footer border-0"></div>
           </div>
       </a>

   </div>