0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-24 23:48:13 -05:00

Switched breakpoint from md to sm

This commit is contained in:
Djordje Vlaisavljevic 2022-07-06 15:41:25 +02:00
parent 5114157564
commit 4743c3939f

View file

@ -131,9 +131,9 @@ function SearchBox() {
}; };
}, [dispatch]); }, [dispatch]);
let className = 'z-10 relative flex items-center py-5 px-4 md:px-7 mt-10 md:mt-0 bg-white rounded-t-lg shadow'; let className = 'z-10 relative flex items-center py-5 px-4 sm:px-7 mt-10 sm:mt-0 bg-white rounded-t-lg shadow';
if (!searchValue) { if (!searchValue) {
className = 'z-10 relative flex items-center py-5 px-4 md:px-7 mt-10 md:mt-0 bg-white rounded-lg'; className = 'z-10 relative flex items-center py-5 px-4 sm:px-7 mt-10 sm:mt-0 bg-white rounded-lg';
} }
return ( return (
@ -151,7 +151,7 @@ function SearchBox() {
placeholder='Search posts, tags, authors..' placeholder='Search posts, tags, authors..'
/> />
<ClearButton /> <ClearButton />
<CloseIcon className='ml-4 text-neutral-300 cursor-pointer w-5 h-5 md:hidden' alt='Close' /> <CloseIcon className='ml-4 text-neutral-300 cursor-pointer w-5 h-5 sm:hidden' alt='Close' />
</div> </div>
); );
} }
@ -179,7 +179,7 @@ function TagListItem({tag}) {
const {name, url} = tag; const {name, url} = tag;
return ( return (
<div <div
className='flex items-center py-3 -mx-4 md:-mx-7 px-4 md:px-7 hover:bg-gray-100 cursor-pointer' className='flex items-center py-3 -mx-4 sm:-mx-7 px-4 sm:px-7 hover:bg-gray-100 cursor-pointer'
onClick={() => { onClick={() => {
if (url) { if (url) {
window.location.href = url; window.location.href = url;
@ -206,7 +206,7 @@ function TagResults({tags}) {
); );
}); });
return ( return (
<div className='border-t border-gray-200 py-3 px-4 md:px-7'> <div className='border-t border-gray-200 py-3 px-4 sm:px-7'>
<h1 className='uppercase text-xs text-neutral-400 font-semibold mb-1 tracking-wide'>Tags</h1> <h1 className='uppercase text-xs text-neutral-400 font-semibold mb-1 tracking-wide'>Tags</h1>
{TagItems} {TagItems}
</div> </div>
@ -216,7 +216,7 @@ function TagResults({tags}) {
function PostListItem({post}) { function PostListItem({post}) {
const {title, excerpt, url} = post; const {title, excerpt, url} = post;
return ( return (
<div className='py-3 -mx-4 md:-mx-7 px-4 md:px-7 hover:bg-neutral-100 cursor-pointer' onClick={() => { <div className='py-3 -mx-4 sm:-mx-7 px-4 sm:px-7 hover:bg-neutral-100 cursor-pointer' onClick={() => {
if (url) { if (url) {
window.location.href = url; window.location.href = url;
} }
@ -249,7 +249,7 @@ function PostResults({posts}) {
); );
}); });
return ( return (
<div className='border-t border-neutral-200 py-3 px-4 md:px-7'> <div className='border-t border-neutral-200 py-3 px-4 sm:px-7'>
<h1 className='uppercase text-xs text-neutral-400 font-semibold mb-1 tracking-wide'>Posts</h1> <h1 className='uppercase text-xs text-neutral-400 font-semibold mb-1 tracking-wide'>Posts</h1>
{PostItems} {PostItems}
<ShowMoreButtom /> <ShowMoreButtom />
@ -261,7 +261,7 @@ function AuthorListItem({author}) {
const {name, profile_image: profileImage, url} = author; const {name, profile_image: profileImage, url} = author;
return ( return (
<div <div
className='py-[1rem] -mx-4 md:-mx-7 px-4 md:px-7 hover:bg-neutral-100 cursor-pointer flex items-center' className='py-[1rem] -mx-4 sm:-mx-7 px-4 sm:px-7 hover:bg-neutral-100 cursor-pointer flex items-center'
onClick={() => { onClick={() => {
if (url) { if (url) {
window.location.href = url; window.location.href = url;
@ -302,7 +302,7 @@ function AuthorResults({authors}) {
}); });
return ( return (
<div className='border-t border-neutral-200 py-3 px-4 md:px-7'> <div className='border-t border-neutral-200 py-3 px-4 sm:px-7'>
<h1 className='uppercase text-xs text-neutral-400 font-semibold mb-1 tracking-wide'>Authors</h1> <h1 className='uppercase text-xs text-neutral-400 font-semibold mb-1 tracking-wide'>Authors</h1>
{AuthorItems} {AuthorItems}
</div> </div>
@ -381,7 +381,7 @@ function Search() {
} }
}} }}
> >
<div className='bg-white w-full max-w-[95vw] md:max-w-lg rounded-lg shadow-xl m-auto relative animate-popup'> <div className='bg-white w-full max-w-[95vw] sm:max-w-lg rounded-lg shadow-xl m-auto relative animate-popup'>
<SearchBox /> <SearchBox />
<SearchResultBox /> <SearchResultBox />
</div> </div>