Commit 018b9b655e3ddc44f8867c2fcde39b2845196a5f
1 parent
7adf531e
Exists in
master
and in
4 other branches
Fix: align to right the share links on archived program
Showing
1 changed file
with
31 additions
and
14 deletions
Show diff stats
src/app/pages/programas/programas.scss
@@ -11,12 +11,34 @@ | @@ -11,12 +11,34 @@ | ||
11 | 11 | ||
12 | .program-preview { | 12 | .program-preview { |
13 | 13 | ||
14 | - .program-preview--box { | 14 | + &--box { |
15 | position: relative; | 15 | position: relative; |
16 | background-color: #f1f1f1; | 16 | background-color: #f1f1f1; |
17 | } | 17 | } |
18 | 18 | ||
19 | - .program-preview--banner { | 19 | + &--box--content-wrapper { |
20 | + padding: 48px; | ||
21 | + position: relative; | ||
22 | + | ||
23 | + } | ||
24 | + &--archived { | ||
25 | + .program-preview--box--content-wrapper { | ||
26 | + text-align: right; | ||
27 | + padding: 10px; | ||
28 | + | ||
29 | + @media screen and (max-width: $screen-xs) { | ||
30 | + text-align: center; | ||
31 | + padding-top: 50px; | ||
32 | + } | ||
33 | + } | ||
34 | + | ||
35 | + .program-preview--share { | ||
36 | + margin-bottom: 0; | ||
37 | + } | ||
38 | + } | ||
39 | + | ||
40 | + | ||
41 | + &--banner { | ||
20 | width: 100%; | 42 | width: 100%; |
21 | height: 400px; | 43 | height: 400px; |
22 | 44 | ||
@@ -35,7 +57,7 @@ | @@ -35,7 +57,7 @@ | ||
35 | } | 57 | } |
36 | } | 58 | } |
37 | 59 | ||
38 | - .program-preview--icon { | 60 | + &--icon { |
39 | $icon-size: 80px; | 61 | $icon-size: 80px; |
40 | $icon-scale: 0.7; | 62 | $icon-scale: 0.7; |
41 | position: absolute; | 63 | position: absolute; |
@@ -57,19 +79,14 @@ | @@ -57,19 +79,14 @@ | ||
57 | } | 79 | } |
58 | } | 80 | } |
59 | 81 | ||
60 | - .program-preview--box--content-wrapper { | ||
61 | - padding: 48px; | ||
62 | - position: relative; | ||
63 | - } | ||
64 | - | ||
65 | - .program-preview--abstract { | 82 | + &--abstract { |
66 | h2 { | 83 | h2 { |
67 | margin-top: 22px; // parent.margin + this.margin = 48 + 22 = 72px; | 84 | margin-top: 22px; // parent.margin + this.margin = 48 + 22 = 72px; |
68 | margin-bottom: 32px; | 85 | margin-bottom: 32px; |
69 | } | 86 | } |
70 | } | 87 | } |
71 | 88 | ||
72 | - .program-preview--abstract-details { | 89 | + &--abstract-details { |
73 | p { | 90 | p { |
74 | color: #484848; | 91 | color: #484848; |
75 | font-size: 14px; | 92 | font-size: 14px; |
@@ -78,7 +95,7 @@ | @@ -78,7 +95,7 @@ | ||
78 | } | 95 | } |
79 | } | 96 | } |
80 | 97 | ||
81 | - .program-preview--share { | 98 | + &--share { |
82 | margin-bottom: 20px; | 99 | margin-bottom: 20px; |
83 | position: relative; | 100 | position: relative; |
84 | 101 | ||
@@ -110,8 +127,8 @@ | @@ -110,8 +127,8 @@ | ||
110 | } | 127 | } |
111 | } | 128 | } |
112 | 129 | ||
113 | - .program-preview--share-label, | ||
114 | - .program-preview--share-directive { | 130 | + &--share-label, |
131 | + &--share-directive { | ||
115 | display: inline-block; | 132 | display: inline-block; |
116 | vertical-align: middle; | 133 | vertical-align: middle; |
117 | } | 134 | } |
@@ -262,7 +279,7 @@ | @@ -262,7 +279,7 @@ | ||
262 | h3 { | 279 | h3 { |
263 | font-weight: bold; | 280 | font-weight: bold; |
264 | } | 281 | } |
265 | - | 282 | + |
266 | .sub-section-odd {background-color: #f1f1f1; } | 283 | .sub-section-odd {background-color: #f1f1f1; } |
267 | .sub-section-even {background-color: #ffffff; } | 284 | .sub-section-even {background-color: #ffffff; } |
268 | 285 |