替换撇号登录页面上的 SVG 图像

Question

如何替换登录页面上的撇号徽标？我已经将样式追溯到 public/modules/apostrophe-login/css/always.less 文件。当我尝试设置背景时，撇号徽标位于我尝试使用的图像之上。我正在寻找一种方法来覆盖该图像。我在下面包含了我最近尝试的代码。

.apos-login-logo
{
  text-align: center;
  margin-bottom: @apos-margin-5;
  svg { background: url('/images/el_logo.svg'); width: 84px; height: 84px;  }

}

Answer 1

该徽标包含在此处的登录界面中：

node_modules/apostrophe/lib/modules/apostrophe-login/views/loginBase.html
        ...
    <div class="apos-login-content">
    <div class="apos-login-logo">{% block logo %}{% include "apostrophe-admin-bar:logo.html" %}{% endblock %}</div>
    <div class="apos-ui apos-login">
        ...

因此您可以决定包含其他一些包含您徽标的 html 文件或更改 logo.html 中的内容：

node_modules/apostrophe/lib/modules/apostrophe-admin-bar/views/logo.html

因此，您将其中一个复制到您的项目 lib 文件夹中。它们自动加载并作为 my-apostrophe-login 或 my-apostrophe-admin-bar 推送到浏览器，并将覆盖 node_modules.

中的元素

所以它一定是这样的，例如：

your_project/lib/modules/apostrophe-admin-bar/views/logo.html

替换撇号登录页面上的 SVG 图像

Replacing SVG image on apostrophecms login page

apostrophe-cms