ios tweaks

This commit is contained in:
Jeff Colombo 2019-04-19 12:39:44 -04:00
parent 30f6c056c4
commit f0245fc11c
8 changed files with 57 additions and 30 deletions

4
dist/app.css vendored
View File

@ -2,7 +2,7 @@
/** Source: ./dist/main.tmp.css */
.Navigation__navigation__32sTf{margin-right:-72px;padding:1em;position:sticky;top:90px;display:inline-flex;flex-flow:column nowrap;align-self:flex-start}.Navigation__navigation__32sTf.Navigation__menu__2XeMt{position:fixed;right:72px;z-index:1;width:100px;height:400px;justify-content:space-between}.Navigation__navigation__32sTf.Navigation__menu__2XeMt button>*{display:block;margin:auto}.Navigation__navigation__32sTf.Navigation__menu__2XeMt a>i{margin-left:auto;margin-right:auto;transform-origin:top}.Navigation__navigationButton__2DGTd{padding:0;margin-bottom:1em;outline:none;border:none;background-color:transparent}
.PokemonApp__displayWrapper__2PiN5{margin:0 auto}.PokemonApp__displayWrapper__2PiN5>*{width:450px;margin:0 1em}@media only screen and (max-width: 767px){.PokemonApp__displayWrapper__2PiN5>*{width:auto;margin:0 0.1em}}.PokemonApp__wrapper__3ZEoC{display:flex;flex-flow:column nowrap;align-items:stretch;height:100vh}.PokemonApp__wrapper__3ZEoC .PokemonApp__body__23cv_{background-color:#fff;display:flex;flex-flow:row nowrap;align-items:stretch;position:relative;padding-bottom:75px}.PokemonApp__wrapper__3ZEoC.PokemonApp__overlaid__3B_Ol{background-color:rgba(0,0,0,0.7)}.PokemonApp__wrapper__3ZEoC.PokemonApp__overlaid__3B_Ol .PokemonApp__highlight__1zywH{z-index:1}.PokemonApp__header__2s_s2{display:flex;flex:0 0 auto;justify-content:space-between;align-items:center;padding:0.5rem 1rem;position:sticky;top:0}.PokemonApp__header__2s_s2 a{display:inline-block;display:flex}ul{display:grid;justify-items:center}.PokemonApp__footer__3q19Q{height:60px;position:fixed;right:0;bottom:0;left:0;display:grid;grid-template-columns:1fr auto 1fr;grid-column-gap:1em;justify-content:center;padding-top:0;padding-bottom:0}.PokemonApp__footer__3q19Q .PokemonApp__adWrapper__3GNZY{width:320px;height:50px;grid-column-start:2;display:flex;justify-content:space-evenly;align-items:center}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6{margin:auto 0 auto auto}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6>*{display:inline;margin:1em}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6 .PokemonApp__feedback__2Nh7J{vertical-align:super}.PokemonApp__header__2s_s2,.PokemonApp__footer__3q19Q{margin:0.1em;z-index:10}.PokemonApp__navigationButton__2BuiE{}.PokemonApp__navigationButton__2BuiE.PokemonApp__hamburgerIcon__1ujIT{font-size:2rem;margin-top:-6px}.PokemonApp__overlay__2vc-r{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#000;opacity:.7}.PokemonApp__overlay__2vc-r.PokemonApp__complete__h3L_s{z-index:1}.PokemonApp__navigationWrapper__3oyCI{display:flex;margin:0 auto}.PokemonApp__container__MsUHy{display:flex;justify-content:space-evenly}.PokemonApp__container__MsUHy .PokemonApp__leftColumn__3Lv_L,.PokemonApp__container__MsUHy .PokemonApp__rightColumn__1xE25{display:flex;flex-flow:column nowrap;align-items:center}.PokemonApp__container__MsUHy .PokemonApp__leftColumn__3Lv_L{width:45%;text-align:center}.PokemonApp__container__MsUHy .PokemonApp__rightColumn__1xE25{flex-grow:0;align-items:start}
.PokemonApp__displayWrapper__2PiN5{margin:0 auto}.PokemonApp__displayWrapper__2PiN5>*{width:450px;margin:0 1em}@media only screen and (max-width: 767px){.PokemonApp__displayWrapper__2PiN5>*{width:auto;margin:0 0.1em}}.PokemonApp__wrapper__3ZEoC{display:flex;flex-flow:column nowrap;align-items:stretch;height:100vh}.PokemonApp__wrapper__3ZEoC .PokemonApp__body__23cv_{background-color:#fff;display:flex;flex-flow:row nowrap;align-items:stretch;position:relative;padding-bottom:75px}.PokemonApp__wrapper__3ZEoC.PokemonApp__overlaid__3B_Ol .PokemonApp__highlight__1zywH{z-index:1}.PokemonApp__header__2s_s2,.PokemonApp__footer__3q19Q{margin:0.1em;z-index:10}.PokemonApp__header__2s_s2{display:flex;flex:0 0 auto;justify-content:space-between;align-items:center;padding:0.5rem 1rem;position:sticky;top:0}@supports not (-webkit-overflow-scrolling: touch){.PokemonApp__overlaid__3B_Ol .PokemonApp__header__2s_s2{background-color:rgba(0,0,0,0.7)}}.PokemonApp__header__2s_s2 a{display:inline-block;display:flex}ul{display:grid;justify-items:center}.PokemonApp__footer__3q19Q{height:60px;position:fixed;right:0;bottom:0;left:0;display:grid;grid-template-columns:1fr auto 1fr;grid-column-gap:1em;justify-content:center;padding-top:0;padding-bottom:0}.PokemonApp__footer__3q19Q .PokemonApp__adWrapper__3GNZY{width:320px;height:50px;grid-column-start:2;display:flex;justify-content:space-evenly;align-items:center}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6{margin:auto 0 auto auto}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6>*{display:inline;margin:1em}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6 .PokemonApp__feedback__2Nh7J{vertical-align:super}.PokemonApp__navigationButton__2BuiE{}.PokemonApp__navigationButton__2BuiE.PokemonApp__hamburgerIcon__1ujIT{font-size:2rem;margin-top:-6px}.PokemonApp__overlay__2vc-r{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000;opacity:.7}.PokemonApp__overlay__2vc-r.PokemonApp__complete__h3L_s{z-index:1}.PokemonApp__navigationWrapper__3oyCI{display:flex;margin:0 auto}.PokemonApp__container__MsUHy{display:flex;justify-content:space-evenly}.PokemonApp__container__MsUHy .PokemonApp__leftColumn__3Lv_L,.PokemonApp__container__MsUHy .PokemonApp__rightColumn__1xE25{display:flex;flex-flow:column nowrap;align-items:center}.PokemonApp__container__MsUHy .PokemonApp__leftColumn__3Lv_L{width:45%;text-align:center}.PokemonApp__container__MsUHy .PokemonApp__rightColumn__1xE25{flex-grow:0;align-items:start}
.Loading__wrapper__3kid5{text-align:center}.Loading__wrapper__3kid5 .icon{animation:Loading__bounce__2g2QY 0.6s both linear infinite}@media only screen and (max-width: 767px){.Loading__wrapper__3kid5 .icon{margin:0 auto}}@keyframes Loading__bounce__2g2QY{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}.Loading__wrapper__3kid5 .icon:nth-child(2){animation-delay:0.2s}.Loading__wrapper__3kid5 .icon:nth-child(3){animation-delay:0.4s}
@ -16,7 +16,7 @@
.StatDisplay__baseStatRow__1B60A{display:flex;align-items:center}.StatDisplay__baseStatRow__1B60A>*{flex-shrink:0}.StatDisplay__baseStatRow__1B60A>progress{flex-shrink:1;margin:0 0 0 1em;width:5em;height:1em;border-image-outset:1;padding:2px}@media only screen and (max-width: 767px){.StatDisplay__baseStatRow__1B60A>progress{height:1.2em}}@media only screen and (max-width: 359px){.StatDisplay__baseStatRow__1B60A>progress{height:1.3em}}
.PokemonApp__displayWrapper__2PiN5{margin:0 auto}.PokemonApp__displayWrapper__2PiN5>*{width:450px;margin:0 1em}@media only screen and (max-width: 767px){.PokemonApp__displayWrapper__2PiN5>*{width:auto;margin:0 0.1em}}.PokemonApp__wrapper__3ZEoC{display:flex;flex-flow:column nowrap;align-items:stretch;height:100vh}.PokemonApp__wrapper__3ZEoC .PokemonApp__body__23cv_{background-color:#fff;display:flex;flex-flow:row nowrap;align-items:stretch;position:relative;padding-bottom:75px}.PokemonApp__wrapper__3ZEoC.PokemonApp__overlaid__3B_Ol{background-color:rgba(0,0,0,0.7)}.PokemonApp__wrapper__3ZEoC.PokemonApp__overlaid__3B_Ol .PokemonApp__highlight__1zywH{z-index:1}.PokemonApp__header__2s_s2{display:flex;flex:0 0 auto;justify-content:space-between;align-items:center;padding:0.5rem 1rem;position:sticky;top:0}.PokemonApp__header__2s_s2 a{display:inline-block;display:flex}ul{display:grid;justify-items:center}.PokemonApp__footer__3q19Q{height:60px;position:fixed;right:0;bottom:0;left:0;display:grid;grid-template-columns:1fr auto 1fr;grid-column-gap:1em;justify-content:center;padding-top:0;padding-bottom:0}.PokemonApp__footer__3q19Q .PokemonApp__adWrapper__3GNZY{width:320px;height:50px;grid-column-start:2;display:flex;justify-content:space-evenly;align-items:center}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6{margin:auto 0 auto auto}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6>*{display:inline;margin:1em}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6 .PokemonApp__feedback__2Nh7J{vertical-align:super}.PokemonApp__header__2s_s2,.PokemonApp__footer__3q19Q{margin:0.1em;z-index:10}.PokemonApp__navigationButton__2BuiE{}.PokemonApp__navigationButton__2BuiE.PokemonApp__hamburgerIcon__1ujIT{font-size:2rem;margin-top:-6px}.PokemonApp__overlay__2vc-r{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#000;opacity:.7}.PokemonApp__overlay__2vc-r.PokemonApp__complete__h3L_s{z-index:1}.PokemonApp__navigationWrapper__3oyCI{display:flex;margin:0 auto}.PokemonApp__container__MsUHy{display:flex;justify-content:space-evenly}.PokemonApp__container__MsUHy .PokemonApp__leftColumn__3Lv_L,.PokemonApp__container__MsUHy .PokemonApp__rightColumn__1xE25{display:flex;flex-flow:column nowrap;align-items:center}.PokemonApp__container__MsUHy .PokemonApp__leftColumn__3Lv_L{width:45%;text-align:center}.PokemonApp__container__MsUHy .PokemonApp__rightColumn__1xE25{flex-grow:0;align-items:start}
.PokemonApp__displayWrapper__2PiN5{margin:0 auto}.PokemonApp__displayWrapper__2PiN5>*{width:450px;margin:0 1em}@media only screen and (max-width: 767px){.PokemonApp__displayWrapper__2PiN5>*{width:auto;margin:0 0.1em}}.PokemonApp__wrapper__3ZEoC{display:flex;flex-flow:column nowrap;align-items:stretch;height:100vh}.PokemonApp__wrapper__3ZEoC .PokemonApp__body__23cv_{background-color:#fff;display:flex;flex-flow:row nowrap;align-items:stretch;position:relative;padding-bottom:75px}.PokemonApp__wrapper__3ZEoC.PokemonApp__overlaid__3B_Ol .PokemonApp__highlight__1zywH{z-index:1}.PokemonApp__header__2s_s2,.PokemonApp__footer__3q19Q{margin:0.1em;z-index:10}.PokemonApp__header__2s_s2{display:flex;flex:0 0 auto;justify-content:space-between;align-items:center;padding:0.5rem 1rem;position:sticky;top:0}@supports not (-webkit-overflow-scrolling: touch){.PokemonApp__overlaid__3B_Ol .PokemonApp__header__2s_s2{background-color:rgba(0,0,0,0.7)}}.PokemonApp__header__2s_s2 a{display:inline-block;display:flex}ul{display:grid;justify-items:center}.PokemonApp__footer__3q19Q{height:60px;position:fixed;right:0;bottom:0;left:0;display:grid;grid-template-columns:1fr auto 1fr;grid-column-gap:1em;justify-content:center;padding-top:0;padding-bottom:0}.PokemonApp__footer__3q19Q .PokemonApp__adWrapper__3GNZY{width:320px;height:50px;grid-column-start:2;display:flex;justify-content:space-evenly;align-items:center}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6{margin:auto 0 auto auto}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6>*{display:inline;margin:1em}.PokemonApp__footer__3q19Q .PokemonApp__contactWrapper__2kgo6 .PokemonApp__feedback__2Nh7J{vertical-align:super}.PokemonApp__navigationButton__2BuiE{}.PokemonApp__navigationButton__2BuiE.PokemonApp__hamburgerIcon__1ujIT{font-size:2rem;margin-top:-6px}.PokemonApp__overlay__2vc-r{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000;opacity:.7}.PokemonApp__overlay__2vc-r.PokemonApp__complete__h3L_s{z-index:1}.PokemonApp__navigationWrapper__3oyCI{display:flex;margin:0 auto}.PokemonApp__container__MsUHy{display:flex;justify-content:space-evenly}.PokemonApp__container__MsUHy .PokemonApp__leftColumn__3Lv_L,.PokemonApp__container__MsUHy .PokemonApp__rightColumn__1xE25{display:flex;flex-flow:column nowrap;align-items:center}.PokemonApp__container__MsUHy .PokemonApp__leftColumn__3Lv_L{width:45%;text-align:center}.PokemonApp__container__MsUHy .PokemonApp__rightColumn__1xE25{flex-grow:0;align-items:start}
.LeagueIvExplorer__wrapper__3E7AD{display:flex;flex-flow:column nowrap}.LeagueIvExplorer__container__3GKct{margin-bottom:1rem}.LeagueIvExplorer__leftColumn__3au0L{}.LeagueIvExplorer__rightColumn__1eyvh{}.LeagueIvExplorer__leaguePokemonRank__3bjyU{justify-content:flex-start;flex-wrap:wrap}.LeagueIvExplorer__leaguePokemonRank__3bjyU .LeagueIvExplorer__pokemonInfoWrapper__3WVsh{flex:1 0 100%;display:flex}.LeagueIvExplorer__leaguePokemonRank__3bjyU .LeagueIvExplorer__leftColumn__3au0L{align-items:flex-start}.LeagueIvExplorer__leaguePokemonRank__3bjyU .LeagueIvExplorer__pokemonRankValue__3k3ih{display:inline}.LeagueIvExplorer__ivsContainer__31sfb{max-height:350px;font-size:0.95em;flex:0 999 auto;display:flex;flex-flow:column nowrap}.LeagueIvExplorer__ivsContainer__31sfb .title.LeagueIvExplorer__ivContainerTitle__3Z3eX{display:flex;justify-content:flex-end;background-color:transparent;padding:0}.LeagueIvExplorer__ivsContainer__31sfb .title.LeagueIvExplorer__ivContainerTitle__3Z3eX>*{background-color:#fff}.LeagueIvExplorer__ivsContainer__31sfb .title.LeagueIvExplorer__ivContainerTitle__3Z3eX>*:first-child{margin-right:auto;padding:0 0.5em}.LeagueIvExplorer__ivsContainer__31sfb .title.LeagueIvExplorer__ivContainerTitle__3Z3eX>*:last-child{padding-right:0.5em}.LeagueIvExplorer__ivsContainer__31sfb.LeagueIvExplorer__diplayingIvList__1Q5r8{padding:1.5rem 0 0}.LeagueIvExplorer__ivsContainer__31sfb.LeagueIvExplorer__diplayingIvList__1Q5r8 .title.LeagueIvExplorer__ivContainerTitle__3Z3eX{margin-bottom:0;margin-right:-9px;margin-left:-9px;padding:0 1.5em}

File diff suppressed because one or more lines are too long

2
dist/global.css vendored

File diff suppressed because one or more lines are too long

14
dist/main-bundle.js vendored

File diff suppressed because one or more lines are too long

View File

@ -208,8 +208,8 @@ a.list-item {
}
}
.nes-list li {
margin: 1em 0;
}
// .nes-list li {
// margin: 1em 0;
// }
/** end nes.css overrides */

View File

@ -121,8 +121,8 @@ export class Navigation extends React.Component<INavigationProps> {
</button>
<Media query={ { maxWidth: MAX_MOBILE_WIDTH } }>
<React.Fragment>
<a className={ buttonCss } href="mailto:feedback@pvpokemon.com"><i className="nes-icon gmail" /></a>
<a className={ buttonCss } href="https://twitter.com/pvpokemongo"><i className="nes-icon twitter" /></a>
<span>Tweet</span>
</React.Fragment>
</Media>
</div>

View File

@ -1,5 +1,6 @@
import React from 'react';
import { clearAllBodyScrollLocks, disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';
import classNames from 'classnames';
import * as styles from 'app/styles/WelcomeDialog.scss';
@ -8,7 +9,30 @@ export interface IWelcomeDialogProps {
handleClose : () => void;
}
export class WelcomeDialog extends React.Component<IWelcomeDialogProps> {
interface IState {
ref : React.RefObject<HTMLDivElement>;
}
export class WelcomeDialog extends React.Component<IWelcomeDialogProps, IState> {
constructor(props : IWelcomeDialogProps) {
super(props);
this.state = {
ref: React.createRef(),
};
}
public componentDidMount() {
if (this.state.ref.current) {
disableBodyScroll(this.state.ref.current);
}
}
public componentWillUnmount() {
if (this.state.ref.current) {
enableBodyScroll(this.state.ref.current);
}
}
public render() {
const { handleClose } = this.props;
@ -27,7 +51,7 @@ export class WelcomeDialog extends React.Component<IWelcomeDialogProps> {
);
return (
<div className={ wrapperCss }>
<div ref={ this.state.ref }className={ wrapperCss }>
<h3 className={ styles.title }>Welcome to PVPokémon Go</h3>
<ul className="nes-list is-disc">
<li>Evaluate your Pokémon for PVP viability!</li>

View File

@ -32,13 +32,15 @@ $footer-height: 60px;
padding-bottom: $footer-height * 1.25;
}
&.overlaid {
background-color: rgba($main-overlay-color, $overlay-opacity);
.highlight {
&.overlaid .highlight {
z-index: 1;
}
}
.header,
.footer {
margin: 0.1em;
z-index: 10;
}
.header {
@ -50,6 +52,13 @@ $footer-height: 60px;
position: sticky;
top: 0;
.overlaid & {
// non-iOS only
@supports not (-webkit-overflow-scrolling: touch) {
background-color: rgba($main-overlay-color, $overlay-opacity);
}
}
a {
display: inline-block;
display: flex;
@ -97,12 +106,6 @@ ul {
}
}
.header,
.footer {
margin: 0.1em;
z-index: 10;
}
.navigationButton {
composes: navigationButton from '../components/PokemonExplorer/styles/Navigation.scss';
@ -113,7 +116,7 @@ ul {
}
.overlay {
position: absolute;
position: fixed;
top: 0;
right: 0;
bottom: 0;