Skip to content

Commit 17a2d17

Browse files
committed
added foot.css
1 parent 656bf8d commit 17a2d17

6 files changed

Lines changed: 206 additions & 20 deletions

File tree

css/backgrounds.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ body.grey {
6767
background: url('../img/backgrounds/scollop-white.png');
6868
}
6969
.background.dark-grey {
70-
background: url('../img/backgrounds/titlebar-bg.png');
70+
background: #171717;
7171
}
7272
.background.dark-grey:before {
7373
background: url('../img/backgrounds/scollop-dark-grey.png');

css/footer.css

Lines changed: 145 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
1+
/*
2+
# Footer
3+
4+
```
5+
<div class="footer background dark-grey">
6+
<div class="box-container container">
7+
<div class="box small">
8+
<span class="box-title">API ENGINE</span>
9+
<ul class="footer-links">
10+
<li><a href="">HOME</a></li>
11+
<li><a href="">PRICING</a></li>
12+
<li><a href="">FEATURES</a></li>
13+
</ul>
14+
</div>
15+
<div class="box small">
16+
<span class="box-title">OPEN SOURCE</span>
17+
<p class="footer-desc">The API Engine team are active in the Open Source community.</p>
18+
<p class="footer-desc">Visit our Open Source home page on Github to find out more about our Open Source projects .</p>
19+
<ul class="footer-links">
20+
<li><a href="">API ENGINE ON GITHUB</a>
21+
</ul>
22+
</div>
23+
<div class="box small">
24+
<span class="box-title">HELP</span>
25+
<ul class="footer-links">
26+
<li><a href="">GETTING STARTED</a></li>
27+
<li><a href="">CREATING APIS</a></li>
28+
<li><a href="">MANAGING APIS</a></li>
29+
<li><a href="">COLLABORATORS</a></li>
30+
</ul>
31+
</div>
32+
<div class="box large last">
33+
<span class="box-title">CONTACT</span>
34+
<form>
35+
<input type="text" />
36+
<input type="text" />
37+
<textarea></textarea>
38+
<button class="btn btn-blue">Submit</button>
39+
40+
</form>
41+
42+
</div>
43+
<div style="clear: both;"></div>
44+
</div>
45+
<div class="footer-terms-container">
46+
<ul class="footer-terms">
47+
<li><a href="">Privacy</a></li>
48+
<li><a href="">Privacy</a></li>
49+
<li><a href="">Privacy</a></li>
50+
<li class="last"><a href="">Privacy</a></li>
51+
</ul>
52+
<div style="clear: both;"></div>
53+
54+
</div>
55+
<div class="footer-copyright">
56+
Api Engine Inc, Copyright 2012
57+
</div>
58+
</div>
59+
```
60+
61+
*/
62+
.footer .box-container {
63+
padding: 50px 0;
64+
}
65+
.footer .box-container .box.last {
66+
margin-right: 0;
67+
}
68+
.footer .box {
69+
float: left;
70+
margin-right: 40px;
71+
min-height: 50px;
72+
}
73+
.footer .box.large {
74+
width: 352px;
75+
76+
}
77+
.footer .box-title {
78+
color: #eee;
79+
font-size: 20px;
80+
font-family: 'Nexa Bold';
81+
margin-bottom: 25px;
82+
display: inline-block;
83+
}
84+
.footer-links {
85+
margin: 0;
86+
padding: 0;
87+
list-style: none;
88+
}
89+
.footer-desc {
90+
margin: 0;
91+
margin-bottom: 25px;
92+
color: #eee;
93+
font-size: 14px;
94+
}
95+
.footer-links li a {
96+
color: #fed563;
97+
font-size: 16px;
98+
font-family: 'Nexa';
99+
}
100+
.footer-links li {
101+
margin-bottom: 25px;
102+
}
103+
.footer .box.small {
104+
width: 184px;
105+
}
106+
107+
.footer form input {
108+
width: 346px;
109+
margin-bottom: 16px;
110+
}
111+
.footer form textarea {
112+
margin-bottom: 16px;
113+
width: 346px;
114+
height: 150px;
115+
}
116+
.footer-terms-container {
117+
text-align: center;
118+
margin-bottom: 50px;
119+
}
120+
.footer-terms {
121+
list-style: none;
122+
margin: 0;
123+
padding: 0;
124+
display: inline-block;
125+
}
126+
.footer-terms li {
127+
float: left;
128+
margin-right: 40px;
129+
}
130+
.footer-terms li.last {
131+
margin-right: 0;
132+
}
133+
.footer-terms li a {
134+
135+
color: #fed563;
136+
font-size: 16px;
137+
font-family: 'Nexa';
138+
}
139+
140+
.footer-copyright {
141+
text-align: center;
142+
font-family: 'Nexa';
143+
color: #eee;
144+
padding-bottom: 50px;
145+
}

css/profile.css

Lines changed: 4 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -137,7 +137,7 @@
137137
.tempbox-container {
138138
padding: 20px 20px 30px 20px;
139139
}
140-
.box {
140+
.tempbox-container .box {
141141
width: 290px;
142142
float: left;
143143
margin-right: 44px;
@@ -152,10 +152,10 @@
152152
.tempbox-footer {
153153
padding: 10px 0 10px 0;
154154
}
155-
.box.first {
155+
.tempbox-container .box.first {
156156
margin-left: 10px;
157157
}
158-
.box .icon {
158+
.tempbox-container .box .icon {
159159
font-size: 108px;
160160
display: inline-block;
161161
width: 100%;
@@ -177,18 +177,6 @@ text-justify:inter-word;
177177
color: #6c6d6f;
178178
margin-bottom: 20px;
179179
}
180-
.box.last {
180+
.tempbox-container .box.last {
181181
margin-right: 0;
182182
}
183-
.box1 {
184-
185-
}
186-
187-
.box2 {
188-
189-
190-
}
191-
192-
.box3 {
193-
194-
}

css/styles.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ Third party helper libraries
1616
@import url("bodybuilder.css");
1717
@import url("apimenu.css");
1818
@import url("theme.css");
19+
@import url("footer.css");
1920
@import url("backgrounds.css");
2021
@import url("comments.css");
2122
@import url("button.css");

css/theme.css

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -349,7 +349,4 @@ html, body {
349349
.api-description:hover {
350350
outline: 1px solid #ccc;
351351
background: #ebebeb;
352-
}
353-
.footer {
354-
height: 300px;
355352
}

templates/home/page.html

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -172,3 +172,58 @@ <h3 class="home-heading">
172172
</script>
173173

174174
</div>
175+
176+
<div class="footer background dark-grey">
177+
<div class="box-container container">
178+
<div class="box small">
179+
<span class="box-title">API ENGINE</span>
180+
<ul class="footer-links">
181+
<li><a href="">HOME</a></li>
182+
<li><a href="">PRICING</a></li>
183+
<li><a href="">FEATURES</a></li>
184+
</ul>
185+
</div>
186+
<div class="box small">
187+
<span class="box-title">OPEN SOURCE</span>
188+
<p class="footer-desc">The API Engine team are active in the Open Source community.</p>
189+
<p class="footer-desc">Visit our Open Source home page on Github to find out more about our Open Source projects .</p>
190+
<ul class="footer-links">
191+
<li><a href="">API ENGINE ON GITHUB</a>
192+
</ul>
193+
</div>
194+
<div class="box small">
195+
<span class="box-title">HELP</span>
196+
<ul class="footer-links">
197+
<li><a href="">GETTING STARTED</a></li>
198+
<li><a href="">CREATING APIS</a></li>
199+
<li><a href="">MANAGING APIS</a></li>
200+
<li><a href="">COLLABORATORS</a></li>
201+
</ul>
202+
</div>
203+
<div class="box large last">
204+
<span class="box-title">CONTACT</span>
205+
<form>
206+
<input type="text" />
207+
<input type="text" />
208+
<textarea></textarea>
209+
<button class="btn btn-blue">Submit</button>
210+
211+
</form>
212+
213+
</div>
214+
<div style="clear: both;"></div>
215+
</div>
216+
<div class="footer-terms-container container">
217+
<ul class="footer-terms">
218+
<li><a href="">Privacy</a></li>
219+
<li><a href="">Privacy</a></li>
220+
<li><a href="">Privacy</a></li>
221+
<li class="last"><a href="">Privacy</a></li>
222+
</ul>
223+
<div style="clear: both;"></div>
224+
225+
</div>
226+
<div class="footer-copyright container">
227+
Api Engine Inc, Copyright 2012
228+
</div>
229+
</div>

0 commit comments

Comments
 (0)