|
@@ -3,8 +3,6 @@ import React, { useState } from 'react';
|
|
|
import { useTranslation } from 'next-i18next';
|
|
import { useTranslation } from 'next-i18next';
|
|
|
import { Collapse } from 'reactstrap';
|
|
import { Collapse } from 'reactstrap';
|
|
|
|
|
|
|
|
-import styles from './SearchHelp.module.scss';
|
|
|
|
|
-
|
|
|
|
|
export const SearchHelp = (): JSX.Element => {
|
|
export const SearchHelp = (): JSX.Element => {
|
|
|
const { t } = useTranslation();
|
|
const { t } = useTranslation();
|
|
|
|
|
|
|
@@ -18,35 +16,35 @@ export const SearchHelp = (): JSX.Element => {
|
|
|
<span className="material-symbols-outlined ms-2 p-0">{isOpen ? 'expand_less' : 'expand_more'}</span>
|
|
<span className="material-symbols-outlined ms-2 p-0">{isOpen ? 'expand_less' : 'expand_more'}</span>
|
|
|
</button>
|
|
</button>
|
|
|
<Collapse isOpen={isOpen}>
|
|
<Collapse isOpen={isOpen}>
|
|
|
- <table className={`table m-0 ${styles['search-helper']}`}>
|
|
|
|
|
|
|
+ <table className="table table-borderless m-0">
|
|
|
<tbody>
|
|
<tbody>
|
|
|
- <tr>
|
|
|
|
|
|
|
+ <tr className="border-bottom">
|
|
|
<th className="py-2">
|
|
<th className="py-2">
|
|
|
<code>word1</code> <code>word2</code><br />
|
|
<code>word1</code> <code>word2</code><br />
|
|
|
<small className="text-muted">({ t('search_help.and.syntax help') })</small>
|
|
<small className="text-muted">({ t('search_help.and.syntax help') })</small>
|
|
|
</th>
|
|
</th>
|
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.and.desc', { word1: 'word1', word2: 'word2' }) }</h6></td>
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.and.desc', { word1: 'word1', word2: 'word2' }) }</h6></td>
|
|
|
</tr>
|
|
</tr>
|
|
|
- <tr>
|
|
|
|
|
|
|
+ <tr className="border-bottom">
|
|
|
<th className="py-2">
|
|
<th className="py-2">
|
|
|
<code>"This is GROWI"</code><br />
|
|
<code>"This is GROWI"</code><br />
|
|
|
<small className="text-muted">({ t('search_help.phrase.syntax help') })</small>
|
|
<small className="text-muted">({ t('search_help.phrase.syntax help') })</small>
|
|
|
</th>
|
|
</th>
|
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.phrase.desc', { phrase: 'This is GROWI' }) }</h6></td>
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.phrase.desc', { phrase: 'This is GROWI' }) }</h6></td>
|
|
|
</tr>
|
|
</tr>
|
|
|
- <tr>
|
|
|
|
|
|
|
+ <tr className="border-bottom">
|
|
|
<th className="py-2"><code>-keyword</code></th>
|
|
<th className="py-2"><code>-keyword</code></th>
|
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.exclude.desc', { word: 'keyword' }) }</h6></td>
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.exclude.desc', { word: 'keyword' }) }</h6></td>
|
|
|
</tr>
|
|
</tr>
|
|
|
- <tr>
|
|
|
|
|
|
|
+ <tr className="border-bottom">
|
|
|
<th className="py-2"><code>prefix:/user/</code></th>
|
|
<th className="py-2"><code>prefix:/user/</code></th>
|
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.prefix.desc', { path: '/user/' }) }</h6></td>
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.prefix.desc', { path: '/user/' }) }</h6></td>
|
|
|
</tr>
|
|
</tr>
|
|
|
- <tr>
|
|
|
|
|
|
|
+ <tr className="border-bottom">
|
|
|
<th className="py-2"><code>-prefix:/user/</code></th>
|
|
<th className="py-2"><code>-prefix:/user/</code></th>
|
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.exclude_prefix.desc', { path: '/user/' }) }</h6></td>
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.exclude_prefix.desc', { path: '/user/' }) }</h6></td>
|
|
|
</tr>
|
|
</tr>
|
|
|
- <tr>
|
|
|
|
|
|
|
+ <tr className="border-bottom">
|
|
|
<th className="py-2"><code>tag:wiki</code></th>
|
|
<th className="py-2"><code>tag:wiki</code></th>
|
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.tag.desc', { tag: 'wiki' }) }</h6></td>
|
|
<td><h6 className="m-0 text-muted">{ t('search_help.tag.desc', { tag: 'wiki' }) }</h6></td>
|
|
|
</tr>
|
|
</tr>
|