Commit dde6aa9e9966ca578e4d874de4a176a9bec2710a
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
@@ -3028,91 +3028,95 @@ li.folder-item:first-child { | @@ -3028,91 +3028,95 @@ li.folder-item:first-child { | ||
3028 | border-top: 1px solid #ccc; | 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 | text-align: justify; | 3060 | text-align: justify; |
3055 | - max-height: 45px; | 3061 | + max-height: 25px; |
3056 | text-overflow: ellipsis; | 3062 | text-overflow: ellipsis; |
3057 | overflow: hidden; | 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 | .page-1 .position-1 .post-pic { | 3074 | .page-1 .position-1 .post-pic { |
3075 | + width: 100%; | ||
3084 | height: 315px; | 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 | } |