Commit 53e7fa18063c8a94881884531eadd842824e6dd0
1 parent
58da2bc3
Exists in
master
and in
11 other branches
Styling the last box and using font awesome
Showing
2 changed files
with
43 additions
and
6 deletions
Show diff stats
index.html
| ... | ... | @@ -3,6 +3,7 @@ |
| 3 | 3 | <meta charset="utf-8" /> |
| 4 | 4 | <title>Participa Brasil</title> |
| 5 | 5 | <link rel="stylesheet" type="text/css" href="style.css" /> |
| 6 | + <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"> | |
| 6 | 7 | <script src='js/jquery-2.1.3.min.js'></script> |
| 7 | 8 | <script src='js/handlebars-v3.0.1.js'></script> |
| 8 | 9 | <script src='js/handlebars-helpers.js'></script> |
| ... | ... | @@ -144,14 +145,14 @@ |
| 144 | 145 | <p>Confira as datas e horários disponíveis:</p> |
| 145 | 146 | <ul class='calendar'> |
| 146 | 147 | <li> |
| 147 | - Arthur Chioro<br/> | |
| 148 | - Saúde | |
| 149 | - <div class='date'>22/04/2015</div><div class='time'>09:00</div> | |
| 148 | + <span>Arthur Chioro</span> | |
| 149 | + <span>Saúde</span> | |
| 150 | + <div class='date'><i class="fa fa-calendar"></i> 22/04/2015</div><div class='time'><i class="fa fa-clock-o"></i> 09:00</div> | |
| 150 | 151 | </li> |
| 151 | 152 | <li> |
| 152 | - Teresa Campello<br/> | |
| 153 | - Desenvolvimento Social | |
| 154 | - <div class='date'>22/04/2015</div><div class='time'>09:00</div> | |
| 153 | + <span>Teresa Campello</span> | |
| 154 | + <span>Desenvolvimento Social</span> | |
| 155 | + <div class='date'><i class="fa fa-calendar"></i> 22/04/2015</div><div class='time'><i class="fa fa-clock-o"></i> 09:00</div> | |
| 155 | 156 | </li> |
| 156 | 157 | </ul> |
| 157 | 158 | </div> | ... | ... |
sass/_proposal_detail.scss
| ... | ... | @@ -280,6 +280,42 @@ |
| 280 | 280 | height: $container-height; |
| 281 | 281 | min-height: $container-height; |
| 282 | 282 | margin: 20px 0 0 10px; |
| 283 | + text-align: left; | |
| 284 | + | |
| 285 | + span { | |
| 286 | + font-weight: 14px; | |
| 287 | + color: #333; | |
| 288 | + display: block; | |
| 289 | + } | |
| 290 | + | |
| 291 | + div.date, div.time { | |
| 292 | + width: 45%; | |
| 293 | + text-align: left; | |
| 294 | + color: $color; | |
| 295 | + display: inline-block; | |
| 296 | + margin-top: 20px; | |
| 297 | + } | |
| 298 | + | |
| 299 | + p { | |
| 300 | + margin: 20px; | |
| 301 | + text-align: left; | |
| 302 | + } | |
| 303 | + | |
| 304 | + ul { | |
| 305 | + width: 80%; | |
| 306 | + display: block; | |
| 307 | + margin: 0 auto; | |
| 308 | + | |
| 309 | + li { | |
| 310 | + width: 100%; | |
| 311 | + margin: 0; | |
| 312 | + padding: 10px; | |
| 313 | + height: auto; | |
| 314 | + overflow: visible; | |
| 315 | + margin-bottom: 5px; | |
| 316 | + background: #EEEFF1; | |
| 317 | + } | |
| 318 | + } | |
| 283 | 319 | } |
| 284 | 320 | |
| 285 | 321 | } | ... | ... |