forked from pensandoodireito/pensandoodireito-tema
-
Notifications
You must be signed in to change notification settings - Fork 0
/
page-comece-debate.php
304 lines (281 loc) · 13.1 KB
/
page-comece-debate.php
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
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
<?php get_header(); ?>
<div id="featured-border-gray">
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 text-center">
<h4 class="font-roboto">O Ministério da Justiça quer sua ajuda para democratizar a elaboração das leis
no país</h4>
</div>
</div>
</div>
</div>
<!-- /destaque-border-gray -->
<div id="hello">
<div class="container text-center">
<div class="row">
<div class="col-md-5">
<h1 class="h4 font-amatic red" id="proponha"><strong>Proponha um debate!</strong></h1>
</div>
<div class="col-md-7">
<div class="mt-lg">
<h3 class="">Você quer saber a opinião da sociedade sobre um tema?</h3>
<div class="row mt-lg" id="discuss">
<div class="col-sm-5">
<a href="#" class="btn btn-danger btn-lg font-roboto width-full">CRIE</a>
<p class="mt-sm"><strong>Crie uma proposta</strong></p>
</div>
<div class="col-sm-2">
<p class=" h1 font-roboto"><strong>ou</strong></p>
</div>
<div class="col-sm-5">
<a href="#" class="btn btn-primary btn-lg font-roboto width-full">VOTE</a>
<p class="mt-sm"><strong>Vote nas propostas</strong></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container mt-lg mb-lg pb-lg">
<div class="row">
<div class="col-lg-10 col-md-offset-1">
<p class="text-center font-roboto"><strong>Conheça mais um pouco sobre os tópicos de debate: </strong></p>
<!--
<div id="accordion">
<div class="panel">
<input type="button" class="btn" data-toggle="collapse" data-target="#direitoconsumidor" value="Direito do Consumidor">
<input type="button" class="btn" data-toggle="collapse" data-target="#direitotransito" value="Direito de Trânsito">
<input type="button" class="btn" data-toggle="collapse" data-target="#politicapenitenciaria" value="Política Penitenciária">
<input type="button" class="btn" data-toggle="collapse" data-target="#segurancapublica" value="Segurança Pública">
<input type="button" class="btn" data-toggle="collapse" data-target="#sociedadedainfo" value="Sociedade da Informação">
<div id="direitoconsumidor" class="collapse out text-left col-md-12" data-parent="#accordion" class="collapse">
<h5><strong>Direito do Consumidor</strong></h5>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
</div>
<div id="direitotransito" class="collapse out text-left col-md-12" data-parent="#accordion" class="collapse">
<h5><strong>Direito de Trânsito</strong></h5>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
</div>
<div id="politicapenitenciaria" class="collapse out text-left col-md-12" data-parent="#accordion" class="collapse">
<h5><strong>Política Penitenciária</strong></h5>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
</div>
<div id="segurancapublica" class="collapse out text-left col-md-12" data-parent="#accordion" class="collapse">
<h5><strong>Segurança Pública</strong></h5>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
</div>
<div id="sociedadedainfo" class="collapse out text-left col-md-12" data-parent="#accordion" class="collapse">
<h5><strong>Sociedade da Informação</strong></h5>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
</div>
</div>
</div>
-->
<div role="tabpanel">
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li role="topicos-debate" class="active"><a href="#direitoconsumidor"
aria-controls="direitoconsumidor" role="tab"
data-toggle="tab">Direito do Consumidor</a></li>
<li role="topicos-debate"><a href="#direitotransito" aria-controls="direitotransito" role="tab"
data-toggle="tab">Direito de Trânsito</a></li>
<li role="topicos-debate"><a href="#politicapenitenciaria" aria-controls="politicapenitenciaria"
role="tab" data-toggle="tab">Política Penitenciária</a></li>
<li role="topicos-debate"><a href="#segurancapublica" aria-controls="segurancapublica" role="tab"
data-toggle="tab">Segurança Pública</a></li>
<li role="topicos-debate"><a href="#sociedadedainfo" aria-controls="sociedadedainfo" role="tab"
data-toggle="tab">Sociedade da Informação</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content mt-md">
<div role="tabpanel" class="tab-pane fade in active" id="direitoconsumidor">
<div class="row">
<div class="col-sm-2 col-md-offset-1 text-center">
<i class="fa fa-shopping-cart fa-5x red mt-sm"></i>
</div>
<div class="col-sm-6">
<h5 class="font-roboto"><strong>Direito do Consumidor</strong></h5>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the 1500s, when an
unknown printer took a galley of type and scrambled it to make a type specimen
book.</p>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane fade" id="direitotransito">
<div class="row">
<div class="col-sm-2 col-md-offset-1 text-center">
<i class="fa fa-road fa-5x red mt-sm"></i>
</div>
<div class="col-sm-6">
<h5 class="font-roboto"><strong>Direito de Trânsito</strong></h5>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the 1500s, when an
unknown printer took a galley of type and scrambled it to make a type specimen
book.</p>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane fade" id="politicapenitenciaria">
<div class="row">
<div class="col-sm-2 col-md-offset-1 text-center">
<i class="fa fa-gavel fa-5x red mt-sm"></i>
</div>
<div class="col-sm-6">
<h5 class="font-roboto"><strong>Política Penitenciária</strong></h5>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the 1500s, when an
unknown printer took a galley of type and scrambled it to make a type specimen
book.</p>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane fade" id="segurancapublica">
<div class="row">
<div class="col-sm-2 col-md-offset-1 text-center">
<i class="fa fa-lock fa-5x red mt-sm"></i>
</div>
<div class="col-sm-6">
<h5 class="font-roboto"><strong>Segurança Pública</strong></h5>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the 1500s, when an
unknown printer took a galley of type and scrambled it to make a type specimen
book.</p>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane fade" id="sociedadedainfo">
<div class="row">
<div class="col-sm-2 col-md-offset-1 text-center">
<i class="fa fa-mobile fa-5x red mt-sm"></i>
</div>
<div class="col-sm-6">
<h5 class="font-roboto"><strong>Sociedade da Informação</strong></h5>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the 1500s, when an
unknown printer took a galley of type and scrambled it to make a type specimen
book.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="bg-red">
<div class="container">
<div class="row">
<div class="col-lg-8 col-md-offset-1 text-left pb-lg">
<h3 class="font-roboto">Como funciona?</h3>
<p>Os debates servem para que o governo conheça a opinião da sociedade sobre determinado tema. E podem
até virar um projeto de lei.</p>
<p>Criar um debate nesta plataforma é muito simples. Primeiro você se cadastra no site. Depois, você
pode descrever sua proposta em texto ou fazer um vídeo. O debate deve pertencer a um dos tópicos
tratados pelo Ministério da Justiça: segurança pública, direito do consumidor, direitos no trânsito,
sociedade da informação e política penitenciária.</p>
<p>Você vai precisar conseguir no mínimo XXXXXXX votos para que sua proposta realmente vire um debate.
Por isso, divulgue o máximo que você puder! Compartilhe nas redes sociais e conte para os
amigos!</p>
</div>
<div class="col-lg-3 text-center">
<i class="fa fa-question-circle"></i>
</div>
</div>
</div>
</div>
<div id="featured-border-gray">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h3 class="font-roboto">Participar do processo legislativo é fácil!</h3>
</div>
</div>
<div class="col-sm-7 col-md-offset-1">
<ol>
<li>Mande sua ideia</li>
<li>Divulgue sua proposta</li>
<li>Acompanhe o processo de votação</li>
<li>Acompanhe a votação</li>
<li>Continue acompanhando o site</li>
<li>Participe sempre: enviando mais propostas, votando ou expondo seu ponto de vista</li>
</ol>
</div>
<div class="col-sm-4 text-center">
<i class="fa fa-thumbs-o-up"></i>
</div>
</div>
</div>
<div id="bgcolor2">
<div class="container">
<div class="row">
<div class="col-md-8 mb-xl">
<h3 class="font-roboto">Siga essas regras para uma proposta legal</h3>
<p class="mt-md">Por favor, não use em sua proposta linguagem ofensiva, obscena, racista ou
preconceituosa.</p>
<p>Também não invada a privacidade, se passe por outra pessoa ou use a plataforma para fazer propaganda
comercial.</p>
<p>Não moderamos debates, mas propostas com usuários com esses comportamentos poderão ser prevenidos ou
até bloqueados.</p>
<p>Ah, e não se esqueça: não saia do assunto.</p>
<p>Essa é a melhor forma de contribuir para um debate construtivo! </p>
</div>
<div class="col-md-4">
<div class="balao">
<h4 class="font-roboto">Dúvidas?</h4>
<p>Mande um email pra gente: email@email.com.br</p>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-8">
<h3 class="font-roboto">Vote nas propostas:</h3>
</div>
</div>
<div class="row">
<div class="col-ms-10 col-md-4 mt-lg">
<div class="proposal">
<figure class="img-responsive">
<img src="http://lorempixel.com/output/business-q-c-400-300-9.jpg">
<figcaption>
<h5 class="font-roboto">Título da proposta</h5>
<small>criador da proposta</small>
<span class="proposal-details">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever.Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever dummy text ever.</span>
<div class="proposal-footer">
<small>Resultado parcial da votação:</small>
<div class="progress">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40"
aria-valuemin="0" aria-valuemax="100" style="width: 40%">
</div>
</div>
<ul class="proposal-stats">
<li>
<div class="proposal-vote-yes">30%</div>
<span class="proposal-stats-label">concordam</span>
</li>
<li>
<div class="proposal-vote-no">70%</div>
<span class="proposal-stats-label">discordam</span></li>
<li class="proposal-date">
<div class="proposal-stats-date">
<div class="days">29 dias</div>
</div>
<div class="proposal-stats-label">para encerrar</div>
</li>
</ul>
</div>
<button class="btn btn-danger btn-sm btn-block" type="submit">Ver proposta</button>
</figcaption>
</figure>
</div>
</div>
</div>
<div class="row text-center">
<button type="button" class="btn btn-danger">Mostrar mais propostas</button>
</div>
</div>
<?php get_footer(); ?>