[ { "name": "Svg.Styled.Keyed", "comment": " Drop-in replacement for the `Svg.Keyed` module from the `elm-lang/svg` package.\n\nA keyed node helps optimize cases where children are getting added, moved,\nremoved, etc. Common examples include:\n\n - The user can delete items from a list.\n - The user can create new items in a list.\n - You can sort a list based on name or date or whatever.\n\nWhen you use a keyed node, every child is paired with a string identifier. This\nmakes it possible for the underlying diffing algorithm to reuse nodes more\nefficiently.\n\n\n# Keyed Nodes\n\n@docs node\n\n", "unions": [], "aliases": [], "values": [ { "name": "node", "comment": " Works just like `Svg.node`, but you add a unique identifier to each child\nnode. You want this when you have a list of nodes that is changing: adding\nnodes, removing nodes, etc. In these cases, the unique identifiers help make\nthe DOM modifications more efficient.\n", "type": "String -> List (Attribute msg) -> List ( String, Svg msg ) -> Svg msg" } ], "binops": [] }, { "name": "Svg.Styled.Lazy", "comment": " A not-quite-drop-in replacement for the `Svg.Lazy` module from the\n`elm-lang/svg` package.\n\nThe only difference between this and the `lazy` from `elm-lang/svg` is that the\ncaller must call `toUnstyled` inside the function being passed to `lazy`.\n\nFor example:\n\n import Css exposing (backgroundColor, rgb)\n import Svg.Styled exposing (Svg, circle, svg, toUnstyled)\n import Svg.Styled.Attributes exposing (css, cx, cy, r, viewBox)\n import Svg.Styled.Lazy exposing (lazy)\n import VirtualDom\n\n\n view : Model -> Svg Msg\n view model =\n svg [ viewBox \"0 0 100 100\" ]\n [ lazy viewCircle model.radius\n ]\n\n\n viewCircle : Int -> VirtualDom.Node msg\n viewCircle radius =\n circle\n [ cx \"60\"\n , cy \"60\"\n , r (toString radius)\n , css [ backgroundColor (rgb 200 0 0) ]\n ]\n |> toUnstyled -- toUnstyled must happen inside viewCircle!\n\n@docs lazy, lazy2, lazy3\n\n", "unions": [], "aliases": [], "values": [ { "name": "lazy", "comment": " A performance optimization that delays the building of virtual DOM nodes.\n\nCalling `(view model)` will definitely build some virtual DOM, perhaps a lot of\nit. Calling `(lazy view model)` delays the call until later. During diffing, we\ncan check to see if `model` is referentially equal to the previous value used,\nand if so, we just stop. No need to build up the tree structure and diff it,\nwe know if the input to `view` is the same, the output must be the same!\n\n", "type": "(a -> Node msg) -> a -> Svg msg" }, { "name": "lazy2", "comment": " Same as `lazy` but checks on two arguments.\n", "type": "(a -> b -> Node msg) -> a -> b -> Svg msg" }, { "name": "lazy3", "comment": " Same as `lazy` but checks on three arguments.\n", "type": "(a -> b -> c -> Node msg) -> a -> b -> c -> Svg msg" } ], "binops": [] }, { "name": "Svg.Styled.Attributes", "comment": " Drop-in replacement for the `Svg.Attributes` module from the `elm-lang/svg` package.\nThe only functions added are `css`, and `fromUnstyled`:\n\n@docs css, fromUnstyled\n\n\n# Regular attributes\n\n@docs accentHeight, accelerate, accumulate, additive, alphabetic, allowReorder, amplitude, arabicForm, ascent, attributeName, attributeType, autoReverse, azimuth, baseFrequency, baseProfile, bbox, begin, bias, by, calcMode, capHeight, class, clipPathUnits, contentScriptType, contentStyleType, cx, cy, d, decelerate, descent, diffuseConstant, divisor, dur, dx, dy, edgeMode, elevation, end, exponent, externalResourcesRequired, filterRes, filterUnits, format, from, fx, fy, g1, g2, glyphName, glyphRef, gradientTransform, gradientUnits, hanging, height, horizAdvX, horizOriginX, horizOriginY, id, ideographic, in_, in2, intercept, k, k1, k2, k3, k4, kernelMatrix, kernelUnitLength, keyPoints, keySplines, keyTimes, lang, lengthAdjust, limitingConeAngle, local, markerHeight, markerUnits, markerWidth, maskContentUnits, maskUnits, mathematical, max, media, method, min, mode, name, numOctaves, offset, operator, order, orient, orientation, origin, overlinePosition, overlineThickness, panose1, path, pathLength, patternContentUnits, patternTransform, patternUnits, pointOrder, points, pointsAtX, pointsAtY, pointsAtZ, preserveAlpha, preserveAspectRatio, primitiveUnits, r, radius, refX, refY, renderingIntent, repeatCount, repeatDur, requiredExtensions, requiredFeatures, restart, result, rotate, rx, ry, scale, seed, slope, spacing, specularConstant, specularExponent, speed, spreadMethod, startOffset, stdDeviation, stemh, stemv, stitchTiles, strikethroughPosition, strikethroughThickness, string, style, surfaceScale, systemLanguage, tableValues, target, targetX, targetY, textLength, title, to, transform, type_, u1, u2, underlinePosition, underlineThickness, unicode, unicodeRange, unitsPerEm, vAlphabetic, vHanging, vIdeographic, vMathematical, values, version, vertAdvY, vertOriginX, vertOriginY, viewBox, viewTarget, width, widths, x, xHeight, x1, x2, xChannelSelector, xlinkActuate, xlinkArcrole, xlinkHref, xlinkRole, xlinkShow, xlinkTitle, xlinkType, xmlBase, xmlLang, xmlSpace, y, y1, y2, yChannelSelector, z, zoomAndPan\n\n\n# Presentation attributes\n\n@docs alignmentBaseline, baselineShift, clipPath, clipRule, clip, colorInterpolationFilters, colorInterpolation, colorProfile, colorRendering, color, cursor, direction, display, dominantBaseline, enableBackground, fillOpacity, fillRule, fill, filter, floodColor, floodOpacity, fontFamily, fontSizeAdjust, fontSize, fontStretch, fontStyle, fontVariant, fontWeight, glyphOrientationHorizontal, glyphOrientationVertical, imageRendering, kerning, letterSpacing, lightingColor, markerEnd, markerMid, markerStart, mask, opacity, overflow, pointerEvents, shapeRendering, stopColor, stopOpacity, strokeDasharray, strokeDashoffset, strokeLinecap, strokeLinejoin, strokeMiterlimit, strokeOpacity, strokeWidth, stroke, textAnchor, textDecoration, textRendering, unicodeBidi, visibility, wordSpacing, writingMode\n\n", "unions": [], "aliases": [], "values": [ { "name": "accelerate", "comment": " ", "type": "String -> Attribute msg" }, { "name": "accentHeight", "comment": " ", "type": "String -> Attribute msg" }, { "name": "accumulate", "comment": " ", "type": "String -> Attribute msg" }, { "name": "additive", "comment": " ", "type": "String -> Attribute msg" }, { "name": "alignmentBaseline", "comment": " ", "type": "String -> Attribute msg" }, { "name": "allowReorder", "comment": " ", "type": "String -> Attribute msg" }, { "name": "alphabetic", "comment": " ", "type": "String -> Attribute msg" }, { "name": "amplitude", "comment": " ", "type": "String -> Attribute msg" }, { "name": "arabicForm", "comment": " ", "type": "String -> Attribute msg" }, { "name": "ascent", "comment": " ", "type": "String -> Attribute msg" }, { "name": "attributeName", "comment": " ", "type": "String -> Attribute msg" }, { "name": "attributeType", "comment": " ", "type": "String -> Attribute msg" }, { "name": "autoReverse", "comment": " ", "type": "String -> Attribute msg" }, { "name": "azimuth", "comment": " ", "type": "String -> Attribute msg" }, { "name": "baseFrequency", "comment": " ", "type": "String -> Attribute msg" }, { "name": "baseProfile", "comment": " ", "type": "String -> Attribute msg" }, { "name": "baselineShift", "comment": " ", "type": "String -> Attribute msg" }, { "name": "bbox", "comment": " ", "type": "String -> Attribute msg" }, { "name": "begin", "comment": " ", "type": "String -> Attribute msg" }, { "name": "bias", "comment": " ", "type": "String -> Attribute msg" }, { "name": "by", "comment": " ", "type": "String -> Attribute msg" }, { "name": "calcMode", "comment": " ", "type": "String -> Attribute msg" }, { "name": "capHeight", "comment": " ", "type": "String -> Attribute msg" }, { "name": "class", "comment": " ", "type": "String -> Attribute msg" }, { "name": "clip", "comment": " ", "type": "String -> Attribute msg" }, { "name": "clipPath", "comment": " ", "type": "String -> Attribute msg" }, { "name": "clipPathUnits", "comment": " ", "type": "String -> Attribute msg" }, { "name": "clipRule", "comment": " ", "type": "String -> Attribute msg" }, { "name": "color", "comment": " ", "type": "String -> Attribute msg" }, { "name": "colorInterpolation", "comment": " ", "type": "String -> Attribute msg" }, { "name": "colorInterpolationFilters", "comment": " ", "type": "String -> Attribute msg" }, { "name": "colorProfile", "comment": " ", "type": "String -> Attribute msg" }, { "name": "colorRendering", "comment": " ", "type": "String -> Attribute msg" }, { "name": "contentScriptType", "comment": " ", "type": "String -> Attribute msg" }, { "name": "contentStyleType", "comment": " ", "type": "String -> Attribute msg" }, { "name": "css", "comment": " Apply styles to an element.\n\nSee the [`Css` module documentation](http://package.elm-lang.org/packages/rtfeldman/elm-css/latest/Css) for an overview of how to use this function.\n\n", "type": "List Style -> Attribute msg" }, { "name": "cursor", "comment": " ", "type": "String -> Attribute msg" }, { "name": "cx", "comment": " ", "type": "String -> Attribute msg" }, { "name": "cy", "comment": " ", "type": "String -> Attribute msg" }, { "name": "d", "comment": " ", "type": "String -> Attribute msg" }, { "name": "decelerate", "comment": " ", "type": "String -> Attribute msg" }, { "name": "descent", "comment": " ", "type": "String -> Attribute msg" }, { "name": "diffuseConstant", "comment": " ", "type": "String -> Attribute msg" }, { "name": "direction", "comment": " ", "type": "String -> Attribute msg" }, { "name": "display", "comment": " ", "type": "String -> Attribute msg" }, { "name": "divisor", "comment": " ", "type": "String -> Attribute msg" }, { "name": "dominantBaseline", "comment": " ", "type": "String -> Attribute msg" }, { "name": "dur", "comment": " ", "type": "String -> Attribute msg" }, { "name": "dx", "comment": " ", "type": "String -> Attribute msg" }, { "name": "dy", "comment": " ", "type": "String -> Attribute msg" }, { "name": "edgeMode", "comment": " ", "type": "String -> Attribute msg" }, { "name": "elevation", "comment": " ", "type": "String -> Attribute msg" }, { "name": "enableBackground", "comment": " ", "type": "String -> Attribute msg" }, { "name": "end", "comment": " ", "type": "String -> Attribute msg" }, { "name": "exponent", "comment": " ", "type": "String -> Attribute msg" }, { "name": "externalResourcesRequired", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fill", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fillOpacity", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fillRule", "comment": " ", "type": "String -> Attribute msg" }, { "name": "filter", "comment": " ", "type": "String -> Attribute msg" }, { "name": "filterRes", "comment": " ", "type": "String -> Attribute msg" }, { "name": "filterUnits", "comment": " ", "type": "String -> Attribute msg" }, { "name": "floodColor", "comment": " ", "type": "String -> Attribute msg" }, { "name": "floodOpacity", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fontFamily", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fontSize", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fontSizeAdjust", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fontStretch", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fontStyle", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fontVariant", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fontWeight", "comment": " ", "type": "String -> Attribute msg" }, { "name": "format", "comment": " ", "type": "String -> Attribute msg" }, { "name": "from", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fromUnstyled", "comment": " ", "type": "Property msg -> Attribute msg" }, { "name": "fx", "comment": " ", "type": "String -> Attribute msg" }, { "name": "fy", "comment": " ", "type": "String -> Attribute msg" }, { "name": "g1", "comment": " ", "type": "String -> Attribute msg" }, { "name": "g2", "comment": " ", "type": "String -> Attribute msg" }, { "name": "glyphName", "comment": " ", "type": "String -> Attribute msg" }, { "name": "glyphOrientationHorizontal", "comment": " ", "type": "String -> Attribute msg" }, { "name": "glyphOrientationVertical", "comment": " ", "type": "String -> Attribute msg" }, { "name": "glyphRef", "comment": " ", "type": "String -> Attribute msg" }, { "name": "gradientTransform", "comment": " ", "type": "String -> Attribute msg" }, { "name": "gradientUnits", "comment": " ", "type": "String -> Attribute msg" }, { "name": "hanging", "comment": " ", "type": "String -> Attribute msg" }, { "name": "height", "comment": " ", "type": "String -> Attribute msg" }, { "name": "horizAdvX", "comment": " ", "type": "String -> Attribute msg" }, { "name": "horizOriginX", "comment": " ", "type": "String -> Attribute msg" }, { "name": "horizOriginY", "comment": " ", "type": "String -> Attribute msg" }, { "name": "id", "comment": " ", "type": "String -> Attribute msg" }, { "name": "ideographic", "comment": " ", "type": "String -> Attribute msg" }, { "name": "imageRendering", "comment": " ", "type": "String -> Attribute msg" }, { "name": "in2", "comment": " ", "type": "String -> Attribute msg" }, { "name": "in_", "comment": " ", "type": "String -> Attribute msg" }, { "name": "intercept", "comment": " ", "type": "String -> Attribute msg" }, { "name": "k", "comment": " ", "type": "String -> Attribute msg" }, { "name": "k1", "comment": " ", "type": "String -> Attribute msg" }, { "name": "k2", "comment": " ", "type": "String -> Attribute msg" }, { "name": "k3", "comment": " ", "type": "String -> Attribute msg" }, { "name": "k4", "comment": " ", "type": "String -> Attribute msg" }, { "name": "kernelMatrix", "comment": " ", "type": "String -> Attribute msg" }, { "name": "kernelUnitLength", "comment": " ", "type": "String -> Attribute msg" }, { "name": "kerning", "comment": " ", "type": "String -> Attribute msg" }, { "name": "keyPoints", "comment": " ", "type": "String -> Attribute msg" }, { "name": "keySplines", "comment": " ", "type": "String -> Attribute msg" }, { "name": "keyTimes", "comment": " ", "type": "String -> Attribute msg" }, { "name": "lang", "comment": " ", "type": "String -> Attribute msg" }, { "name": "lengthAdjust", "comment": " ", "type": "String -> Attribute msg" }, { "name": "letterSpacing", "comment": " ", "type": "String -> Attribute msg" }, { "name": "lightingColor", "comment": " ", "type": "String -> Attribute msg" }, { "name": "limitingConeAngle", "comment": " ", "type": "String -> Attribute msg" }, { "name": "local", "comment": " ", "type": "String -> Attribute msg" }, { "name": "markerEnd", "comment": " ", "type": "String -> Attribute msg" }, { "name": "markerHeight", "comment": " ", "type": "String -> Attribute msg" }, { "name": "markerMid", "comment": " ", "type": "String -> Attribute msg" }, { "name": "markerStart", "comment": " ", "type": "String -> Attribute msg" }, { "name": "markerUnits", "comment": " ", "type": "String -> Attribute msg" }, { "name": "markerWidth", "comment": " ", "type": "String -> Attribute msg" }, { "name": "mask", "comment": " ", "type": "String -> Attribute msg" }, { "name": "maskContentUnits", "comment": " ", "type": "String -> Attribute msg" }, { "name": "maskUnits", "comment": " ", "type": "String -> Attribute msg" }, { "name": "mathematical", "comment": " ", "type": "String -> Attribute msg" }, { "name": "max", "comment": " ", "type": "String -> Attribute msg" }, { "name": "media", "comment": " ", "type": "String -> Attribute msg" }, { "name": "method", "comment": " ", "type": "String -> Attribute msg" }, { "name": "min", "comment": " ", "type": "String -> Attribute msg" }, { "name": "mode", "comment": " ", "type": "String -> Attribute msg" }, { "name": "name", "comment": " ", "type": "String -> Attribute msg" }, { "name": "numOctaves", "comment": " ", "type": "String -> Attribute msg" }, { "name": "offset", "comment": " ", "type": "String -> Attribute msg" }, { "name": "opacity", "comment": " ", "type": "String -> Attribute msg" }, { "name": "operator", "comment": " ", "type": "String -> Attribute msg" }, { "name": "order", "comment": " ", "type": "String -> Attribute msg" }, { "name": "orient", "comment": " ", "type": "String -> Attribute msg" }, { "name": "orientation", "comment": " ", "type": "String -> Attribute msg" }, { "name": "origin", "comment": " ", "type": "String -> Attribute msg" }, { "name": "overflow", "comment": " ", "type": "String -> Attribute msg" }, { "name": "overlinePosition", "comment": " ", "type": "String -> Attribute msg" }, { "name": "overlineThickness", "comment": " ", "type": "String -> Attribute msg" }, { "name": "panose1", "comment": " ", "type": "String -> Attribute msg" }, { "name": "path", "comment": " ", "type": "String -> Attribute msg" }, { "name": "pathLength", "comment": " ", "type": "String -> Attribute msg" }, { "name": "patternContentUnits", "comment": " ", "type": "String -> Attribute msg" }, { "name": "patternTransform", "comment": " ", "type": "String -> Attribute msg" }, { "name": "patternUnits", "comment": " ", "type": "String -> Attribute msg" }, { "name": "pointOrder", "comment": " ", "type": "String -> Attribute msg" }, { "name": "pointerEvents", "comment": " ", "type": "String -> Attribute msg" }, { "name": "points", "comment": " ", "type": "String -> Attribute msg" }, { "name": "pointsAtX", "comment": " ", "type": "String -> Attribute msg" }, { "name": "pointsAtY", "comment": " ", "type": "String -> Attribute msg" }, { "name": "pointsAtZ", "comment": " ", "type": "String -> Attribute msg" }, { "name": "preserveAlpha", "comment": " ", "type": "String -> Attribute msg" }, { "name": "preserveAspectRatio", "comment": " ", "type": "String -> Attribute msg" }, { "name": "primitiveUnits", "comment": " ", "type": "String -> Attribute msg" }, { "name": "r", "comment": " ", "type": "String -> Attribute msg" }, { "name": "radius", "comment": " ", "type": "String -> Attribute msg" }, { "name": "refX", "comment": " ", "type": "String -> Attribute msg" }, { "name": "refY", "comment": " ", "type": "String -> Attribute msg" }, { "name": "renderingIntent", "comment": " ", "type": "String -> Attribute msg" }, { "name": "repeatCount", "comment": " ", "type": "String -> Attribute msg" }, { "name": "repeatDur", "comment": " ", "type": "String -> Attribute msg" }, { "name": "requiredExtensions", "comment": " ", "type": "String -> Attribute msg" }, { "name": "requiredFeatures", "comment": " ", "type": "String -> Attribute msg" }, { "name": "restart", "comment": " ", "type": "String -> Attribute msg" }, { "name": "result", "comment": " ", "type": "String -> Attribute msg" }, { "name": "rotate", "comment": " ", "type": "String -> Attribute msg" }, { "name": "rx", "comment": " ", "type": "String -> Attribute msg" }, { "name": "ry", "comment": " ", "type": "String -> Attribute msg" }, { "name": "scale", "comment": " ", "type": "String -> Attribute msg" }, { "name": "seed", "comment": " ", "type": "String -> Attribute msg" }, { "name": "shapeRendering", "comment": " ", "type": "String -> Attribute msg" }, { "name": "slope", "comment": " ", "type": "String -> Attribute msg" }, { "name": "spacing", "comment": " ", "type": "String -> Attribute msg" }, { "name": "specularConstant", "comment": " ", "type": "String -> Attribute msg" }, { "name": "specularExponent", "comment": " ", "type": "String -> Attribute msg" }, { "name": "speed", "comment": " ", "type": "String -> Attribute msg" }, { "name": "spreadMethod", "comment": " ", "type": "String -> Attribute msg" }, { "name": "startOffset", "comment": " ", "type": "String -> Attribute msg" }, { "name": "stdDeviation", "comment": " ", "type": "String -> Attribute msg" }, { "name": "stemh", "comment": " ", "type": "String -> Attribute msg" }, { "name": "stemv", "comment": " ", "type": "String -> Attribute msg" }, { "name": "stitchTiles", "comment": " ", "type": "String -> Attribute msg" }, { "name": "stopColor", "comment": " ", "type": "String -> Attribute msg" }, { "name": "stopOpacity", "comment": " ", "type": "String -> Attribute msg" }, { "name": "strikethroughPosition", "comment": " ", "type": "String -> Attribute msg" }, { "name": "strikethroughThickness", "comment": " ", "type": "String -> Attribute msg" }, { "name": "string", "comment": " ", "type": "String -> Attribute msg" }, { "name": "stroke", "comment": " ", "type": "String -> Attribute msg" }, { "name": "strokeDasharray", "comment": " ", "type": "String -> Attribute msg" }, { "name": "strokeDashoffset", "comment": " ", "type": "String -> Attribute msg" }, { "name": "strokeLinecap", "comment": " ", "type": "String -> Attribute msg" }, { "name": "strokeLinejoin", "comment": " ", "type": "String -> Attribute msg" }, { "name": "strokeMiterlimit", "comment": " ", "type": "String -> Attribute msg" }, { "name": "strokeOpacity", "comment": " ", "type": "String -> Attribute msg" }, { "name": "strokeWidth", "comment": " ", "type": "String -> Attribute msg" }, { "name": "style", "comment": " ", "type": "String -> Attribute msg" }, { "name": "surfaceScale", "comment": " ", "type": "String -> Attribute msg" }, { "name": "systemLanguage", "comment": " ", "type": "String -> Attribute msg" }, { "name": "tableValues", "comment": " ", "type": "String -> Attribute msg" }, { "name": "target", "comment": " ", "type": "String -> Attribute msg" }, { "name": "targetX", "comment": " ", "type": "String -> Attribute msg" }, { "name": "targetY", "comment": " ", "type": "String -> Attribute msg" }, { "name": "textAnchor", "comment": " ", "type": "String -> Attribute msg" }, { "name": "textDecoration", "comment": " ", "type": "String -> Attribute msg" }, { "name": "textLength", "comment": " ", "type": "String -> Attribute msg" }, { "name": "textRendering", "comment": " ", "type": "String -> Attribute msg" }, { "name": "title", "comment": " ", "type": "String -> Attribute msg" }, { "name": "to", "comment": " ", "type": "String -> Attribute msg" }, { "name": "transform", "comment": " ", "type": "String -> Attribute msg" }, { "name": "type_", "comment": " ", "type": "String -> Attribute msg" }, { "name": "u1", "comment": " ", "type": "String -> Attribute msg" }, { "name": "u2", "comment": " ", "type": "String -> Attribute msg" }, { "name": "underlinePosition", "comment": " ", "type": "String -> Attribute msg" }, { "name": "underlineThickness", "comment": " ", "type": "String -> Attribute msg" }, { "name": "unicode", "comment": " ", "type": "String -> Attribute msg" }, { "name": "unicodeBidi", "comment": " ", "type": "String -> Attribute msg" }, { "name": "unicodeRange", "comment": " ", "type": "String -> Attribute msg" }, { "name": "unitsPerEm", "comment": " ", "type": "String -> Attribute msg" }, { "name": "vAlphabetic", "comment": " ", "type": "String -> Attribute msg" }, { "name": "vHanging", "comment": " ", "type": "String -> Attribute msg" }, { "name": "vIdeographic", "comment": " ", "type": "String -> Attribute msg" }, { "name": "vMathematical", "comment": " ", "type": "String -> Attribute msg" }, { "name": "values", "comment": " ", "type": "String -> Attribute msg" }, { "name": "version", "comment": " ", "type": "String -> Attribute msg" }, { "name": "vertAdvY", "comment": " ", "type": "String -> Attribute msg" }, { "name": "vertOriginX", "comment": " ", "type": "String -> Attribute msg" }, { "name": "vertOriginY", "comment": " ", "type": "String -> Attribute msg" }, { "name": "viewBox", "comment": " ", "type": "String -> Attribute msg" }, { "name": "viewTarget", "comment": " ", "type": "String -> Attribute msg" }, { "name": "visibility", "comment": " ", "type": "String -> Attribute msg" }, { "name": "width", "comment": " ", "type": "String -> Attribute msg" }, { "name": "widths", "comment": " ", "type": "String -> Attribute msg" }, { "name": "wordSpacing", "comment": " ", "type": "String -> Attribute msg" }, { "name": "writingMode", "comment": " ", "type": "String -> Attribute msg" }, { "name": "x", "comment": " ", "type": "String -> Attribute msg" }, { "name": "x1", "comment": " ", "type": "String -> Attribute msg" }, { "name": "x2", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xChannelSelector", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xHeight", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xlinkActuate", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xlinkArcrole", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xlinkHref", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xlinkRole", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xlinkShow", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xlinkTitle", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xlinkType", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xmlBase", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xmlLang", "comment": " ", "type": "String -> Attribute msg" }, { "name": "xmlSpace", "comment": " ", "type": "String -> Attribute msg" }, { "name": "y", "comment": " ", "type": "String -> Attribute msg" }, { "name": "y1", "comment": " ", "type": "String -> Attribute msg" }, { "name": "y2", "comment": " ", "type": "String -> Attribute msg" }, { "name": "yChannelSelector", "comment": " ", "type": "String -> Attribute msg" }, { "name": "z", "comment": " ", "type": "String -> Attribute msg" }, { "name": "zoomAndPan", "comment": " ", "type": "String -> Attribute msg" } ], "binops": [] }, { "name": "Svg.Styled.Events", "comment": " Drop-in replacement for the `Svg.Events` module from the `elm-lang/svg` package.\n\n\n# Animation event attributes\n\n@docs onBegin, onEnd, onRepeat\n\n\n# Document event attributes\n\n@docs onAbort, onError, onResize, onScroll, onLoad, onUnload, onZoom\n\n\n# Graphical event attributes\n\n@docs onActivate, onClick, onFocusIn, onFocusOut, onMouseDown, onMouseMove, onMouseOut, onMouseOver, onMouseUp\n\n\n# Custom Events\n\n@docs on\n\n", "unions": [], "aliases": [], "values": [ { "name": "on", "comment": " Create a custom event listener.\n\n import Json.Decode as Json\n\n onClick : msg -> Attribute msg\n onClick msg =\n on \"click\" (Json.succeed msg)\n\nYou first specify the name of the event in the same format as with JavaScript’s\n`addEventListener`. Next you give a JSON decoder, which lets you pull\ninformation out of the event object. If the decoder succeeds, it will produce\na message and route it to your `update` function.\n\n", "type": "String -> Decoder msg -> Attribute msg" }, { "name": "onAbort", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onActivate", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onBegin", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onClick", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onEnd", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onError", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onFocusIn", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onFocusOut", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onLoad", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onMouseDown", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onMouseMove", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onMouseOut", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onMouseOver", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onMouseUp", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onRepeat", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onResize", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onScroll", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onUnload", "comment": " ", "type": "msg -> Attribute msg" }, { "name": "onZoom", "comment": " ", "type": "msg -> Attribute msg" } ], "binops": [] }, { "name": "Svg.Styled", "comment": " Drop-in replacement for the `Svg` module from the `elm-lang/svg` package.\nThe only functions added are `styled`, `toUnstyled` and `fromUnstyled`:\n\n@docs styled, fromUnstyled, toUnstyled\n\n\n# SVG Nodes\n\n@docs Svg, Attribute, text, node, map\n\n\n# HTML Embedding\n\n@docs svg, foreignObject\n\n\n# Graphics elements\n\n@docs circle, ellipse, image, line, path, polygon, polyline, rect, use\n\n\n# Animation elements\n\n@docs animate, animateColor, animateMotion, animateTransform, mpath, set\n\n\n# Descriptive elements\n\n@docs desc, metadata, title\n\n\n# Containers\n\n@docs a, defs, g, marker, mask, pattern, switch, symbol\n\n\n# Text\n\n@docs altGlyph, altGlyphDef, altGlyphItem, glyph, glyphRef, textPath, text_, tref, tspan\n\n\n# Fonts\n\n@docs font\n\n\n# Gradients\n\n@docs linearGradient, radialGradient, stop\n\n\n# Filters\n\n@docs feBlend, feColorMatrix, feComponentTransfer, feComposite, feConvolveMatrix, feDiffuseLighting, feDisplacementMap, feFlood, feFuncA, feFuncB, feFuncG, feFuncR, feGaussianBlur, feImage, feMerge, feMergeNode, feMorphology, feOffset, feSpecularLighting, feTile, feTurbulence\n\n\n# Light source elements\n\n@docs feDistantLight, fePointLight, feSpotLight\n\n\n# Miscellaneous\n\n@docs clipPath, colorProfile, cursor, filter, script, style, view\n\n", "unions": [], "aliases": [ { "name": "Attribute", "comment": " An [`Attribute`](http://package.elm-lang.org/packages/elm-lang/svg/latest/Svg#Attribute) which supports the [`css`](http://package.elm-lang.org/packages/rtfeldman/elm-css/latest/Svg-Styled-Attributes#css) attribute.\n\nYou can obtain one of these from the normal [`Attribute`](http://package.elm-lang.org/packages/elm-lang/svg/latest/Svg#Attribute) type from [`elm-lang/svg`](http://package.elm-lang.org/packages/elm-lang/svg/latest)\nby using [`fromUnstyled`](http://package.elm-lang.org/packages/elm-lang/svg/latest/Svg-Styled-Attributes#fromUnstyled).\n\n", "args": [ "msg" ], "type": "Property msg" }, { "name": "Svg", "comment": " Styled [`Svg`](http://package.elm-lang.org/packages/elm-lang/svg/latest/Svg#Svg).\n\nYou can convert from this to the normal [`Svg`](http://package.elm-lang.org/packages/elm-lang/svg/latest/Svg#Svg) type from [`elm-lang/svg`](http://package.elm-lang.org/packages/elm-lang/svg/latest)\n(which is a type alias for [`VirtualDom.Node`](http://package.elm-lang.org/packages/elm-lang/virtual-dom/latest/VirtualDom#Node))\nby using [`toUnstyled`](#toUnstyled).\n\nYou can convert the other way using [`fromUnstyled`](#fromUnstyled).\n\n", "args": [ "msg" ], "type": "Node msg" } ], "values": [ { "name": "a", "comment": " The SVG Anchor Element defines a hyperlink.\n", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "altGlyph", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "altGlyphDef", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "altGlyphItem", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "animate", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "animateColor", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "animateMotion", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "animateTransform", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "circle", "comment": " The circle element is an SVG basic shape, used to create circles based on\na center point and a radius.\ncircle [ cx \"60\", cy \"60\", r \"50\" ]\n", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "clipPath", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "colorProfile", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "cursor", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "defs", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "desc", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "ellipse", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feBlend", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feColorMatrix", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feComponentTransfer", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feComposite", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feConvolveMatrix", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feDiffuseLighting", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feDisplacementMap", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feDistantLight", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feFlood", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feFuncA", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feFuncB", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feFuncG", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feFuncR", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feGaussianBlur", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feImage", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feMerge", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feMergeNode", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feMorphology", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feOffset", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "fePointLight", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feSpecularLighting", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feSpotLight", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feTile", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "feTurbulence", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "filter", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "font", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "foreignObject", "comment": " ", "type": "List (Attribute msg) -> List (Html msg) -> Svg msg" }, { "name": "fromUnstyled", "comment": " ", "type": "Node msg -> Svg msg" }, { "name": "g", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "glyph", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "glyphRef", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "image", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "line", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "linearGradient", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "map", "comment": " Transform the messages produced by some `Svg`.\n", "type": "(a -> msg) -> Svg a -> Svg msg" }, { "name": "marker", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "mask", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "metadata", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "mpath", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "node", "comment": " Create any SVG node. To create a `` helper function, you would write:\n\n rect : List (Attribute msg) -> List (Svg msg) -> Svg msg\n rect attributes children =\n node \"rect\" attributes children\n\nYou should always be able to use the helper functions already defined in this\nlibrary though!\n\n", "type": "String -> List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "path", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "pattern", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "polygon", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "polyline", "comment": " The polyline element is an SVG basic shape, used to create a series of\nstraight lines connecting several points. Typically a polyline is used to\ncreate open shapes.\npolyline [ fill \"none\", stroke \"black\", points \"20,100 40,60 70,80 100,20\" ]\n", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "radialGradient", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "rect", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "script", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "set", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "stop", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "style", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "styled", "comment": " Takes a function that creates an element, and pre-applies styles to it.\n", "type": "(List (Attribute msg) -> List (Svg msg) -> Svg msg) -> List Style -> List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "svg", "comment": " The root `` node for any SVG scene. This example shows a scene\ncontaining a rounded rectangle:\n\n import Html.Styled exposing (Html)\n import Svg.Styled exposing (..)\n import Svg.Styled.Attributes exposing (..)\n\n roundRect : Html msg\n roundRect =\n svg\n [ width \"120\", height \"120\", viewBox \"0 0 120 120\" ]\n [ rect [ x \"10\", y \"10\", width \"100\", height \"100\", rx \"15\", ry \"15\" ] [] ]\n\n", "type": "List (Attribute msg) -> List (Svg msg) -> Html msg" }, { "name": "switch", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "symbol", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "text", "comment": " A simple text node, no tags at all.\nWarning: not to be confused with `text_` which produces the SVG `` tag!\n", "type": "String -> Svg msg" }, { "name": "textPath", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "text_", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "title", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "toUnstyled", "comment": " ", "type": "Svg msg -> Node msg" }, { "name": "tref", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "tspan", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "use", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" }, { "name": "view", "comment": " ", "type": "List (Attribute msg) -> List (Svg msg) -> Svg msg" } ], "binops": [] }, { "name": "Css.Foreign", "comment": " Style foreign DOM structures (e.g. generated from markdown) where you cannot\nadd attributes.\n\nThis works by using CSS selectors which are [globally scoped and\nbad for maintainability](https://medium.com/seek-blog/the-end-of-global-css-90d2a4a06284),\nso definitely avoid using this module except when you specifically need to style\nthird-party DOM nodes!\n\n\n# Global Styles\n\n@docs global, Snippet\n\n\n# Statements\n\n@docs class, id, selector, everything, media, mediaQuery\n\n\n# Combinators\n\n@docs children, descendants, adjacentSiblings, generalSiblings, each, withClass\n\n\n# Basic elements\n\n@docs typeSelector, html, body\n\n\n# Content sectioning\n\n@docs article, header, footer, h1, h2, h3, h4, h5, h6, nav, menu, section, aside, time\n\n\n# Text content\n\n@docs div, hr, li, main_, ol, p, ul, pre, dl, dt, dd, blockquote\n\n\n# Inline text semantics\n\n@docs a, code, small, span, strong, i, em, q\n\n\n# Image and multimedia\n\n@docs img, audio, video, canvas\n\n\n# Table content\n\n@docs caption, col, colgroup, table, tbody, td, tfoot, th, thead, tr\n\n\n# Forms\n\n@docs button, fieldset, form, input, label, legend, optgroup, option, progress, select, textarea\n\n\n# SVG\n\n@docs svg, path, rect, circle, ellipse, line, polyline, polygon\n\n", "unions": [], "aliases": [ { "name": "Snippet", "comment": " ", "args": [], "type": "Snippet" } ], "values": [ { "name": "a", "comment": " Selector for an `` element.\n", "type": "List Style -> Snippet" }, { "name": "adjacentSiblings", "comment": " ", "type": "List Snippet -> Style" }, { "name": "article", "comment": " Selector for an article element.\n", "type": "List Style -> Snippet" }, { "name": "aside", "comment": " Selector for a [aside](https://developer.mozilla.org/en/docs/Web/HTML/Element/aside) element.\n", "type": "List Style -> Snippet" }, { "name": "audio", "comment": " Selector for an audio element.\n", "type": "List Style -> Snippet" }, { "name": "blockquote", "comment": " Selector for a blockquote element.\n", "type": "List Style -> Snippet" }, { "name": "body", "comment": " Selector for a body element.\n", "type": "List Style -> Snippet" }, { "name": "button", "comment": " Selector for a button element.\n", "type": "List Style -> Snippet" }, { "name": "canvas", "comment": " Selector for a canvas element.\n", "type": "List Style -> Snippet" }, { "name": "caption", "comment": " Selector for a caption element.\n", "type": "List Style -> Snippet" }, { "name": "children", "comment": " ", "type": "List Snippet -> Style" }, { "name": "circle", "comment": " Selector for a circle element.\n", "type": "List Style -> Snippet" }, { "name": "class", "comment": " A [class selector](https://developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors).\n\n global\n [ class LoginFormButton\n [ fontWeight normal\n , color (rgb 128 64 32)\n ]\n ]\n\n", "type": "class -> List Style -> Snippet" }, { "name": "code", "comment": " Selector for a code element.\n", "type": "List Style -> Snippet" }, { "name": "col", "comment": " Selector for a col element.\n", "type": "List Style -> Snippet" }, { "name": "colgroup", "comment": " Selector for a colgroup element.\n", "type": "List Style -> Snippet" }, { "name": "dd", "comment": " Selector for a dd element.\n\n https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dd\n\n", "type": "List Style -> Snippet" }, { "name": "descendants", "comment": " ", "type": "List Snippet -> Style" }, { "name": "div", "comment": " Selector for a div element.\n", "type": "List Style -> Snippet" }, { "name": "dl", "comment": " Selector for a dl element.\n\n https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dl\n\n", "type": "List Style -> Snippet" }, { "name": "dt", "comment": " Selector for a dt element.\n\n https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dt\n\n", "type": "List Style -> Snippet" }, { "name": "each", "comment": " ", "type": "List (List Style -> Snippet) -> List Style -> Snippet" }, { "name": "ellipse", "comment": " Selector for a ellipse element.\n", "type": "List Style -> Snippet" }, { "name": "em", "comment": " Selector for a em element.\n", "type": "List Style -> Snippet" }, { "name": "everything", "comment": " A [`*` selector](https://developer.mozilla.org/en-US/docs/Web/CSS/Universal_selectors).\n\n class Foo\n [ children\n [ everything\n [ color (rgb 14 15 16)\n , borderRadius (px 5)\n ]\n ]\n ]\n\n...compiles to:\n\n .Foo > * {\n color: rgb(14, 15, 16);\n border-radius: 5px;\n }\n\n", "type": "List Style -> Snippet" }, { "name": "fieldset", "comment": " Selector for a fieldset element.\n", "type": "List Style -> Snippet" }, { "name": "footer", "comment": " Selector for a footer element.\n", "type": "List Style -> Snippet" }, { "name": "form", "comment": " Selector for a form element.\n", "type": "List Style -> Snippet" }, { "name": "generalSiblings", "comment": " ", "type": "List Snippet -> Style" }, { "name": "global", "comment": " Add global styles to the page. This compiles directly to a `\n", "type": "Color" }, { "name": "black", "comment": " \n", "type": "Color" }, { "name": "blue", "comment": " \n", "type": "Color" }, { "name": "fuchsia", "comment": " \n", "type": "Color" }, { "name": "gray", "comment": " \n", "type": "Color" }, { "name": "green", "comment": " \n", "type": "Color" }, { "name": "lime", "comment": " \n", "type": "Color" }, { "name": "maroon", "comment": " \n", "type": "Color" }, { "name": "navy", "comment": " \n", "type": "Color" }, { "name": "olive", "comment": " \n", "type": "Color" }, { "name": "orange", "comment": " \n", "type": "Color" }, { "name": "purple", "comment": " \n", "type": "Color" }, { "name": "red", "comment": " \n", "type": "Color" }, { "name": "silver", "comment": " \n", "type": "Color" }, { "name": "teal", "comment": " \n", "type": "Color" }, { "name": "white", "comment": " \n", "type": "Color" }, { "name": "yellow", "comment": " \n", "type": "Color" } ], "binops": [] }, { "name": "Css.Media", "comment": " Functions for building `@media` queries.\n\n\n\n\n# Data Structures\n\n@docs MediaQuery, MediaType, Expression\n\n\n# `@media` rule constructors\n\n@docs withMedia, withMediaQuery\n\n\n# Query constructors\n\n@docs all, only, not\n\n\n# Media Types\n\n@docs screen, print, speech\n\n\n# Viewport, Page Dimensions Media Features\n\n@docs minWidth, width, maxWidth, minHeight, height, maxHeight, Ratio, ratio\n@docs minAspectRatio, aspectRatio, maxAspectRatio, Landscape, Portrait\n@docs landscape, portrait, orientation\n\n\n# Display Quality Media Features\n\n@docs Resolution, dpi, dpcm, dppx, minResolution, resolution, maxResolution\n@docs scan, Progressive, Interlace, progressive, interlace, scan, grid, Slow\n@docs Fast, slow, fast, update, Paged, OptionalPaged, paged, optionalPaged\n@docs overflowBlock, overflowInline\n\n\n# Color Media Features\n\n@docs Bits, bits, minColor, color, maxColor, minMonochrome, monochrome\n@docs maxMonochrome, minColorIndex, colorIndex, maxColorIndex, SRGB, P3\n@docs Rec2020, srgb, p3, rec2020, colorGamut\n\n\n# Interaction Media Features\n\n@docs Fine, Coarse, fine, coarse, pointer, anyPointer, CanHover, canHover\n@docs hover, anyHover\n\n\n# Scripting Media Features\n\n@docs InitialOnly, Enabled, initialOnly, enabled, scripting\n\n", "unions": [], "aliases": [ { "name": "Bits", "comment": " ", "args": [], "type": "{ value : String, bits : Compatible }" }, { "name": "CanHover", "comment": " ", "args": [], "type": "{ value : String, hoverCapability : Compatible }" }, { "name": "Coarse", "comment": " ", "args": [], "type": "{ value : String, pointerDevice : Compatible }" }, { "name": "Enabled", "comment": " ", "args": [], "type": "{ value : String, scriptingSupport : Compatible }" }, { "name": "Expression", "comment": " A media expression.\n\nAn expression is a media feature with an optional value, which resolves to\neither true or false.\n\nIn the media query `screen and (min-width: 768px)`,\n\n - `screen` is a media type,\n - `min-width` is a media feature, and\n - `(min-width: 768px)` is an expression.\n\n\n\n", "args": [], "type": "MediaExpression" }, { "name": "Fast", "comment": " ", "args": [], "type": "{ value : String, updateFrequency : Compatible }" }, { "name": "Fine", "comment": " ", "args": [], "type": "{ value : String, pointerDevice : Compatible }" }, { "name": "InitialOnly", "comment": " ", "args": [], "type": "{ value : String, scriptingSupport : Compatible }" }, { "name": "Interlace", "comment": " ", "args": [], "type": "{ value : String, scanningProcess : Compatible }" }, { "name": "Landscape", "comment": " ", "args": [], "type": "{ value : String, orientation : Compatible }" }, { "name": "MediaQuery", "comment": " One query of a media rule. A media rule can have multiple queries.\nThe CSS below contains 1 rule, with 2 queries.\n\n```css\n@media print, screen and (monochrome) {\n body {\n color: black;\n }\n}\n```\n\nThe above rule roughly translates as:\n_If the device is a printer or is a monochrome screen, the body color is black._\n\nIn elm-css, queries are joined into rules using a special `MediaQuery`\nreturned by the `or` function.\n\n", "args": [], "type": "MediaQuery" }, { "name": "MediaType", "comment": " A media type.\n\n\n\n", "args": [], "type": "MediaType" }, { "name": "OptionalPaged", "comment": " ", "args": [], "type": "{ value : String, blockAxisOverflow : Compatible }" }, { "name": "P3", "comment": " ", "args": [], "type": "{ value : String, colorGamut : Compatible }" }, { "name": "Paged", "comment": " ", "args": [], "type": "{ value : String, blockAxisOverflow : Compatible }" }, { "name": "Portrait", "comment": " ", "args": [], "type": "{ value : String, orientation : Compatible }" }, { "name": "Progressive", "comment": " ", "args": [], "type": "{ value : String, scanningProcess : Compatible }" }, { "name": "Ratio", "comment": " ", "args": [], "type": "{ value : String, ratio : Compatible }" }, { "name": "Rec2020", "comment": " ", "args": [], "type": "{ value : String, colorGamut : Compatible }" }, { "name": "Resolution", "comment": " Display Resolution. \n", "args": [], "type": "{ value : String, resolution : Compatible }" }, { "name": "SRGB", "comment": " ", "args": [], "type": "{ value : String, colorGamut : Compatible }" }, { "name": "Slow", "comment": " ", "args": [], "type": "{ value : String, updateFrequency : Compatible }" } ], "values": [ { "name": "all", "comment": " Build a media query that will match all media types.\n\nThe supplied `expressions` are combined with `and`.\n\n media [ all [ color, landscape ] ]\n [ body [ Css.color (hex \"ff0000\") ] ]\n\nThe above code translates into the following CSS.\n\n```css\n@media (color) and (landscape) {\n body {\n color: #ff0000;\n }\n}\n```\n\n", "type": "List Expression -> MediaQuery" }, { "name": "anyHover", "comment": " Media feature [`any-hover`](https://drafts.csswg.org/mediaqueries/#any-input)\nQueries the if any of user agent's input mechanisms have the ability to hover over elements\nAccepts `none` or `canHover`.\n\n media (anyHover canHover) [ a [ Css.hover [ textDecoration underline] ] ]\n\n", "type": "HoverCapability a -> Expression" }, { "name": "anyPointer", "comment": " Media feature [`any-pointer`](https://drafts.csswg.org/mediaqueries/#any-input)\nQueries the presence and accuracy of a pointing device, such as a mouse, touchscreen, or Wii remote.\nReflects the capabilities of the most capable input mechanism.\nAccepts `none`, `fine`, and `coarse`.\n\n media (anyPointer coarse) [ a [ display block, Css.height (px 24) ] ]\n\n", "type": "PointerDevice a -> Expression" }, { "name": "aspectRatio", "comment": " Media feature [`aspect-ratio`](https://drafts.csswg.org/mediaqueries/#aspect-ratio)\n\n media (aspectRatio (ratio 16 10)) [ ... ]\n\n", "type": "Ratio -> Expression" }, { "name": "bits", "comment": " Get a bumber of bits\n\n bits 8\n\n", "type": "Int -> Bits" }, { "name": "canHover", "comment": " The value [`hover`](https://drafts.csswg.org/mediaqueries/#valdef-media-hover-hover).\nNamed `canHover` to avoid conflict with the media feature of the same name\n", "type": "CanHover" }, { "name": "coarse", "comment": " CSS Value [`coarse`](https://drafts.csswg.org/mediaqueries/#valdef-media-pointer-coarse)\n", "type": "Coarse" }, { "name": "color", "comment": " Media feature [`color`](https://drafts.csswg.org/mediaqueries/#color)\n\n media (not color) [ body [Css.color (hex \"000000\")] ]\n\n", "type": "Expression" }, { "name": "colorGamut", "comment": " Media feature [`color-gamut`](https://drafts.csswg.org/mediaqueries/#color-gamut).\nDescribes the approximate range of colors supported by the user agent and device.\n\n media (and screen (colorGamut rec2020)) [ Css.class HiColorImg [ display block ] ]\n\n", "type": "ColorGamut a -> Expression" }, { "name": "colorIndex", "comment": " Media feature [`color-index`](https://drafts.csswg.org/mediaqueries/#color-index)\nQueries the number of colors in the user agent's color lookup table.\n\n media (and screen (colorIndex (int 16777216))) [ a [ Css.color (hex \"D9534F\") ] ]\n\n", "type": "Number a -> Expression" }, { "name": "dpcm", "comment": " `dpcm`: Dots per centimeter. \n\n dpcm 65\n\n", "type": "Float -> Resolution" }, { "name": "dpi", "comment": " `dpi`: Dots per inch. \n\n dpi 166\n\n", "type": "Float -> Resolution" }, { "name": "dppx", "comment": " `dppx`: Dots per pixel. \n\n dppx 1.5\n\n", "type": "Float -> Resolution" }, { "name": "enabled", "comment": " CSS value [`enabled`](https://drafts.csswg.org/mediaqueries/#valdef-media-scripting-enabled).\n", "type": "Enabled" }, { "name": "fast", "comment": " CSS value [`fast`](https://drafts.csswg.org/mediaqueries/#valdef-media-update-fast)\n", "type": "Fast" }, { "name": "fine", "comment": " CSS Value [`fine`](https://drafts.csswg.org/mediaqueries/#valdef-media-pointer-fine)\n", "type": "Fine" }, { "name": "grid", "comment": " Media feature [`grid`](https://drafts.csswg.org/mediaqueries/#grid).\nQueries whether the output device is a grid or bitmap.\n", "type": "Expression" }, { "name": "height", "comment": " Media feature [`height`](https://drafts.csswg.org/mediaqueries/#height)\n", "type": "AbsoluteLength compatible -> Expression" }, { "name": "hover", "comment": " Media feature [`hover`](https://drafts.csswg.org/mediaqueries/#hover).\nQueries the if the user agent's primary input mechanism has the ability to hover over elements.\nAccepts `none` or `canHover`.\n\n media (Media.hover canHover) [ a [ Css.hover [ textDecoration underline] ] ]\n\n", "type": "HoverCapability a -> Expression" }, { "name": "initialOnly", "comment": " CSS value [`initial-only`](https://drafts.csswg.org/mediaqueries/#valdef-media-scripting-initial-only).\n", "type": "InitialOnly" }, { "name": "interlace", "comment": " CSS value [`interlace`](https://drafts.csswg.org/mediaqueries/#valdef-media-scan-interlace)\n", "type": "Interlace" }, { "name": "landscape", "comment": " CSS value [`landscape`](https://drafts.csswg.org/mediaqueries/#valdef-media-orientation-portrait)\n", "type": "Landscape" }, { "name": "maxAspectRatio", "comment": " Media feature [`max-aspect-ratio`](https://drafts.csswg.org/mediaqueries/#aspect-ratio)\n\n media (maxAspectRatio (ratio 16 9)) [ ... ]\n\n", "type": "Ratio -> Expression" }, { "name": "maxColor", "comment": " Media feature [`max-color`](https://drafts.csswg.org/mediaqueries/#color)\nQueries the user agent's bits per color channel\n\n media (and screen (maxColor (bits 8))) [ a [ Css.color (hex \"FF0000\") ] ]\n\n", "type": "Bits -> Expression" }, { "name": "maxColorIndex", "comment": " Media feature [`max-color-index`](https://drafts.csswg.org/mediaqueries/#color-index).\nQueries the number of colors in the user agent's color lookup table.\n\n media (and screen (maxColorIndex (int 256))) [ a [ Css.color (hex \"FF0000\")] ]\n\n", "type": "Number a -> Expression" }, { "name": "maxHeight", "comment": " Media feature [`max-height`](https://drafts.csswg.org/mediaqueries/#height)\n\n media (Media.maxHeight(px 399)) [ Css.class TopBanner [ display none] ]\n\n", "type": "AbsoluteLength compatible -> Expression" }, { "name": "maxMonochrome", "comment": " Media feature [`max-monochrome`](https://drafts.csswg.org/mediaqueries/#monochrome)\n", "type": "Bits -> Expression" }, { "name": "maxResolution", "comment": " Media feature [`max-resolution`](https://drafts.csswg.org/mediaqueries/#resolution)\nDescribes the resolution of the output device.\n\n media (maxResolution (dpcm 65)) [ Css.class HiResImg [ display none ] ]\n\n", "type": "Resolution -> Expression" }, { "name": "maxWidth", "comment": " Media feature [`max-width`](https://drafts.csswg.org/mediaqueries/#width)\n\n media (Media.maxWidth (px 800)) [ Css.class MobileNav [ display none] ]\n\n", "type": "AbsoluteLength compatible -> Expression" }, { "name": "minAspectRatio", "comment": " Media feature [`min-aspect-ratio`](https://drafts.csswg.org/mediaqueries/#aspect-ratio)\n\n media (minAspectRatio (ratio 1 1)) [ ... ]\n\n", "type": "Ratio -> Expression" }, { "name": "minColor", "comment": " Media Feature [`min-nncolor`](https://drafts.csswg.org/mediaqueries/#color)\nQueries the user agent's bits per color channel\n\n media (screen (minColor (bits 256))) [ a [ Css.color (hex \"D9534F\") ] ]\n\n", "type": "Bits -> Expression" }, { "name": "minColorIndex", "comment": " Media Feature [`min-color-index`](https://drafts.csswg.org/mediaqueries/nn#color-index)\nQueries the number of colors in the user agent's color lookup table.\n\n media (and screen (minColorIndex (int 16777216))) [ a [ Css.color (hex \"D9534F\")] ]\n\n", "type": "Number a -> Expression" }, { "name": "minHeight", "comment": " Media feature [`min-height`](https://drafts.csswg.org/mediaqueries/#height)\n\n media (Media.minHeight(px 400)) [ Css.class TopBanner [ display block] ]\n\n", "type": "AbsoluteLength compatible -> Expression" }, { "name": "minMonochrome", "comment": " Media Feature [`min-monochrome`](https://drafts.csswg.org/mediaqueries/#monochrome)\n", "type": "Bits -> Expression" }, { "name": "minResolution", "comment": " Media feature [`min-resolution`](https://drafts.csswg.org/mediaqueries/#resolution).\nDescribes the resolution of the output device.\n\n media (minResolution (dpi 600)) [ Css.class HiResImg [ display block ] ]\n\n", "type": "Resolution -> Expression" }, { "name": "minWidth", "comment": " Media feature [`min-width`](https://drafts.csswg.org/mediaqueries/#width)\nQueries the width of the output device.\n\n media (Media.minWidth (px 600)) [ Css.class Container [ Css.maxWidth (px 500) ] ]\n\n", "type": "AbsoluteLength compatible -> Expression" }, { "name": "monochrome", "comment": " Media feature [`monochrome`](https://drafts.csswg.org/mediaqueries/#monochrome)\n\n media [ monochrome ] [ body [Css.color (hex \"000000\")] ]\n\n", "type": "Expression" }, { "name": "not", "comment": " Build a negated media query.\n\n media [ not screen [] ]\n [ body [ Css.color (hex \"ff0000\") ] ]\n\nThe above code translates into the following CSS.\n\n```css\n@media not screen {\n body {\n color: #ff0000;\n }\n}\n```\n\n", "type": "MediaType -> List Expression -> MediaQuery" }, { "name": "only", "comment": " Build a media query matching a single media type.\n\n media [ only screen [ minWidth (px 320), portrait ] ]\n [ body [ Css.color (hex \"ff0000\") ] ]\n\nThe above code translates into the following CSS.\n\n```css\n@media only screen and (min-width: 320px) and (portrait) {\n body {\n color: #ff0000;\n }\n}\n```\n\n", "type": "MediaType -> List Expression -> MediaQuery" }, { "name": "optionalPaged", "comment": " CSS value [`optional-paged`](https://drafts.csswg.org/mediaqueries/#valdef-media-overflow-block-optional-paged)\n", "type": "OptionalPaged" }, { "name": "orientation", "comment": " Media feature [`orientation`](https://drafts.csswg.org/mediaqueries/#orientation).\nAccepts `portrait` or `landscape`.\n", "type": "Orientation a -> Expression" }, { "name": "overflowBlock", "comment": " Media feature [`overflow-block`](https://drafts.csswg.org/mediaqueries/#overflow-block)\nDescribes the behavior of the device when content overflows the initial containing block in the block axis.\n", "type": "BlockAxisOverflow a -> Expression" }, { "name": "overflowInline", "comment": " Media feature [`overflow-inline`](https://drafts.csswg.org/mediaqueries/#overflow-inline).\nDescribes the behavior of the device when content overflows the initial containing block in the inline axis.\n", "type": "InlineAxisOverflow a -> Expression" }, { "name": "p3", "comment": " CSS value [`p3`](https://drafts.csswg.org/mediaqueries/#valdef-media-color-gamut-p3)\n", "type": "P3" }, { "name": "paged", "comment": " CSS value [`paged`](https://drafts.csswg.org/mediaqueries/#valdef-media-overflow-block-paged)\n", "type": "Paged" }, { "name": "pointer", "comment": " Media feature [`pointer`](https://drafts.csswg.org/mediaqueries/#pointer)\nQueries the presence and accuracy of a pointing device, such as a mouse, touchscreen, or Wii remote.\nReflects the capabilities of the primary input mechanism.\nAccepts `none`, `fine`, and `coarse`.\n\n media (Media.pointer coarse) [ a [ display block, Css.height (px 24) ] ]\n\n", "type": "PointerDevice a -> Expression" }, { "name": "portrait", "comment": " CSS value [`portrait`](https://drafts.csswg.org/mediaqueries/#valdef-media-orientation-portrait)\n", "type": "Portrait" }, { "name": "print", "comment": " Media type for printers\n\n media print [ a [ color (hex 000000), textDecoration none ] ]\n\n", "type": "MediaType" }, { "name": "progressive", "comment": " CSS value [`progressive`](https://drafts.csswg.org/mediaqueries/#valdef-media-scan-progressive)\n", "type": "Progressive" }, { "name": "ratio", "comment": " Create a ratio.\n\n --a ratio of 4/3\n ratio 4 3\n\n", "type": "Int -> Int -> Ratio" }, { "name": "rec2020", "comment": " CSS value [`rec2020`](https://drafts.csswg.org/mediaqueries/#valdef-media-color-gamut-rec2020)\n", "type": "Rec2020" }, { "name": "resolution", "comment": " Media feature [`resolution`](https://drafts.csswg.org/mediaqueries/#resolution)\nDescribes the resolution of the output device.\n\n media (resolution (dppx 2)) [ img [ width (pct 50) ] ]\n\n", "type": "Resolution -> Expression" }, { "name": "scan", "comment": " Media feature [`scan`](https://drafts.csswg.org/mediaqueries/#scan).\nQueries scanning process of the device. Accepts `innterlace` (some TVs) or `progressive` (most things).\n", "type": "ScanningProcess a -> Expression" }, { "name": "screen", "comment": " Media type for any device not matched by print or speech.\n\n media (and screen (maxWidth (px 600)) [ Css.class mobileNav display none ]\n\n", "type": "MediaType" }, { "name": "scripting", "comment": " The [`scripting`](https://drafts.csswg.org/mediaqueries/#scripting) media feature\nfor querying the user agents support for scripting languages like JavaScript.\nAccepts `none`, `initialOnly`, and `enabled`.\n\n media (scripting none) [ Css.class NoScript [ display block ] ]\n\n", "type": "ScriptingSupport a -> Expression" }, { "name": "slow", "comment": " CSS value [`slow`](https://drafts.csswg.org/mediaqueries/#valdef-media-update-slow)\n", "type": "Slow" }, { "name": "speech", "comment": " Media type for screenreaders and similar devices that read out a page\n\n media (not speech) [ Css.class screenReaderOnly [ display none ] ]\n\n", "type": "MediaType" }, { "name": "srgb", "comment": " CSS value [`srgb`](https://drafts.csswg.org/mediaqueries/#valdef-media-color-gamut-srgb)\n", "type": "SRGB" }, { "name": "update", "comment": " Media feature [`update`](https://drafts.csswg.org/mediaqueries/#update)\nThe update frequency of the device. Accepts `none`, `slow`, or `fast`\n", "type": "UpdateFrequency a -> Expression" }, { "name": "width", "comment": " Media feature [`width`](https://drafts.csswg.org/mediaqueries/#width)\n\n media (Media.width (px 200)) [ ... ]\n\n", "type": "AbsoluteLength compatible -> Expression" }, { "name": "withMedia", "comment": " Combines media queries that are nested under selectors into a `@media` rule.\n\n css\n [ withMedia [ only screen [ Media.minWidth (px 300), Media.maxWidth (px 800) ] ]\n [ Css.maxWidth (px 300) ]\n\nThe above code translates into the following CSS.\n\n```css\n@media only screen and (min-width: 300px) and (max-width: 800px) {\n ._c9f0fd {\n max-width: 300px;\n }\n}\n```\n\n", "type": "List MediaQuery -> List Style -> Style" }, { "name": "withMediaQuery", "comment": " Manually specify a `@media` rule that is nested under an element or class\nusing a List of strings.\n\n body\n [ withMediaQuery [ \"screen and (min-width: 320px)\", \"screen and (max-height: 400px)\" ]\n [ fontSize (px 14px) ]\n ]\n\nThe above code translates into the following CSS.\n\n```css\n@media screen and (min-width: 320px), screen and (max-height: 400px) {\n body {\n font-size: 14px;\n }\n}\n```\n\n", "type": "List String -> List Style -> Style" } ], "binops": [] }, { "name": "DEPRECATED.Css.Namespace", "comment": "\n\n\n# DEPRECATED\n\n`Html.Styled` makes namespacing unnecessary, so please use it instead of This\nmodule! This module relies on a `Basics.toString` implementation which will no\nlonger exist in Elm 0.19, so it will be removed in the next major release of elm-css.\n\n\n## Namespacing\n\n@docs namespace\n\n", "unions": [], "aliases": [], "values": [ { "name": "namespace", "comment": " takes an identifier, namespaces the list of snippets given with that identifier\n", "type": "a -> List Snippet -> List Snippet" } ], "binops": [] }, { "name": "DEPRECATED.Css.File", "comment": "\n\n\n# DEPRECATED\n\nCompiling to .css files is deprecated, and support is planned to be removed in a\nfuture release (likely sometime in 2018), once [`Html.Styled`](Html-Styled) has\nmatured sufficiently. The design goal is for elm-css to offer One Way To Do It,\nand that one way is planned to be `Html.Styled`!\n\n\n## Css.File\n\nFunctions for writing CSS files from elm-css.\n\n@docs Stylesheet, stylesheet, compile, compiler, toFileStructure, CssFileStructure, CssCompilerProgram\n\n\n## Automatically-generated unique classes\n\n@docs UniqueClass, uniqueClass, UniqueSvgClass, uniqueSvgClass\n\n", "unions": [ { "name": "UniqueClass", "comment": " Styles scoped under an automatically-generated class.\n", "args": [], "cases": [] }, { "name": "UniqueSvgClass", "comment": " Styles scoped under an automatically-generated class. Use these for \nelements, as they use a different\n", "args": [], "cases": [] } ], "aliases": [ { "name": "CssCompilerProgram", "comment": " A prorgam that compiles a CSS file.\n\nSee [`compiler`](#compiler).\n\n", "args": [], "type": "Program Never () Never" }, { "name": "CssFileStructure", "comment": " A description of CSS files that will be created by elm-css.\n", "args": [], "type": "List { filename : String, content : String, success : Bool }" }, { "name": "Stylesheet", "comment": " ", "args": [], "type": "Stylesheet" } ], "values": [ { "name": "compile", "comment": " Compile the given stylesheets to a CSS string, or to an error\nmessage if it could not be compiled.\n", "type": "List Stylesheet -> { css : String, warnings : List String }" }, { "name": "compiler", "comment": " Create a program that compiles an elm-css stylesheet to a CSS file.\n\n import Css.File exposing (CssCompilerProgram, CssFileStructure)\n import HomepageCss as Homepage\n\n port files : CssFileStructure -> Cmd msg\n\n fileStructure : CssFileStructure\n fileStructure =\n Css.File.toFileStructure\n [ ( \"homepage.css\", Css.File.compile [ Homepage.css ] ) ]\n\n main : CssCompilerProgram\n main =\n Css.File.compiler files fileStructure\n\n", "type": "(CssFileStructure -> Cmd Never) -> CssFileStructure -> CssCompilerProgram" }, { "name": "stylesheet", "comment": " A stylesheet.\n\n stylesheet\n [ body\n [ width (px 960)\n , color (rgb 7 7 7)\n ]\n ]\n\n", "type": "List Snippet -> Stylesheet" }, { "name": "toFileStructure", "comment": " Translate a list of filenames and [`prettyPrint`](#prettyPrint) results\nto a list of tuples suitable for being sent to a port in a Stylesheets.elm file.\n", "type": "List ( String, { css : String, warnings : List String } ) -> CssFileStructure" }, { "name": "uniqueClass", "comment": " Create a style scoped under an automatically-generated class that is\nguaranteed to be unique - at least relative to other class names generated\nusing this function!\n\nNote: Use [`uniqueSvgClass`](#uniqueSvgClass) for classes that will be used\nwith SVG elements. These will not work with them!\n\n", "type": "List Style -> UniqueClass" }, { "name": "uniqueSvgClass", "comment": " Create a style scoped under an automatically-generated class that is\nguaranteed to be unique - at least relative to other class names generated\nusing this function!\n\nNote: Use [`uniqueClass`](#uniqueClass) for classes that will be used with\nSVG elements. These will only work with SVGs!\n\n", "type": "List Style -> UniqueSvgClass" } ], "binops": [] }, { "name": "Css", "comment": " Define CSS styles in Elm.\n\n import Css exposing (..)\n import Html\n import Html.Styled exposing (..)\n import Html.Styled.Attributes exposing (css, href, src)\n import Html.Styled.Events exposing (onClick)\n\n {-| A logo image, with inline styles that change on hover.\n -}\n logo : Html msg\n logo =\n img\n [ src \"logo.png\"\n , css\n [ display inlineBlock\n , padding (px 20)\n , border3 (px 5) solid (rgb 120 120 120)\n , hover\n [ borderColor theme.primary\n , borderRadius (px 10)\n ]\n ]\n ]\n []\n\n {-| A plain old record holding a couple of theme colors.\n -}\n theme : { secondary : Color, primary : Color }\n theme =\n { primary = hex \"55af6a\"\n , secondary = rgb 250 240 230\n }\n\n {-| A reusable button which has some styles pre-applied to it.\n -}\n btn : List (Attribute msg) -> List (Html msg) -> Html msg\n btn =\n styled button\n [ margin (px 12)\n , color (rgb 250 250 250)\n , hover\n [ backgroundColor theme.primary\n , textDecoration underline\n ]\n ]\n\n {-| A reusable style. Css.batch combines multiple styles into one, much\n like mixins in CSS preprocessors.\n -}\n paragraphFont : Style\n paragraphFont =\n Css.batch\n [ fontFamilies [ \"Palatino Linotype\", \"Georgia\", \"serif\" ]\n , fontSize (px 16)\n , fontWeight normal\n ]\n\n {-| Css.property lets you define custom properties, using strings as their values.\n -}\n legacyBorderRadius : String -> Style\n legacyBorderRadius amount =\n Css.batch\n [ property \"-moz-border-radius\" amount\n , property \"-webkit-border-top-left-radius\" amount\n , property \"-webkit-border-top-right-radius\" amount\n , property \"-webkit-border-bottom-right-radius\" amount\n , property \"-webkit-border-bottom-left-radius\" amount\n , property \"border-radius\" amount\n ]\n\n view : Model -> Html Msg\n view model =\n nav []\n [ img [ src \"assets/backdrop.jpg\", css [ width (pct 100) ] ] []\n , btn [ onClick DoSomething ] [ text \"Click me!\" ]\n ]\n\n main : Program Never Model Msg\n main =\n Html.beginnerProgram\n { view = view >> toUnstyled\n , update = update\n , model = initialModel\n }\n\n_See [`examples/readme/`](https://github.com/rtfeldman/elm-css/blob/master/examples/readme) to play around with this example._\n\nThe [`css`](http://package.elm-lang.org/packages/rtfeldman/elm-css/latest/Html-Styled-Attributes#css)\nfunction accepts a list of [`Style`](http://package.elm-lang.org/packages/rtfeldman/elm-css/latest/Html-Styled-Attributes#css)\nvalues which roughly correspond to [CSS properties](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference).\n\n css\n [ display inlineBlock\n , padding (px 20)\n , border3 (px 5) solid (rgb 120 120 120)\n , hover\n [ borderColor theme.primary\n , borderRadius (px 10)\n ]\n ]\n\nLet's take a look at some of these declarations.\n\n display inlineBlock\n\nThis compiles to the CSS declaration `display: inline-block;` -\n\n_Snake-case_ CSS names become _camelCase_ names in elm-css.\n\nThe [`Css.display`](#display) function only accepts values that are compatible\nwith the CSS `display` property, such as [`inlineBlock`](#inlineBlock), [`flex`](#flex), [`none`](#none), [`inherit`](#inherit), etc.\nIf you try to pass `display` an invalid value such as [`pointer`](#pointer), it will not compile!\n\n padding (px 20)\n\nThis compiles to the CSS declaration `padding: 20px;`\n\nValues with units such as [`px`](#px), [`em`](#em), and [`rem`](#rem) are implemented as functions.\nThe [`num`](#num) function compiles to unitless numbers; for example, `flexGrow (num 1)` compiles to `flex-grow: 1;`.\n\n[`zero`](#zero) is compatible with declarations that either do or do not expect units, so you can write\n`padding zero` instead of something like `padding (px 0)`. (`padding zero` compiles to `padding: 0;`.)\n\n border3 (px 5) solid (rgb 120 120 120)\n\nThe [`border3`](#border3) function shows a convention in elm-css: when a CSS property supports a variable number of arguments, as is the case with `border`, elm-css commonly provides multiple functions to support those alternatives. For example, [`border`](#border), [`border2`](#border2), and [`border3`](#border3).\n\n hover\n [ borderColor theme.primary\n , borderRadius (px 10)\n ]\n\nCSS pseudo-classes like `:hover` are implemented as functions that take a list of declarations.\n\nThe above compiles to something like this:\n\n ._c7f8ba:hover {\n border-color: #55af6a;\n border-raidus: 10px;\n }\n\nWhere does that funky classname of `_c7f8ba` come from?\n\nelm-css automatically generates this classname based on the declarations used, and\nuses it to generate a `