Commit 60f522631951cea9674303e6a8846acde2c7becb

Authored by Juliana
1 parent 9184ae9a

Organization tab blog with structure "short + pic"

Showing 1 changed file with 57 additions and 57 deletions   Show diff stats
css/community-pages.css
... ... @@ -316,88 +316,88 @@
316 316 }
317 317  
318 318 #content #blog-tab .blog .blog-post{
319   - padding:0px 20px 5px 20px;
320 319 background:none;
321 320 border-bottom: 1px solid #ECEDF1;
322   - padding:20px 0px 30px 0px;
  321 + padding:30px 0px 0px 0px;
323 322 }
324 323  
325 324 #content #blog-tab .blog .blog-post h1{
326   - margin: 0px 0px 6px 0px;
327   - text-align: left;
328   -}
329   -
330   -#blog-tab #article.blog .article-body h1{
331   - padding-top:0px;
332   - border-top:none;
333   - width: 70%;
334   - padding-left:130px;
  325 + margin: 0px 0px 10px 0px;
  326 + padding: 0px 0px 0px 0px;
  327 + max-width: 555px;
  328 + max-height: 40px;
  329 + border: none;
  330 + font: normal normal bold 16px/20px arial;
  331 + overflow: hidden;
  332 + display: inline-block;
335 333 }
336 334  
337   -/*#content #blog-tab .blog .blog-post.position-1 h1{
338   - line-height: 37px;
339   - font-size: 34px;
340   - color: #172738;
341   - padding-left:0px;
342   -}
343   -#content #blog-tab .blog .blog-post.position-1 .date{
344   - padding-left:0px;
  335 +#content #blog-tab .blog .blog-post .post-pic{
  336 + margin:0 20px 5px 0px;
  337 + border-radius: 4px;
  338 + height: 60px;
  339 + width: 20%;
  340 + background: center/cover no-repeat;
  341 + float: left;
345 342 }
346   -#content #blog-tab .blog .blog-post.position-1 .article-compact-image{
347   - position:relative;
348   - padding-right: 0px;
349   - margin-top: 0px; *temporary*
  343 +#content #blog-tab .blog .blog-post .publishing-info {
  344 + border-top: none;
  345 + color: #172838;
  346 + font: 13px/21px arial;
350 347 }
351 348  
352   -#content #blog-tab .blog .blog-post.position-1 .article-compact-abstract-with-image{
353   - width: 100%;
354   - margin-left: 0px;
  349 +#content #blog-tab .blog .publishing-info{
  350 + display:inline;
  351 + text-align: left;
355 352 }
356   -
357   -#blog-tab .blog .blog-post.position-1{
358   - padding-right: 0px;
359   -
360   -}*/
361   -
362   -#content #blog-tab .blog .publishing-info .date{
363   - width: 70%;
364   - padding-left:130px;
  353 +#content #blog-tab .blog .blog-post .publishing-info .date {
  354 + margin: 0px 0px 5px 0px;
  355 + display: table-cell;
365 356 }
366   -
367   -#content #blog-tab .blog .publishing-info .author{
  357 +#content #blog-tab .blog .blog-post .author {
368 358 display: none;
369 359 }
370 360  
371   -#content #blog-tab .blog .publishing-info .comments{
  361 +#content #blog-tab .blog .blog-post .comments{
372 362 display: none;
373 363 }
374   -#content #blog-tab .blog .blog-post .article-compact-image{
375   - position:absolute;
376   - margin-top:-51px; /* temporary */
377   - text-align: left;
378   -}
379 364  
380   -#content #blog-tab .blog .blog-post .article-compact-image img{
381   - border-radius: 4px;
382   - width: 110px;
383   - max-height: auto;
  365 +#content #blog-tab .blog .blog-post .short-post {
  366 + max-height: 35px;
  367 + text-align: justify;
  368 + text-overflow: ellipsis;
  369 + overflow: hidden;
384 370 }
385 371  
386   -#content #blog-tab .blog .blog-post .zoomable-image{
387   - width: 200px !important;
388   - height: auto !important;
  372 +#content #blog-tab .blog .article-body p {
  373 + margin: 0px 0px 5px 0px;
  374 + max-height: 25px;
  375 + color: #172738;
  376 + text-align: left;
  377 + text-overflow: ellipsis;
  378 + font: 14px/21px arial;
  379 + overflow: hidden;
389 380 }
390 381  
391   -#content #blog-tab .blog .blog-post .zoomable-image:hover .zoomify-image{
392   - display: none;
  382 +/*Post Position-1*/
  383 +#content #blog-tab .blog .blog-post.position-1 h1{
  384 + line-height: 37px;
  385 + font-size: 34px;
  386 + color: #172738;
  387 + padding-left:0px;
  388 + text-align: left;
393 389 }
394   -
395   -#content #blog-tab .blog .blog-post .zoomify-text{
396   - display:none;
  390 +#content #blog-tab .blog .blog-post.position-1 .date{
  391 + padding-left:0px;
397 392 }
398 393  
399   -#content #blog-tab .blog .blog-post .article-compact-abstract-with-image{
400   - margin-left: 130px;
  394 +#content #blog-tab .blog .blog-post.position-1 .post-pic {
  395 +margin: 0 20px 5px 0px;
  396 +border-radius: 4px;
  397 +height: 220px;
  398 +width: 100%;
  399 +background: center/cover no-repeat;
  400 +float: left;
401 401 }
402 402  
403 403 /* Read more button*/
... ...