Adjust UI via CSS Editor

Tagged:
  • Stanislav Khodorov
    Participant
      6 years, 3 months ago #13173

      Hello everybody,

      I am a huge fan of the Simplifier! Thank you guys for making this possible!

      Hopefully you can help me with the following issue: I would like to access the single UI elements via the CSS Editor.
      What is the structure? How do I turn e.g. a button into red and the font in that button into blue?
      Could you provide me a sample how to access Bars, Buttons, Tables (Widgets in general)?
      In the documentation I only found minor information:
      https://community.simplifier.io/documentation/current-release/applications/ui-designer/css-editor/
      Here the structure seems to be something like

      .Button, #MyButtonsID {
color: red;
font: blue;
}

      which is not working for me.

      Really looking forward to your answer!
      Have a nice day!

      Cheers,
      Stan

      Chris Bouveret
      Keymaster
        Has successfully completed the online course Introduction
        Has successfully completed the online course Intermediate (200)
        Has successfully completed the online course Advanced (300)
        Has successfully completed the online course Basics (100)
        Has successfully completed the online course Advanced (320)
        Has successfully completed the Intermediate Certification
        Has successfully completed the Advanced Certification
      6 years, 3 months ago #13174
      Up
      2
      Down
      ::

      Hi Stan,

      thx for posting this. Generally speaking it is very straight forward. Just make sure that you pick the right ID from the generated HTML code that you want to access via CSS. See attached Screenshot of Chrome DevTools within the App Preview on how to find the generated ID of the element you want to access via CSS. Also make sure that you add a !important to your CSS Directives in order to overrule UI5 CSS directives. Simplifier AppGenerator adds some more to the ID of an Element, as you can see in the attached Screenshots.

      Attachments:
      You must be logged in to view attached files.
      Stanislav Khodorov
      Participant
        6 years, 3 months ago #13178
        Up
        0
        Down
        ::

        Yes! Thank you Chris!
        This was exactly what I have been missing!

      Viewing 3 posts - 1 through 3 (of 3 total)

      You must be logged in to reply to this topic.