chore(website): home page redesign
This commit is contained in:
kokliKo
Sylvain UTARD
parent
fab0e5b7ac
commit
5d57aa0b80
19 changed files with 323 additions and 77 deletions
BIN
docs/.DS_Store
vendored
Normal file
BIN
docs/.DS_Store
vendored
Normal file
Binary file not shown.
|
|
@ -1,22 +1,18 @@
|
|||
|
||||
<header class="site-header">
|
||||
<nav class="navbar navbar-default navbar-inverse">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#instant-search-nav">
|
||||
Menu <i class="fa fa-bars"></i>
|
||||
</button>
|
||||
<a class="navbar-brand" href="{{ site.baseurl }}/">{{ site.title }}</a>
|
||||
<a id="logo" href="/docsearch/"><img src='./img/algolia-logo.svg'></a>
|
||||
presents
|
||||
</div>
|
||||
<div id="instant-search-nav" class="navbar-collapse collapse">
|
||||
<div class="navbar-collapse collapse">
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
{% assign url = page.url %}
|
||||
{% for link in site.navigation %}
|
||||
<li {% if url == link.url %}class="active"{% endif %}>
|
||||
<a href="{{ site.baseurl }}{{ link.url }}" title="{{ link.title }}">{{ link.text }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
<li>
|
||||
<a class="navbar-github-link" href="//github.com/algolia/docsearch"><i class="fa fa-github"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
</header>
|
||||
|
|
@ -2,21 +2,21 @@
|
|||
<div id="mc_embed_signup">
|
||||
<form action="//algolia.us3.list-manage.com/subscribe/post?u=f7b8acc6ec97794a08484ca9b&id=285b80e148" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" novalidate>
|
||||
<div id="mc_embed_signup_scroll">
|
||||
<h3>Signup for our newsletter</h3>
|
||||
<div class="spacer20"></div>
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon" id="sizing-addon1"><i class="fa fa-envelope-o"></i></span>
|
||||
<input type="email" value="" name="EMAIL" class="form-control" id="mce-EMAIL" placeholder="Email Address">
|
||||
<span class="input-group-btn">
|
||||
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary">
|
||||
</span>
|
||||
</div>
|
||||
<div id="mce-responses" class="clear">
|
||||
<div class="response" id="mce-error-response" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;"><input type="text" name="b_f7b8acc6ec97794a08484ca9b_285b80e148" tabindex="-1" value=""></div>
|
||||
<h3>Sign up for our newsletter</h3>
|
||||
<div class="spacer20"></div>
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon" id="sizing-addon1"><i class="fa fa-envelope-o"></i></span>
|
||||
<input type="email" value="" name="EMAIL" class="form-control" id="mce-EMAIL" placeholder="Email Address">
|
||||
<span class="input-group-btn">
|
||||
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary">
|
||||
</span>
|
||||
</div>
|
||||
<div id="mce-responses" class="clear">
|
||||
<div class="response" id="mce-error-response" style="display:none"></div>
|
||||
<div class="response" id="mce-success-response" style="display:none"></div>
|
||||
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
|
||||
<div style="position: absolute; left: -5000px;"><input type="text" name="b_f7b8acc6ec97794a08484ca9b_285b80e148" tabindex="-1" value=""></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!--End mc_embed_signup-->
|
||||
|
|
|
|||
|
|
@ -1,22 +1,134 @@
|
|||
/* COLORS
|
||||
// -------------------------
|
||||
#46AEDA Algolia blue
|
||||
#FF2E6C Radical Red
|
||||
#091724 Black Pearl
|
||||
#C7C4C4 Gray text
|
||||
*/
|
||||
|
||||
/* GENERAL
|
||||
// ------------------------- */
|
||||
html, body {
|
||||
position: relative;
|
||||
@include size(100%,100%);
|
||||
background-attachment: fixed; }
|
||||
|
||||
h2 {
|
||||
font-size: 1.8em;
|
||||
font-weight: normal;
|
||||
letter-spacing: 1px;
|
||||
margin-bottom: 1em;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-attachment: fixed;
|
||||
font-family: "Raleway", "Open Sans", Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
.showcase--image {
|
||||
max-width: 200px;
|
||||
|
||||
|
||||
/* HEADER
|
||||
// ------------------------- */
|
||||
header.site-header {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
z-index: 99;
|
||||
background: linear-gradient(to right, rgba(10, 23, 36, 0.8) -50%, rgba(23, 44, 79, 0.5) 100%);
|
||||
transition: background 2s ease;
|
||||
border-bottom: 1px solid #232E3A;
|
||||
}
|
||||
header.site-header nav.navbar {
|
||||
margin-bottom: 0;
|
||||
background-color: #0B1724;
|
||||
border-radius: 0;
|
||||
border: none;
|
||||
}
|
||||
header.site-header nav.navbar .navbar-collapse.in {
|
||||
background-color: #0B1724 !important;
|
||||
animation: fadeInUp .2s ease-in-out;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding: 20%;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
header.site-header nav.navbar .navbar-collapse.in li {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
header.site-header nav.navbar #logo img {
|
||||
height: 32px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
header.site-header nav.navbar .navbar-header {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
height: 50px;
|
||||
font-size: 16px;
|
||||
color: #FF2E6C;
|
||||
line-height: 50px;
|
||||
}
|
||||
header.site-header nav.navbar .navbar-toggle {
|
||||
background-color: #1d96c7;
|
||||
border: solid 1px #1d96c7;
|
||||
color: white;
|
||||
}
|
||||
header.site-header nav.navbar .navbar-toggle.collapsed {
|
||||
background-color: transparent;
|
||||
border: solid 1px rgba(255, 255, 255, 0.4);
|
||||
color: white;
|
||||
}
|
||||
header.site-header nav.navbar .navbar-nav > li > a {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
header.site-header nav.navbar .navbar-nav > .active > a {
|
||||
color: #1D96C7 !important;
|
||||
background-color: transparent;
|
||||
}
|
||||
header.site-header nav.navbar .navbar-nav > li > a.navbar-github-link {
|
||||
font-size: 32px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
header.site-header nav.navbar .navbar-nav > li > a.navbar-github-link:hover {
|
||||
color: #46AEDA;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.jumbotron {
|
||||
|
||||
|
||||
|
||||
/* JUMBOTRON
|
||||
// ------------------------- */
|
||||
.main-content .jumbotron {
|
||||
padding-top: 60px;
|
||||
height: 700px;
|
||||
background: #091724 url(../img/header-bg.png) no-repeat center center;
|
||||
-webkit-background-size: cover;
|
||||
-moz-background-size: cover;
|
||||
-o-background-size: cover;
|
||||
background-size: cover;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.jumbotron .jumbotron-header {
|
||||
text-align: center;
|
||||
color: #FFF;
|
||||
}
|
||||
.jumbotron .jumbotron-header h1 {
|
||||
font-size: 60px;
|
||||
font-weight: 500;
|
||||
font-family: "Helvetica Neue", "Raleway", "Open Sans", Helvetica, Arial, sans-serif;
|
||||
}
|
||||
.jumbotron .jumbotron-header .big {
|
||||
font-size: 90px;
|
||||
}
|
||||
.jumbotron .jumbotron-header .blue {
|
||||
color: #46AEDA;
|
||||
}
|
||||
.jumbotron .jumbotron-left-column {
|
||||
padding-top: 100px;
|
||||
float: left;
|
||||
width: 400px;
|
||||
color: #FFF;
|
||||
margin-left: 120px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* JOIN FORM
|
||||
// ------------------------- */
|
||||
#join-form {
|
||||
background: white;
|
||||
display: block;
|
||||
|
|
@ -25,15 +137,115 @@ h2 {
|
|||
border: 2px solid #ccc;
|
||||
}
|
||||
|
||||
@media (min-width: $screen-lg) {
|
||||
@media (min-width: 1200px) {
|
||||
.jumbotron {
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
#join-form {
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
right: -20px;
|
||||
top: 240px;
|
||||
right: 120px;
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/* PAGE SECTIONS
|
||||
// ------------------------- */
|
||||
.page-section {
|
||||
padding-top: 100px;
|
||||
padding-bottom: 60px;
|
||||
font-size: 16px;
|
||||
line-height: 1.8;
|
||||
color: #091724;
|
||||
}
|
||||
.page-section-dark {
|
||||
background-color: #091724;
|
||||
color: #C7C4C4;
|
||||
}
|
||||
h2.page-section-title {
|
||||
font-size: 28px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 600;
|
||||
margin-top: 0;
|
||||
margin-bottom: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
.page-section-dark h2.page-section-title{
|
||||
color: #FFF;
|
||||
}
|
||||
h2.page-section-title:after {
|
||||
display: block;
|
||||
content: ' ';
|
||||
height: 10px;
|
||||
border-bottom: 3px solid #FF2E6C;
|
||||
margin: 4px auto;
|
||||
width: 60px;
|
||||
}
|
||||
#section_why {
|
||||
padding-left: 120px;
|
||||
padding-right: 120px;
|
||||
font-size: 20px;
|
||||
}
|
||||
#section_examples {
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
}
|
||||
#section_examples a {
|
||||
color: #C7C4C4;
|
||||
}
|
||||
#section_examples a:hover {
|
||||
color: #46AEDA;
|
||||
text-decoration: none;
|
||||
}
|
||||
#section_examples .showcase {
|
||||
margin-top: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
#section_examples .showcase img.logo {
|
||||
display: inline-block;;
|
||||
height: 60px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
#section_examples .showcase img.example {
|
||||
width: 100%;
|
||||
}
|
||||
#section_how h3 .how-it-works-number {
|
||||
float: left;
|
||||
line-height: 1;
|
||||
color: #46AEDA;
|
||||
font-size: 70px;
|
||||
font-weight: bold;
|
||||
font-family: "Helvetica Neue";
|
||||
position: relative;
|
||||
top: -13px;
|
||||
margin-right: 7px;
|
||||
}
|
||||
#section_how p {
|
||||
clear: both;
|
||||
}
|
||||
#section_get-started {
|
||||
padding-left: 120px;
|
||||
padding-right: 120px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
|
||||
/* FOOTER
|
||||
// ------------------------- */
|
||||
footer.site-footer {
|
||||
padding-top: 2em;
|
||||
margin-top: 0;
|
||||
border-top: 1px solid #eeeeee;
|
||||
background-color: white;
|
||||
text-align: center;
|
||||
}
|
||||
footer.site-footer .fa.fa-heart {
|
||||
color: #e61870;
|
||||
}
|
||||
footer.site-footer .input-group-addon {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
|
|
|||
BIN
docs/img/.DS_Store
vendored
Normal file
BIN
docs/img/.DS_Store
vendored
Normal file
Binary file not shown.
1
docs/img/algolia-logo.svg
Normal file
1
docs/img/algolia-logo.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg width="50" height="16" viewBox="0 0 50 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>algolia-logo</title><desc>Created with Sketch.</desc><defs><path d="M30.046 6.24l-.658 2.366 2.118-1.178c-.308-.572-.832-1.005-1.46-1.187zM24.85 8.656c0 2.533 2.023 4.586 4.52 4.586 2.496 0 4.52-2.052 4.52-4.585S31.866 4.07 29.37 4.07c-2.497 0-4.52 2.054-4.52 4.587zm4.52-3.277c1.78 0 3.228 1.47 3.228 3.275 0 1.806-1.45 3.276-3.23 3.276-1.778 0-3.227-1.47-3.227-3.274 0-1.807 1.45-3.277 3.23-3.277zm1.56-1.88c0-.018.004-.035.004-.054v-.413c0-.457-.363-.827-.81-.827h-1.42c-.45 0-.812.37-.812.827v.406c.452-.13.928-.2 1.42-.2.564 0 1.107.09 1.617.26zm-4.957.81c-.317-.324-.83-.324-1.148 0l-.143.145c-.317.323-.317.847 0 1.17l.153.155c.325-.53.74-1 1.22-1.385l-.082-.084z" id="a"/></defs><g fill="none" fill-rule="evenodd"><g transform="translate(-432 -160) translate(432 160)"><use fill="#00B7E5" xlink:href="#a"/><use xlink:href="#a"/></g><path d="M8.826 12.138c-.185-.478-.36-.948-.522-1.41-.163-.46-.332-.93-.506-1.41H2.676l-1.028 2.82H0c.435-1.168.843-2.248 1.224-3.24.38-.993.752-1.935 1.117-2.827.367-.89.73-1.74 1.088-2.552.36-.812.734-1.616 1.126-2.413h1.452c.39.797.767 1.6 1.125 2.413.36.812.72 1.663 1.086 2.555.364.893.736 1.835 1.117 2.828.38.993.788 2.073 1.224 3.24h-1.73zM7.342 8.046c-.35-.924-.694-1.818-1.036-2.683-.343-.865-.7-1.696-1.07-2.492-.38.8-.74 1.63-1.084 2.495-.342.865-.683 1.76-1.02 2.683h4.21zm6.89 4.644c-.93-.022-1.59-.22-1.98-.598-.39-.376-.583-.963-.583-1.76V.26L13.18 0v10.09c0 .248.02.453.063.614.044.16.114.29.21.388.1.096.23.17.392.217.162.046.362.086.6.12l-.21 1.26M21.834 12.123c-.13.086-.38.195-.75.33-.37.134-.803.2-1.298.2-.505 0-.98-.08-1.426-.24-.446-.162-.836-.41-1.17-.75-.332-.337-.595-.758-.79-1.262-.192-.502-.29-1.102-.29-1.8 0-.61.092-1.172.275-1.682.183-.51.45-.95.798-1.32.35-.37.776-.66 1.282-.868.505-.21 1.074-.315 1.708-.315.7 0 1.31.05 1.83.153.52.102.96.196 1.314.28v7.47c0 1.286-.333 2.22-1 2.8-.666.578-1.676.868-3.03.868-.527 0-1.024-.043-1.49-.13-.47-.085-.875-.186-1.218-.304l.27-1.303c.3.116.67.22 1.105.312.435.092.89.138 1.362.138.89 0 1.533-.176 1.925-.53.393-.354.59-.918.59-1.69v-.354zm-.62-6.333c-.254-.037-.595-.057-1.024-.057-.806 0-1.427.264-1.862.79-.436.525-.653 1.222-.653 2.09 0 .484.06.897.185 1.24.124.344.29.628.5.853.21.226.45.392.725.5.274.107.557.16.847.16.397 0 .763-.056 1.096-.17.333-.112.596-.243.79-.393V5.91c-.15-.042-.352-.082-.605-.12zm16.353 6.9c-.932-.022-1.592-.22-1.982-.598-.39-.376-.585-.963-.585-1.76V.26L36.51 0v10.09c0 .248.022.452.066.614.043.16.113.29.21.387.098.1.228.17.39.22.163.05.363.09.602.12l-.21 1.26" fill="#fff"/><path d="M40.555 2.564c-.308 0-.57-.09-.786-.272-.22-.182-.328-.426-.328-.734s.108-.553.325-.734c.214-.182.477-.272.785-.272.31 0 .57.09.788.272.216.18.325.426.325.734s-.11.552-.324.734c-.215.18-.48.272-.786.272zm-.85 1.55h1.72v8.576h-1.72V4.114zm7.003-.252c.614 0 1.133.084 1.555.25.423.167.763.402 1.02.707.26.302.443.664.552 1.083.11.42.165.882.165 1.388v5.605l-.55.094c-.237.04-.503.08-.8.112-.296.035-.617.066-.963.095-.346.03-.69.043-1.03.043-.482 0-.926-.05-1.332-.153s-.757-.267-1.053-.49c-.297-.225-.527-.52-.692-.89-.164-.367-.247-.81-.247-1.327 0-.495.096-.92.29-1.277.19-.356.45-.643.78-.862.33-.215.714-.376 1.153-.48.438-.103.9-.155 1.382-.155.154 0 .313.01.478.026.164.017.32.04.47.07l.386.077c.11.023.186.04.23.052v-.45c0-.264-.027-.525-.082-.784-.055-.26-.154-.49-.297-.69-.142-.2-.337-.362-.584-.483-.25-.12-.57-.18-.966-.18-.505 0-.946.037-1.325.112-.378.074-.66.152-.848.232l-.18-1.327c.197-.094.526-.183.987-.27.46-.086.96-.13 1.497-.13zm.132 8.035c.362 0 .683-.01.963-.026.28-.015.513-.046.7-.092V9.103c-.11-.057-.29-.106-.536-.146-.247-.04-.546-.06-.897-.06-.23 0-.475.017-.732.05-.258.036-.494.108-.708.217-.214.11-.393.258-.535.448-.143.19-.214.44-.214.75 0 .575.178.974.53 1.198.35.225.83.337 1.432.337z" fill="#fff"/></g></svg>
|
||||
|
After Width: | Height: | Size: 3.8 KiB |
BIN
docs/img/header-bg.png
Normal file
BIN
docs/img/header-bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 96 KiB |
BIN
docs/img/showcase/.DS_Store
vendored
Normal file
BIN
docs/img/showcase/.DS_Store
vendored
Normal file
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 97 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 64 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 58 KiB |
BIN
docs/img/showcase/example-eslint.gif
Normal file
BIN
docs/img/showcase/example-eslint.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 616 KiB |
BIN
docs/img/showcase/example-react.gif
Normal file
BIN
docs/img/showcase/example-react.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 216 KiB |
BIN
docs/img/showcase/example-scala.gif
Normal file
BIN
docs/img/showcase/example-scala.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 456 KiB |
BIN
docs/img/showcase/logo-eslint.png
Normal file
BIN
docs/img/showcase/logo-eslint.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4 KiB |
BIN
docs/img/showcase/logo-react.png
Normal file
BIN
docs/img/showcase/logo-react.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 48 KiB |
BIN
docs/img/showcase/logo-scala.png
Normal file
BIN
docs/img/showcase/logo-scala.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 82 KiB |
109
docs/index.haml
109
docs/index.haml
|
|
@ -5,39 +5,76 @@ layout: default
|
|||
.main-content
|
||||
.jumbotron
|
||||
.container.pos-rel
|
||||
%h1 Documentation Search
|
||||
|
||||
%p Add relevant, fast and reliable search to your documentation website in minutes.
|
||||
|
||||
%iframe#join-form{height: 356, allowTransparency: true, frameborder: 0, scrolling: 'no', src: '//www.formget.com/app/embed/form/H5IR-174988/i?w=328'}
|
||||
|
||||
.container
|
||||
%h1 Showcase
|
||||
.row.text-center
|
||||
.col-sm-3.showcase
|
||||
%img.img-responsive{src: '/img/showcase/eslint.png'}
|
||||
%p Eslint
|
||||
.col-sm-3
|
||||
%img.img-responsive{src: '/img/showcase/babeljs.png'}
|
||||
%p Babel
|
||||
.col-sm-3
|
||||
%img.img-responsive{src: '/img/showcase/bootstrap.png'}
|
||||
%p Bootstrap
|
||||
.col-sm-3
|
||||
%img.img-responsive{src: '/img/showcase/reactjs.png'}
|
||||
%p React
|
||||
|
||||
%h1 Features
|
||||
.row.text-center
|
||||
.col-sm-4
|
||||
%img{src: 'http://placehold.it/200x200'}
|
||||
%p Lorem ipsum dolor sit amet, consectetur adipisicing elit. In, sit, veritatis tempora ipsum, provident fugiat quas, eum dicta architecto
|
||||
.col-sm-4
|
||||
%img{src: 'http://placehold.it/200x200'}
|
||||
%p Lorem ipsum dolor sit amet, consectetur adipisicing elit. In, sit, veritatis tempora ipsum, provident fugiat quas, eum dicta architecto
|
||||
.col-sm-4
|
||||
%img{src: 'http://placehold.it/200x200'}
|
||||
%p Lorem ipsum dolor sit amet, consectetur adipisicing elit. In, sit, veritatis tempora ipsum, provident fugiat quas, eum dicta architecto
|
||||
|
||||
|
||||
%p Here are some examples of what you could build with docsearch.
|
||||
.jumbotron-header
|
||||
%h1.jumbotron-title
|
||||
%span.blue
|
||||
%span.big> D
|
||||
OC
|
||||
= succeed "EARCH" do
|
||||
%span.big S
|
||||
%p The easiest way to add search to your documentation.
|
||||
.jumbotron-left-column
|
||||
%p We’ve created the fastest, easiest way to search within documentation.
|
||||
%p And best of all? It’s free!
|
||||
%iframe#join-form{:allowTransparency => "", :frameborder => "0", :height => "356", :scrolling => "no", :src => "//www.formget.com/app/embed/form/H5IR-174988/i?w=328"}
|
||||
#section_why.page-section
|
||||
.container
|
||||
.row
|
||||
.col-sm-10.col-sm-offset-1
|
||||
%h2.page-section-title Why DocSearch?
|
||||
%p We’re scratching our own itch here. As developers, we spend a lot of time reading documentation, and it isn’t always easy to find the information we need.
|
||||
%p Not blaming anyone here. Building a good search for a documentation is a complex challenge. We happen to have a lot of experience doing that, and we want to share it with the world. For free.
|
||||
#section_examples.page-section.page-section-dark
|
||||
.container
|
||||
.row
|
||||
.col-sm-10.col-sm-offset-1
|
||||
%h2.page-section-title DocSearch is live
|
||||
%p
|
||||
We’ve integrated DocSearch into several open source projects.
|
||||
%br Take a look.
|
||||
.row
|
||||
.col-sm-4.showcase
|
||||
%a{:href => "//eslint.org/", :target => "_blank"}
|
||||
%img.img-responsive.logo{:src => "./img/showcase/logo-eslint.png"}
|
||||
%img.img-responsive.example{:src => "./img/showcase/example-eslint.gif"}
|
||||
ESLint
|
||||
.col-sm-4.showcase
|
||||
%a{:href => "//docs.scala-lang.org/", :target => "_blank"}
|
||||
%img.img-responsive.logo{:src => "./img/showcase/logo-scala.png"}
|
||||
%img.img-responsive.example{:src => "./img/showcase/example-scala.gif"}
|
||||
Scala
|
||||
.col-sm-4.showcase
|
||||
%a{:href => "//reactjs.algolia.com/", :target => "_blank"}
|
||||
%img.img-responsive.logo{:src => "./img/showcase/logo-react.png"}
|
||||
%img.img-responsive.example{:src => "./img/showcase/example-react.gif"}
|
||||
React.js
|
||||
#section_how.page-section
|
||||
.container
|
||||
.row
|
||||
%h2.page-section-title How it works
|
||||
.row
|
||||
.col-sm-4.how-it-works
|
||||
%h3
|
||||
%span.how-it-works-number> 1
|
||||
We crawl your documentation pages
|
||||
%p We built a website crawler designed to index every section of your documentation.
|
||||
%p Just send us the URL of your documentation, and we’ll periodically run the crawler so you’re always up-to-date.
|
||||
.col-sm-4.how-it-works
|
||||
%h3
|
||||
%span.how-it-works-number> 2
|
||||
We configure your search experience
|
||||
%p You don’t need to configure any settings or even have an Algolia account.
|
||||
%p We take of all of this automatically to ensure the best documentation search experience.
|
||||
.col-sm-4.how-it-works
|
||||
%h3
|
||||
%span.how-it-works-number> 3
|
||||
You add the autocomplete script to your UI
|
||||
%p We’ll send you the script so you can integrate Algolia autocomplete to power your search.
|
||||
%p You will receive the same speed, relevance and best-in-class UX as our paying customers.
|
||||
#section_get-started.page-section.page-section-dark
|
||||
.container
|
||||
.row
|
||||
.col-sm-10.col-sm-offset-1
|
||||
%h2.page-section-title Get started
|
||||
%p Add the url of your documentation site and your email to the form at the top of the page. We’ll get back to you with what you need to integrate your new search into your website.
|
||||
%p Don’t forget, DocSearch is completely free! There’s no need to sign up for Algolia or submit any payment information. Let’s tackle document search together.
|
||||
|
|
|
|||
Loading…
Reference in a new issue