TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-11-28 05:37:34 +03:00
Code Issues Projects Releases Wiki Activity

Added the loading state

Browse Source
This commit is contained in:
Djordje Vlaisavljevic 2022-07-08 10:30:31 +02:00
parent b72bd2c85c
commit 5ade92c78d
1 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
ghost/sodo-search/src/components/PopupModal.js
View File

@ -2,6 +2,7 @@ import Frame from './Frame';
import AppContext from '../AppContext';
import {ReactComponent as SearchIcon} from '../icons/search.svg';
import {ReactComponent as ClearIcon} from '../icons/clear.svg';
import {ReactComponent as CircleAnimated} from '../icons/circle-anim.svg';
import {useContext, useEffect, useMemo, useRef, useState} from 'react';
import {getBundledCssLink} from '../utils/helpers';
@ -145,7 +146,6 @@ function SearchBox() {
<SearchClearIcon />
</div>
{/* <SearchIcon className='mr-3 text-neutral-900' alt='Search' /> */}
<input
ref={inputRef}
value={searchValue || ''}
@ -160,8 +160,9 @@ function SearchBox() {
}
}}
className='grow -my-5 py-5 -ml-3 pl-3 text-[1.65rem] focus-visible:outline-none placeholder:text-gray-400 outline-none'
placeholder='Search posts, tags, authors..'
placeholder='Search posts, tags, authors...'
/>
<Loading />
<CancelButton />
</div>
);
@ -185,6 +186,12 @@ function SearchClearIcon() {
);
}
function Loading() {
return (
<CircleAnimated className='shrink-0' />
);
}
function CancelButton() {
const {dispatch} = useContext(AppContext);