halo-theme-dream2.0-plus/templates/widget/music.html

梦之城，童话梦境，动漫类型博客主题。

<div xmlns:th="https://www.thymeleaf.org"
     th:fragment="widget (sidebar, index)"
     th:data-index="${index}"
     th:data-position="${sidebar.position}"
     th:class="'card widget music ' + ${sidebar.hide}">
  <div class="card-title" th:with="defaultTitle=#{widget.music.title},
                    iconContent = ${#strings.defaultString(sidebar.icon_new?.value, 'ri-music-2-line')},
                    iconSvg = ${#strings.startsWith(iconContent, '<svg')}">
    <i class="card-title-label"
       th:unless="${iconSvg}"
       th:classappend="${iconContent}"></i>
    <th:block th:if="${iconSvg}" th:utext="${iconContent}"></th:block>
    <span th:text="${#strings.defaultString(sidebar.title, defaultTitle)}"></span>
  </div>
  <div style="min-height: 90px;margin-top: -0.5rem;">
    <meting-js th:if="${theme.config.sidebar.music_mode == 'playlist'}" list-folded="true" server="netease"
               type="playlist" th:id="${theme.config.sidebar.netease_playlist_id}"></meting-js>
    <th:block th:if="${theme.config.sidebar.music_mode == 'config'}"
              th:utext="'<meting-js ' + ${theme.config.sidebar.music_config} + '></meting-js>'"></th:block>
  </div>
  <link rel="stylesheet" th:href="@{/assets/lib/aplayer@1.10.1/APlayer.min.css}">
  <script defer th:src="@{/assets/lib/aplayer@1.10.1/APlayer.min.js}"></script>
  <script defer th:src="@{/assets/lib/meting@2.0.1/Meting.min.js}"></script>
</div>