@berlitz/location-single

5.4.1 • Public • Published

LocationSingle npm version

Location Single Template comes with a featured card showcasing an image, heading, contact field, address fields and opening hours. A Google maps section is then presented revealing the location, and followed up with a call to action section with text area content.

Installation

yarn add @berlitz/location-single

Props

Argument Type Required Default Example
featuredCardSection object {} View Below
mapSection object {} View Below
contentSection object {} View Below
const featuredCardSection = {
  heading: `Awesome Language Center`,
  image: {
    url: 'https://picsum.photos/1280/720/?random',
    description: 'random image',
  },
  nonPhysicalLocation: false,
  nonPhysicalLocationDescription: 'Awesome Language Center Description',
  email: 'a@a.com',
  phone: '623-207-7801',
  addressLineOne: '420 Blaze It, Street',
  addressLineTwo: 'Perth AU 6000',
  classroomHours: [
    { day: 'Monday - Friday', hours: '8:00AM - 9:00PM' },
    { day: 'Saturday', hours: '9:00AM - 12:00PM' },
  ],
  officeHours: [
    { day: 'Monday - Friday', hours: '8:00AM - 9:00PM' },
    { day: 'Saturday', hours: '9:00AM - 12:00PM' },
  ],
  addressTitle: 'Address',
  classroomHoursTitle: 'Classroom Hours',
  officeHoursTitle: 'Öffice Hours',
}

const mapSection = {
  location: { lat: -31.953832, lng: 115.853299 },
  googleMapURL: '{API URL HERE}',
}

const contentSection = {
  innerHTML: `
  <h2>Awesome Language Center</h2>
  <p>You're obsessed with the fat lady! Here's my chance. I've crashed into a beet truck. Remind me to thank John for a lovely weekend. This thing comes fully loaded. Just my luck, no ice. I've crashed into a beet truck. A computer virus.</p>
  `,
}

Usage

import React from 'react'
import LocationSingle from '@berlitz/location-single'
const MyApp = () => {
  return (
    <LocationSingle
      featuredCardSection={featuredCardSection}
      mapSection={mapSection}
      contentSection={contentSection}
    />
  )
}

When to use this component

  • Single Page with Location Data

Notes

Recommended packages to work with location-single @berlitz/location-index

Readme

Keywords

none

Package Sidebar

Install

npm i @berlitz/location-single

Weekly Downloads

0

Version

5.4.1

License

MIT

Unpacked Size

68.9 kB

Total Files

9

Last publish

Collaborators

  • berlitz