Skip to content
This repository was archived by the owner on Mar 4, 2025. It is now read-only.
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Commit ba3d0fb

Browse files
committedFeb 1, 2017
Fix footer links for mobile view
1 parent 80e730e commit ba3d0fb

File tree

2 files changed

+55
-44
lines changed

2 files changed

+55
-44
lines changed
 

‎app/layout/footer/footer.jade

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
footer.bottom-footer
22
// Footer links
33
nav.menu-item
4-
.menu-item-header.show-small OTHERS
54

65
ul.submenu
76
li.submenu-item #[a.menu-link(ng-href="https://www.{{domain}}/sitemap") SITE MAP]

‎assets/css/layout/footer.scss

Lines changed: 55 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,31 @@
11
@import 'topcoder/tc-includes';
22

3+
footer {
4+
font-family: "Merriweather Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
5+
font-weight: 400;
6+
}
7+
38
.bottom-footer {
49
background-color: $gray-darkest;
510
padding: 1px 20px 30px 20px;
611
}
712

13+
.bottom-footer .menu-item .menu-link {
14+
color: $tc-white;
15+
font-size: ;
16+
}
17+
18+
.bottom-footer .menu-item .menu-link:hover {
19+
color: $primary;
20+
}
21+
822
.social-links {
923
font-size: 13px;
1024
line-height: 1.2em;
1125
text-align: center;
1226
font-weight: normal;
1327
margin: 35px 0;
14-
color: #fff;
28+
color: $tc-white;
1529

1630
a {
1731
display: inline-block;
@@ -23,60 +37,80 @@
2337
margin-left: 30px;
2438
}
2539
}
40+
41+
.fb-link {
42+
background-image: url(@@cdn/i/ico-facebook_desktop.svg);
43+
width: 27px;
44+
height: 27px;
45+
}
46+
47+
.twitter-link {
48+
background-image: url(@@cdn/i/ico-twitter_desktop.svg);
49+
width: 28px;
50+
height: 24px;
51+
}
52+
53+
.linkedin-link {
54+
background-image: url(@@cdn/i/ico-linkedin_desktop.svg);
55+
width: 27px;
56+
height: 27px;
57+
}
58+
59+
.google-link {
60+
background-image: url(@@cdn/i/ico-google_desktop.svg);
61+
width: 27px;
62+
height: 27px;
63+
}
2664
}
2765

2866
.copyright-notice {
2967
text-align: center;
3068
font-size: 12px;
3169
line-height: 14px;
32-
color: #656565;
70+
color: $tc-white;
3371
}
3472

3573

3674
@media only screen and (max-width : 1024px) {
3775
// removed fold-pusher from the rule to remove white space
38-
// .bottom-footer, .fold-pusher {
39-
.bottom-footer {
40-
height: 200px;
76+
.bottom-footer, .fold-pusher {
77+
// .bottom-footer {
78+
height: auto;
4179
}
4280
.bottom-footer .menu-item {
43-
display: none;
44-
margin-top: 10px;
81+
display: block;
4582
}
4683

4784
.social-links {
85+
margin-top: 0;
86+
margin-bottom: 6px;
87+
4888
.fb-link {
49-
background-image: url(../../images/ico-facebook.svg);
5089
width: 27px;
5190
height: 27px;
5291
}
5392

5493
.twitter-link {
55-
background-image: url(../../images/ico-twitter.svg);
5694
width: 28px;
5795
height: 24px;
5896
}
5997

6098
.linkedin-link {
61-
background-image: url(../../images/ico-linkedin.svg);
6299
width: 27px;
63100
height: 27px;
64101
}
65102

66103
.google-link {
67-
background-image: url(../../images/ico-google.svg);
68104
width: 27px;
69105
height: 27px;
70106
}
71107
}
72108

73109
.bottom-footer nav {
74-
position: absolute;
75-
top: 1047px;
76-
left: 0;
77-
width: 100%;
78-
padding: 20px;
79-
background-color: $gray-darkest;
110+
position: relative;;
111+
top: auto;
112+
left: auto;
113+
text-align: center;
80114

81115
ul a {
82116
color: $white;
@@ -86,9 +120,9 @@
86120

87121
@media only screen and (min-width : 1025px) {
88122
// removed fold-pusher from the rule to remove white space
89-
// .bottom-footer, .fold-pusher {
90-
.bottom-footer {
91-
height: 270px;
123+
.bottom-footer, .fold-pusher {
124+
// .bottom-footer {
125+
height: 200px;
92126
}
93127
.bottom-footer {
94128
padding-top: 40px;
@@ -102,25 +136,19 @@
102136
font-weight: normal;
103137

104138
.menu-link {
105-
color: #fff;
106-
font-size: 16px;
107139
line-height: 21px;
108140
}
109-
.menu-link:hover {
110-
color: #0096ff;
111-
}
112141
}
113142
}
114143

115144
.copyright-notice {
116145
font-size: 15px;
117-
color: #fff;
146+
color: $tc-white;
118147
}
119148

120149
.account-footer {
121150
.copyright-notice {
122151
font-size: 12px;
123-
color: #656565;
124152
}
125153
}
126154

@@ -132,21 +160,5 @@
132160
height: 26px;
133161
margin-top: 13px;
134162
}
135-
136-
.fb-link {
137-
background-image: url(../../images/ico-facebook_desktop.svg);
138-
}
139-
140-
.twitter-link {
141-
background-image: url(../../images/ico-twitter_desktop.svg);
142-
}
143-
144-
.linkedin-link {
145-
background-image: url(../../images/ico-linkedin_desktop.svg);
146-
}
147-
148-
.google-link {
149-
background-image: url(../../images/ico-google_desktop.svg);
150-
}
151163
}
152164
}

0 commit comments

Comments
 (0)
This repository has been archived.