Dream2.0Plus 的主题右侧显示金色halo和页脚金色halopro

今天闲来无事翻了翻 Dream2.0Plus 的主题文档，发现里面虽有 “金色 halo” 相关教程，却没有右侧公告栏的金色风格教程，便参考着借鉴了部分代码。

原主题中文档中显示代码注入 -> 全局Head 中注入

<script>
  /* Halo Pro */
  document.addEventListener('DOMContentLoaded', function () {
    const link = document.querySelector('footer a[href*="https://halo.run"]');
    if(link) {
      link.textContent = 'Halo Pro ' + '[[${site.version}]]';
    }

    const themePlus2 = document.querySelector('footer a[href*="https://github.com/zsjy/halo-theme-dream2.0-plus"]');
    if(themePlus2) {
      themePlus2.textContent = 'Dream2 Plus ' + '[[${theme.spec.version}]]';
    }
  });
</script>

<style>
    /* 页脚的链接文本动画效果 */
    @keyframes maskedAnimation {
        0% {
            background-position: 0 0;
        }
        100% {
            background-position: -100% 0;
        }
    }

    footer .footer-copyright {
        font-weight: bold;
        background-image: -webkit-linear-gradient(left, #ffdd00, #3e2f08 25%, #ffdd00 50%, #3e2f08 75%, #ffdd00);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        -webkit-background-size: 200% 100%;
        -webkit-animation: maskedAnimation 1s infinite linear;
    }
</style>

这个代码是页脚可以直接使用的

然后我直接复制粘贴过去发现会变成没有特效

<style>
    /* 页脚的链接文本动画效果 */
    @keyframes maskedAnimation {
        0% {
            background-position: 0 0;
        }
        100% {
            background-position: -100% 0;
        }
    }
    footer .footer-copyright,
    #halo-version-span,
    #theme-version-span {
        font-weight: bold;
        background-image: -webkit-linear-gradient(left, #ffdd00, #3e2f08 25%, #ffdd00 50%, #3e2f08 75%, #ffdd00);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
        -webkit-background-size: 200% 100%;
        -webkit-animation: maskedAnimation 1s infinite linear;
    }
</style>

<div class="card widget notice is-not-hidden">
    <div class="card-title">
        <i class="hc-gonggao1 card-title-label"></i><span>公告</span>
    </div>
    
    
        <div class="card-content">
            <b>站点信息：</b>
<div style="display: flex; align-items: center;color: var(--main);margin-top: 10px;">
  <i class="hc-dongtaitiaocha ri-news-line" style="color: var(--theme);font-size: 1.3em;margin-right:5px;"></i>
  <b><span id="halo-version-span">博客：Halo Pro 2.21.9</span></b>
</div>

<div style="display: flex; align-items: center;color: var(--main);margin-top: 10px;">
  <i class="hc-zhuti1 ri-t-shirt-2-line" style="color: var(--theme);font-size: 1.3em;margin-right:5px;"></i>
  <b><span id="theme-version-span">主题：Dream2.0 Plus 1.9.2</span></b>
</div>

<div style="display: flex; align-items: center;color: var(--main);margin-top: 10px;">
  <i class="hc-yinsizhengce ri-git-repository-private-line" style="color: var(--theme);font-size: 1.3em;margin-right:5px;"></i>
  <div>
		点击查看本站<a style="cursor: var(--cursor-pointer);    color: var(--theme) !important;" href="/audiyszc" title="隐私政策"><b>隐私政策</b></a>  
  </div>
</div>
        </div>
    
</div>

用这个解决问题