putting a frame around element of a scale object

PennController for IBEX Forums Support putting a frame around element of a scale object

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #3661
    robpetrosino
    Participant

    I would like to put a frame around the element of a Scale object. I am assuming that this could be done by calling the appropriate CSS command within the PennController object, but I can’t seem to get it right. I tried to do the following:

    `
    newScale(“scale”, 7)
    […]
    .settings.cssContainer(“border-style”, “solid”)
    `

    but it does not work. I guess that the question may be more generally phrased: where can one access the commands that can be referred to within the setting.cssContainer command?

    Thanks!

    #3664
    Jeremy
    Keymaster

    Hi again,

    The command .settings.cssContainer will not affect the elements within the container, but indeed the container itself. Using newScale(7).settings.cssContainter("border-style","solid 1px black") will only add a black border around the whole Scale element, not around the scale’s buttons.

    For you to modify the scale’s buttons, you need to upload a file named PennController.css under css_includes with the right target, e.g.

    td.PennController-Scale-scaleButton {
      padding:10 15 10 15;
      color:blue;
      border:1px solid gray;
    }
    #3672
    robpetrosino
    Participant

    Hi Jeremy,

    thanks, this makes sense. I created a the PennController.css with the code you suggested and uploaded it under css_includes, but it did not have any effect on the aesthetics of the scale buttons. (I have already encountered this problem before, around a couple of months ago, when I was trying to modify the aesthetics of a text object).

    #3673
    robpetrosino
    Participant

    I think I found a solution for this – I had to prepend global_ to the name of the css file (i.e., global_PennController.css), as suggested in the IBEX tutorial. I am not sure why it is like that, but it might be good for you to know, in case you want to find out/fix it…

    #3674
    Jeremy
    Keymaster

    Ah, right, my bad, you probably want to remove PennController- between td. and Scale if you are going to use a file named PennController.css (though Ibex’s automatic class prefixation is a little bit shaky, so the global_ method is safe).

    #3675
    robpetrosino
    Participant

    Sounds good! Thanks!

    #9734
    BenG
    Participant

    Hi, I am having the same issue regarding boxes around the buttons of scales. I can make changes to the scales through the PennController.css file without issue, but for some reason the code provided above does nothing to the scale.

    Any help would be appreciated!

    Demo link: https://farm.pcibex.net/r/RTusyr/

    • This reply was modified 1 year, 4 months ago by BenG.
    #9747
    Jeremy
    Keymaster

    Hi,

    The code above dates from 2019, there have been new releases of PennController since then, and Scale elements are no longer rendered as HTML table elements

    Judging from the project you shared, it seems like you have come up with a solution, as you have this in global_z.css:

    .PennController-Scale .option label {
        margin: 0em 1em; 
        font-size: 18px;
    }

    You could add a frame like this:

    .PennController-Scale .option label {
        margin: 0em 1em; 
        font-size: 18px;
        border:1px solid gray;
    }

    Jeremy

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.