-
Notifications
You must be signed in to change notification settings - Fork 2
/
tabela.html
146 lines (131 loc) · 5.58 KB
/
tabela.html
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
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<!DOCTYPE html>
<html lang="pt-br" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Tabela de feriados do Brasil</title>
<meta name="description" content="Veja aqui o calendário de feriados para diversas cidades do Brasil.">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe" crossorigin="anonymous"></script>
<script src="dateutils.js"></script>
<script src="feriados_calculo.js"></script>
<script src="feriados_view.js"></script>
<style>
body {
font-family: "Chinese Quotes", "Inter var", "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
#cardFeriados {
margin-left: 36px;
margin-right: 36px;
}
@media screen and (max-width:425px) {
#cardFeriados {
margin-left: 0px;
margin-right: 0px;
}
}
@media only screen and (max-width: 480px) {
th:nth-child(4) {
display: none;
}
td:nth-child(4) {
display: none;
}
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg bg-body-tertiary" data-bs-theme="dark">
<div class="container-fluid">
<a class="navbar-brand" href="index.html">Página inicial</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarText">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="index.html">Ver em calendário</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://github.com/alexandrehtrb/FeriadosDoBrasil">Ver código-fonte</a>
</li>
</ul>
<span class="navbar-text">
feito por <a href="https://github.com/alexandrehtrb">AlexandreHTRB</a>
</span>
</div>
</div>
</nav>
<div class="container" style="margin-top:24px;margin-left:24px;margin-right:24px;">
<h1 style="margin-right:48px;">🇧🇷 Tabela de feriados do Brasil</h1>
<p style="margin-top:24px;">Veja os feriados para seu estado e cidade.</p>
<div class="row row-cols-lg-auto g-3 align-items-center">
<div class="col-12">
<label class="visually-hidden" for="slEstado">Estado</label>
<select class="form-select" style="max-width: 240px;" id="slEstado"></select>
</div>
<div class="col-12">
<label class="visually-hidden" for="slCidade">Cidade</label>
<select class="form-select" style="max-width: 240px;" id="slCidade"></select>
</div>
<div class="col-12">
<label class="visually-hidden" for="inpAno">Ano</label>
<input type="number" id="inpAno" class="form-control" style="max-width: 120px;" placeholder="Ano" />
</div>
<div class="col-12">
<div class="form-check">
<input class="form-check-input" type="checkbox" value="" id="inpMarcarEmendas">
<label class="form-check-label" for="flexCheckDefault">
Marcar emendas
</label>
</div>
</div>
</div>
<div class="row row-cols-lg-auto g-3 align-items-center" style="margin-top:4px;">
<div class="col-12">
<button id="btnIncluirOutraCidade" class="btn btn-outline-dark" type="button" data-bs-toggle="collapse" data-bs-target="#collapseEstadoCidade2" aria-expanded="false" aria-controls="collapseEstadoCidade2">
Incluir outra cidade
</button>
</div>
<div class="row row-cols-lg-auto g-2 align-items-center collapse collapse-horizontal" id="collapseEstadoCidade2">
<div class="col-12">
<label class="visually-hidden" for="slEstado2">Estado</label>
<select class="form-select" style="max-width: 240px;" id="slEstado2"></select>
</div>
<div class="col-12">
<label class="visually-hidden" for="slCidade2">Cidade</label>
<select class="form-select" style="max-width: 240px;" id="slCidade2"></select>
</div>
</div>
</div>
<div class="row row-cols-lg-auto g-3 align-items-center" style="margin-top:4px;">
<div class="col-12">
<button id="btnExportarParaJson" class="btn btn-outline-dark" type="button">
Exportar para JSON
</button>
</div>
<div class="col-12">
<button id="btnExportarParaCsv" class="btn btn-outline-dark" type="button">
Exportar para CSV / Excel
</button>
</div>
</div>
</div>
<div id="cardFeriados" class="card text-center" style="margin-top:24px;margin-bottom:48px;visibility:hidden;">
<table class="table table-hover">
<thead>
<tr>
<th scope="col">Data</th>
<th scope="col">Dia da semana</th>
<th scope="col">Nome</th>
<th scope="col">Abrangência</th>
</tr>
</thead>
<tbody id="tbodyTabelaFeriados"></tbody>
</table>
</div>
<script>
setupView("tabela");
</script>
</body>
</html>