Skip to content

Commit f16cc38

Browse files
author
maddog
committed
Merge branch 'master' of github.com:apiengine/apiengine-client
2 parents d1def31 + 693f652 commit f16cc38

File tree

5 files changed

+348
-9
lines changed

5 files changed

+348
-9
lines changed

.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
The.Fountain*
12
build/node_modules
23
node_modules
34
build/output

css/features.css

+161
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,161 @@
1+
/*
2+
# Features page
3+
4+
```
5+
<div class="background grey">
6+
7+
</div>
8+
<div class="background light-grey">
9+
<div class="container features-section">
10+
<div class="features-toolbox"></div>
11+
<h2 class="features-heading">GREAT TOOLS</h2>
12+
<p class="features-tag">API Engine comes with a feature set of tools to suit large businesses, start-ups and individual developers alike</p>
13+
<a href="" class="sbtn green">SIGN UP</a>
14+
<div style="clear: both;"></div>
15+
</div>
16+
</div>
17+
<div class="background white">
18+
<div class="container ">
19+
<div class="features-section">
20+
21+
<div class="features-pic">
22+
<div class="features-pic-discovery"></div>
23+
</div>
24+
<div class="features-info">
25+
<h2 class="features-heading">DOCUMENTATION</h2>
26+
27+
<p class="features-desc">When you host your APIs on API Engine you can be confident that they are accessible, stylish, and responsive on all platforms.</p>
28+
29+
<div class="two-column">
30+
<div class="yellow-developers"></div>
31+
<h3 class="for-tag">FOR API DEVELOPERS</h3>
32+
<p class="features-desc">Stylish, acccesible, and hassle free API documents.</p>
33+
<ul class="features-list">
34+
<li>Stylish docs</li>
35+
<li>Consistent theme</li>
36+
<li>Responsive design</li>
37+
<ul>
38+
39+
</div>
40+
<div class="two-column">
41+
<div class="yellow-consumers"></div>
42+
<h3 class="for-tag">FOR API CONSUMERS</h3>
43+
<p class="features-desc">When you host your APIs on API Engine you can be confident that they are accesible stylish.</p>
44+
</div>
45+
<div style="clear: both;"></div>
46+
47+
</div>
48+
<div style="clear: both;"></div>
49+
50+
</div>
51+
<div style="clear: both;"></div>
52+
53+
</div>
54+
55+
</div>
56+
<div class="background light-grey"></div>
57+
```
58+
59+
*/
60+
.features-section {
61+
padding: 75px 0 75px 38px;
62+
}
63+
.features-toolbox {
64+
background: url('../img/features-toolbox.png');
65+
width: 337px;
66+
height: 252px;
67+
float: right;
68+
}
69+
.features-heading {
70+
font-size: 28px;
71+
font-family: 'Nexa Bold';
72+
font-weight: normal;
73+
margin-top: 0;
74+
}
75+
.features-tag {
76+
font-size: 28px;
77+
font-family: 'Nexa';
78+
}
79+
.features-desc {
80+
font-size: 18px;
81+
font-family: 'Nexa';
82+
text-align: left;
83+
}
84+
.features-info {
85+
width: 910px;
86+
float: left;
87+
}
88+
.features-pic {
89+
float: left;'
90+
width: 60px;
91+
height: 60px;
92+
margin-right: 20px;
93+
}
94+
.features-pic-discovery {
95+
width: 51px;
96+
height: 49px;
97+
background: url('../img/features-discovery-icon.png');
98+
}
99+
.features-pic-collab {
100+
width: 55px;
101+
height: 50px;
102+
background: url('../img/features-collaboration-icon.png');
103+
}
104+
.features-pic-docs {
105+
width: 39px;
106+
height: 50px;
107+
background: url('../img/features-docs-icon.png');
108+
}
109+
110+
111+
.two-column {
112+
width: 50%;
113+
float: left;
114+
text-align: center;
115+
margin-top: 50px;
116+
}
117+
.red-developers {
118+
width: 169px;
119+
height: 100px;
120+
background: url('../img/features-red-for-developers.png');
121+
display: inline-block;
122+
}
123+
124+
.red-consumers {
125+
width: 103px;
126+
display: inline-block;
127+
height: 100px;
128+
background: url('../img/features-red-for-consumers.png');
129+
}
130+
.blue-developers {
131+
width: 169px;
132+
height: 100px;
133+
background: url('../img/features-blue-for-developers.png');
134+
display: inline-block;
135+
}
136+
137+
.blue-consumers {
138+
width: 103px;
139+
display: inline-block;
140+
height: 100px;
141+
background: url('../img/features-blue-for-consumers.png');
142+
}
143+
.yellow-developers {
144+
width: 169px;
145+
height: 100px;
146+
background: url('../img/features-yellow-for-developers.png');
147+
display: inline-block;
148+
}
149+
150+
.yellow-consumers {
151+
width: 103px;
152+
display: inline-block;
153+
height: 100px;
154+
background: url('../img/features-yellow-for-consumers.png');
155+
}
156+
.features-list li {
157+
158+
font-size: 18px;
159+
font-family: 'Nexa';
160+
text-align: left;
161+
}

css/styles.css

+1
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ Third party helper libraries
1313
*/
1414
@import url("home.css");
1515
@import url("bodybuilder.css");
16+
@import url("features.css");
1617
@import url("apimenu.css");
1718
@import url("theme.css");
1819
@import url("footer.css");

img/features-toolbox.png

13 Bytes
Loading

templates/home/features.html

+185-9
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,187 @@
1-
1+
<div class="background light-grey">
2+
<div class="container features-section">
3+
<div class="features-toolbox">
4+
</div>
5+
<h2 class="features-heading">
6+
GREAT TOOLS
7+
</h2>
8+
<p class="features-tag">
9+
API Engine comes with a feature set of tools to suit large businesses,
10+
start-ups and individual developers alike
11+
</p>
12+
<a href="" class="sbtn green">SIGN UP</a>
13+
<div style="clear: both;">
14+
</div>
15+
</div>
16+
</div>
217
<div class="background white">
3-
<div class="container">
4-
<h2 style="margin: 0">Features</h2>
5-
<p style="margin: 0">We are going to have some feature listing going here</p>
6-
<h2 style="margin: 0">Features</h2>
7-
<p style="margin: 0">We are going to have some feature listing going here</p>
8-
<h2 style="margin: 0">Features</h2>
9-
<p style="margin: 0">We are going to have some feature listing going here</p>
10-
</div>
18+
<div class="container ">
19+
<div class="features-section">
20+
<div class="features-pic">
21+
<div class="features-pic-docs">
22+
</div>
23+
</div>
24+
<div class="features-info">
25+
<h2 class="features-heading">
26+
DOCUMENTATION
27+
</h2>
28+
<p class="features-desc">
29+
When you host your APIs on API Engine you can be confident that they are
30+
accessible, stylish, and responsive on all platforms.
31+
</p>
32+
<div class="two-column">
33+
<div class="yellow-developers">
34+
</div>
35+
<h3 class="for-tag">
36+
FOR API DEVELOPERS
37+
</h3>
38+
<p class="features-desc">
39+
Stylish, acccesible, and hassle free API documents.
40+
</p>
41+
<ul class="features-list">
42+
<li>
43+
Stylish docs
44+
</li>
45+
<li>
46+
Consistent theme
47+
</li>
48+
<li>
49+
Responsive design
50+
</li>
51+
<ul>
52+
</div>
53+
<div class="two-column">
54+
<div class="yellow-consumers">
55+
</div>
56+
<h3 class="for-tag">
57+
FOR API CONSUMERS
58+
</h3>
59+
<p class="features-desc">
60+
When you host your APIs on API Engine you can be confident that they are
61+
accesible stylish.
62+
</p>
63+
</div>
64+
<div style="clear: both;">
65+
</div>
66+
</div>
67+
<div style="clear: both;">
68+
</div>
69+
</div>
70+
<div style="clear: both;">
71+
</div>
72+
</div>
73+
</div>
74+
<div class="background light-grey">
75+
<div class="container ">
76+
<div class="features-section">
77+
<div class="features-pic">
78+
<div class="features-pic-collab">
79+
</div>
80+
</div>
81+
<div class="features-info">
82+
<h2 class="features-heading">
83+
COLLABORATION
84+
</h2>
85+
<p class="features-desc">
86+
When you host your APIs on API Engine you can be confident that they are
87+
accessible, stylish, and responsive on all platforms.
88+
</p>
89+
<div class="two-column">
90+
<div class="blue-developers">
91+
</div>
92+
<h3 class="for-tag">
93+
FOR API DEVELOPERS
94+
</h3>
95+
<p class="features-desc">
96+
Stylish, acccesible, and hassle free API documents.
97+
</p>
98+
<ul class="features-list">
99+
<li>
100+
Stylish docs
101+
</li>
102+
<li>
103+
Consistent theme
104+
</li>
105+
<li>
106+
Responsive design
107+
</li>
108+
<ul>
109+
</div>
110+
<div class="two-column">
111+
<div class="blue-consumers">
112+
</div>
113+
<h3 class="for-tag">
114+
FOR API CONSUMERS
115+
</h3>
116+
<p class="features-desc">
117+
When you host your APIs on API Engine you can be confident that they are
118+
accesible stylish.
119+
</p>
120+
</div>
121+
<div style="clear: both;">
122+
</div>
123+
</div>
124+
<div style="clear: both;">
125+
</div>
126+
</div>
127+
<div style="clear: both;">
128+
</div>
129+
</div>
130+
</div>
131+
<div class="background white">
132+
<div class="container ">
133+
<div class="features-section">
134+
<div class="features-pic">
135+
<div class="features-pic-discovery">
136+
</div>
137+
</div>
138+
<div class="features-info">
139+
<h2 class="features-heading">
140+
DISCOVERY
141+
</h2>
142+
<p class="features-desc">
143+
When you host your APIs on API Engine you can be confident that they are
144+
accessible, stylish, and responsive on all platforms.
145+
</p>
146+
<div class="two-column">
147+
<div class="red-developers">
148+
</div>
149+
<h3 class="for-tag">
150+
FOR API DEVELOPERS
151+
</h3>
152+
<p class="features-desc">
153+
Stylish, acccesible, and hassle free API documents.
154+
</p>
155+
<ul class="features-list">
156+
<li>
157+
Stylish docs
158+
</li>
159+
<li>
160+
Consistent theme
161+
</li>
162+
<li>
163+
Responsive design
164+
</li>
165+
<ul>
166+
</div>
167+
<div class="two-column">
168+
<div class="red-consumers">
169+
</div>
170+
<h3 class="for-tag">
171+
FOR API CONSUMERS
172+
</h3>
173+
<p class="features-desc">
174+
When you host your APIs on API Engine you can be confident that they are
175+
accesible stylish.
176+
</p>
177+
</div>
178+
<div style="clear: both;">
179+
</div>
180+
</div>
181+
<div style="clear: both;">
182+
</div>
183+
</div>
184+
<div style="clear: both;">
185+
</div>
186+
</div>
11187
</div>

0 commit comments

Comments
 (0)