ideas-1.7: Feedback services for intelligent tutoring systems

Maintainerbastiaan.heeren@ou.nl
Stabilityprovisional
Portabilityportable (depends on ghc)
Safe HaskellSafe
LanguageHaskell98

Ideas.Text.HTML.W3CSS

Contents

Description

A minimal interface for using W3.CSS, a modern CSS framework with built-in responsiveness. See https://www.w3schools.com/w3css/

Synopsis

Documentation

w3class :: BuildXML a => String -> a -> a Source #

w3classIf :: BuildXML a => Bool -> String -> a -> a Source #

data Size Source #

Constructors

Tiny 
Small 
Medium 
Large 
XL 
XXL 
XXXL 
Jumbo 

Instances

Eq Size Source # 

Methods

(==) :: Size -> Size -> Bool #

(/=) :: Size -> Size -> Bool #

Ord Size Source # 

Methods

compare :: Size -> Size -> Ordering #

(<) :: Size -> Size -> Bool #

(<=) :: Size -> Size -> Bool #

(>) :: Size -> Size -> Bool #

(>=) :: Size -> Size -> Bool #

max :: Size -> Size -> Size #

min :: Size -> Size -> Size #

Show Size Source # 

Methods

showsPrec :: Int -> Size -> ShowS #

show :: Size -> String #

showList :: [Size] -> ShowS #

Container Classes

container :: BuildXML a => a -> a Source #

HTML container with 16px left and right padding

panel :: BuildXML a => a -> a Source #

HTML container with 16px left and right padding and 16px top and bottom margin

badge :: BuildXML a => a -> a Source #

Circular badge

tag :: BuildXML a => a -> a Source #

Rectangular tag

ul :: BuildXML a => [a] -> a Source #

Unordered list

ulWith :: BuildXML a => (a -> a) -> [a] -> a Source #

Unordered list

code :: BuildXML a => a -> a Source #

Code container

codespan :: BuildXML a => a -> a Source #

Inline code container (for code snippets)

Table Classes

table :: BuildXML a => a -> a Source #

Container for an HTML table

tableAll :: BuildXML a => a -> a Source #

All properties set

striped :: BuildXML a => a -> a Source #

Striped table

bordered :: BuildXML a => a -> a Source #

Bordered lines

centered :: BuildXML a => a -> a Source #

Centered table

hoverable :: BuildXML a => a -> a Source #

Hoverable table

responsive :: BuildXML a => a -> a Source #

Creates a responsive table

Card Classes

card :: BuildXML a => a -> a Source #

Same as w3-card-2

card2 :: BuildXML a => a -> a Source #

Container for any HTML content (2px bordered shadow)

card4 :: BuildXML a => a -> a Source #

Container for any HTML content (4px bordered shadow)

Responsive Classes

row :: BuildXML a => a -> a Source #

Container for one row of fluid responsive content

rowPadding :: BuildXML a => a -> a Source #

Row where all columns have a default padding

content :: BuildXML a => a -> a Source #

Container for fixed size centered content

half :: BuildXML a => a -> a Source #

Half (1/2) screen column container

third :: BuildXML a => a -> a Source #

Third (1/3) screen column container

twothird :: BuildXML a => a -> a Source #

Two third (2/3) screen column container

quarter :: BuildXML a => a -> a Source #

Quarter (1/4) screen column container

threequarter :: BuildXML a => a -> a Source #

Three quarters (3/4) screen column container

col :: BuildXML a => a -> a Source #

Column container for any HTML content

rest :: BuildXML a => a -> a Source #

Occupies the rest of the column width

hideSmall :: BuildXML a => a -> a Source #

Hide content on small screens (less than 601px)

hideMedium :: BuildXML a => a -> a Source #

Hide content on medium screens

hideLarge :: BuildXML a => a -> a Source #

Hide content on large screens (larger than 992px)

image :: BuildXML a => a -> a Source #

Responsive image

mobile :: BuildXML a => a -> a Source #

Adds mobile-first responsiveness to any element. Displays elements as block elements on mobile devices.

Layout Classes

cellRow :: BuildXML a => a -> a Source #

Container for layout columns (cells).

cell :: BuildXML a => a -> a Source #

Layout column (cell).

cellTop :: BuildXML a => a -> a Source #

Aligns content at the top of a column (cell).

cellMiddle :: BuildXML a => a -> a Source #

Aligns content at the vertical middle of a column (cell).

cellBottom :: BuildXML a => a -> a Source #

Aligns content at the bottom of a column (cell).

Bar Classes - Navigation

bar :: BuildXML a => a -> a Source #

Horizontal bar

barBlock :: BuildXML a => a -> a Source #

Vertical bar

barItem :: BuildXML a => a -> a Source #

Provides common style for bar items

sidebar :: BuildXML a => a -> a Source #

Side bar

collapse :: BuildXML a => a -> a Source #

Used together with w3-sidebar to create a fully automatic responsive side navigation. For this class to work, the page content must be within a "w3-main" class

mainPage :: BuildXML a => a -> a Source #

Container for page content when using the w3-collapse class for responsive side navigations

Dropdown Classes

dropdownClick :: BuildXML a => a -> a Source #

Clickable dropdown element

dropdownHover :: BuildXML a => a -> a Source #

Hoverable dropdown element

Button Classes

button :: BuildXML a => String -> a -> a Source #

Rectangular button with grey background color on hover

btn :: BuildXML a => String -> a -> a Source #

Rectangular button with shadows on hover

ripple :: BuildXML a => String -> a -> a Source #

Rectangular button with ripple effect

Input Classes

input :: BuildXML a => a -> a Source #

Input elements

check :: BuildXML a => a -> a Source #

Checkbox input type

radio :: BuildXML a => a -> a Source #

Radio input type

select :: BuildXML a => a -> a Source #

Input select element

Modal Classes

modal :: BuildXML a => a -> a Source #

Modal container

modalContent :: BuildXML a => a -> a Source #

Modal pop-up element

tooltip :: BuildXML a => a -> a Source #

Tooltip element

tooltipText :: BuildXML a => a -> a Source #

Tooltip text

Animation Classes

animate :: BuildXML a => Position -> a -> a Source #

Animates an element from -300px to 0px

animateOpacity :: BuildXML a => a -> a Source #

Animates an element's opacity from 0 to 1

animateZoom :: BuildXML a => a -> a Source #

Animates an element from 0 to 100% in size

animateFading :: BuildXML a => a -> a Source #

Animates an element's opacity from 0 to 1 and 1 to 0 (fades in AND out)

spin :: BuildXML a => a -> a Source #

Spin an icon 360 degrees

animateInput :: BuildXML a => a -> a Source #

Animates the width of an input field to 100%

Font and Text Classes

fontSize :: BuildXML a => Size -> a -> a Source #

Specifies a font size: tiny 10px, small 12px, large 18px, xlarge 24px, xxlarge 32px, xxxlarge 48px, jumbo 64px

wide :: BuildXML a => a -> a Source #

Specifies a wider text

serif :: BuildXML a => a -> a Source #

Changes the font to serif

Display Classes

center :: BuildXML a => a -> a Source #

Centered content

left :: BuildXML a => a -> a Source #

Floats an element to the left (float: left)

right :: BuildXML a => a -> a Source #

Floats an element to the right (float: right)

leftAlign :: BuildXML a => a -> a Source #

Left aligned text

rightAlign :: BuildXML a => a -> a Source #

Right aligned text

justify :: BuildXML a => a -> a Source #

Right and left aligned text

circle :: BuildXML a => a -> a Source #

Circled content

hide :: BuildXML a => a -> a Source #

Hidden content (display:none)

showBlock :: BuildXML a => a -> a Source #

Alias of w3-show (display:block)

showInlineBlock :: BuildXML a => a -> a Source #

Show content as inline-block (display:inline-block)

top :: BuildXML a => a -> a Source #

Fixed content at the top of a page

bottom :: BuildXML a => a -> a Source #

Fixed content at the bottom of a page

display :: BuildXML a => Position -> a -> a Source #

Container for w3-display-classes (position: relative)

displayHover :: BuildXML a => a -> a Source #

Displays content on hover inside the w3-display-container

Effect Classes

opacity :: BuildXML a => a -> a Source #

Adds opacity/transparency to an element (opacity: 0.6)

opacityOff :: BuildXML a => a -> a Source #

Turns off opacity/transparency (opacity: 1)

opacityMin :: BuildXML a => a -> a Source #

Adds opacity/transparency to an element (opacity: 0.75)

opacityMax :: BuildXML a => a -> a Source #

Adds opacity/transparency to an element (opacity: 0.25)

grayscaleMin :: BuildXML a => a -> a Source #

Adds a grayscale effect to an element (grayscale: 50%)

grayscale :: BuildXML a => a -> a Source #

Adds a grayscale effect to an element (grayscale: 75%)

grayscaleMax :: BuildXML a => a -> a Source #

Adds a grayscale effect to an element (grayscale: 100%)

sepiaMin :: BuildXML a => a -> a Source #

Adds a sepia effect to an element (sepia: 50%)

sepia :: BuildXML a => a -> a Source #

Adds a sepia effect to an element (sepia: 75%)

sepiaMax :: BuildXML a => a -> a Source #

Adds a sepia effect to an element (sepia: 100%)

overlay :: BuildXML a => a -> a Source #

Creates an overlay effect

Background Color Classes

background :: BuildXML a => Color -> a -> a Source #

Background color

transparent :: BuildXML a => a -> a Source #

Transparent background-color

hover :: BuildXML a => Color -> a -> a Source #

Hover color

Text Color Classes

textColor :: BuildXML a => Color -> a -> a Source #

Text color

Hover Classes

hoverColor :: BuildXML a => Color -> a -> a Source #

Hover text color

hoverOpacity :: BuildXML a => a -> a Source #

Adds transparency to an element on hover (opacity: 0.6)

hoverOpacityOff :: BuildXML a => a -> a Source #

Removes transparency from an element on hover (100% opacity)

hoverShadow :: BuildXML a => a -> a Source #

Adds shadow to an element on hover

hoverGrayscale :: BuildXML a => a -> a Source #

Adds a black and white (100% grayscale) effect to an element

hoverSepia :: BuildXML a => a -> a Source #

Adds a sepia effect to an element on hover

hoverNone :: BuildXML a => a -> a Source #

Removes hover effects from an element

Round Classes

rounded :: BuildXML a => Size -> a -> a Source #

Element rounded (border-radius): small 2px, medium 4px, large 8px, xlarge 16px, xxlarge 32px

Padding Classes

padding :: BuildXML a => Size -> a -> a Source #

Small: Padding 4px top and bottom, and 8px left and right, Medium: Padding 8px top and bottom, and 16px left and right, Large: Padding 12px top and bottom, and 24px left and right.

vpadding :: BuildXML a => Size -> a -> a Source #

Padding top and bottom: medium 16px, large 24px, xlarge 32px, xxlarge 48px, xxxlarge 64px

Margin Classes

margin :: BuildXML a => a -> a Source #

Adds an 16px margin to an element

marginPos :: BuildXML a => Position -> a -> a Source #

section :: BuildXML a => a -> a Source #

Adds an 16px top and bottom margin to an element

Border Classes

border :: BuildXML a => a -> a Source #

Borders (top, right, bottom, left)

borderPos :: BuildXML a => Position -> a -> a Source #

noBorder :: BuildXML a => a -> a Source #

Removes all borders

borderColor :: BuildXML a => Color -> a -> a Source #

Border color

barPos :: BuildXML a => Position -> a -> a Source #

Adds a thick border (bar) to an element

Color themes

data ColorTheme Source #

Constructors

L1 
L2 
L3 
L4 
L5 
D1 
D2 
D3 
D4 
D5 

theme_ :: BuildXML a => a -> a Source #

textTheme :: BuildXML a => a -> a Source #

borderTheme :: BuildXML a => a -> a Source #

theme :: BuildXML a => ColorTheme -> a -> a Source #