Skip to content

Beth3346/elr-scss-address

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

30 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Address and Location Listing Styles

npm version CI License: MIT npm last commit Netlify Status

a scss mixin for addresses

View Demo

Screenshots

Address Block

Screenshot of address block

Locations List

Screenshot of locations list

Installation

Download node at nodejs.org and install it, if you haven't already.

npm install elr-scss-address

or

yarn add elr-scss-address

Implementation

Address Block

Arguments

primary-color: primary text color accent-color: accent text color

Scss

@import "elr-scss-address";

.address-block {
  @include elr-address-block(
    $config: (
      color: #111,
      accent-color: #005ebd,
    )
  );
}

HTML

<div class="address-block">
  <address class="address">
    <span class="business-name-line">Wildfire Publishing</span>
    <span class="address-line">1234 Somewhere Lane</span>
    <span class="address-line">#4321</span>
    <span class="address-line">Austin TX 77000</span>
    <span class="address-line">United States</span>
    <span class="contact-line">
      <span class="contact-label">Main Phone:</span> 512-555-5555
    </span>
    <span class="contact-line">
      <span class="contact-label">Email:</span> info@wildfiredigital.design
    </span>
  </address>
</div>

License

SEE LICENSE IN LICENSE.md