Commit 35bf2b940bb15c945dda326aa06b01b7a38719eb

Authored by Tomáz Martins
1 parent b98f0ac7

Readjusting size of images and spaces between texts

Showing 1 changed file with 76 additions and 62 deletions   Show diff stats
news.css
1   -/*.action-content_viewer-view_page #content .main-block #article p {
2   - max-height: 65px;
3   - overflow: hidden;
4   - text-align: left;
5   - text-overflow: ellipsis;
6   -}
7   -*/
8   -
9 1 /******************** New layout of blog. ********************/
10 2  
11 3 /***** Default behavior to blog posts *****/
12 4  
13   -.action-content_viewer-view_page .blog-post .author {
14   - display: none;
  5 +.action-content_viewer-view_page #content .main-block #article-header h1.title {
  6 + border:none !important;
  7 + color: #FF0366; /* Magenta. */
  8 + font-family: 'open sans';
  9 + font-size: 16px !important;
  10 + text-transform: uppercase;
15 11 }
16 12  
17   -.action-content_viewer-view_page.blog-post h1.title {
18   - margin-bottom: 0px;
19   - padding-left: 25px;
  13 +.action-content_viewer-view_page #article-header .publishing-info .date,
  14 +.action-content_viewer-view_page #article-header .publishing-info .author,
  15 +.action-content_viewer-view_page #article-header .publishing-info .comments {
  16 + display: none;
  17 +}
  18 +
  19 +.action-content_viewer-view_page .blog-post .author {
  20 + display: none;
20 21 }
21 22  
22 23 .action-content_viewer-view_page .blog-post .title a {
23 24 font-family: arial;
24 25 font-size: 16px;
  26 + line-height: 20px;
25 27 }
26 28  
27 29 .action-content_viewer-view_page .blog-post .post-pic {
... ... @@ -30,15 +32,15 @@
30 32 background-repeat: no-repeat;
31 33 border-radius: 4px;
32 34 float: left;
33   - height: 136px; /*100px;*/
  35 + height: 100px;
34 36 margin-bottom: 5px;
35   - margin-right: 10px;
  37 + margin-right: 20px;
36 38 /*width: 150px;*/
37   - width: 33.33333333%;
  39 + width: 33%;
38 40 }
39 41  
40 42 .action-content_viewer-view_page .blog-post .short-post {
41   - max-height: 25px;
  43 + max-height: 50px;
42 44 overflow: hidden;
43 45 text-align: justify;
44 46 text-overflow: ellipsis;
... ... @@ -46,19 +48,28 @@
46 48  
47 49 .action-content_viewer-view_page .blog-post .short-post p {
48 50 color: #172738;
49   - margin-bottom: -5px;
50 51 }
51 52  
52 53  
53 54 /***** Behavior to special posts *****/
54 55  
55 56 /* Featured post */
56   -/* REMOVER.action-content_viewer-view_page .page-1 .position-1{
57   - background-image: url("topo2.png");
58   - background-repeat: no-repeat;
59   -}*/
  57 +.action-content_viewer-view_page #content .blog-post h1.title {
  58 + border-top: none !important;
  59 + margin-bottom: 0px;
  60 + padding-left: 25px;
  61 +}
  62 +
  63 +.action-content_viewer-view_page #content .blog-post {
  64 + background: none;
  65 + border-bottom: 1px solid #ccc;
  66 + padding: 25px 0px 20px 0px;
  67 + margin: 0px 0px;
  68 +}
  69 +
60 70 .action-content_viewer-view_page .page-1 .position-1 .post-pic {
61 71 height: 320px;
  72 + margin-bottom: 13px;
62 73 max-height: 320px;
63 74 width: 100%;
64 75 }
... ... @@ -67,16 +78,13 @@
67 78 color: #172738 !important;
68 79 font-size: 34px;
69 80 line-height: 37px;
70   -
71 81 }
72 82  
73   -/* Secondary posts */
74   -/*REMOVER.action-content_viewer-view_page .page-1 .position-2 {
75   - background-image: url("lado-a-lado.png") !important;
76   - background-repeat: no-repeat;
77   -}*/
78   -
  83 +.action-content_viewer-view_page #content .page-1 .position-1 {
  84 + padding-bottom: 0px;
  85 +}
79 86  
  87 +/* Secondary posts */
80 88 .action-content_viewer-view_page .page-1 .position-2 .short-post,
81 89 .action-content_viewer-view_page .page-1 .position-3 .short-post,
82 90 .action-content_viewer-view_page .page-1 .position-4 .short-post {
... ... @@ -93,13 +101,9 @@
93 101 display: block;
94 102 float:left;
95 103 height: 235px;
96   - padding: 20px 14px 45px 0px; /*20px 23px 20px 0px;*/
  104 + padding: 20px 30px 45px 0px; /*20px 23px 20px 0px;*/
97 105 /*width: 158px;*/
98   - width: 32%; /*30%;*/
99   -}
100   -
101   -.action-content_viewer-view_page #content .page-1 .position-4 {
102   - padding-right: 0px;
  106 + width: 29%; /*30%;*/
103 107 }
104 108  
105 109 .action-content_viewer-view_page .page-1 .position-2 .odd-post-inner,
... ... @@ -110,7 +114,6 @@
110 114 overflow: hidden;
111 115 }
112 116  
113   -
114 117 .action-content_viewer-view_page .page-1 .position-2 .post-pic,
115 118 .action-content_viewer-view_page .page-1 .position-3 .post-pic,
116 119 .action-content_viewer-view_page .page-1 .position-4 .post-pic {
... ... @@ -119,34 +122,14 @@
119 122 width: 100%;
120 123 }
121 124  
122   -.action-content_viewer-view_page #content .blog-post {
123   - background: none;
124   - border-bottom: 1px solid #ccc;
125   - padding: 25px 0px 20px 0px;
126   - margin: 0px 0px;
127   -}
128   -
129   -.action-content_viewer-view_page #content .page-1 .position-1 {
130   - padding-bottom: 0px;
  125 +.action-content_viewer-view_page #content .page-1 .position-4 {
  126 + padding-right: 0px;
131 127 }
132 128  
133   -/* This rule is a plan B. */
134   -/*.action-content_viewer-view_page .page-1 .position-3 {
135   - padding: 25px !important;
136   -}*/
137   -
138 129 .action-content_viewer-view_page #content .main-block .article-body h1 {
139 130 padding-top: 0px !important;
140 131 border-top: none !important;
141 132 }
142   -.action-content_viewer-view_page #content .main-block #article-header h1.title {
143   - border:none !important;
144   -}
145   -
146   -
147   -.action-content_viewer-view_page #content .blog-post h1.title {
148   - border-top: none !important;
149   -}
150 133  
151 134 /* Other Positions */
152 135  
... ... @@ -185,15 +168,46 @@
185 168 .action-content_viewer-view_page #content .blog-post .publishing-info {
186 169 border-top: none;
187 170 color: #172838;
188   - font-size: 12px;
189   - font-family: "Open sans",arial;
  171 + font-size: 13px;
  172 + font-family:arial;
190 173 line-height: 21px;
191 174 }
192 175  
193 176 .action-content_viewer-view_page #content .blog-post .publishing-info .date {
194 177 display: block;
195   - margin-bottom: 10px;
  178 + margin-bottom: 5px;
196 179 }
  180 +
  181 +
197 182 .action-content_viewer-view_page #content #article-actions:last-child {
198 183 border-top: none;
199   -}
200 184 \ No newline at end of file
  185 +}
  186 +
  187 +/*
  188 + Observações:
  189 +
  190 + titulo do Blog: já resolvido;
  191 + autor do blog: pode tirar;ok
  192 +
  193 + date: reduzir 5 px (margin-botton); ok
  194 + Fonte: 13, Arial (remover OpenSans); ok
  195 +
  196 + titulo das postagens menores: reduzir o espaçamento entre linhas (7px a menos); ok
  197 + Fonte: 16, Arial; ok
  198 +
  199 + Espaçamento da foto para o texto: margem de baixo da imagem da position-1 deve aumentar 8px;
  200 +
  201 + Tamanho das imagens (lado a lado): reduzir XXXpx de cada imagem para ter 30px de
  202 + espaço entre elas;
  203 +
  204 + Tamanho das imagens (lista):;
  205 +
  206 + Título do Blog: formatar para o padrão especificado; ok
  207 + Fonte: 16, OpenSans, Caixa Alta; ok
  208 +
  209 + Espaçamento entre notícias: OK!
  210 +
  211 + Margem entre imagens e Texto (lista): o correto é 20px; ok
  212 +
  213 + Falta o título notícias anteriores!
  214 +*/
201 215 \ No newline at end of file
... ...