隐藏创建账户表单中的全名字段

大家好:

我们已按如下方式自定义了常规的 Discourse 创建账户表单,使用了网格布局:

目前,我们使用以下 SCSS 隐藏了全名:

.d-modal.create-account .login-form {
   form {
        .input-group:nth-child(3) {
            display:none !important;
        }
   }
}

我们使用 nth-child 选择器隐藏全名字段,因为下方提到的 input-group div 没有唯一的类:

但现在我们启用了 Google Oauth2 登录,全名字段位于第 4 位。因此,当前的 CSS 会破坏 Auth provider 创建账户表单的创建账户功能,如下所示:

我该如何使用 CSS 来识别当前表单是常规创建账户表单还是 Auth provider(例如 Google OAuth2)表单?这样我就可以相应地为字段应用 CSS。

密码字段也存在类似问题。

谢谢,
Saurabh

1 个赞

CSS 的 :has 选择器 可能适用于你的用例:

.input-group:has(#new-account-name) { ... }
1 个赞

谢谢回复,
:has 选择器不起作用。

1 个赞

关于这个,我们通过私信进行了一些来回讨论,但最终在创建账户模态框中添加了类。 :partying_face: :balloon:

2 个赞