Commit f8893b7e8d01772bff1d8f4e958dd91a8e8bcca2
1 parent
31e863ca
Exists in
master
and in
5 other branches
Add participate button (html/css only)
Showing
2 changed files
with
65 additions
and
42 deletions
Show diff stats
index.html
@@ -314,48 +314,52 @@ | @@ -314,48 +314,52 @@ | ||
314 | <section class="talk-proposal box box-propostas"> | 314 | <section class="talk-proposal box box-propostas"> |
315 | <div class="container-title box-title">Bate-papo com ministras e ministros</div> | 315 | <div class="container-title box-title">Bate-papo com ministras e ministros</div> |
316 | <p class="talk__description">Confira as datas e horários:</p> | 316 | <p class="talk__description">Confira as datas e horários:</p> |
317 | - <div> | ||
318 | - <ul class="calendar saude" data-slick='{"infinite": false, "rows": 2}'> | ||
319 | - <li> | ||
320 | - <span id='ep0'></span> | ||
321 | - <span>Saúde</span> | ||
322 | - <div id='ed0' class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div> | ||
323 | - </li> | ||
324 | - </ul> | ||
325 | - <ul class="calendar seguranca-publica" data-slick='{"infinite": false, "rows": 2}'> | ||
326 | - <li> | ||
327 | - <span id='ep1'></span> | ||
328 | - <span id='ed1'>Justiça</span> | ||
329 | - <div class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div> | ||
330 | - </li> | ||
331 | - </ul> | ||
332 | - <ul class="calendar educacao" data-slick='{"infinite": false, "rows": 2}'> | ||
333 | - <li> | ||
334 | - <span id='ep2'></span> | ||
335 | - <span>Educação</span> | ||
336 | - <div id='ed2' class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div> | ||
337 | - </li> | ||
338 | - </ul> | ||
339 | - <ul class="calendar reducao-da-pobreza" data-slick='{"infinite": false, "rows": 2}'> | ||
340 | - <li> | ||
341 | - <span id='ep3'></span> | ||
342 | - <span>Desenvolvimento Social</span> | ||
343 | - <div id='ed3' class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div> | ||
344 | - </li> | ||
345 | - </ul> | ||
346 | - </div> | ||
347 | - <div class="talk__participate"> | 317 | + <div class="col-sm-12"> |
348 | <div class="row"> | 318 | <div class="row"> |
349 | - <div class="col-sm-4 col-md-3 col-lg-2"> | ||
350 | - <div class="row"> | ||
351 | - <button type="button" class="button button-block">Participar</button> | 319 | + <ul class="calendar saude" data-slick='{"infinite": false, "rows": 2}'> |
320 | + <li> | ||
321 | + <span id='ep0'></span> | ||
322 | + <span>Saúde</span> | ||
323 | + <div id='ed0' class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div> | ||
324 | + </li> | ||
325 | + </ul> | ||
326 | + <ul class="calendar seguranca-publica" data-slick='{"infinite": false, "rows": 2}'> | ||
327 | + <li> | ||
328 | + <span id='ep1'></span> | ||
329 | + <span id='ed1'>Justiça</span> | ||
330 | + <div class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div> | ||
331 | + </li> | ||
332 | + </ul> | ||
333 | + <ul class="calendar educacao" data-slick='{"infinite": false, "rows": 2}'> | ||
334 | + <li> | ||
335 | + <span id='ep2'></span> | ||
336 | + <span>Educação</span> | ||
337 | + <div id='ed2' class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div> | ||
338 | + </li> | ||
339 | + </ul> | ||
340 | + <ul class="calendar reducao-da-pobreza" data-slick='{"infinite": false, "rows": 2}'> | ||
341 | + <li> | ||
342 | + <span id='ep3'></span> | ||
343 | + <span>Desenvolvimento Social</span> | ||
344 | + <div id='ed3' class="date"><i class="fa fa-calendar"></i></div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div> | ||
345 | + </li> | ||
346 | + </ul> | ||
347 | + </div> | ||
348 | + </div> | ||
349 | + <div class="col-sm-12"> | ||
350 | + <div class="talk__participate"> | ||
351 | + <div class="row"> | ||
352 | + <div class="col-sm-4 col-md-3 col-lg-2"> | ||
353 | + <div class="row"> | ||
354 | + <button type="button" class="button button-block">Participar</button> | ||
355 | + </div> | ||
352 | </div> | 356 | </div> |
353 | - </div> | ||
354 | - <div class="col-sm-8 col-md-9 col-lg-10"> | ||
355 | - <div class="row"> | ||
356 | - <div class="talk__counter"> | ||
357 | - <span class="talk__value">8.117</span> | ||
358 | - <span class="talk__counter-message">se inscreveram para esse hangout</span> | 357 | + <div class="col-sm-8 col-md-9 col-lg-10"> |
358 | + <div class="row"> | ||
359 | + <div class="talk__counter"> | ||
360 | + <span class="talk__value">8.117</span> | ||
361 | + <span class="talk__counter-message">se inscreveram para esse hangout</span> | ||
362 | + </div> | ||
359 | </div> | 363 | </div> |
360 | </div> | 364 | </div> |
361 | </div> | 365 | </div> |
sass/style.sass
@@ -1089,8 +1089,27 @@ td | @@ -1089,8 +1089,27 @@ td | ||
1089 | text-align: center | 1089 | text-align: center |
1090 | 1090 | ||
1091 | // 6.20 - participe | 1091 | // 6.20 - participe |
1092 | -// .talk__participate | ||
1093 | -// .talk__participate | 1092 | +.talk__participate |
1093 | + .button | ||
1094 | + position: relative | ||
1095 | + z-index: 5 | ||
1096 | +.talk__counter | ||
1097 | + position: relative | ||
1098 | + display: inline-block | ||
1099 | + // line-height: 3 | ||
1100 | + margin-left: -10px | ||
1101 | + padding: 15px 15px 15px 25px | ||
1102 | + height: 52px // equals button size | ||
1103 | + background-color: #eeeff1 | ||
1104 | + z-index: 1 | ||
1105 | + border-radius: 10px | ||
1106 | + | ||
1107 | + @each $category, $color in $categories | ||
1108 | + .#{$category} & | ||
1109 | + color: $color | ||
1110 | + | ||
1111 | +.talk__value | ||
1112 | + font-weight: bold | ||
1094 | 1113 | ||
1095 | // ------------------------------------ | 1114 | // ------------------------------------ |
1096 | // 7 - Modificadores | 1115 | // 7 - Modificadores |