顶部栏有阴影-Jekyll 主题

Question

网站的顶部栏有一个不应该存在的阴影。

详情

我已经编辑了这个 Jekyll 主题的顶部栏，感觉响应迅速，这样我就可以在顶部栏中添加徽标，现在它上面有这个阴影。我可能以某种方式添加了它，但我不知道如何删除它。我在下面附上了几张图片，以便您更好地理解我在说什么。查看顶部栏的正下方，您会看到那里有一个阴影。

现在是什么样子

文件

可以在[此处]找到存储库（https://github.com/NewSpectrum/*emphasized text*-Site），其组件是：

这是一些

top-bar.scss

请记住，此文件中有大约 530 多行代码，我不太确定我在寻找什么。

.top-bar {
      overflow: hidden;
      height: $topbar-height;
      line-height: $topbar-height;
      position: relative;
      background: $topbar-bg;
      margin-bottom: $topbar-margin-bottom;

      // Topbar Global list Styles
      ul {
        margin-bottom: 0;
        list-style: none;
      }

      .row { max-width: none; }

      form,
      input { margin-bottom: 0; }

      input {
        height: $topbar-input-height;
        padding-top: .35rem;
        padding-bottom: .35rem;
        font-size: $topbar-button-font-size;

这是

navigation.html

<div id="navigation" class="sticky">
    <nav class="top-bar" role="navigation" data-topbar data-options="scrolltop: false">
        <ul class="title-area">
            <div id="topbar-logo">
                <a href="{{ site.url }}{{ site.baseurl }}">
                    <img id="topbar-logo-img"
                         src="{{ site.url }}{{ site.baseurl }}/assets/img/logo-topnav.png"
                         alt="Name"
                         style="object-fit:contain"
                         />
                </a>
            </div>
            <li class="name">
                <h1 class="hide-for-large-up">
                    <!-- <a href="{{ site.url }}{{ site.baseurl }}" class="icon-tree"> {{ site.title }}</a> -->
                        <!-- <img src="{{ site.url }}{{ site.baseurl }}/assets/img/{{ site.logo }}"
                             height="3rem" /> -->
                </h1>
            </li>
            <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
            <li class="toggle-topbar toggle-topbar-click menu-icon"><a><span>Nav</span></a></li>
        </ul>
        <section class="top-bar-section">

Answer 1

我已将

max-height: fit-content;

添加到 _sass_07_layout.scss 中的导航

#navigation {
    -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,.2);
    box-shadow: 0 2px 3px 0 rgba(0,0,0,.2);
    max-height: fit-content;

    [class^='icon-']:before, [class*=' icon-']:before {
        margin-right: rem-calc(8);
    }
}

并清理了 _includes_navigation.html 文件：

    <nav class="top-bar" role="navigation" data-topbar data-options="scrolltop: false">
        <ul class="title-area">
            <div id="topbar-logo">
                <a href="{{ site.url }}{{ site.baseurl }}">
                    <img id="topbar-logo-img" src="{{ site.url }}{{ site.baseurl }}/assets/img/logo-topnav.png"
                        alt="Technovine Solutions" style="object-fit:contain" />
                </a>
            </div>
            <li class="toggle-topbar toggle-topbar-click menu-icon"><a><span>Nav</span></a></li>
        </ul>

...