Solved

Very small scroll bars

  • 6 February 2023
  • 4 replies
  • 122 views
Harm Horstman
Rank
Userlevel 5
Badge +20

Why are scroll bars in the Universal GUI so very small and light grey? Users barely recognize them the first time.

Or is it easy to adjust them with custom CSS?


 

icon

Best answer by Kasper Reijnders 6 February 2023, 13:18

View original
This topic has been closed for comments

4 replies

Kasper Reijnders
Userlevel 4
Badge +5

You can do this with custom css. For example by using this code, I've added !important to all because else they are not specific enough.

/* width */
::-webkit-scrollbar {
  width: 20px !important;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey  !important; 
  border-radius: 10px  !important;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: red  !important; 
  border-radius: 10px  !important;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #b30000 !important; 
}

 

Blommetje
Userlevel 5
Badge +12

That doesn’t feel very low-code to me 😆

But thnx, useful! 

Kasper Reijnders
Userlevel 4
Badge +5

It is not no-code, but is in line with the universal documentation on custom styling: https://docs.thinkwisesoftware.com/docs/sf/themes#css-classes-in-the-universal-gui

A
Rank
Userlevel 6
Badge +10

Apparently since Universal GUI 2023.1.10 the scroll bar has generically been degraded in usability.

The same scrollbar in the entire application

Due to a lack of updates and crashes from the third-party component we used for our scrollbars, we have decided to remove that component entirely.
This means that all scrollbars are now similar to the scrollbars in the grid.

We have longstanding TCP issues that actually requested the earlier Forms scroll bar to be applied to Grid and Resource Scheduler too. 

We haven’t tested the suggested custom CSS just yet, but I totally agree with @Harm Horstman that the current scroll bar is absolutely not a proper default scroll bar to work with. And it can’t seriously be expected from every client to have to apply custom CSS to fix this…

@Erik Brink could this please be fixed properly for all screens soon?

Terms & ConditionsCookie settings