Download as
Browse Code »

Commit dde6aa9e9966ca578e4d874de4a176a9bec2710a

Authored by Eduardo Vital
1 parent f01f81ed
Exists in news_page_css

Code organization and refactoring 

- Blocks of code commented
- '!important' removed
- 'img' replaced for 'post-pic'
- minor fixes

Signed-off-by: Alexandre Kryonidis <alexandrekry@gmail.com>
Signed-off-by: Eduardo Vital <vitaldu@gmail.com>
Showing 1 changed file with 62 additions and 58 deletions   Show diff stats
style.css
  Diff comments   View file @dde6aa9
... ... @@ -3028,91 +3028,95 @@ li.folder-item:first-child {
3028 3028 border-top: 1px solid #ccc;
3029 3029 }
3030 3030  
3031   -/* Código para o novo layout de notícias. Forçando soluções. */
3032   -.page-1 .position-2 {
3033   - display: table-cell !important;
3034   - width: 222px;
3035   - padding-left: 0px;
3036   - padding-right: 20px;
  3031 +/******************** New layout of blog. ********************/
  3032 +
  3033 +/***** Default behavior to blog posts *****/
  3034 +
  3035 +.blog-post .author {
  3036 + display: none;
3037 3037 }
3038 3038  
3039   -.page-1 .position-3 {
3040   - display: table-cell !important;
3041   - width: 232px;
3042   - padding-left: 10px;
3043   - padding-right: 10px;
  3039 +.blog-post h1.title {
  3040 + padding-left: 25px;
  3041 + margin-bottom: 0px;
3044 3042 }
3045 3043  
3046   -.page-1 .position-4 {
3047   - display: table-cell !important;
3048   - width: 222px;
3049   - padding-left: 20px;
3050   - padding-right: 0px;
  3044 +.blog-post .title a {
  3045 + font-size: 16px;
  3046 + font-family: arial;
  3047 +}
  3048 +
  3049 +.blog-post .post-pic {
  3050 + border-radius: 8px;
  3051 + width: 150px;
  3052 + height: 100px;
  3053 + float: left;
  3054 + margin-right: 10px;
  3055 + margin-bottom: 5px;
  3056 + background-size: 100% 100%;
3051 3057 }
3052 3058  
3053   -.page-1 .position-2 .short-post, .position-3 .short-post, .position-4 .short-post {
  3059 +.blog-post .short-post {
3054 3060 text-align: justify;
3055   - max-height: 45px;
  3061 + max-height: 25px;
3056 3062 text-overflow: ellipsis;
3057 3063 overflow: hidden;
3058 3064 }
3059 3065  
3060   -.page-1 .position-2 img, .position-3 img, .position-4 img {
3061   - width: 222px !important;
3062   - height: 135px !important;
3063   - max-width: none !important;
3064   - top: 10px;
3065   - margin-top: 5px;
3066   -}
3067   -
3068   -.page-1 .position-1 img {
3069   - width: 726px !important;
3070   - max-height: 315px;
3071   - max-width: none !important;
  3066 +.blog-post .short-post p {
  3067 + margin-bottom: -5px;
3072 3068 }
3073 3069  
3074   -.page-1 .position-1 .title a {
3075   - font-size: 32px !important;
3076   -}
  3070 +/***** Behavior to special posts *****/
3077 3071  
3078   -.page-1 .blog-post .post-pic {
3079   - border-radius: 8px;
3080   - margin-bottom: 5px;
3081   -}
  3072 +/* Featured post */
3082 3073  
3083 3074 .page-1 .position-1 .post-pic {
  3075 + width: 100%;
3084 3076 height: 315px;
  3077 + max-height: 315px;
3085 3078 }
3086 3079  
3087   -.title a {
3088   - font-size: 16px;
3089   - font-family: arial;
  3080 +.page-1 .position-1 .title a {
  3081 + font-size: 32px;
3090 3082 }
3091 3083  
3092   -#content #article .article-body img {
3093   - border-radius: 8px;
  3084 +/* Secondary posts */
  3085 +
  3086 +.page-1 .position-2 .short-post,
  3087 +.page-1 .position-3 .short-post,
  3088 +.page-1 .position-4 .short-post {
  3089 + text-align: justify;
  3090 + max-height: 45px;
  3091 + text-overflow: ellipsis;
  3092 + overflow: hidden;
3094 3093 }
3095 3094  
3096   -.page-1 .position-5 h1.title {
3097   - /* background-color: gray; */
3098   - padding-left: 25px;
3099   - margin-bottom: 0px;
  3095 +.page-1 .position-2 .post-pic,
  3096 +.page-1 .position-3 .post-pic,
  3097 +.page-1 .position-4 .post-pic {
  3098 + width: 100%;
  3099 + top: 10px;
  3100 + margin-top: 5px;
3100 3101 }
3101 3102  
3102   -.page-1 .position-5 .post-pic {
3103   - width: 150px;
3104   - height: 100px;
3105   - float: left;
3106   - margin-right: 10px;
  3103 +.page-1 .position-2 {
  3104 + display: table-cell;
  3105 + width: 222px;
  3106 + padding-left: 0px;
  3107 + padding-right: 20px;
3107 3108 }
3108 3109  
3109   -.position-5 .short-post {
3110   - text-align: justify;
3111   - max-height: 25px;
3112   - text-overflow: ellipsis;
3113   - overflow: hidden;
  3110 +.page-1 .position-3 {
  3111 + display: table-cell;
  3112 + width: 232px;
  3113 + padding-left: 10px;
  3114 + padding-right: 10px;
3114 3115 }
3115 3116  
3116   -#content .main-block .article-body P {
3117   - margin-bottom: -5px;
  3117 +.page-1 .position-4 {
  3118 + display: table-cell;
  3119 + width: 222px;
  3120 + padding-left: 20px;
  3121 + padding-right: 0px;
3118 3122 }
... ...