pui-css-google-mapsdeprecated

google-maps css component for Pivotal UI based on Bootstrap

Usage no npm install needed!

<script type="module">
  import puiCssGoogleMaps from 'https://cdn.skypack.dev/pui-css-google-maps';
</script>

README

pui-css-google-maps

A CSS google-maps component that can be installed via this npm package. This package provides all of the CSS you need to use the component.

Installation

To install the package from the command line:

npm install pui-css-google-maps

Usage

To use Google Maps, you need to load the following JavaScript from Google.

<script src="http://maps.googleapis.com/maps/api/js?libraries=places"></script>

Here's an example usage:

<div class='map-wrapper'>
  <div class='pane'>
    <div class='container pan'>
      <div class='row'>
        <div class='col-sm-6 col-md-8 col-sm-offset-1'>
          <div class='map-overlay panel panel-basic bg-neutral-10 paxxl'>
            <h3 class="h2">Location</h3>
            <address class='h4 pvl'>Pivotal Software Inc.<br>
              875 Howard Street<br>
              San Francisco, CA 94103
            </address>
            <p class='h4'>Support: <a href='mailto:support@run.pivotal.io'>support@run.pivotal.io</a></p>
            <p class='h4'>Twitter: <a href='https://twitter.com/pivotalws'>@pivotalws</a></p>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class='pane pane-map'>
    <div id='labs-map'></div>
  </div>
</div>

You can find more examples of the google-maps component in the pui style guide

This is a component of Pivotal UI, a collection of React and CSS components for rapidly building and prototyping UIs.

Styleguide Github npm

(c) Copyright 2017 Pivotal Software, Inc. All Rights Reserved.