/
index.haml
151 lines (147 loc) · 6.49 KB
/
index.haml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
---
layout: default
---
.jumbotron
.container.pos-rel
.jumbotron-header
%h1.jumbotron-title
%img.logo{:src => "./img/docsearch-logo.svg"}
%p#top The easiest way to add search to your documentation.
.jumbotron-left-column
%div.index-container
%img.index{:src => "./img/illus-index.svg"}
%div.ripple
.spacer30
.text-center
%p We’ve created the fastest, easiest way to search within documentation.
%p
And best of all? It’s FREE.
{% haml join-form.haml %}
#section_why.page-section
.m800.m-l-r-auto
%h2.page-section-title Why DocSearch?
%p We're kind of 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 No one's to blame, building a good search for a documentation is a complex challenge.
We just happen to have a lot of experience doing that, and we want to share it with the world.
#section_examples.page-section.dark
.container
.text-center
%h2.page-section-title DocSearch is live
%p We’ve integrated DocSearch into several open source projects. Take a look.
.row
.col-sm-4.showcase
%a{:href => "http://eslint.org/", :target => "_blank"}
%img.img-responsive.logo{:src => "./img/showcase/logo-eslint.png"}
.screen-wrapper
%img.img-responsive.example.freezeframe{:src => "./img/showcase/example-eslint.gif"}
%img.img-responsive.screen-mask{:src => "./img/mask.png"}
.spacer5
ESLint
.col-sm-4.showcase
%a{:href => "http://docs.scala-lang.org/", :target => "_blank"}
%img.img-responsive.logo{:src => "./img/showcase/logo-scala.png"}
.screen-wrapper
%img.img-responsive.example.freezeframe{:src => "./img/showcase/example-scala.gif"}
%img.img-responsive.screen-mask{:src => "./img/mask.png"}
.spacer5
Scala
.col-sm-4.showcase
%a{:href => "https://babeljs.algolia.com/", :target => "_blank"}
%img.img-responsive.logo{:src => "./img/showcase/logo-babel.png"}
.screen-wrapper
%img.img-responsive.example.freezeframe{:src => "./img/showcase/example-babel.gif"}
%img.img-responsive.screen-mask{:src => "./img/mask.png"}
.spacer5
Babel.js
.col-sm-4.showcase
%a{:href => "http://vuejs.org/guide/", :target => "_blank"}
%img.img-responsive.logo{:src => "./img/showcase/logo-vuejs.png"}
.screen-wrapper
%img.img-responsive.example.freezeframe{:src => "./img/showcase/example-vuejs.gif"}
%img.img-responsive.screen-mask{:src => "./img/mask.png"}
.spacer5
Vue.js
.col-sm-4.showcase
%a{:href => "http://facebook.github.io/react-native/docs/getting-started.html", :target => "_blank"}
%img.img-responsive.logo{:src => "./img/showcase/logo-react.png"}
.screen-wrapper
%img.img-responsive.example.freezeframe{:src => "./img/showcase/example-reactnative.gif"}
%img.img-responsive.screen-mask{:src => "./img/mask.png"}
.spacer5
React Native
.col-sm-4.showcase
%a{:href => "https://docs.influxdata.com/", :target => "_blank"}
%img.img-responsive.logo{:src => "./img/showcase/logo-influxdata.png"}
.screen-wrapper
%img.img-responsive.example.freezeframe{:src => "./img/showcase/example-influxdata.gif"}
%img.img-responsive.screen-mask{:src => "./img/mask.png"}
.spacer5
Influxdata
.col-sm-4.showcase
%a{:href => "http://help.apiary.io/", :target => "_blank"}
%img.img-responsive.logo{:src => "./img/showcase/logo-apiary.png"}
.screen-wrapper
%img.img-responsive.example.freezeframe{:src => "./img/showcase/example-apiary.gif"}
%img.img-responsive.screen-mask{:src => "./img/mask.png"}
.spacer5
Apiary
.col-sm-4.showcase
%a{:href => "http://marionettejs.com/", :target => "_blank"}
%img.img-responsive.logo{:src => "./img/showcase/logo-marionettejs.png"}
.screen-wrapper
%img.img-responsive.example.freezeframe{:src => "./img/showcase/example-marionettejs.gif"}
%img.img-responsive.screen-mask{:src => "./img/mask.png"}
.spacer5
Marionette.js
.col-sm-4.showcase
.placeholder-logo
.placeholder-screen
.spacer5
You?
#section_how.page-section
.container
.row
%h2.page-section-title How it works
.row
.col-sm-12
%img.img-responsive{:src => "./img/illus-howitworks.jpg"}
.spacer60
.row
.col-sm-10.col-sm-offset-1
.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.
.spacer30
.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 care of all of this automatically to ensure the best documentation search experience.
.spacer30
.col-sm-4.how-it-works
%h3
%span.how-it-works-number> 3
You add the search autocomplete to your UI
%p We’ll send you a few lines to code to integrate Algolia autocomplete and 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.dark
.container
%h2.page-section-title Get started
.text-center
%p We’ll get back to you within a few hours with everything you need to integrate your new search into your website.
%p Oh, and did we mention it's FREE? No commitment. No subscription. Everything is on us! And it won't change.
.spacer30
{% haml join-form.haml %}
{% contentfor site-footer %}
<script src="{{ "/js/home.js" | prepend: site.baseurl }}"></script>
<script src="js/animation.js"></script>
<script type="text/javascript">
freezeframe_options = {
animation_icon_image: false
}
</script>
<script src="js/freezeframe.min.js"></script>
{% endcontentfor %}