MichaelCombs28 / elm-css-bulma / Bulma.Styled.Modifiers

Most Bulma elements have alternative styles. These types will come in handy for various modifiers records throughout this library. Also included are a set of helpers for style, layout.

Table of Contents

Types

Size


type alias Size =
Internal.Size

small : Size

standard : Size

medium : Size

large : Size


type alias Width =
Internal.Width

auto : Width

width1 : Width

width2 : Width

width3 : Width

width4 : Width

width5 : Width

width6 : Width

width7 : Width

width8 : Width

width9 : Width

width10 : Width

width11 : Width

State


type alias State =
Internal.State

blur : State

hover : State

focus : State

active : State

loading : State


type alias IsActive =
Internal.IsActive

Color


type alias Color =
Internal.Color

default : Color

white : Color

light : Color

dark : Color

black : Color

primary : Color

link : Color

info : Color

success : Color

warning : Color

danger : Color

Alignment


type alias HorizontalAlignment =
Internal.HorizontalAlignment

left : HorizontalAlignment

centered : HorizontalAlignment

right : HorizontalAlignment


type alias VerticalAlignment =
Internal.VerticalAlignment

top : VerticalAlignment

bottom : VerticalAlignment

verticallyCentered : VerticalAlignment

Direction


type alias VerticalDirection =
Internal.VerticalDirection

up : VerticalDirection

down : VerticalDirection

Attributes

General

Float

clearfix : Html.Styled.Attribute msg

Fixes an element's floating children.

pulledLeft : Html.Styled.Attribute msg

Moves an element to the left.

pulledRight : Html.Styled.Attribute msg

Moves an element to the right.

Overlay

overlay : Html.Styled.Attribute msg

Completely covers the first-positioned parent.

Size

Sizing

fullWidth : Html.Styled.Attribute msg

Takes up the whole width (100%).

Spacing

marginless : Html.Styled.Attribute msg

Removes all margins.

paddingless : Html.Styled.Attribute msg

Removes all paddings.

Selectability

unselectable : Html.Styled.Attribute msg

Prevents text from being selectable.

Overflow

clipped : Html.Styled.Attribute msg

Adds overflow:hidden.

Style

radiusless : Html.Styled.Attribute msg

Removes any radius.

shadowless : Html.Styled.Attribute msg

Removes any shadow.

invisible : Html.Styled.Attribute msg

Makes it disappear.

screenReaderOnly : Html.Styled.Attribute msg

Hides element visually, but keeps the element available to be announced by a screen reader.

Display


type alias Devices a =
Internal.Devices a


type alias Display =
Internal.Display

block : Display

flex : Display

hidden : Display

inline : Display

inlineBlock : Display

inlineFlex : Display

display : Display -> Html.Styled.Attribute msg

This sets a certain display attributes across all device sizes.

displayByDevice : Devices Display -> Html.Styled.Attribute msg

This sets display attributes per-device.

tabletOnly =
    displayByDevice
        { mobile = Hidden
        , tablet = Block
        , desktop = Hidden
        , widescreen = Hidden
        , fullHD = Hidden
        }

Typography

See Bulma.Modifiiers.Typography.