add shadows everywhere because *material design*
This commit is contained in:
parent
3f64142e4d
commit
0f1fc5d2c3
8 changed files with 18 additions and 13 deletions
|
@ -36,10 +36,10 @@ export default function Page({
|
|||
return (
|
||||
<div>
|
||||
<div className='grid grid-cols-1 max-w-3xl mx-auto'>
|
||||
<div className='mx-auto mb-4 w-[90vw] md:w-auto md:h-[40vw] lg:h-[20vw]'>
|
||||
<div className='mx-auto mb-4 max-w-3xl md:w-auto md:h-[40vw] lg:h-[20vw]'>
|
||||
<img
|
||||
alt='profile picture'
|
||||
className='rounded-sm mx-auto object-cover w-full h-full'
|
||||
className='rounded-sm mx-auto object-cover w-full h-full shadow-md shadow-slate-400'
|
||||
src={image}
|
||||
/>
|
||||
</div>
|
||||
|
|
|
@ -41,7 +41,7 @@ export default function AuthorDisplay({
|
|||
<img
|
||||
src={affiliations[a.split('@')[1]].image}
|
||||
alt={affiliations[a.split('@')[1]].name}
|
||||
className='h-12 mr-2'
|
||||
className='h-12 mr-3 shadow-md shadow-slate-300'
|
||||
/>
|
||||
</Link>
|
||||
))}
|
||||
|
@ -110,7 +110,7 @@ export default function AuthorDisplay({
|
|||
<div className='flex items-center'>
|
||||
<img
|
||||
src={flag}
|
||||
className='w-10 border-2 border-slate-200'
|
||||
className='w-10 shadow-md shadow-slate-300'
|
||||
alt={`${demonym} flag`}
|
||||
/>
|
||||
<span className='mx-3 font-semibold'>{demonym}</span>
|
||||
|
|
|
@ -38,7 +38,9 @@ export default function MobileMenu() {
|
|||
>
|
||||
<RxHamburgerMenu size={40} />
|
||||
</button>
|
||||
<div className={`${isOpen ? '' : styles['menu-hidden']} ${styles.menu}`}>
|
||||
<div
|
||||
className={`${isOpen ? '' : styles['menu-hidden']} ${styles.menu} shadow-md shadow-slate-300`}
|
||||
>
|
||||
<span className={styles['search-bar']}>
|
||||
<SearchBar onSubmit={handleSubmit} />
|
||||
</span>
|
||||
|
|
|
@ -2,10 +2,10 @@ import Link from 'next/link'
|
|||
|
||||
export default function News() {
|
||||
return (
|
||||
<div className='bg-slate-800 rounded-lg p-6 w-full basis-full md:basis-2/5 my-4 lg:my-0 max-h-[250px] overflow-y-auto'>
|
||||
<span className='text-3xl md:text-4xl text-slate-200'>eeXiv News</span>
|
||||
<div className='bg-slate-800 rounded-lg p-6 w-full basis-full md:basis-2/5 my-4 lg:my-0 max-h-[250px] overflow-y-auto shadow-md shadow-slate-500'>
|
||||
<span className='text-3xl text-slate-200'>eeXiv News</span>
|
||||
<br className='my-2' />
|
||||
<span className='text-xl text-slate-400'>
|
||||
<span className='text-lg text-slate-400'>
|
||||
Stay up to date with what is happening at eeXiv.
|
||||
</span>
|
||||
<br className='my-2' />
|
||||
|
|
|
@ -52,7 +52,7 @@ export default function DocumentViewer({ slug }: Readonly<{ slug: string }>) {
|
|||
</p>
|
||||
<ItemBadge itemName={type as DocumentType} />
|
||||
<Status statusName={status} />
|
||||
<span className='inline-block border-gray-200 border-2 rounded px-2 py-1.5 mr-2'>
|
||||
<span className='inline-block border-gray-200 border-2 rounded px-2 py-1.5 mr-2 shadow-sm shadow-slate-300'>
|
||||
Revision {latest}
|
||||
</span>
|
||||
<hr className='my-4' />
|
||||
|
|
|
@ -21,11 +21,11 @@ a:hover {
|
|||
}
|
||||
|
||||
.button-default {
|
||||
@apply bg-blue-600 text-slate-100 hover:bg-blue-400 font-semibold rounded py-2 px-4 my-2;
|
||||
@apply bg-blue-600 text-slate-100 hover:bg-blue-400 font-semibold rounded py-2 px-4 my-2 shadow-sm shadow-slate-500;
|
||||
}
|
||||
|
||||
.badge-base {
|
||||
@apply px-3 py-1.5 rounded inline-block w-fit mr-2 my-1 text-slate-50 border-2;
|
||||
@apply px-3 py-1.5 rounded inline-block w-fit mr-2 my-1 text-slate-50 border-2 shadow-sm shadow-slate-500;
|
||||
}
|
||||
|
||||
.badge-draft {
|
||||
|
|
|
@ -56,7 +56,9 @@ export default function RootLayout({
|
|||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className={`${styles.banner} w-full h-[100px] mb-[50px]`}>
|
||||
<div
|
||||
className={`${styles.banner} w-full h-[100px] mb-[50px] shadow-md shadow-slate-400`}
|
||||
>
|
||||
<div className='max-w-[1200px] flex justify-between mx-auto items-center pt-3 flex-nowrap'>
|
||||
<h1 className={`${styles.title} ${zillaSlab.className} mx-10`}>
|
||||
<Link href='/' className='no-link-style'>
|
||||
|
|
|
@ -41,8 +41,9 @@ const SearchResult = ({
|
|||
|
||||
return (
|
||||
<div
|
||||
className='border-4 rounded-lg border-gray-300 hover:border-blue-500 p-5 my-4 w-full cursor-pointer'
|
||||
className='border-4 rounded-lg border-gray-300 hover:border-blue-500 p-5 my-4 w-full cursor-pointer shadow-slate-300 shadow-md'
|
||||
onClick={handleClick}
|
||||
role='button' // this is a critical DEI concern as we have marked this element as a button with ARIA role, yet we have not supported button accessiblity features
|
||||
>
|
||||
<h2 className={`${zillaSlab.className} text-3xl`}>{title}</h2>
|
||||
<p className='text-slate-500 py-2 text-md mt-2'>
|
||||
|
|
Loading…
Reference in a new issue