jellyfin-web/dashboard-ui/music.html

<div id="musicRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="musicartist">

    <div class="libraryViewNav">
        <button class="pageTabButton is-active" data-index="0">${TabSuggestions}</button>
        <button class="pageTabButton" data-index="1">${TabAlbums}</button>
        <button class="pageTabButton" data-index="2">${TabAlbumArtists}</button>
        <button class="pageTabButton" data-index="3">${TabArtists}</button>
        <button class="pageTabButton" data-index="4">${TabSongs}</button>
        <button class="pageTabButton" data-index="5">${TabGenres}</button>
        <button class="pageTabButton" data-index="6">${TabFolders}</button>
    </div>
    <div class="pageTabContent is-active pageTabContent ehsContent" id="suggestionsTab" data-index="0">
        <div class="homePageSection">
            <h1 class="listHeader">${HeaderLatestMusic}</h1>

            <div id="recentlyAddedSongs" class="itemsContainer noautoinit" style="text-align:left;">
            </div>
        </div>

        <div id="playlists" class="homePageSection hide">
            <h1 class="listHeader">${HeaderPlaylists}</h1>

            <div class="itemsContainer noautoinit" style="text-align:left;">
            </div>
        </div>

        <div id="recentlyPlayed" class="homePageSection hide">
            <h1 class="listHeader">${HeaderRecentlyPlayed}</h1>

            <div id="recentlyPlayedSongs" class="itemsContainer noautoinit" style="text-align:left;">
            </div>
        </div>

        <div id="topPlayed" class="homePageSection hide">
            <h1 class="listHeader">${HeaderFrequentlyPlayed}</h1>

            <div id="topPlayedSongs" class="itemsContainer noautoinit" style="text-align: left;">
            </div>
        </div>

        <div class="favoriteSections homePageSection"></div>
    </div>
    <div class="pageTabContent pageTabContent ehsContent" id="albumsTab" data-index="1">
        <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
            <div class="paging"></div>
            <button is="paper-icon-button-light" class="btnSelectView autoSize" title="${ButtonSelectView}"><i class="md-icon">view_comfy</i></button>
            <button is="paper-icon-button-light" class="btnSort autoSize" title="${ButtonSort}"><i class="md-icon">sort_by_alpha</i></button>
            <button is="paper-icon-button-light" class="btnFilter autoSize" title="${ButtonFilter}"><i class="md-icon">filter_list</i></button>
        </div>

        <div class="alphaPicker alphabetPicker vertical">
        </div>

        <div class="itemsContainer itemsContainerWithAlphaPicker">
        </div>
        <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
            <div class="paging"></div>
        </div>
    </div>
    <div class="pageTabContent pageTabContent ehsContent" id="albumArtistsTab" data-index="2">
        <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
            <div class="paging"></div>
            <button is="paper-icon-button-light" class="btnSelectView autoSize" title="${ButtonSelectView}"><i class="md-icon">view_comfy</i></button>
            <button is="paper-icon-button-light" class="btnFilter autoSize" title="${ButtonFilter}"><i class="md-icon">filter_list</i></button>
        </div>

        <div class="alphaPicker alphabetPicker vertical">
        </div>

        <div class="itemsContainer itemsContainerWithAlphaPicker">
        </div>
        <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
            <div class="paging"></div>
        </div>
    </div>
    <div class="pageTabContent pageTabContent ehsContent" id="artistsTab" data-index="3">
        <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
            <div class="paging"></div>
            <button is="paper-icon-button-light" class="btnSelectView autoSize" title="${ButtonSelectView}"><i class="md-icon">view_comfy</i></button>
            <button is="paper-icon-button-light" class="btnFilter autoSize" title="${ButtonFilter}"><i class="md-icon">filter_list</i></button>
        </div>

        <div class="alphaPicker alphabetPicker vertical">
        </div>

        <div class="itemsContainer itemsContainerWithAlphaPicker">
        </div>
        <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
            <div class="paging"></div>
        </div>
    </div>
    <div class="pageTabContent pageTabContent ehsContent" id="songsTab" data-index="4">
        <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
            <div class="paging"></div>
            <button is="paper-icon-button-light" class="btnSort autoSize" title="${ButtonSort}"><i class="md-icon">sort_by_alpha</i></button>
            <button is="paper-icon-button-light" class="btnFilter autoSize" title="${ButtonFilter}"><i class="md-icon">filter_list</i></button>
        </div>

        <div id="items" class="itemsContainer" style="max-width:1000px;margin: 0 auto;"></div>

        <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
            <div class="paging"></div>
        </div>
    </div>
    <div class="pageTabContent pageTabContent ehsContent" id="genresTab" data-index="5">
        <div style="text-align: center; display: flex; align-items: center; justify-content: center;">
            <button is="paper-icon-button-light" class="btnSelectView autoSize" title="${ButtonSelectView}"><i class="md-icon">view_comfy</i></button>
        </div>
        <div id="items" class="itemsContainer paddedItemsContainer"></div>
    </div>
    <div class="pageTabContent pageTabContent ehsContent" id="foldersTab" data-index="6">
        <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
            <div class="paging"></div>
        </div>

        <div class="itemsContainer itemsContainerWithAlphaPicker">
        </div>
        <div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
            <div class="paging"></div>
        </div>
    </div>

    <div data-role="content">
    </div>
</div>