update responsive design
This commit is contained in:
parent
c898ddf51c
commit
4fafe38e8d
8 changed files with 22 additions and 70 deletions
6
package-lock.json
generated
6
package-lock.json
generated
|
|
@ -8,7 +8,6 @@
|
|||
"name": "eexiv-2",
|
||||
"version": "0.1.0",
|
||||
"dependencies": {
|
||||
"file-saver": "^2.0.5",
|
||||
"next": "14.1.0",
|
||||
"react": "^18",
|
||||
"react-dom": "^18",
|
||||
|
|
@ -1993,11 +1992,6 @@
|
|||
"node": "^10.12.0 || >=12.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/file-saver": {
|
||||
"version": "2.0.5",
|
||||
"resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz",
|
||||
"integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
|
||||
},
|
||||
"node_modules/fill-range": {
|
||||
"version": "7.0.1",
|
||||
"resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
|
||||
|
|
|
|||
|
|
@ -9,7 +9,6 @@
|
|||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"file-saver": "^2.0.5",
|
||||
"next": "14.1.0",
|
||||
"react": "^18",
|
||||
"react-dom": "^18",
|
||||
|
|
|
|||
|
|
@ -1,27 +0,0 @@
|
|||
.itemTitle {
|
||||
margin: 0;
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.itemAbstractHeader {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
color: 33;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.typePresentation {
|
||||
background-color: #007bff;
|
||||
}
|
||||
|
||||
.typeOther {
|
||||
background-color: #6c757d;
|
||||
}
|
||||
|
||||
.resultAbstract {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.downloadButton {
|
||||
padding: 10px;
|
||||
}
|
||||
|
|
@ -1,6 +1,4 @@
|
|||
import styles from './documentViewer.module.css'
|
||||
import { Zilla_Slab } from 'next/font/google'
|
||||
import { saveAs } from 'file-saver'
|
||||
import {
|
||||
DocumentType,
|
||||
documents,
|
||||
|
|
@ -9,6 +7,7 @@ import {
|
|||
} from '../../../db/data'
|
||||
import Link from 'next/link'
|
||||
import { notFound } from 'next/navigation'
|
||||
import { Fragment } from 'react'
|
||||
|
||||
const zillaSlab = Zilla_Slab({ subsets: ['latin'], weight: ['500'] })
|
||||
|
||||
|
|
@ -32,19 +31,11 @@ export default function Page({
|
|||
const doc = documents[params.slug]
|
||||
if (!doc) {
|
||||
notFound()
|
||||
return
|
||||
}
|
||||
const { abstract, file } = doc
|
||||
const { title, authors, topics, dates, references, code, type, latest } =
|
||||
doc.manifest
|
||||
|
||||
const handleDownloadLatest = () => {
|
||||
saveAs(
|
||||
`/download/${params.slug}/file${latest}.${file}`,
|
||||
`${params.slug}-rev-${latest}.pdf`
|
||||
)
|
||||
}
|
||||
|
||||
const generateTopics = () => {
|
||||
return (
|
||||
<>
|
||||
|
|
@ -67,12 +58,12 @@ export default function Page({
|
|||
<>
|
||||
<span className='font-bold'>Code: </span>
|
||||
{code.map((c: string, i) => (
|
||||
<>
|
||||
<Fragment key={c}>
|
||||
<Link href={c} target='_blank'>
|
||||
{c}
|
||||
</Link>
|
||||
{i !== code.length - 1 ? ', ' : null}
|
||||
</>
|
||||
</Fragment>
|
||||
))}
|
||||
</>
|
||||
)
|
||||
|
|
@ -122,15 +113,14 @@ export default function Page({
|
|||
return (
|
||||
<div>
|
||||
<div>
|
||||
<h3
|
||||
<h1
|
||||
className={`
|
||||
${styles.itemTitle}
|
||||
text-slate-800
|
||||
text-slate-800 font-bold text-5xl mb-8
|
||||
${zillaSlab.className}
|
||||
`}
|
||||
>
|
||||
{title}
|
||||
</h3>
|
||||
</h1>
|
||||
<p className={`text-slate-800 mt-2`}>{generateAuthors()}</p>
|
||||
<p className='mt-4'>
|
||||
Latest revision published{' '}
|
||||
|
|
|
|||
|
|
@ -9,20 +9,15 @@
|
|||
}
|
||||
|
||||
.banner {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
padding: 20px;
|
||||
background-color: #0c5198;
|
||||
color: white;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.title {
|
||||
position: absolute;
|
||||
top: 162.5px;
|
||||
/* top: 162.5px; */
|
||||
color: white;
|
||||
font-size: 50px;
|
||||
margin-bottom: 50px;
|
||||
/* margin-bottom: 50px; */
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
|
@ -34,7 +29,6 @@
|
|||
|
||||
.contributions {
|
||||
width: 40vw;
|
||||
margin-top: 50px;
|
||||
margin-left: calc(100% - 40vw - 10px);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -29,9 +29,9 @@ export default function RootLayout({
|
|||
<html lang='en'>
|
||||
<body className={inter.className}>
|
||||
<div className={styles.header}>
|
||||
<Container width='1200px'>
|
||||
<img className={styles.wordmark} src='/eecs-wordmark.png' />
|
||||
<p className={styles.contributions}>
|
||||
<div className='max-w-[1200px] flex flex-nowrap mx-auto justify-between items-center'>
|
||||
<img className='h-[100px] mt-4' src='/eecs-wordmark.png' />
|
||||
<p className={`max-w-[600px] hidden md:inline`}>
|
||||
We gratefully acknowledge support from our volunteer peer
|
||||
reviewers, member institutions, and all{' '}
|
||||
<a
|
||||
|
|
@ -42,18 +42,20 @@ export default function RootLayout({
|
|||
</a>
|
||||
.
|
||||
</p>
|
||||
</Container>
|
||||
</div>
|
||||
<div className={styles.banner}>
|
||||
<Container width='1200px'>
|
||||
<h1 className={`${styles.title} ${zillaSlab.className}`}>
|
||||
</div>
|
||||
<div className={`${styles.banner} w-full h-[100px] mb-[50px]`}>
|
||||
<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'>
|
||||
eeXiv<sup>2</sup>
|
||||
</Link>
|
||||
</h1>
|
||||
</Container>
|
||||
<div className='hidden md:inline'>
|
||||
<SearchBar />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Container width='1200px' fill>
|
||||
{children}
|
||||
</Container>
|
||||
|
|
|
|||
|
|
@ -3,14 +3,14 @@ import styles from './searchBar.module.css'
|
|||
|
||||
export default function SearchBar() {
|
||||
return (
|
||||
<div className={styles.search}>
|
||||
<div className='width-[40vw]'>
|
||||
<input
|
||||
type='text'
|
||||
className={`${styles.searchBox} text-slate-800`}
|
||||
className='py-3 px-5 rounded-xl text-slate-800'
|
||||
name='q'
|
||||
placeholder='Search...'
|
||||
/>
|
||||
<button type='submit' className={styles.searchButton}>
|
||||
<button type='submit' className='p-2.5 mx-4 border-2 rounded-xl bg-'>
|
||||
Search
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue