Leahnaya/chaoticbackup.github.io
1
0
Fork 0
mirror of https://github.com/chaoticbackup/chaoticbackup.github.io.git synced 2026-03-21 17:24:14 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

rotated location card in extended

Browse Source
This commit is contained in:
Daniel 2020-07-15 17:44:09 -04:00
parent 4f85d1f007
commit f27d2a3edf
6 changed files with 29 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/collection/collection.scss
View File

@ -346,10 +346,18 @@
display: flex;
}
.extended {
.fullcard {
max-width: 250px;
max-height: 350px;
.fullcard {
width: 250px;
height: 350px;
}
.location .fullcard {
width: 350px;
min-width: 350px;
height: 250px;
img {
transform-origin: 70% 50%;
transform: rotate(90deg);
}
}

10
src/components/collection/types/Attack.js
View File

@ -1,7 +1,7 @@
import React from 'react';
import API from '../../SpreadsheetData';
import {observer, inject} from 'mobx-react';
import {Rarity, Unique, Name, Element, Ability, AttackIcon} from '../../Snippets';
import { observer, inject } from 'mobx-react';
import { Rarity, Unique, Name, Element, Ability, AttackIcon } from '../../Snippets';
@inject((stores, props, context) => props) @observer
export default class Attack extends React.Component {
@ -27,18 +27,18 @@ export default class Attack extends React.Component {
<br />
<div className="right" >
<Ability ability={card.gsx$ability} />
<Unique data={{unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary}} />
<Unique data={{ unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary }} />
<span className="flavortext">{card.gsx$flavortext}</span>
</div>
</div>
)
else return (
<div className="card attack">
<img className="fullcard" src={API.base_image + (card.gsx$image || API.card_back)} />
<div className="fullcard"><img src={API.base_image + (card.gsx$image || API.card_back)} /></div>
<div className="right">
<Name name={card.gsx$name} /><br />
<Ability ability={card.gsx$ability} />
<Unique data={{unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary}} />
<Unique data={{ unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary }} />
{card.gsx$flavortext && <React.Fragment>
<span className="flavortext">{card.gsx$flavortext}</span><br />
</React.Fragment>}

12
src/components/collection/types/Battlegear.js
View File

@ -1,7 +1,7 @@
import React from 'react';
import API from '../../SpreadsheetData';
import {observer, inject} from 'mobx-react';
import {Rarity, Unique, Name, Ability, BattlegearIcon} from '../../Snippets';
import { observer, inject } from 'mobx-react';
import { Rarity, Unique, Name, Ability, BattlegearIcon } from '../../Snippets';
@inject((stores, props, context) => props) @observer
export default class Battlegear extends React.Component {
@ -11,7 +11,7 @@ export default class Battlegear extends React.Component {
if (this.props.ext == false) return (
<div className="card battlegear">
<img className="thumb" style={{float: 'left'}} src={API.base_image + (card.gsx$thumb||API.thumb_missing)} onClick={() => this.props.setImage(card.gsx$image)} />
<img className="thumb" style={{ float: 'left' }} src={API.base_image + (card.gsx$thumb||API.thumb_missing)} onClick={() => this.props.setImage(card.gsx$image)} />
<div className="left">
<Name name={card.gsx$name} /><br />
<Rarity set={card.gsx$set} rarity={card.gsx$rarity} /><br />
@ -19,18 +19,18 @@ export default class Battlegear extends React.Component {
</div>
<div className="right" >
<Ability ability={card.gsx$ability} />
<Unique data={{unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary}} />
<Unique data={{ unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary }} />
<span className="flavortext">{card.gsx$flavortext}</span>
</div>
</div>
);
else return (
<div className="card battlegear">
<img className="fullcard" src={API.base_image + (card.gsx$image || API.card_back)} />
<div className="fullcard"><img src={API.base_image + (card.gsx$image || API.card_back)} /></div>
<div className="right" >
<Name name={card.gsx$name} /><br />
<Ability ability={card.gsx$ability} />
<Unique data={{unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary}} />
<Unique data={{ unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary }} />
{card.gsx$flavortext && <React.Fragment>
<span className="flavortext">{card.gsx$flavortext}</span><br />
</React.Fragment>}

2
src/components/collection/types/Creature.js
View File

@ -81,7 +81,7 @@ export default class Creature extends React.Component {
)
else return (
<div className="card creature">
<img className="fullcard" src={API.base_image + (card.gsx$image || API.card_back)} />
<div className="fullcard"><img src={API.base_image + (card.gsx$image || API.card_back)} /></div>
<div className="right" >
<Name name={card.gsx$name} /><br />
<span>{card.gsx$courage}&nbsp;<Discipline discipline="courage" /></span>&nbsp;

8
src/components/collection/types/Location.js
View File

@ -12,7 +12,7 @@ export default class Location extends React.Component {
if (this.props.ext == false) return (
<div className="card location">
<img className="thumb" style={{float: 'left', width: '100px', height: '98px'}} src={API.base_image + (card.gsx$thumb||API.thumb_missing)} onClick={() => this.props.setImage(card.gsx$image)} />
<img className="thumb" style={{ float: 'left', width: '100px', height: '98px' }} src={API.base_image + (card.gsx$thumb||API.thumb_missing)} onClick={() => this.props.setImage(card.gsx$image)} />
<div className="left">
<Name name={card.gsx$name} /><br />
<Rarity set={card.gsx$set} rarity={card.gsx$rarity} /><br />
@ -21,19 +21,19 @@ export default class Location extends React.Component {
</div>
<div className="right">
<Ability ability={card.gsx$ability} />
<Unique data={{unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary}} />
<Unique data={{ unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary }} />
<span className="flavortext">{card.gsx$flavortext}</span>
</div>
</div>
)
else return (
<div className="card location">
<img className="fullcard" src={API.base_image + (card.gsx$image || API.card_back)} />
<div className="fullcard"><img src={API.base_image + (card.gsx$image || API.card_back)} /></div>
<div className="right">
<Name name={card.gsx$name} /><br />
<Initiative initiative={card.gsx$initiative} />
<Ability ability={card.gsx$ability} />
<Unique data={{unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary}} />
<Unique data={{ unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary }} />
{card.gsx$flavortext && <React.Fragment>
<span className="flavortext">{card.gsx$flavortext}</span><br />
</React.Fragment>}

2
src/components/collection/types/Mugic.js
View File

@ -48,7 +48,7 @@ class Attack extends React.Component {
)
else return (
<div className="card mugic">
<img className="fullcard" src={API.base_image + (card.gsx$image || API.card_back)} />
<div className="fullcard"><img src={API.base_image + (card.gsx$image || API.card_back)} /></div>
<div className="right" >
<Name name={card.gsx$name} /><br />
<Ability ability={card.gsx$ability} tribe={card.gsx$tribe} />