Skip to content

Commit ce37b0f

Browse files
authored
[DOCS] Creates custom landing page for the JS client book (#1831
* [DOCS] Creates custom landing page for the JS client book. * [DOCS] Fine-tunes text. * [DOCS] Updates hero image. * [DOCS] Changes page file name. * [DOCS] Adds one-liner to hero. * [DOCS] Reduces padding. * [DOCS] Changes section title. * [DOCS] Fine-tunes text.
1 parent 948f44a commit ce37b0f

File tree

1 file changed

+185
-0
lines changed

1 file changed

+185
-0
lines changed

docs/index-custom-title-page.html

Lines changed: 185 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,185 @@
1+
<style>
2+
* {
3+
box-sizing: border-box;
4+
}
5+
6+
.card {
7+
cursor: pointer;
8+
padding: 16px;
9+
text-align: left;
10+
color: #000;
11+
}
12+
13+
.card:hover {
14+
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
15+
padding: 16px;
16+
text-align: left;
17+
}
18+
19+
#guide a.no-text-decoration:hover {
20+
text-decoration: none!important;
21+
}
22+
23+
.icon {
24+
width: 24px;
25+
height: 24px;
26+
background-position: bottom;
27+
background-size: contain;
28+
background-repeat: no-repeat;
29+
}
30+
31+
.ul-col-1 {
32+
columns: 1;
33+
-webkit-columns: 1;
34+
-moz-columns: 1;
35+
}
36+
37+
@media (min-width:769px) {
38+
.ul-col-md-2 {
39+
columns: 2;
40+
-webkit-columns: 2;
41+
-moz-columns: 2;
42+
}
43+
}
44+
45+
#guide h3.gtk {
46+
margin-top: 16px;
47+
}
48+
49+
.mb-4, .my-4 {
50+
margin-bottom: 0!important;
51+
}
52+
</style>
53+
54+
<div class="legalnotice"></div>
55+
56+
<div class="row my-4">
57+
<div class="col-md-6 col-12">
58+
<p></p>
59+
<p>
60+
<h2>Documentation</h2>
61+
</p>
62+
<p>
63+
The official Node.js client provides one-to-one mapping with Elasticsearch REST APIs.
64+
</p>
65+
<p>
66+
<a href="https://www.elastic.co/guide/en/elasticsearch/client/javascript-api/current/installation.html">
67+
<button class="btn btn-primary">Get started</button>
68+
</a>
69+
</p>
70+
</div>
71+
<div class="col-md-6 col-12">
72+
<img class="w-100" src="https://images.contentstack.io/v3/assets/bltefdd0b53724fa2ce/blt3826dd36882ab258/641c4e9d542f593a7e8ba656/js-es-lp-hero.png" />
73+
</div>
74+
</div>
75+
76+
<h3 class="gtk">Get to know the JavaScript client</h3>
77+
78+
<div class="my-5">
79+
<div class="d-flex align-items-center mb-3">
80+
<h4 class="mt-3">
81+
<span class="inline-block float-left icon mr-2" style="background-image: url('https://images.contentstack.io/v3/assets/bltefdd0b53724fa2ce/bltfd59779217093221/641ae0c8db18f61d68e9c377/64x64_Color_icon-connected-circles64-color.png');"></span>
82+
Connecting
83+
</h4>
84+
</div>
85+
<ul class="ul-col-md-2 ul-col-1">
86+
<li>
87+
<a href="introduction.html">Introduction to the client</a>
88+
</li>
89+
<li>
90+
<a href="installation.html">Installing the client</a>
91+
</li>
92+
<li>
93+
<a href="client-connecting.html">Connecting to Elasticsearch</a>
94+
</li>
95+
<li>
96+
<a href="client-configuration.html">Configuration options</a>
97+
</li>
98+
</ul>
99+
</div>
100+
101+
<div class="my-5">
102+
<div class="d-flex align-items-center mb-3">
103+
<h4 class="mt-3">
104+
<span class="inline-block float-left icon mr-2" style="background-image: url('https://images.contentstack.io/v3/assets/bltefdd0b53724fa2ce/bltca09fd8c807816ce/641ae17733e7f95594918557/icon-monitor-cog-64-color.png');"></span>
105+
Using the JS client
106+
</h4>
107+
</div>
108+
<ul class="ul-col-md-2 ul-col-1">
109+
<li>
110+
<a href="bulk_examples.html">Bulk indexing</a>
111+
</li>
112+
<li>
113+
<a href="get_examples.html">Getting documents</a>
114+
</li>
115+
<li>
116+
<a href="search_examples.html">Searching</a>
117+
</li>
118+
<li>
119+
<a href="examples.html">More examples</a>
120+
</li>
121+
</ul>
122+
</div>
123+
124+
<div class="my-5">
125+
<div class="d-flex align-items-center mb-3">
126+
<h4 class="mt-3">
127+
<span class="inline-block float-left icon mr-2" style="background-image: url('https://images.contentstack.io/v3/assets/bltefdd0b53724fa2ce/blteacd058910f155d8/636925a6e0ff7c532db636d7/64x64_Color_icon-dev-tools-64-color.png');"></span>
128+
API and developer docs
129+
</h4>
130+
</div>
131+
<ul class="ul-col-md-2 ul-col-1">
132+
<li>
133+
<a href="api-reference.html">API reference</a>
134+
</li>
135+
<li>
136+
<a href="client-helpers.html">Client helpers</a>
137+
</li>
138+
<li>
139+
<a href="integrations.html">Integrations</a>
140+
</li>
141+
<li>
142+
<a href="changelog-client.html">Release notes</a>
143+
</li>
144+
</ul>
145+
</div>
146+
147+
<h3 class="explore">Explore by use case</h3>
148+
149+
<div class="row my-4">
150+
<div class="col-md-4 col-12 mb-2">
151+
<a class="no-text-decoration" href="https://www.elastic.co/guide/en/enterprise-search/current/start.html">
152+
<div class="card h-100">
153+
<h4 class="mt-3">
154+
<span class="inline-block float-left icon mr-2" style="background-image: url('https://images.contentstack.io/v3/assets/bltefdd0b53724fa2ce/blt11200907c1c033aa/634d9da119d8652169cf9b2b/enterprise-search-logo-color-32px.png');"></span>
155+
Search my data
156+
</h4>
157+
<p>Create search experiences for your content, wherever it lives.</p>
158+
</div>
159+
</a>
160+
</div>
161+
<div class="col-md-4 col-12 mb-2">
162+
<a class="no-text-decoration" href="https://www.elastic.co/guide/en/welcome-to-elastic/current/getting-started-observability.html">
163+
<div class="card h-100">
164+
<h4 class="mt-3">
165+
<span class="inline-block float-left icon mr-2" style="background-image: url('https://images.contentstack.io/v3/assets/bltefdd0b53724fa2ce/bltaa08b370a00bbecc/634d9da14e565f1cdce27f7c/observability-logo-color-32px.png');"></span>
166+
Observe my data
167+
</h4>
168+
<p>Follow our guides to monitor logs, metrics, and traces.</p>
169+
</div>
170+
</a>
171+
</div>
172+
<div class="col-md-4 col-12 mb-2">
173+
<a class="no-text-decoration" href="https://www.elastic.co/guide/en/security/current/es-overview.html">
174+
<div class="card h-100">
175+
<h4 class="mt-3">
176+
<span class="inline-block float-left icon mr-2" style="background-image: url('https://images.contentstack.io/v3/assets/bltefdd0b53724fa2ce/blt5e0e0ad9a13e6b8c/634d9da18473831f96bbdf1e/security-logo-color-32px.png');"></span>
177+
Protect my environment
178+
</h4>
179+
<p>Learn how to defend against threats across your environment.</p>
180+
</div>
181+
</a>
182+
</div>
183+
</div>
184+
185+
<p class="my-4"><a href="https://www.elastic.co/guide/index.html">View all Elastic docs</a></p>

0 commit comments

Comments
 (0)