Issue Details (XML | Word | Printable)

Key: MDL-19757
Type: Sub-task Sub-task
Status: Open Open
Priority: Minor Minor
Assignee: Tim Hunt
Reporter: Tim Hunt
Votes: 1
Watchers: 4
Operations

Add/Edit UI Mockup to this issue
If you were logged in you would be able to see more operations.
Moodle
MDL-19077

replace the table layout in theme/standard/layout.php with something better

Created: 09/Jul/09 05:52 PM   Updated: 26/Aug/09 04:03 PM
Component/s: Themes
Affects Version/s: 2.0
Fix Version/s: 2.0

File Attachments: 1. Zip Archive standardNew.zip (116 kB)


Participants: Frank Ralf, Mauno Korpelainen, Paul ODonnell, Petr Škoda (skodak) and Tim Hunt
Security Level: None
Affected Branches: MOODLE_20_STABLE
Fixed Branches: MOODLE_20_STABLE


 All   Comments   Change History   Version Control      Sort Order: Ascending order - Click to sort in descending order
Petr Škoda (skodak) added a comment - 24/Aug/09 06:24 PM

Tim Hunt added a comment - 24/Aug/09 07:23 PM
Possibly, but I am hoping that Patrick Malley or someone else does this.

Frank Ralf added a comment - 24/Aug/09 07:26 PM
Or perhaps something like the Holy Grail of three-column CSS layout:

http://www.alistapart.com/articles/holygrail
http://www.manisheriar.com/holygrail/index.htm


Mauno Korpelainen added a comment - 25/Aug/09 02:10 AM
I would give this task to Patrick like Tim suggested.

Holygrail fails in cases where pages don't have either left or right blocks because it sets a fixed width for left, right and center column with paddings and if sideblocks are missing we see empty space there.

Yui grids are interesting like http://developer.yahoo.com/yui/grids/builder/ but them may need a similar check of existence of sideblocks like holygrail - or can yui grids collapse automatically or fill the empty space if colums have no content? ... we should just test it.


Paul ODonnell added a comment - 25/Aug/09 04:25 AM
Addending styles_layouts.css with this:

div#table-layout {
width: 100%;
display:table;
margin-top: .5em;
}
div#table-layout .grid_row {
display:table-cell;
vertical-align:top;
}
#page {
margin: .5em;
}

And this to layouts.php:

<div id="table-layout" class="container">
<?php if ($PAGE->blocks->region_has_content('side-pre', $OUTPUT))

Unknown macro: { ?> <div id="region-side-pre" class="block-region region-side-pre aside grid_row"> <?php echo $OUTPUT->blocks_for_region('side-pre') ?> </div> <?php }
?>
<div id="content" class="block-region content grid_row"> [MAIN CONTENT GOES HERE] </div>
<?php if ($PAGE->blocks->region_has_content('side-post', $OUTPUT))
Unknown macro: { ?> <div id="region-side-post" class="block-region region-side-post aside grid_row"> <?php echo $OUTPUT->blocks_for_region('side-post') ?> </div> <?php }
?>
<div class="clearfix"> </div>
</div>

Might do the trick.


Paul ODonnell added a comment - 25/Aug/09 04:29 AM
Sorry. That obviously didn't work. See attached.

Tim Hunt added a comment - 25/Aug/09 04:25 PM
The layout.php code can find out which block regions are empty if it needs to before any HTML is output.

Mauno Korpelainen added a comment - 25/Aug/09 08:39 PM
Yes, I know we can use such code in layout.php but yui grids don't obviously do it automatically. It would be possible to use holygrail as well if we used for example different code and different classes according to situations where we have all columns, left colum is missing, right column is missing or both left and right column are missing. It is possible but most likely not reasonable.

The problem with yui grid presets is that widths of those preset columns don't fit very well to current column widths of standard theme - and again all things can be changed but if we want to use same kind of layout as current standard theme yui grids may not be the right tool.

As far as I can see your solution makes any kind of layouts possible Tim and a big Thank You for that... Was your original idea to find some different solution (layout) or only to replace table layout with div layout? What did you mean by "something better" meaning is there something else wrong in current layout.php than tables?


Petr Škoda (skodak) added a comment - 25/Aug/09 10:53 PM
"The problem with yui grid presets is that widths of those preset columns don't fit very well to current column widths of standard theme" - I do not understand this, we can simply override the CSS for existing div.yui-tX or add new classes like div.yui-t10, div.yui-t11..., right?

Mauno Korpelainen added a comment - 25/Aug/09 11:37 PM
True - it is possible to override css and add new classes ... we are just not using grid PRESETS then anymore ... we need to create and test how those new classes work and forget old css of standard theme which many old themes have used in config.php...

I suppose it is ok to use yui grids like any other solution that people just want to use.


Mauno Korpelainen added a comment - 26/Aug/09 05:27 AM
Ah - I saw for the first time http://docs.moodle.org/en/Development:Theme_changes_proposal from other post and comment Tim wrote...

Petr,

that plan sounds quite reasonable, well planned and we'll see how things roll on - it was just a major surprise that a couple days ago I was testing the system that Tim created and now we suddenly have a new theme proposal with lots of big changes.

Can you post some info about final proposal to theme forum when you have implemented the changed proposal so that all theme designers who are eager to try all kinds of cool things will know how to go on with moodle 2.0 themes...


Tim Hunt added a comment - 26/Aug/09 04:03 PM
That proposal is still being developed. When it is clearer (which is probably quite soon) Petr is planning to post about it in the themes forum. It is not a different proposal from my recent changes, it is more of the same to clean things up and simplify them even further.