summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--packages/gitbook-plugin-search/src/components/Results.js9
-rw-r--r--packages/gitbook-plugin-theme-default/less/Search.less2
-rw-r--r--packages/gitbook-plugin-theme-default/less/variables.less2
3 files changed, 11 insertions, 2 deletions
diff --git a/packages/gitbook-plugin-search/src/components/Results.js b/packages/gitbook-plugin-search/src/components/Results.js
index 0e44960..ddff87d 100644
--- a/packages/gitbook-plugin-search/src/components/Results.js
+++ b/packages/gitbook-plugin-search/src/components/Results.js
@@ -2,6 +2,8 @@ const GitBook = require('gitbook-core');
const { React } = GitBook;
const Highlight = require('react-highlighter');
+const MAX_DESCRIPTION_SIZE = 500;
+
const Result = React.createClass({
propTypes: {
result: React.PropTypes.object,
@@ -11,6 +13,11 @@ const Result = React.createClass({
render() {
const { result, query } = this.props;
+ let summary = result.body.trim();
+ if (summary.length > MAX_DESCRIPTION_SIZE) {
+ summary = summary.slice(0, MAX_DESCRIPTION_SIZE).trim() + '...';
+ }
+
return (
<div className="Search-ResultContainer">
<GitBook.InjectedComponent matching={{ role: 'search:result' }} props={{ result, query }}>
@@ -23,7 +30,7 @@ const Result = React.createClass({
matchElement="span"
matchClass="Search-MatchSpan"
search={query}>
- {result.body}
+ {summary}
</Highlight>
</p>
</div>
diff --git a/packages/gitbook-plugin-theme-default/less/Search.less b/packages/gitbook-plugin-theme-default/less/Search.less
index 92981e8..38c1812 100644
--- a/packages/gitbook-plugin-theme-default/less/Search.less
+++ b/packages/gitbook-plugin-theme-default/less/Search.less
@@ -24,5 +24,5 @@
.Search-MatchSpan {
- background: #ffd54f;
+ background: @search-highlight-color;
}
diff --git a/packages/gitbook-plugin-theme-default/less/variables.less b/packages/gitbook-plugin-theme-default/less/variables.less
index 7cd444e..95d34ab 100644
--- a/packages/gitbook-plugin-theme-default/less/variables.less
+++ b/packages/gitbook-plugin-theme-default/less/variables.less
@@ -38,6 +38,8 @@
@dropdown-border-color: #e5e5e5;
@dropdown-color: @button-color;
@dropdown-hover-color: @button-hover-color;
+// Search
+@search-highlight-color: rgba(255, 220, 0, 0.4);
// Font awesome
@path-assets: '.';
@path-fonts: '@{path-assets}/fonts';