add contact to menu on mobile

This commit is contained in:
Jeff Colombo 2019-04-18 21:43:05 -04:00
parent 8c2a4099d5
commit b367ea66c6
5 changed files with 17 additions and 11 deletions

4
dist/app.css vendored
View File

@ -1,6 +1,6 @@
/* Generated by cssConcatenator.js */
/** 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:325px;justify-content:space-between}.Navigation__navigation__32sTf.Navigation__menu__2XeMt button>*{display:block;margin:auto}.Navigation__navigationButton__2DGTd{padding:0;margin-bottom:1em;outline:none;border:none;background-color:transparent}
.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}
@ -28,7 +28,7 @@
.MovesExplorer__wrapper__2y-BK h3{font-size:1rem}.MovesExplorer__wrapper__2y-BK h4{font-size:0.8em;color:#676767}
.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:325px;justify-content:space-between}.Navigation__navigation__32sTf.Navigation__menu__2XeMt button>*{display:block;margin:auto}.Navigation__navigationButton__2DGTd{padding:0;margin-bottom:1em;outline:none;border:none;background-color:transparent}
.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}
.PokemonDisplay__highlight__h50BA{color:#fff;pointer-events:none}.PokemonDisplay__pokemonInfoWrapper__3AW3e{margin-bottom:1rem}.PokemonDisplay__pokemonInfoLeftColumn__1vugM{}.PokemonDisplay__pokemonInfoRightColumn__27Q49{}.PokemonDisplay__pokemonName__WBKbk{margin-bottom:0}.PokemonDisplay__dexHeader__2HVfr{margin-bottom:0.25rem}.PokemonDisplay__pokemonTypeWrapper__1rJIA{display:flex;justify-content:center;align-self:stretch}.PokemonDisplay__formHeader__1pr6M{text-transform:uppercase;margin-bottom:0}.PokemonDisplay__pokemonBaseStats__3UJvn{display:flex;flex-flow:column nowrap;align-items:start;align-self:stretch}

2
dist/main-bundle.js vendored

File diff suppressed because one or more lines are too long

View File

@ -41,12 +41,6 @@ export class Footer extends React.Component<IFooterProps> {
<a href="https://twitter.com/pvpokemongo"><i className="nes-icon twitter" /></a>
</React.Fragment>
</Media>
<Media query={ { maxWidth: MAX_MOBILE_WIDTH } }>
<React.Fragment>
<a href="mailto:feedback@pvpokemon.com"><i className="nes-icon is-small gmail" /></a>
<a href="https://twitter.com/pvpokemongo"><i className="nes-icon is-small twitter" /></a>
</React.Fragment>
</Media>
</span>
</footer>
);

View File

@ -9,7 +9,7 @@ import {
} from 'app/components/PokemonExplorer/types';
import { Navigation as NavigationType } from 'app/types';
import { MAX_MOBILE_WIDTH, MIN_TABLET_WIDTH } from 'common/models/constants';
import { MAX_MOBILE_WIDTH } from 'common/models/constants';
import * as styles from 'app/components/PokemonExplorer/styles/Navigation.scss';
@ -119,6 +119,12 @@ export class Navigation extends React.Component<INavigationProps> {
<span>PVP</span>
</Media>
</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>
</React.Fragment>
</Media>
</div>
);
}

View File

@ -14,13 +14,19 @@
right: $navigation-width;
z-index: 1;
width: 100px;
height: 325px;
height: 400px;
justify-content: space-between;
button > * {
display: block;
margin: auto;
}
a > i {
margin-left: auto;
margin-right: auto;
transform-origin: top;
}
}
}