Safe Haskell	Safe-Inferred
Language	GHC2021

Web.View.Types

Contents

Attribute Modifiers
Atomic CSS
- Colors

Synopsis

data Content
- = Node Element
- | Text Text
- | Raw Text
data Element = Element {
- name :: Name
- attributes :: Attributes
- children :: [Content]
}
data Attributes = Attributes {
- classes :: [Class]
- other :: Map Name AttValue
}
type Attribute = (Name, AttValue)
type Name = Text
type AttValue = Text
type Mod = Attributes -> Attributes
type CSS = Map Selector Class
data Class = Class {
- selector :: Selector
- properties :: Styles
}
type Styles = Map Name StyleValue
data Selector = Selector {
- parent :: Maybe Text
- pseudo :: Maybe Pseudo
- media :: Maybe Media
- className :: ClassName
}
selector :: ClassName -> Selector
newtype ClassName = ClassName {
- text :: Text
}
class ToClassName a where
- toClassName :: a -> Text
data Pseudo
- = Hover
- | Active
- | Even
- | Odd
newtype StyleValue = StyleValue String
class ToStyleValue a where
- toStyleValue :: a -> StyleValue
data Length
- = PxRem PxRem
- | Pct Float
newtype PxRem = PxRem' Int
newtype Ms = Ms Int
data Media
- = MinWidth Int
- | MaxWidth Int
data Sides a
- = All a
- | TRBL a a a a
- | X a
- | Y a
- | XY a a
newtype FlatAttributes = FlatAttributes {
- attributes :: Map Name AttValue
}
class ToColor a where
- colorValue :: a -> HexColor
- colorName :: a -> Text
newtype HexColor = HexColor Text
data Align = Center

Documentation

data Content Source #

Constructors

Node Element
Text Text
Raw Text	Raw embedded HTML or SVG. See `raw`

data Element Source #

A single HTML tag. Note that the class attribute is stored separately from the rest of the attributes to make adding styles easier

Constructors

Element
Fields name :: Name attributes :: Attributes children :: [Content]

data Attributes Source #

Constructors

Attributes
Fields classes :: [Class] other :: Map Name AttValue

Instances

Instances details

Monoid Attributes Source #
Instance details Defined in Web.View.Types Methods mempty :: Attributes # mappend :: Attributes -> Attributes -> Attributes # mconcat :: [Attributes] -> Attributes #
Semigroup Attributes Source #
Instance details Defined in Web.View.Types Methods (<>) :: Attributes -> Attributes -> Attributes # sconcat :: NonEmpty Attributes -> Attributes # stimes :: Integral b => b -> Attributes -> Attributes #

type Attribute = (Name, AttValue) Source #

type Name = Text Source #

type AttValue = Text Source #

Attribute Modifiers

type Mod = Attributes -> Attributes Source #

Element functions expect a Mod function as their first argument that adds attributes and classes.

userEmail :: User -> View c ()
userEmail user = input (fontSize 16 . active) (text user.email)
  where
    active = isActive user then bold else id

Atomic CSS

type CSS = Map Selector Class Source #

All the atomic classes used in a View

data Class Source #

Atomic classes include a selector and the corresponding styles

Constructors

Class
Fields selector :: Selector properties :: Styles

type Styles = Map Name StyleValue Source #

The styles to apply for a given atomic Class

data Selector Source #

The selector to use for the given atomic Class

Constructors

Selector
Fields parent :: Maybe Text pseudo :: Maybe Pseudo media :: Maybe Media className :: ClassName

Instances

Instances details

IsString Selector Source #
Instance details Defined in Web.View.Types Methods fromString :: String -> Selector #
Eq Selector Source #
Instance details Defined in Web.View.Types Methods (==) :: Selector -> Selector -> Bool # (/=) :: Selector -> Selector -> Bool #
Ord Selector Source #
Instance details Defined in Web.View.Types Methods compare :: Selector -> Selector -> Ordering # (<) :: Selector -> Selector -> Bool # (<=) :: Selector -> Selector -> Bool # (>) :: Selector -> Selector -> Bool # (>=) :: Selector -> Selector -> Bool # max :: Selector -> Selector -> Selector # min :: Selector -> Selector -> Selector #

selector :: ClassName -> Selector Source #

Create a Selector given only a ClassName

newtype ClassName Source #

A class name

Constructors

ClassName
Fields text :: Text

Instances

Instances details

IsString ClassName Source #
Instance details Defined in Web.View.Types Methods fromString :: String -> ClassName #
Eq ClassName Source #
Instance details Defined in Web.View.Types Methods (==) :: ClassName -> ClassName -> Bool # (/=) :: ClassName -> ClassName -> Bool #
Ord ClassName Source #
Instance details Defined in Web.View.Types Methods compare :: ClassName -> ClassName -> Ordering # (<) :: ClassName -> ClassName -> Bool # (<=) :: ClassName -> ClassName -> Bool # (>) :: ClassName -> ClassName -> Bool # (>=) :: ClassName -> ClassName -> Bool # max :: ClassName -> ClassName -> ClassName # min :: ClassName -> ClassName -> ClassName #

class ToClassName a where Source #

Convert a type into a className segment to generate unique compound style names based on the value

Minimal complete definition

Nothing

Methods

toClassName :: a -> Text Source #

default toClassName :: Show a => a -> Text Source #

Instances

Instances details

ToClassName Text Source #
Instance details Defined in Web.View.Types Methods toClassName :: Text -> Text Source #
ToClassName Align Source #
Instance details Defined in Web.View.Types Methods toClassName :: Align -> Text Source #
ToClassName Length Source #
Instance details Defined in Web.View.Types Methods toClassName :: Length -> Text Source #
ToClassName Ms Source #
Instance details Defined in Web.View.Types Methods toClassName :: Ms -> Text Source #
ToClassName PxRem Source #
Instance details Defined in Web.View.Types Methods toClassName :: PxRem -> Text Source #
ToClassName Float Source #
Instance details Defined in Web.View.Types Methods toClassName :: Float -> Text Source #
ToClassName Int Source #
Instance details Defined in Web.View.Types Methods toClassName :: Int -> Text Source #

data Pseudo Source #

Psuedos allow for specifying styles that only apply in certain conditions. See hover etc

el (color Primary . hover (color White)) "hello"

Constructors

Hover
Active
Even
Odd

Instances

Instances details

Show Pseudo Source #
Instance details Defined in Web.View.Types Methods showsPrec :: Int -> Pseudo -> ShowS # show :: Pseudo -> String # showList :: [Pseudo] -> ShowS #
Eq Pseudo Source #
Instance details Defined in Web.View.Types Methods (==) :: Pseudo -> Pseudo -> Bool # (/=) :: Pseudo -> Pseudo -> Bool #
Ord Pseudo Source #
Instance details Defined in Web.View.Types Methods compare :: Pseudo -> Pseudo -> Ordering # (<) :: Pseudo -> Pseudo -> Bool # (<=) :: Pseudo -> Pseudo -> Bool # (>) :: Pseudo -> Pseudo -> Bool # (>=) :: Pseudo -> Pseudo -> Bool # max :: Pseudo -> Pseudo -> Pseudo # min :: Pseudo -> Pseudo -> Pseudo #

newtype StyleValue Source #

The value of a css style property

Constructors

StyleValue String

Instances

Instances details

IsString StyleValue Source #
Instance details Defined in Web.View.Types Methods fromString :: String -> StyleValue #
Show StyleValue Source #
Instance details Defined in Web.View.Types Methods showsPrec :: Int -> StyleValue -> ShowS # show :: StyleValue -> String # showList :: [StyleValue] -> ShowS #

class ToStyleValue a where Source #

Use a type as a css style property value

Minimal complete definition

Nothing

Methods

toStyleValue :: a -> StyleValue Source #

default toStyleValue :: Show a => a -> StyleValue Source #

Instances

Instances details

ToStyleValue Text Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: Text -> StyleValue Source #
ToStyleValue Align Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: Align -> StyleValue Source #
ToStyleValue HexColor Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: HexColor -> StyleValue Source #
ToStyleValue Length Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: Length -> StyleValue Source #
ToStyleValue Ms Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: Ms -> StyleValue Source #
ToStyleValue PxRem Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: PxRem -> StyleValue Source #
ToStyleValue String Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: String -> StyleValue Source #
ToStyleValue Float Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: Float -> StyleValue Source #
ToStyleValue Int Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: Int -> StyleValue Source #

data Length Source #

Constructors

PxRem PxRem	Px, converted to Rem. Allows for the user to change the document font size and have the app scale accordingly. But allows the programmer to code in pixels to match a design
Pct Float

Instances

Instances details

Num Length Source #
Instance details Defined in Web.View.Types Methods (+) :: Length -> Length -> Length # (-) :: Length -> Length -> Length # (*) :: Length -> Length -> Length # negate :: Length -> Length # abs :: Length -> Length # signum :: Length -> Length # fromInteger :: Integer -> Length #
Show Length Source #
Instance details Defined in Web.View.Types Methods showsPrec :: Int -> Length -> ShowS # show :: Length -> String # showList :: [Length] -> ShowS #
ToClassName Length Source #
Instance details Defined in Web.View.Types Methods toClassName :: Length -> Text Source #
ToStyleValue Length Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: Length -> StyleValue Source #

newtype PxRem Source #

Constructors

PxRem' Int

Instances

Instances details

Enum PxRem Source #
Instance details Defined in Web.View.Types Methods succ :: PxRem -> PxRem # pred :: PxRem -> PxRem # toEnum :: Int -> PxRem # fromEnum :: PxRem -> Int # enumFrom :: PxRem -> [PxRem] # enumFromThen :: PxRem -> PxRem -> [PxRem] # enumFromTo :: PxRem -> PxRem -> [PxRem] # enumFromThenTo :: PxRem -> PxRem -> PxRem -> [PxRem] #
Num PxRem Source #
Instance details Defined in Web.View.Types Methods (+) :: PxRem -> PxRem -> PxRem # (-) :: PxRem -> PxRem -> PxRem # (*) :: PxRem -> PxRem -> PxRem # negate :: PxRem -> PxRem # abs :: PxRem -> PxRem # signum :: PxRem -> PxRem # fromInteger :: Integer -> PxRem #
Integral PxRem Source #
Instance details Defined in Web.View.Types Methods quot :: PxRem -> PxRem -> PxRem # rem :: PxRem -> PxRem -> PxRem # div :: PxRem -> PxRem -> PxRem # mod :: PxRem -> PxRem -> PxRem # quotRem :: PxRem -> PxRem -> (PxRem, PxRem) # divMod :: PxRem -> PxRem -> (PxRem, PxRem) # toInteger :: PxRem -> Integer #
Real PxRem Source #
Instance details Defined in Web.View.Types Methods toRational :: PxRem -> Rational #
Show PxRem Source #
Instance details Defined in Web.View.Types Methods showsPrec :: Int -> PxRem -> ShowS # show :: PxRem -> String # showList :: [PxRem] -> ShowS #
Eq PxRem Source #
Instance details Defined in Web.View.Types Methods (==) :: PxRem -> PxRem -> Bool # (/=) :: PxRem -> PxRem -> Bool #
Ord PxRem Source #
Instance details Defined in Web.View.Types Methods compare :: PxRem -> PxRem -> Ordering # (<) :: PxRem -> PxRem -> Bool # (<=) :: PxRem -> PxRem -> Bool # (>) :: PxRem -> PxRem -> Bool # (>=) :: PxRem -> PxRem -> Bool # max :: PxRem -> PxRem -> PxRem # min :: PxRem -> PxRem -> PxRem #
ToClassName PxRem Source #
Instance details Defined in Web.View.Types Methods toClassName :: PxRem -> Text Source #
ToStyleValue PxRem Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: PxRem -> StyleValue Source #

newtype Ms Source #

Milliseconds, used for transitions

Constructors

Ms Int

Instances

Instances details

Num Ms Source #
Instance details Defined in Web.View.Types Methods (+) :: Ms -> Ms -> Ms # (-) :: Ms -> Ms -> Ms # (*) :: Ms -> Ms -> Ms # negate :: Ms -> Ms # abs :: Ms -> Ms # signum :: Ms -> Ms # fromInteger :: Integer -> Ms #
Show Ms Source #
Instance details Defined in Web.View.Types Methods showsPrec :: Int -> Ms -> ShowS # show :: Ms -> String # showList :: [Ms] -> ShowS #
ToClassName Ms Source #
Instance details Defined in Web.View.Types Methods toClassName :: Ms -> Text Source #
ToStyleValue Ms Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: Ms -> StyleValue Source #

data Media Source #

Media allows for responsive designs that change based on characteristics of the window. See Layout Example

Constructors

MinWidth Int
MaxWidth Int

Instances

Instances details

Eq Media Source #
Instance details Defined in Web.View.Types Methods (==) :: Media -> Media -> Bool # (/=) :: Media -> Media -> Bool #
Ord Media Source #
Instance details Defined in Web.View.Types Methods compare :: Media -> Media -> Ordering # (<) :: Media -> Media -> Bool # (<=) :: Media -> Media -> Bool # (>) :: Media -> Media -> Bool # (>=) :: Media -> Media -> Bool # max :: Media -> Media -> Media # min :: Media -> Media -> Media #

data Sides a Source #

Options for styles that support specifying various sides. This has a "fake" Num instance to support literals

border 5
border (X 2)
border (TRBL 0 5 0 0)

Constructors

All a
TRBL a a a a
X a
Y a
XY a a

Instances

Instances details

Num a => Num (Sides a) Source #
Instance details Defined in Web.View.Types Methods (+) :: Sides a -> Sides a -> Sides a # (-) :: Sides a -> Sides a -> Sides a # (*) :: Sides a -> Sides a -> Sides a # negate :: Sides a -> Sides a # abs :: Sides a -> Sides a # signum :: Sides a -> Sides a # fromInteger :: Integer -> Sides a #

newtype FlatAttributes Source #

Element's attributes do not include class, which is separated. FlatAttributes generate the class attribute and include it

Constructors

FlatAttributes
Fields attributes :: Map Name AttValue

Instances

Instances details

Generic FlatAttributes Source #
Instance details Defined in Web.View.Types Associated Types type Rep FlatAttributes :: Type -> Type # Methods from :: FlatAttributes -> Rep FlatAttributes x # to :: Rep FlatAttributes x -> FlatAttributes #
type Rep FlatAttributes Source #
Instance details Defined in Web.View.Types type Rep FlatAttributes = D1 ('MetaData "FlatAttributes" "Web.View.Types" "web-view-0.4.0-inplace" 'True) (C1 ('MetaCons "FlatAttributes" 'PrefixI 'True) (S1 ('MetaSel ('Just "attributes") 'NoSourceUnpackedness 'NoSourceStrictness 'DecidedLazy) (Rec0 (Map Name AttValue))))

Colors

class ToColor a where Source #

ToColor allows you to create a type containing your application's colors:

data AppColor
  = White
  | Primary
  | Dark

instance ToColor AppColor where
  colorValue White = "#FFF"
  colorValue Dark = "#333"
  colorValue Primary = "#00F"

hello :: View c ()
hello = el (bg Primary . color White) "Hello"

Minimal complete definition

colorValue

Methods

colorValue :: a -> HexColor Source #

colorName :: a -> Text Source #

default colorName :: Show a => a -> Text Source #

Instances

Instances details

ToColor HexColor Source #
Instance details Defined in Web.View.Types Methods colorValue :: HexColor -> HexColor Source # colorName :: HexColor -> Text Source #

newtype HexColor Source #

Hexidecimal Color. Can be specified with or without the leading #. Recommended to use an AppColor type instead of manually using hex colors. See ToColor

Constructors

HexColor Text

Instances

Instances details

IsString HexColor Source #
Instance details Defined in Web.View.Types Methods fromString :: String -> HexColor #
ToColor HexColor Source #
Instance details Defined in Web.View.Types Methods colorValue :: HexColor -> HexColor Source # colorName :: HexColor -> Text Source #
ToStyleValue HexColor Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: HexColor -> StyleValue Source #

data Align Source #

Constructors

Center

Instances

Instances details

Show Align Source #
Instance details Defined in Web.View.Types Methods showsPrec :: Int -> Align -> ShowS # show :: Align -> String # showList :: [Align] -> ShowS #
ToClassName Align Source #
Instance details Defined in Web.View.Types Methods toClassName :: Align -> Text Source #
ToStyleValue Align Source #
Instance details Defined in Web.View.Types Methods toStyleValue :: Align -> StyleValue Source #