Comment 2 for bug 1273931

Revision history for this message
Valerii Kuznetsov (valerii-kuznetsov) wrote :

Custom CSS will help to solve limitations with artefact blocks design.

Each block placed on a page have own structure and design.
For example, journal block has big title, description, tags in bold, author in gray, date, list separator (dotted line), etc. In the same time file block has file name, and preview on its left, size, etc.

To properly display block of every type developer needs to use different CSS classes and styles.
Currently, developer can only use CSS classes defined in /theme/view.css. But there only limited number of classes defined and they are not fit/enough for many cases. So, if developers need to add some CSS to their blocks they have to add CSS classes into /theme/view.css.

This is done for example for journals. Such classes as .postlist .title, .postlist .post used only for journal block and defined in /theme/view.css to show journals block properly.

This is fine for Mahara core development, but it's bad for me as artefact developer. When I need to add some style I also need to change /theme/view.css, which is part of core. So, each time Mahara updates /theme/view.css I need to merge these changes into my artefact and redistribute artefact upgrade even when nothing else was changed.
Also it's bad for end users when they use two different third party artefact blocks they need to merge /theme/view.css from both artefacts.

Basically it makes impossible distribution of artefacts with blocktypes that need some advanced CSS separate from mahara.

It would be great to have a way to add CSS for blocks without changing /theme/view.css. I really like how it's done for artefacts. When I add style.css to /artefact/[name]/theme/raw/static/style folder, this file will be automatically loaded when artefact location is opened. Having the same for artefact blocks would solve this limitation.

As I said may be there is another way or workaround to solve this limitation, but the only thing I could do, is load CSS file programaticaly using javascript. Which is also has obvious disadvantages.