Question

我在rails应用程序中使用devise进行身份验证，并使用simple_form gem创建了表单。我想使用css自定义登录和注册表单，但似乎无法确定目标，使用哪个类并添加换行符。

这是我需要做的，

在标签后添加换行符，并在标签后面移动星号。
使用css
使用css

这就是我的注册页面的设计视图，

<div class="formwrapper">
<center>
<h1>Sign up</h2>

<%= simple_form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
  <%= f.error_notification %>

  <div class="form-inputs">
    <%= f.input :first_name, :label => 'First Name', required: true, autofocus: true %>
    <br>
    <%= f.input :last_name, :label => 'Last Name', required: true, autofocus: true %>
    <br>
    <%= f.input :user_name, :label => 'Username', required: true, autofocus: true %>
    <br>
    <%= f.input :email, :label => 'Email', required: true, autofocus: true %>
    <br>
    <%= f.input :password, :label => 'Password', required: true %>
    <br>
    <%= f.input :password_confirmation, :label => 'Confirm Password', required: true %>
    <br>
  </div>

  <div class="form-actions">
    <%= f.button :submit, "Sign up" %>
  </div>
<% end %>


<%= render "devise/shared/links" %>
</center>
</div>

Answer 1

由于Devise是一个引擎，它的所有视图都打包在gem中。这些视图将帮助您入门，但一段时间后您可能想要更改它们。如果是这种情况，您只需要调用以下生成器，它就会将所有视图复制到您的应用程序中：

rails generate devise:views

如果您的应用程序中有多个Devise模型（例如User和Admin），您会注意到Devise对所有模型使用相同的视图。幸运的是，Devise提供了一种自定义视图的简便方法。您需要做的就是设置：

config.scoped_views = true

在config / initializers / devise.rb文件中。

Answer 2

确定。这很简单。

在您的代码中将此更改为

<div class=' {{users.activeuser}}'></div>

这： -

    <%= f.input :first_name, :label => 'First Name', required: true, autofocus: true %>

与其他控件类似。

如何自定义使用simple_form gem创建的设计登录和注册表单？

2 个答案: