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

Updated mobile design

This commit is contained in:
Djordje Vlaisavljevic 2022-07-06 15:25:13 +02:00
parent 1b2f6524cd
commit fa4adcd365

View file

@ -197,7 +197,7 @@ function TagListItem({tag}) {
const {name, url} = tag; const {name, url} = tag;
return ( return (
<div <div
className='flex items-center py-3 -mx-7 px-7 hover:bg-gray-100 cursor-pointer' className='flex items-center py-3 -mx-4 md:-mx-7 px-4 md:px-7 hover:bg-gray-100 cursor-pointer'
onClick={() => { onClick={() => {
if (url) { if (url) {
window.location.href = url; window.location.href = url;
@ -224,7 +224,7 @@ function TagResults({tags}) {
); );
}); });
return ( return (
<div className='border-t border-gray-200 py-3 px-7'> <div className='border-t border-gray-200 py-3 px-4 md: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>
@ -234,7 +234,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-7 px-7 hover:bg-neutral-100 cursor-pointer' onClick={() => { <div className='py-3 -mx-4 md:-mx-7 px-4 md:px-7 hover:bg-neutral-100 cursor-pointer' onClick={() => {
if (url) { if (url) {
window.location.href = url; window.location.href = url;
} }
@ -267,7 +267,7 @@ function PostResults({posts}) {
); );
}); });
return ( return (
<div className='border-t border-neutral-200 py-3 px-7'> <div className='border-t border-neutral-200 py-3 px-4 md: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 />
@ -320,7 +320,7 @@ function AuthorResults({authors}) {
}); });
return ( return (
<div className='border-t border-neutral-200 py-3 px-7'> <div className='border-t border-neutral-200 py-3 px-4 md: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>
@ -399,7 +399,7 @@ function Search() {
} }
}} }}
> >
<div className='bg-white max-w-lg rounded-t-2xl md:rounded-lg shadow-2xl drop-shadow-md m-auto absolute md:relative top-20 md:top-0 bottom-0 left-0 right-0 animate-popup'> <div className='bg-white w-full max-w-[95vw] max-w-lg rounded-lg shadow-xl m-auto relative animate-popup'>
<SearchBox /> <SearchBox />
<SearchResultBox /> <SearchResultBox />
</div> </div>