accommodation-services-jsx

import React, { Component } from 'react';
import './AcommodationServices.css';
import rightCoconutTree from './rightCoconutTree.svg';
import leftCoconutTree from './leftCoconutTree.svg';



class AcommodationServices extends Component {
    state = {
        services: [
            {
                icon: require('./wifi.svg'),
                text: 'Internet sem fio gratuita e de alta velocidade (WiFi)',
            },
            {
                icon: require('./wifi.svg'),
                text: 'Internet sem fio gratuita e de alta velocidade (WiFi)',
            },
            {
                icon: require('./wifi.svg'),
                text: 'Internet sem fio gratuita e de alta velocidade (WiFi)',
            },
            {
                icon: require('./breakfast.svg'),
                text: 'Café da manhã',
            },
            {
                icon: require('./breakfast.svg'),
                text: 'Café da manhã',
            },
            {
                icon: require('./breakfast.svg'),
                text: 'Café da manhã',
            },
            {
                icon: require('./bathtub.svg'),
                text: 'Banheira de hidromassagem',
            },
            {
                icon: require('./bathtub.svg'),
                text: 'Banheira de hidromassagem',
            },

            {
                icon: require('./bathtub.svg'),
                text: 'Banheira de hidromassagem',
            },

        ]
    }
    render() {
        return (
            <section className="accommodation-services-container">
                <div className></div>
                <img src={leftCoconutTree} className="accommodation-services-right-coconut"/>
                <div className="accommodation-services-box">
                    {this.state.services.map((service) => {
                        return(
                            <div className="accommodation-services-description-box">
                                <img className="accommodation-services-icon" src={service.icon}/>
                                <div className="accommodation-services-text">{service.text}</div>
                            </div>
                        )
                    })}
                </div>
                <img src={rightCoconutTree} className="accommodation-services-left-coconut"/>
            </section>
         );
    }
}

export default AcommodationServices;