Skip to main content

Setting 'style' in the HTML element of DSP.

  • March 15, 2023
  • 2 replies
  • 0 views
Iain Sharp
Forum|alt.badge.img+5

I'd like to put a generic text bigger/smaller option on a DSP, and as such would have it set the font-size in the style of the <HTML> at the top (thus changing the size of 1rem for the rest of the page). 

How can I set this programmatically? Can I set an attributes only ID against the element in the page and then set this? 

Do I have to 'hack' the string in the postactivate somehow? 

Regards, 

Iain



------------------------------
Iain Sharp
Head of Technical Services
Pci Systems Ltd
Sheffield GB
------------------------------
Iain Sharp : Head of Technical Services, Jonas Metals Software

    2 replies

    David Akerman

    I'd like to put a generic text bigger/smaller option on a DSP, and as such would have it set the font-size in the style of the <HTML> at the top (thus changing the size of 1rem for the rest of the page). 

    How can I set this programmatically? Can I set an attributes only ID against the element in the page and then set this? 

    Do I have to 'hack' the string in the postactivate somehow? 

    Regards, 

    Iain



    ------------------------------
    Iain Sharp
    Head of Technical Services
    Pci Systems Ltd
    Sheffield GB
    ------------------------------

    Hi Iain,

    I'm not quite sure why you want to do that instead of using built-in options, e.g.

    • users can resize fonts in their web browser - the keyboard shortcut is typically Ctrl + or - or you can typically pinch zoom on a touch screen such as a mobile device  (it  isn't a good idea to hard-code font sizes in pixels in CSS for this reason - em or rem or vw are usually better options)
    • vw adjusts font size to viewport width (see Viewport Sized Typography | CSS-Tricks - CSS-Tricks or similar).

    If you really want to do it (and for me the risk of maintenance issues would be a disincentive), you could easily webactivate a javascript operation that changes the style or CSS class of the <body> element of the outer DSP as needed. If you fix sizes of elements and CSS classes you would probably need to change those too.

    As you mentioned, you'd normally modify $fieldproperties to change field properties such as html:style (as described in the How to Override Properties and Attributes e-Learning module), but I don't think that will work for the HTML <body> attribute, which is loaded once for the outer (main) containing component.

    It is also possible to CSS files to the $webinfo("css") channel but I think that would be overkill.



    ------------------------------
    David Akerman
    Principal Solution & Enablement Architect
    Rocket Internal - All Brands
    ------------------------------

    Iain Sharp
    Forum|alt.badge.img+5
    • Iain Sharp
    • Author
    • Inspiring
    • March 17, 2023

    Hi Iain,

    I'm not quite sure why you want to do that instead of using built-in options, e.g.

    • users can resize fonts in their web browser - the keyboard shortcut is typically Ctrl + or - or you can typically pinch zoom on a touch screen such as a mobile device  (it  isn't a good idea to hard-code font sizes in pixels in CSS for this reason - em or rem or vw are usually better options)
    • vw adjusts font size to viewport width (see Viewport Sized Typography | CSS-Tricks - CSS-Tricks or similar).

    If you really want to do it (and for me the risk of maintenance issues would be a disincentive), you could easily webactivate a javascript operation that changes the style or CSS class of the <body> element of the outer DSP as needed. If you fix sizes of elements and CSS classes you would probably need to change those too.

    As you mentioned, you'd normally modify $fieldproperties to change field properties such as html:style (as described in the How to Override Properties and Attributes e-Learning module), but I don't think that will work for the HTML <body> attribute, which is loaded once for the outer (main) containing component.

    It is also possible to CSS files to the $webinfo("css") channel but I think that would be overkill.



    ------------------------------
    David Akerman
    Principal Solution & Enablement Architect
    Rocket Internal - All Brands
    ------------------------------

    We are taking to writing new components of our CS system in DSPs where appropriate and then including them in the CS app using a 'wrapper' form with an HTML widget, so it's the cefrender browser in Uniface. Where the user has selected a size which suits them, I'd like to be able to remember it and restore that size when they next use the same component. 

    Experiments with devtools leads me to believe that it's actually the <HTML> element I need to change, <body> seems not to affect some of the styles (and there are other styles in use (<table> maybe? ) which are using fixed pixel sizes, and I need to change to rem. ) . 

    I had not thought of webactivate, (mostly because I'd hoped to be able to do it in proc as I find that more transparent). 

    I'll look into it, it was a idea I was playing with anyway, we'll see if it's needed. 

    Regards, 

    Iain



    ------------------------------
    Iain Sharp
    Head of Technical Services
    Pci Systems Ltd
    Sheffield GB
    ------------------------------
    Iain Sharp : Head of Technical Services, Jonas Metals Software

    Recent badge winners

    Explore all badges
    Terms & ConditionsAccessibility statement