estrutura-de-dados-e-algoritmos/index.html at main · OnoSendae/estrutura-de-dados-e-algoritmos · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
---
layout: default
title: Início
---

<div class="app-container">
    {% include sidebar_playlist.html %}

    <main class="content">
        <div class="main-header">
            <!-- O botão do menu hambúrguer será inserido aqui pelo JavaScript -->
        </div>
        <div class="content-area">
            <div class="now-playing">
                <div class="current-lesson">
                    <div class="lesson-cover">
                        <i class="fas fa-book-open fa-5x"></i> <!-- Ícone padrão -->
                    </div>
                    <div class="lesson-details">
                        <h3 id="current-title">Selecione uma aula para começar</h3>
                        <p id="current-module">-</p>
                    </div>
                </div>
            </div>

            <div class="material-container">
                <div id="reading-material">
                    <p>Selecione uma aula para ver o material de leitura associado.</p>
                    <a id="material-link" href="#" class="hidden" target="_blank" rel="noopener noreferrer">Abrir
                        Material Completo <i class="fas fa-external-link-alt"></i></a>
                </div>
            </div>
        </div>
    </main>

    <footer class="player">
        <div class="player-left">
            <div id="mini-cover-content" class="mini-cover">
                <i class="fas fa-book-open"></i> <!-- Ícone padrão inicial, será substituído -->
            </div>
            <div class="track-info">
                <div id="mini-title">Nenhuma aula selecionada</div>
                <div id="mini-module">-</div>
            </div>
        </div>

        <div class="player-center">
            <div class="player-controls">
                <button class="control-btn" id="prev-btn"><i class="fas fa-step-backward"></i></button>
                <button class="control-btn play-pause-btn" id="play-btn"><i class="fas fa-play"></i></button>
                <button class="control-btn" id="next-btn"><i class="fas fa-step-forward"></i></button>
            </div>

            <div id="messageTicker" class="ticker-container">
                <span id="tickerText" class="ticker-item"></span>
            </div>

            <div class="progress-container">
                <span id="current-time">0:00</span>
                <div class="progress-bar">
                    <div class="progress"></div>
                </div>
                <span id="duration">0:00</span>
            </div>
        </div>

        <div class="player-right">
            <!-- Link GitHub como span com ID e data-url -->
            <span id="github-player-icon" class="control-btn"
                data-url="https://github.com/OnoSendae/estrutura-de-dados-e-algoritmos" role="button" tabindex="0"
                title="Ver projeto no GitHub">
                <i class="fab fa-github"></i>
            </span>
            <button class="control-btn" id="mute-btn"><i class="fas fa-volume-up"></i></button>
            <div class="volume-bar">
                <input type="range" id="volume-slider" min="0" max="100" value="50">
                <div class="volume"></div>
            </div>
        </div>

        <audio id="audio-player"></audio>
    </footer>
</div>