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]);
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) {
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 (
@ -151,7 +151,7 @@ function SearchBox() {
placeholder='Search posts, tags, authors..'
/>
<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>
);
}
@ -179,7 +179,7 @@ function TagListItem({tag}) {
const {name, url} = tag;
return (
<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={() => {
if (url) {
window.location.href = url;
@ -206,7 +206,7 @@ function TagResults({tags}) {
);
});
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>
{TagItems}
</div>
@ -216,7 +216,7 @@ function TagResults({tags}) {
function PostListItem({post}) {
const {title, excerpt, url} = post;
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) {
window.location.href = url;
}
@ -249,7 +249,7 @@ function PostResults({posts}) {
);
});
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>
{PostItems}
<ShowMoreButtom />
@ -261,7 +261,7 @@ function AuthorListItem({author}) {
const {name, profile_image: profileImage, url} = author;
return (
<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={() => {
if (url) {
window.location.href = url;
@ -302,7 +302,7 @@ function AuthorResults({authors}) {
});
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>
{AuthorItems}
</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 />
<SearchResultBox />
</div>