Module

FPO.UI.Style

This module contains some additional styling helpers and goodies for the FPO app, useful for creating and reusing CSS styles across components and pages.

#popover​

popover :: forall r i. String -> IProp r i

Popover attribute for tooltips. Can be used just like any other HTML attribute, and adds a tooltip to the element when hovered.

Example usage: HH.div [ popover "Tooltip text" ] [ HH.text "Hover me!" ]

#responsiveButton​

responsiveButton :: ClassName

Class for responsive buttons that adapt to different screen sizes. This class can be used to ensure buttons look good on both mobile and desktop views.

#cyanStyle​

cyanStyle :: forall r i. IProp (class :: String | r) i

A cyan style button, predominantly used as main-feature buttons of some admin pages.

#disableScrollbar​

disableScrollbar :: ClassName

A class to disable scrollbars in a cross-browser compatible way. This class can be applied to any scrollable container to hide the scrollbar while still allowing scrolling functionality.

#truncateHoverTitle​

truncateHoverTitle :: ClassName

A class to enable title tooltips on truncated text elements. When applied to an element, if the text is truncated due to insufficient space, hovering over the element will show a tooltip with the full text content. Logic implemented in Truncated.purs.

Modules