Fix up viewer

This commit is contained in:
Mentor Palokaj 2021-10-21 18:06:23 +02:00
parent 8a48f5fc24
commit d18b8b003c
6 changed files with 13 additions and 10 deletions

View File

@ -61,7 +61,7 @@ a img {
position: absolute; position: absolute;
width: 120%; width: 120%;
min-width: 1920px; min-width: 1920px;
opacity: .5; opacity: .1;
z-index: -1; z-index: -1;
} }

View File

@ -1,6 +1,7 @@
import { Container, Loading } from './components/generic' import { Container, Loading } from './components/generic'
import { log, callApi, exportSvg } from './modules/helpers' import { log, callApi, exportSvg } from './modules/helpers'
import download from 'downloadjs' import download from 'downloadjs'
import DraftRocketeer from './assets/draft-rocketeer.png'
import './App.css' import './App.css'
import { useEffect, useState } from 'react' import { useEffect, useState } from 'react'
@ -22,11 +23,11 @@ function App() {
// Get ID from url // Get ID from url
useEffect( () => { useEffect( () => {
// Expecting /rocketeer/:id const { search } = window.location
const { pathname } = window.location const query = new URLSearchParams( search )
const id = Number( query.get( 'rocketeer' ) || 'none' )
// Remove '/rocketeer/' log( 'Id found: ', id )
const id = Number( pathname.replace( '/rocketeer/', '' ) )
// Check if id is a number // Check if id is a number
if( isNaN( id ) ) return setError( 'No rocketeer selected' ) if( isNaN( id ) ) return setError( 'No rocketeer selected' )
@ -105,15 +106,15 @@ function App() {
if( rocketeer ) return <Container> if( rocketeer ) return <Container>
<img src={ rocketeer.image } /> <img alt={ `Rocketeer ${ rocketeerId }` } src={ rocketeer.image || DraftRocketeer } />
<h1>{ rocketeer.name }</h1> <h1>{ rocketeer.name }</h1>
<p>{ rocketeer.description }</p> <p>{ rocketeer.description || "This is a generic Rocketeer without a description. That should only happen during testing. Contact us on Discord if you see this." }</p>
<div> <div>
<a href={ rocketeer.image } className="button">Download SVG</a> <a href={ rocketeer.image } className="button">Download SVG</a>
<a onClick={ e => downloadJPEG( e, 500 ) } className="button">Download JPEG</a> <a href='/#' onClick={ e => downloadJPEG( e, 500 ) } className="button">Download JPEG</a>
</div> </div>

Binary file not shown.

After

Width:  |  Height:  |  Size: 196 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 16 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 34 KiB

View File

@ -1,4 +1,4 @@
// import ContainerBackground from '../assets/undraw_launch_day_4e04.svg' import ContainerBackground from '../assets/undraw_connected_world_wuay.svg'
export const Container = ( { children } ) => <main> export const Container = ( { children } ) => <main>
@ -8,7 +8,7 @@ export const Container = ( { children } ) => <main>
</div> </div>
{ /* <img className="stretchBackground" src={ ContainerBackground } alt="Launching rocket" /> */ } <img className="stretchBackground" src={ ContainerBackground } alt="Launching rocket" />
</main> </main>