Align website and other updates
This commit is contained in:
Letícia Camara
parent
4bebb23794
commit
8fc4294cf6
18 changed files with 175 additions and 45 deletions
|
|
@ -6,6 +6,7 @@
|
|||
"@feathersjs/client": "^3.7.2",
|
||||
"@material-ui/core": "^3.1.0",
|
||||
"@material-ui/icons": "^3.0.1",
|
||||
"bootstrap": "^4.1.3",
|
||||
"country-list": "^1.1.0",
|
||||
"mdbreact": "^4.7.1",
|
||||
"react": "^16.5.2",
|
||||
|
|
|
|||
|
|
@ -3942,7 +3942,7 @@ a:not([href]):not([tabindex]), a:not([href]):not([tabindex]):focus, a:not([href]
|
|||
padding-bottom: 1.5rem !important; }
|
||||
|
||||
.p-5 {
|
||||
padding: 3rem !important; }
|
||||
padding: 3rem; }
|
||||
|
||||
.pt-5 {
|
||||
padding-top: 3rem !important; }
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@ p {
|
|||
color: rgba(255, 255, 255, 0.7); }
|
||||
|
||||
section {
|
||||
padding: 8rem 0; }
|
||||
padding: 50px 0; }
|
||||
|
||||
.section-heading {
|
||||
margin-top: 0; }
|
||||
|
|
@ -163,7 +163,9 @@ img::-moz-selection {
|
|||
padding-top: 0px;
|
||||
padding-bottom: 0px; }
|
||||
#mainNav .navbar-brand .logo1 {
|
||||
display: none !important; }
|
||||
/*display: none !important;*/
|
||||
width: 223px;
|
||||
}
|
||||
#mainNav .navbar-brand .logo2 {
|
||||
display: inline !important; } }
|
||||
@media (min-width: 992px) {
|
||||
|
|
@ -293,8 +295,8 @@ header.masthead {
|
|||
|
||||
.copyright {
|
||||
background-color: #212529;
|
||||
padding-left: 6rem;
|
||||
padding-right: 6rem;
|
||||
/*padding-left: 6rem;
|
||||
padding-right: 6rem;*/
|
||||
}
|
||||
|
||||
ul.social-buttons {
|
||||
|
|
@ -350,3 +352,16 @@ ul.social-buttons {
|
|||
}
|
||||
|
||||
}
|
||||
.search-books-input-wrapper {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
#testimonies .container .row > div {
|
||||
border: none !important;
|
||||
}
|
||||
.ambassadorsTitle {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
.about.bg-secondary > div {
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -30,6 +30,7 @@ const styles = theme => ({
|
|||
},
|
||||
textField: {
|
||||
flexBasis: 280,
|
||||
borderColor: "#139657"
|
||||
},
|
||||
});
|
||||
|
||||
|
|
@ -49,7 +50,7 @@ class EnhancedSearch extends Component {
|
|||
<div className="search-books-bar">
|
||||
<div className="search-books-input-wrapper" style={{ textAlign: 'left', marginLeft: 20}}>
|
||||
<TextField
|
||||
style={{ textAlign: 'left', width: 350}}
|
||||
style={{ textAlign: 'left', width: 350,borderColor: "#139657" }}
|
||||
id="outlined-adornment-weight"
|
||||
className={classNames(classes.margin, classes.textField)}
|
||||
variant="outlined"
|
||||
|
|
|
|||
|
|
@ -20,7 +20,10 @@ function Footer() {
|
|||
<FooterBase className="footer text-center">
|
||||
<div className="containerfix">
|
||||
<Row className="vertical-align footerrow">
|
||||
<Col md="4">
|
||||
|
||||
<div className="col-md-10 mx-md-auto">
|
||||
|
||||
<Col className="logoFooter" md="4">
|
||||
<img alt="" src={FooterLogo} />
|
||||
</Col>
|
||||
|
||||
|
|
@ -68,19 +71,20 @@ function Footer() {
|
|||
</li>
|
||||
</ul>
|
||||
</Col>
|
||||
<Col md="4">
|
||||
<Col className="brandTextFooter" md="4">
|
||||
<p className="mb-0">
|
||||
<span id="ft_lang1">
|
||||
<FormattedMessage id="footer.title" />
|
||||
</span>
|
||||
</p>
|
||||
</Col>
|
||||
</div>
|
||||
</Row>
|
||||
|
||||
<div
|
||||
className="copyright py-3 text-center text-white"
|
||||
style={{ fontSize: "0.8em" }}>
|
||||
<div>
|
||||
<div className="col-md-10 mx-md-auto">
|
||||
<div className="row vertical-align">
|
||||
<div className="col-md-10 mx-md-auto">
|
||||
<p>
|
||||
|
|
@ -106,7 +110,7 @@ function Footer() {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row justify-content-end">
|
||||
<div className="row developersName justify-content-end">
|
||||
<div
|
||||
style={{ fontSize: "0.8em" }}
|
||||
className="text-white col-md-2">
|
||||
|
|
|
|||
|
|
@ -258,6 +258,7 @@ class LayerMap extends Component {
|
|||
<LayerMapSwitches
|
||||
ambassadors={this.state.ambassadorLayer}
|
||||
merchants={this.state.merchantLayer}
|
||||
ambsMap={this.props.ambsMap}
|
||||
onChange={this.handleLayerChange}
|
||||
/>
|
||||
) : (
|
||||
|
|
|
|||
|
|
@ -18,11 +18,23 @@ const styles = theme => ({
|
|||
},
|
||||
colorBar: {},
|
||||
colorChecked: {},
|
||||
iOSSwitchBase: {
|
||||
iOSSwitchBaseBlue: {
|
||||
'&$iOSChecked': {
|
||||
color: theme.palette.common.white,
|
||||
'& + $iOSBar': {
|
||||
backgroundColor: '#52d869',
|
||||
backgroundColor: "#2069b3",
|
||||
},
|
||||
},
|
||||
transition: theme.transitions.create('transform', {
|
||||
duration: theme.transitions.duration.shortest,
|
||||
easing: theme.transitions.easing.sharp,
|
||||
}),
|
||||
},
|
||||
iOSSwitchBaseGreen: {
|
||||
'&$iOSChecked': {
|
||||
color: theme.palette.common.white,
|
||||
'& + $iOSBar': {
|
||||
backgroundColor: "#139657",
|
||||
},
|
||||
},
|
||||
transition: theme.transitions.create('transform', {
|
||||
|
|
@ -76,7 +88,7 @@ class LayerMapSwitches extends React.Component {
|
|||
onChange={this.props.onChange('ambassadorLayer')}
|
||||
value="ambassadors"
|
||||
classes={{
|
||||
switchBase: classes.iOSSwitchBase,
|
||||
switchBase: ( (this.props.ambsMap) ? classes.iOSSwitchBaseBlue : classes.iOSSwitchBaseGreen ),
|
||||
bar: classes.iOSBar,
|
||||
icon: classes.iOSIcon,
|
||||
iconChecked: classes.iOSIconChecked,
|
||||
|
|
@ -90,7 +102,7 @@ class LayerMapSwitches extends React.Component {
|
|||
control={
|
||||
<Switch
|
||||
classes={{
|
||||
switchBase: classes.iOSSwitchBase,
|
||||
switchBase: ( (this.props.ambsMap) ? classes.iOSSwitchBaseBlue : classes.iOSSwitchBaseGreen ),
|
||||
bar: classes.iOSBar,
|
||||
icon: classes.iOSIcon,
|
||||
iconChecked: classes.iOSIconChecked,
|
||||
|
|
|
|||
|
|
@ -57,8 +57,8 @@ const columnData = [
|
|||
{ id: 'keybase', numeric: false, disablePadding: false, label: 'Keybase' },
|
||||
{ id: 'email', numeric: false, disablePadding: false, label: 'Email' },
|
||||
{ id: 'phone', numeric: false, disablePadding: false, label: 'Phone' },
|
||||
{ id: 'map', numeric: false, disablePadding: false, label: 'Maps', disableSearch: true},
|
||||
{ id: 'link', numeric: false, disablePadding: false, label: 'URL' }
|
||||
{ id: 'link', numeric: false, disablePadding: false, label: 'URL' },
|
||||
{ id: 'map', numeric: false, disablePadding: false, label: 'Maps', disableSearch: true}
|
||||
];
|
||||
|
||||
/**
|
||||
|
|
@ -171,7 +171,10 @@ class AmbassadorsPage extends Component {
|
|||
ambassador.map = <Button
|
||||
className="App-button"
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
backgroundColor: "#2069b3",
|
||||
color: 'white'
|
||||
}}
|
||||
onClick={() => this.openMaps(
|
||||
ambassador.nickname,
|
||||
`${ambassador.city} - ${ambassador.country}`,
|
||||
|
|
@ -186,7 +189,15 @@ class AmbassadorsPage extends Component {
|
|||
return (
|
||||
<div>
|
||||
<AppHeader />
|
||||
<h2 style={centerStyle}><FormattedMessage id="ambassadors.title" /></h2>
|
||||
|
||||
<div id="maincontent">
|
||||
<section data-spy="scroll" data-target="#mainNav" id="services">
|
||||
<div className="containerfix">
|
||||
<div className="row">
|
||||
<div className="col-md-10 mx-md-auto">
|
||||
|
||||
|
||||
<h2 className="ambassadorsTitle" style={centerStyle}><FormattedMessage id="ambassadors.title" /></h2>
|
||||
{ /* Conditional Rendering */}
|
||||
{(this.state.loading) ? (
|
||||
<img src={LoadingGif} alt="Loading" style={loadingStyle} />
|
||||
|
|
@ -237,11 +248,18 @@ class AmbassadorsPage extends Component {
|
|||
ambassadorsLayer={true}
|
||||
merchantsLayer={false}
|
||||
mapHeight={'600px'}
|
||||
ambsMap={true}
|
||||
showControls={this.state.mapsModalIsOpen}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -5,3 +5,56 @@
|
|||
background-position: center center;
|
||||
height: 100vh;
|
||||
}
|
||||
@media screen and (max-width: 991px) {
|
||||
.testimonialbox {
|
||||
margin-bottom: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width: 991px) {
|
||||
.logoFooter {
|
||||
text-align: left !important;
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
.brandTextFooter {
|
||||
text-align: right !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
.developersName {
|
||||
text-align: right !important;
|
||||
}
|
||||
.developersName > div {
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
#home footer .col-md-10 {
|
||||
padding-left: 0 !important; ;
|
||||
padding-right: 0 !important; ;
|
||||
}
|
||||
.boxTestimonial {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
.boxVideo {
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 991px) {
|
||||
.testimoniesBox {
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
.box-video {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 991px) {
|
||||
.margin-5 {
|
||||
padding-right: 0 !important;
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.margin-5 {
|
||||
padding: 3rem;
|
||||
}
|
||||
|
|
@ -3,7 +3,8 @@ import { Button, Collapse } from "mdbreact";
|
|||
import { FormattedMessage, FormattedHTMLMessage } from 'react-intl';
|
||||
|
||||
// Custom components
|
||||
import MarketingHeader from '../MarketingHeader';
|
||||
import AppHeader from '../AppHeader';
|
||||
import Footer from '../Footer';
|
||||
|
||||
/**
|
||||
* Marketing page component.
|
||||
|
|
@ -85,7 +86,7 @@ class MarketingPage extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<div>
|
||||
<MarketingHeader />
|
||||
<AppHeader />
|
||||
<div id="maincontent">
|
||||
<section data-spy="scroll" data-target="#mainNav" id="services">
|
||||
<div className="containerfix">
|
||||
|
|
@ -168,6 +169,7 @@ class MarketingPage extends React.Component {
|
|||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -165,7 +165,10 @@ class MerchantsPage extends Component {
|
|||
merchant.map = <Button
|
||||
className="App-button"
|
||||
variant="contained"
|
||||
color="primary"
|
||||
style={{
|
||||
backgroundColor: "#139657",
|
||||
color: 'white'
|
||||
}}
|
||||
onClick={() => this.openMaps(
|
||||
merchant.name,
|
||||
`${merchant.address}, ${merchant.city} - ${merchant.country}`,
|
||||
|
|
@ -180,7 +183,13 @@ class MerchantsPage extends Component {
|
|||
return (
|
||||
<div>
|
||||
<AppHeader />
|
||||
<h2 style={centerStyle}><FormattedMessage id="merchants.title" /></h2>
|
||||
|
||||
<section data-spy="scroll" data-target="#mainNav" id="services">
|
||||
<div className="containerfix">
|
||||
<div className="row">
|
||||
<div className="col-md-10 mx-md-auto">
|
||||
|
||||
<h2 className="ambassadorsTitle" style={centerStyle}><FormattedMessage id="merchants.title" /></h2>
|
||||
{ /* Conditional Rendering */}
|
||||
{(this.state.loading) ? (
|
||||
<img src={LoadingGif} alt="Loading" style={loadingStyle} />
|
||||
|
|
@ -237,6 +246,10 @@ class MerchantsPage extends Component {
|
|||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -14,15 +14,15 @@ import AboutImage5 from '../../assets/img/about/ab5.png';
|
|||
function AboutSection() {
|
||||
return (
|
||||
<section className="about bg-secondary" id="about">
|
||||
<div className="container">
|
||||
<div className="col-md-10 mx-md-auto">
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6 order-lg-2">
|
||||
<div className="p-5">
|
||||
<div className="margin-5">
|
||||
<img alt="" className="img-fluid" src={AboutImage1} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 order-lg-1">
|
||||
<div className="p-5">
|
||||
<div className="margin-5">
|
||||
<h2 className="about-text">
|
||||
<span>
|
||||
<span id="ab_lang1">
|
||||
|
|
@ -64,12 +64,12 @@ function AboutSection() {
|
|||
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6">
|
||||
<div className="p-5">
|
||||
<div className="margin-5">
|
||||
<img alt="" className="img-fluid" src={AboutImage2} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="p-5">
|
||||
<div className="margin-5">
|
||||
<h2 className="about-text">
|
||||
<span>
|
||||
<span id="ab_lang6">
|
||||
|
|
@ -103,12 +103,12 @@ function AboutSection() {
|
|||
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6 order-lg-2">
|
||||
<div className="p-5">
|
||||
<div className="margin-5">
|
||||
<img alt="" className="img-fluid" src={AboutImage3} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 order-lg-1">
|
||||
<div className="p-5">
|
||||
<div className="margin-5">
|
||||
<h2 className="about-text">
|
||||
<span>
|
||||
<span id="ab_lang10">
|
||||
|
|
@ -150,12 +150,12 @@ function AboutSection() {
|
|||
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6">
|
||||
<div className="p-5">
|
||||
<div className="margin-5">
|
||||
<img alt="" className="img-fluid" src={AboutImage4} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="p-5">
|
||||
<div className="margin-5">
|
||||
<h2 className="about-text">
|
||||
<span>
|
||||
<span id="ab_lang15">
|
||||
|
|
@ -182,12 +182,12 @@ function AboutSection() {
|
|||
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6 order-lg-2">
|
||||
<div className="p-5">
|
||||
<div className="margin-5">
|
||||
<img alt="" className="img-fluid" src={AboutImage5} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 order-lg-1">
|
||||
<div className="p-5">
|
||||
<div className="margin-5">
|
||||
<h2 className="display-5 about-text">
|
||||
<span>
|
||||
<span id="ab_lang18">
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ function MainSection() {
|
|||
<View className="vmain">
|
||||
<Mask className="d-flex justify-content-center align-items-center gradient">
|
||||
<Container className="px-md-3 px-sm-0">
|
||||
<Row>
|
||||
<Row className="col-md-10 mx-md-auto">
|
||||
<Col lg="10" className="mx-auto white-text text-center">
|
||||
<h1 className="text-uppercase">
|
||||
<strong className="important">
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ import Retail from '../../assets/img/services/retail.png';
|
|||
function ServicesSection() {
|
||||
return (
|
||||
<section data-spy="scroll" data-target="#mainNav" id="services">
|
||||
<div className="containerfix">
|
||||
<div className="col-md-10 mx-md-auto">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 text-center">
|
||||
<h2 className="section-heading">
|
||||
|
|
@ -30,7 +30,7 @@ function ServicesSection() {
|
|||
</div>
|
||||
</div>
|
||||
<div className="containerfix">
|
||||
<div className="row">
|
||||
<div className="row" style={{ margin: 'auto' }}>
|
||||
<div className="col-lg-3 col-md-6 text-center">
|
||||
<div className="service-box mt-5 mx-auto">
|
||||
<i className="fa fa-4x text-primary mb-3 sr-icons">
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ const testimonies = [
|
|||
class TestimoniesSection extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
|
||||
this.state = {
|
||||
activeItem: 1,
|
||||
maxLength: testimonies.length
|
||||
|
|
@ -53,9 +53,14 @@ class TestimoniesSection extends React.Component {
|
|||
return (
|
||||
<span>
|
||||
<section className="testimonials text-center" id="testimonies">
|
||||
<div className="container">
|
||||
<div className="col-md-10 mx-md-auto">
|
||||
<Row>
|
||||
<Col lg="6">
|
||||
<Col lg="6"
|
||||
style={{
|
||||
border: '1px solid #128f52',
|
||||
paddingTop: '10px',
|
||||
paddingLeft: '0'
|
||||
}} className ="testimoniesBox">
|
||||
<Carousel
|
||||
className="testimonialc"
|
||||
activeItem={activeItem}
|
||||
|
|
@ -64,7 +69,9 @@ class TestimoniesSection extends React.Component {
|
|||
showControls={true}
|
||||
showIndicators={true}
|
||||
>
|
||||
<CarouselInner>
|
||||
<CarouselInner
|
||||
className="testimonialbox"
|
||||
>
|
||||
<Row>
|
||||
{testimonies.map( (testimony, index) => (
|
||||
<CarouselItem itemId={index+1} key={index}>
|
||||
|
|
@ -81,7 +88,10 @@ class TestimoniesSection extends React.Component {
|
|||
</CarouselInner>
|
||||
</Carousel>
|
||||
</Col>
|
||||
<Col lg="6" className="mx-auto white-text text-center">
|
||||
<Col lg="6"
|
||||
style={{
|
||||
paddingRight: '0' }}
|
||||
className="mx-auto white-text text-center box-video">
|
||||
<div className="embed-responsive embed-responsive-16by9">
|
||||
<iframe
|
||||
className="embed-responsive-item"
|
||||
|
|
|
|||
|
|
@ -93,7 +93,7 @@ strong.important {
|
|||
}
|
||||
}
|
||||
#testimonies {
|
||||
padding: 14rem 0 !important;
|
||||
padding: 10rem 0 !important;
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.menuc {
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@
|
|||
"home.services.phone_orders": "Phone Orders",
|
||||
|
||||
"footer.title": "FASTER AND SAFER THAN CASH",
|
||||
"footer.description": "This website is not intended as legal or financial advice, is not a guarantee of anything and we do not collect any info about you whatsoever. PalmPay is a Point Of Sale product by Agorise, Ltd. For technical details, chat anytime 24/7 with the Agorise community on Telegram at: <a target='_blank' rel='noopener noreferrer' href='http://t.me/Agorise> http://t.me/Agorise </a>",
|
||||
"footer.description": "This website is not intended as legal or financial advice, is not a guarantee of anything and we do not collect any info about you whatsoever. PalmPay is a Point Of Sale product by Agorise, Ltd. For technical details, chat anytime 24/7 with the Agorise community on Telegram at: <a target='_blank' rel='noopener noreferrer' href='http://t.me/Agorise'> http://t.me/Agorise </a>",
|
||||
|
||||
"marketing.button.presentations": "Presentations",
|
||||
"marketing.accordion.presentations1": "<a target='_blank' rel='noopener noreferrer' href='https://docs.google.com/presentation/d/1oYQxlKIzNHb-F07PJ04xsK0jIJcduIzc-4HMpbqAw0o/edit?usp=sharing' class='list-group-item list-group-item-action flex-column align-items-start'> <div class='d-flex w-100 justify-content-between'> <h5 class='mb-1'> Slides (ES) - Google Slides (for Meetups and Workshops etc) in Spanish </h5> </div> <p class='mb-1'> https://docs.google.com/presentation/d/1oYQxlKIzNHb-F07PJ04xsK0jIJcduIzc-4HMpbqAw0o/edit?usp=sharing </p> </a>",
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@ import feathers from '@feathersjs/client';
|
|||
|
||||
const app = feathers();
|
||||
// Change to your production ambassador web service
|
||||
const restClient = feathers.rest('http://localhost:3030');
|
||||
|
||||
// const restClient = feathers.rest('http://localhost:3030');
|
||||
const restClient = feathers.rest('https://palmpaybackend.leticiacamara.com');
|
||||
// Configure an Fetch AJAX library with that client. For fetch details see https://facebook.github.io/react-native/docs/network.html
|
||||
// For rest details see https://docs.feathersjs.com/api/client/rest.html
|
||||
app.configure(restClient.fetch(window.fetch));
|
||||
|
|
|
|||
Loading…
Reference in a new issue