Module HTML.Styles.Bootstrap4

This library contains some operations to generate web pages rendered with Bootstrap version 4.

Author
Michael Hanus
Version
January 2024

Exported Functions: bootstrapPage, bootstrapPage2, ehref, ehrefDangBadge, ehrefDarkBadge, ehrefInfoBadge, ehrefLightBadge, ehrefNav, ehrefPrimBadge, ehrefScndBadge, ehrefSuccBadge, ehrefWarnBadge, eTarget, hrefDangBadge, hrefDangButton, hrefDangSmButton, hrefDarkBadge, hrefDarkButton, hrefDarkSmButton, hrefInfoBadge, hrefInfoBlock, hrefInfoButton, hrefInfoSmBlock, hrefInfoSmButton, hrefLightBadge, hrefLightButton, hrefLightSmButton, hrefNav, hrefNavActive, hrefPrimBadge, hrefPrimBlock, hrefPrimButton, hrefPrimSmBlock, hrefPrimSmButton, hrefScndBadge, hrefScndBlock, hrefScndButton, hrefScndSmBlock, hrefScndSmButton, hrefSuccBadge, hrefSuccButton, hrefSuccSmButton, hrefWarnBadge, hrefWarnButton, hrefWarnSmButton, infoButton, infoSmButton, kbdInput, modalClosePrimButton, modalLaunchPrimButton, primButton, primSmButton, scndButton, scndSmButton, scriptShowModal, staticButton, stdModal, titledSideMenu


Exported Functions


bootstrapPage :: String -> [String] -> [String] -> String -> (String, [BaseHtml]) -> [[BaseHtml]] -> [[BaseHtml]] -> Int -> [BaseHtml] -> [BaseHtml] -> [BaseHtml] -> [BaseHtml] -> HtmlPage  Deterministic 

An HTML page rendered with bootstrap with a fixed top navigation bar. @lefttopmenu - the menu shown in the left side of the top navigation bar @righttopmenu - the menu shown in the right side of the top navigation bar (could be empty)

:: String  the icon file favicon.ico (when empty not included)
-> [String]  the style files to be included (typically, css/bootstrap.min.css)
-> [String]  the JavaScript files to be included (typically, .../jquery.js, js/bootstrap.min.js)
-> String  the title of the form
-> (String, [BaseHtml])  the brand shown top left (a URL/title pair)
-> [[BaseHtml]]  number of columns for the left-side menu (if columns==0, then the left-side menu is omitted)
-> [[BaseHtml]]  the menu shown at the left-side of the main document (maybe created with titledSideMenu)
-> Int  the main header (will be rendered with jumbotron style)
-> [BaseHtml]  the main contents of the document
-> [BaseHtml]  the footer of the document
-> [BaseHtml] 
-> [BaseHtml] 
-> HtmlPage 

bootstrapPage2 :: String -> [String] -> [String] -> String -> (String, [BaseHtml]) -> [(String, [BaseHtml])] -> [(String, [BaseHtml])] -> Int -> [BaseHtml] -> [BaseHtml] -> [BaseHtml] -> [BaseHtml] -> HtmlPage  Deterministic 

An HTML page rendered with bootstrap with a fixed top navigation bar and individual classes for the top menu items. @lefttopmenu - the menu shown in the left side of the top navigation bar (with class attribute for the menu items) @righttopmenu - the menu shown in the right side of the top navigation bar (with class attribute for the menu items, could be empty)

:: String  the icon file favicon.ico (when empty not included)
-> [String]  the style files to be included (typically, css/bootstrap.min.css)
-> [String]  the JavaScript files to be included (typically, .../jquery.js, js/bootstrap.min.js)
-> String  the title of the form
-> (String, [BaseHtml])  the brand shown top left (a URL/title pair)
-> [(String, [BaseHtml])]  number of columns for the left-side menu (if columns==0, then the left-side menu is omitted)
-> [(String, [BaseHtml])]  the menu shown at the left-side of the main document (maybe created with titledSideMenu)
-> Int  the main header (will be rendered with jumbotron style)
-> [BaseHtml]  the main contents of the document
-> [BaseHtml]  the footer of the document
-> [BaseHtml] 
-> [BaseHtml] 
-> HtmlPage 

titledSideMenu :: HTML a => String -> [[a]] -> [a]  Deterministic 

Create a side menu containing a title and a list of items:


primButton :: String -> ((HtmlRef -> String) -> IO HtmlPage) -> HtmlExp  Non-deterministic 

Primary input button.


primSmButton :: String -> ((HtmlRef -> String) -> IO HtmlPage) -> HtmlExp  Non-deterministic 

Small primary input button.


scndButton :: String -> ((HtmlRef -> String) -> IO HtmlPage) -> HtmlExp  Non-deterministic 

Secondary input button.


scndSmButton :: String -> ((HtmlRef -> String) -> IO HtmlPage) -> HtmlExp  Non-deterministic 

Small secondary input button.


infoButton :: String -> ((HtmlRef -> String) -> IO HtmlPage) -> HtmlExp  Non-deterministic 

Info input button.


infoSmButton :: String -> ((HtmlRef -> String) -> IO HtmlPage) -> HtmlExp  Non-deterministic 

Small info input button.


hrefPrimButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a primary button.


hrefPrimSmButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a small primary button.


hrefScndButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a secondary button.


hrefScndSmButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a small secondary button.


hrefInfoButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as an info button.


hrefInfoSmButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a small secondary button.


hrefSuccButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a success button.


hrefSuccSmButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a small success button.


hrefWarnButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a warning button.


hrefWarnSmButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a small warning button.


hrefDangButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a danger button.


hrefDangSmButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a small danger button.


hrefLightButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a light button.


hrefLightSmButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a small light button.


hrefDarkButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a dark button.


hrefDarkSmButton :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a small dark button.


hrefPrimBlock :: HTML a => String -> [a] -> a  Deterministic 


hrefScndBlock :: HTML a => String -> [a] -> a  Deterministic 


hrefInfoBlock :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as an info block button.


hrefPrimSmBlock :: HTML a => String -> [a] -> a  Deterministic 


hrefScndSmBlock :: HTML a => String -> [a] -> a  Deterministic 


hrefInfoSmBlock :: HTML a => String -> [a] -> a  Deterministic 


hrefPrimBadge :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a primary badge.


hrefScndBadge :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a secondary badge.


hrefSuccBadge :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a success badge.


hrefInfoBadge :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as an info badge.


hrefWarnBadge :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a warning badge.


hrefDangBadge :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a danger badge.


hrefLightBadge :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a light badge.


hrefDarkBadge :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference rendered as a dark badge.


ehrefPrimBadge :: HTML a => String -> [a] -> a  Deterministic 

External hypertext reference rendered as a primary badge.


ehrefScndBadge :: HTML a => String -> [a] -> a  Deterministic 

External hypertext reference rendered as a secondary badge.


ehrefSuccBadge :: HTML a => String -> [a] -> a  Deterministic 

External hypertext reference rendered as a success badge.


ehrefInfoBadge :: HTML a => String -> [a] -> a  Deterministic 

External hypertext reference rendered as an info badge.


ehrefWarnBadge :: HTML a => String -> [a] -> a  Deterministic 

External hypertext reference rendered as a warning badge.


ehrefDangBadge :: HTML a => String -> [a] -> a  Deterministic 

External hypertext reference rendered as a danger badge.


ehrefLightBadge :: HTML a => String -> [a] -> a  Deterministic 

External hypertext reference rendered as a light badge.


ehrefDarkBadge :: HTML a => String -> [a] -> a  Deterministic 

External hypertext reference rendered as a dark badge.


hrefNav :: HTML a => String -> [a] -> a  Deterministic 

Hypertext reference in navigations.


hrefNavActive :: HTML a => String -> [a] -> a  Deterministic 

Active hypertext reference in navigations.


ehrefNav :: HTML a => String -> [a] -> a  Deterministic 

External hypertext reference in navigations.


ehref :: HTML a => String -> [a] -> a  Deterministic 

An external hypertext reference which opens on a new page.


eTarget :: HTML a => a -> a  Deterministic 

Transforms a hypertext reference into an external one which opens on a new page. Basically, the attribute target="_blank" is added.


kbdInput :: HTML a => [a] -> a  Deterministic 

Render an HTML expression as keyboard or user input.


staticButton :: HTML a => [a] -> a  Deterministic 


stdModal :: HTML a => Bool -> String -> [a] -> [a] -> [a] -> a  Deterministic 

Defining a modal dialog where a modal id, the title, body, and footer HTML expressions are provided. If the first argument is True, then the modal dialog will not close when clicking outside it.


modalLaunchPrimButton :: HTML a => String -> String -> a  Deterministic 

A primary button to launch a modal dialog where the modal id and the button text are provided.


modalClosePrimButton :: HTML a => String -> a  Deterministic 

A primary button to close a modal dialog to be used inside the modal definition. The argument is the button text.


scriptShowModal :: String -> [BaseHtml]  Deterministic 

A JavaScript element which can be put at the end of the page body in order to show a modal defined in the page after the page is loaded.