设计文本框格式

Question

为我的登录页面设置设备后，我想知道如何调整 f.email_field 和 f.password_field 高度的大小？我已经尝试过

Answer 1

你尝试过什么？您可以使用

生成设备视图

$ rails generate devise:views

然后编辑它们。

Answer 2

要编辑设备视图页面，您需要进入初始化程序文件夹中的 devise.rb 文件。

取消注释第 181 行并将其更改为

config.scoped_views = false

到此

config.scoped_views = true

您应该能够以任何您想要的方式编辑视图文件

要增加输入字段的大小，您需要增加字体。为您的输入字段声明字体大小。即字体大小：50px；

Answer 3

我知道这是一篇旧帖子，但以防将来有人遇到这个问题。

首先确保您的 <%= form_for ... %> 在该文件中没有父标签，否则您的尺寸样式/大小调整将不起作用。请注意下面示例中 <%= form_for %> 的位置。

之前：

<div class="w-full container">

  <%= form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| %>

    <h1>Log in</h1>

    <div class="w-full">
      <%= f.label :email, class: "w-full" %>
      <br>
      <%= f.email_field :email, autofocus: true, autocomplete: "email", class: "w-full" %>
    </div>

  <% end %>

</div>

之后：

<%= form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| %>

  <div class="w-full container">

    <h1>Log in</h1>

    <div class="w-full">
      <%= f.label :email, class: "w-full" %>
      <br>
      <%= f.email_field :email, autofocus: true, autocomplete: "email", class: "w-full" %>
    </div>

  </div>

<% end %>

上下文：Rails 7.1、Tailwindcss、Devise、Propshaft（我认为应该不重要）