Bug 20670

Summary: Add markup and standard classes for sidebars and main content areas
Product: Koha Reporter: Owen Leonard <oleonard>
Component: TemplatesAssignee: Owen Leonard <oleonard>
Status: RESOLVED WONTFIX QA Contact: Testopia <testopia>
Severity: enhancement    
Priority: P5 - low CC: josef.moravec, katrin.fischer, marjorie.barry-vila
Version: Main   
Hardware: All   
OS: All   
Change sponsored?: --- Patch complexity: ---
Documentation contact: Documentation submission:
Text to go in the release notes:
Version(s) released in:
Bug Depends on:    
Bug Blocks: 14546    

Description Owen Leonard 2018-04-27 13:06:50 UTC
As we move away from YUI grids, it would be helpful if we could consistently add some classes to the primary sections of the page. That would allow us to style elements differently based on their container's class.

I've already begun adding a "main" class to the <div> which is the primary "container" for the Bootstrap grid. It typically looks like this:

    <div class="main container-fluid">
        <div class="row">
            <div class="col-sm-5 col-md-4">

I would like to add an additional container that wraps the primary content region for the page. This container should have no style attached to it (as it might interfere with grid layout), but can serve as a context for styles within it.

-----------------------------------------------
*                  .main                      *
* ------------------------------------------- *
* *          *      .main-content           * *
* *          *                              * *
* * .sidebar *  --------------------------  * *
* *          *  *                        *  * *
* *          *  *   .row                 *  * *
* *          *  *      .col-*            *  * *
* *          *  *           ...etc.      *  * *
* *          *  --------------------------  * *
* *          *                              * *
* ------------------------------------------- *
*                                             *
-----------------------------------------------

The use I have right away is to style forms differently based on whether they are in the sidebar or the main-content area. Right now we have some CSS which depends on YUI grid classes, and we need to replace that which isn't dependent on the grid system we choose.
Comment 1 Owen Leonard 2018-04-27 13:43:55 UTC
My diagram needs some tweaks -- it was off the top of my head. The .sidebar div is contained within the primary .row div, so .main-content will have to be moved.
Comment 2 Katrin Fischer 2018-04-29 20:41:38 UTC
+1
Comment 3 Katrin Fischer 2023-09-16 14:23:48 UTC
Hi Owen, as we had a lot of changes since - do we still want to keep this open?