Margins between Labels

Margins between Labels

by Dominique BODIN -
Number of replies: 6

Hello,

1)The problem:

I'm trying to duplicate the Laure CHARLEUX's excellent idea of a map of progression in order to gamify my moodle courses (http://open.lib.umn.edu/innovativeteaching/chapter/using-game-dynamics-to-teach-applied-statistics-lessons-learned/): briefly I've sliced my svg map in horizontal slices, each slice appears in a different moodle label which will be shown or hidden accordingly to the students' completion of the course's activities.

Everything works fine except that my moodle theme does interpose a very wide white space between two successive labels in my front page layout - so that the slices of the map are obvious instead of giving the impression of one continuous picture.

Hence my question : how to remove this white space between two labels ?


****************************************

2)What I've already found is this quite old thread:

https://moodle.org/mod/forum/discuss.php?d=189183#p823440

But I'm a teacher with editing permissions and no administration permissions so I can't change anything as needed in the css files.

****************************************

3) What I've tried is to override the correct css parameter through a jquery script : but something like this didn't work:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
   $("#page-course-view-topics .content .section .label p").css({
      { "margin" : "0" ; "line-height" : "1"}
   });
});
</script>

Then I've tried to localise with FIREBUG where the script should do something: I've found this

<li id="module-1986" class="activity label modtype_label ">

and so I tried to put to 0 all the "padding" in the FIREBUG console...but a wide blank space is still displayed between successive labels.

Thanks for any help on this,

D.B.

(the theme on this moodle webiste seems to be: " /theme/yui_combo.php?rollup/3.17.2/yui-moodlesimple-min.css" ?).


Average of ratings: -
In reply to Dominique BODIN

Re: Margins between Labels

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hello,

  1. Have you read the forum rules?
  2. Why are you adding jQuery (badly) and causing a potential double inclusion issue to inject CSS onto the page and not using the theme custom CSS box - so actually ask an administrator to do this?  Or....
  3. Just inject inline CSS with a 'style' tag and ditch JavaScript completely?
  4. "the theme on this moodle webiste seems to be: " /theme/yui_combo.php?rollup/3.17.2/yui-moodlesimple-min.css" is not a theme but the YUI JS framework CSS.  Perhaps ask / eMail / contact the administrator for the theme name?

Gareth

Average of ratings: Useful (1)
In reply to Gareth J Barnard

Re: Margins between Labels

by Dominique BODIN -

Hello,

1) I've only post my question in last resort. I did look for a solution for many days.  But all my apologies for having bother this forum.

2) I don't have any access to the custom CSS  box and I'm not able either to have any contact with an administrator (at least in order to make this kind of change ).

This moodle project takes place all over our complete district, each school can create courses on this moodle plateform and at this scale you don't have any direct contact with any administrator (and certainly not in order to get a customisation of this kind - not to mention asking for let's say some plugins you may want to try out ; besides remove a few pixels didn't sound at first such a huge challenge).

3) Sorry I forget to mention it : I did try with <style> tags but all the <style> tags are automatically removed from the html code. Our administrators don't allow this tag (curiously the <script> tag does stay in place and does work since I managed to use it with a very simple script;

I've only mention this (very badly as you said)  because I had read before posting here this kind of idea here:

https://moodle.org/mod/forum/discuss.php?d=232631#p1011167

or here:

https://tic-et-net.org/2017/08/27/moodle-comment-modifier-le-css-dune-page-de-cours-sans-modifier-le-theme/)

4) I was pretty sure I was all wrong about that (just my best guess, hence "it seems"). I understand your discontent but I can't get this information right - for the very same reasons mentionned above.

********************************************

This idea of gamification through a map was very appealing to me since I work with young students, and the idea of Laure CHARLEUX was quite clever and easy to do -just some labels with hidden/shown conditions-...except for those very frustating few white pixels ; but remove them is, as you have proven, finally far above my skills.

Sorry once again for your time, best regards,

D.B.





Average of ratings: -
In reply to Dominique BODIN

Re: Margins between Labels

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi D.B.

Ok, this is Catch-22.  Sometimes you can't solve a problem that is machine based with a machine solution.  You're climbing a machine mountain by yourself in order to achieve something.  But in reality the solution is a human one so you don't have to climb that mountain.

Moodle clearly needs to prevent elements of bad code.  The fact that the systems are configured to allow inline JS is worrying.  And yet remove 'style' tags, which with 'html {display: none !important;}' could be damaging but not to a greater extent.

Right, I assume that you have an account on these systems?  How did you get that account?  As normally this is only orchestrated via an administrator or such authentication method.  Therefore there must be someone you can contact?  You need a human on the systems you have access to in order to help you who has authority and capability to validate the changes.  Otherwise, Moodle would not be doing what it needs to do to prevent unvalidated dangerous changes causing damage to its systems.

Gareth

Average of ratings: -
In reply to Gareth J Barnard

Re: Margins between Labels

by Dominique BODIN -

Hello,

Thanks for your clear answer.

Indeed as I said I just didn't imagine that it would that hard to remove some white pixels...

The scale of this operating Moodle -the size of a district with thousands of students in numerous distant cities- prevents us from asking for any perticular change (the account creation is automatic).

I will try to make my game map otherwise then...

Best regards,

D.B.

Average of ratings: -
In reply to Dominique BODIN

Re: Margins between Labels

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi D.B.

RE: "Indeed as I said I just didn't imagine that it would that hard to remove some white pixels..." = welcome to the world of the developer smile.

But it does seem to me to be a single Moodle instance, and it would be possible with administration co-operation to make such a custom CSS addition to be specific to what you need and not affect anything else.

G

Average of ratings: -
In reply to Dominique BODIN

Re: Margins between Labels

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Hi DB, 

I have  found that if you make TinyMCE your preferred Text Editor.

Usermenu > Preferences 

You can make some reasonably better changes in the HTML part of the Label settings page.

For example:

If you add the following into the first <p> opening tag like this...

<p style="margin-bottom: 0 !important;" >

it will remove the unwanted margin from each label that you add that style to.

I think you will find that works for an editing teacher.

Cheers

Mary

Average of ratings: Useful (1)