向Yesod表单添加样式

Question

我正在尝试使用Yesod的身份验证插件：yesod-auth-account。它提供了一个默认的表单，我希望为它添加一些bootstrap / template特定的样式。如果我使用自定义表单，我将不得不覆盖很多方法。

这是特别紧迫的，因为我想在不同的显示上下文中重复使用表单（在导航栏中，在注册表单旁边等）。

有什么想法吗？

Answer 1

您可以打包默认电子邮件AuthPlugin：

authEmailCustom :: YesodAuthEmail m => AuthPlugin m
authEmailCustom =
    AuthPlugin "email" (apDispatch authEmail) $ \tm ->
        [whamlet|
<form method="post" action="@{tm loginR}">
    <input type="email" name="email">
    <input type="password" name="password">
    <input type="submit" value="submit">
    <a href="@{tm registerR}">I don't have an account
|]

只需替换您的样式表单即可。然后使用它而不是默认值：

instance YesodAuth App where
    ...
    authPlugins _ = [authEmailCustom]

希望这有帮助。