The shared Elm design system for fixpoint-linux sites.
Fixpoint.* is a reusable Elm package (git submodule) that renders the brand
styling as Elm — no CSS files to link. It is built on elm-css (Html.Styled +
inline css), so components carry their own styles and the package works with
the modern, safe inline-combinator approach. Consume it by adding this repo as
a git submodule and putting design/src in your elm.jsonsource-directories,
then import Fixpoint.* in your Elm code.
importHtml.StyledasStyledimportHtml.Styled.Attributesexposing (css)
importFixpoint.StyleimportFixpoint.NavimportFixpoint.Hero-- …view model =Styled.div [][Fixpoint.Style.stylesheet -- element resets + cross-cutting rules,Fixpoint.Nav.view { brand = …, links = …, extra = … },Fixpoint.Hero.view { … }]|>Html.Styled.toUnstyledComponents return Html.Styled.Html msg. Convert once at your app's root with
Html.Styled.toUnstyled. Fixpoint.Style.stylesheet emits the element-level
resets and cross-cutting / descendant rules that inline css can't express;
each component styles its own elements inline via Html.Styled + css.
The old raw-CSS export Fixpoint.Style.css : String was removed. Fixpoint.Style
now exports color tokens (bg, bg2, fg, dim, accent, accent2,
line), the font stacks (fontMono, fontSans), and the wrap layout helper.
Nav API note: Fixpoint.Nav.menuItemClass : String -> String -> String -> Html msg
(className, url, label) was replaced by
Fixpoint.Nav.menuItemAccent : String -> String -> Html msg (url, label), which
renders an accent-highlighted dropdown menu link.
Modules: Style (stylesheet + tokens + wrap), Nav, Hero, Section, Grid,
Card, Code, Footer, Checks, Headline, Cta, Callout. Author a page
once, reuse the brand look everywhere.
Source of the canonical look: fixpointlinux.org.