User's guide

CSS

There are some css in this template. that is: foundation.css, foundation-icon.css and main.css.

And custom style for this template, I put all in main.css. Which consists of:

• Global Styles
• Custom CSS Foundation 5.0.2
• Themes Styles
• Media Queries

If you want to change: background-color, font-color, font-style and others. Please changed from the “comment” /* Themes Styles */.

---

Javascript

Not much I do for javascript. there are only a few javacript like: foundation.min.js, jquery-1.10.2.min.js, modernizr-2.6.2.min.js, smoothscroll.js, maps.js and main.js. For this template you just edit the javascript maps.js and main.js.

Maps.js

• API key. You "MUST" signup for your own API key on Developers Google

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyASm3CwaK9qtcZEWYa-iQwHaGi3gcosAJc&amp;sensor=false"></script>

• Change your location/coordinates with latitude and longitude.

var myLatlng = new google.maps.LatLng(37.28468, -121.95150);

• Maps color:

stylers:[ {"hue": "#b8d30a"} ]

• Using a div with id="map" (#map):

var mapElement = document.getElementById('map');

• Google Maps marker:

icon: 'http://s22.postimg.org/9aopl7pl9/marker.png'});

Main.js

I just put the animation effects in the javascript. If you want to change, please refer to its css animation.

.slideInLeft and .slideOutLeft

---

Font icon

If you want to change the font icon such as font-size, font-color and other, please change the font icon class as well. As examples of font icon that exist in the services section.

<div class="icon-services red">
	<i class="fi-layout"></i>
</div><!-- /.icon-services .red -->

You have to change it in main.css like the example below:

.icon-services .fi-foundation {
	font-size: 2.813rem;
	line-height: 2;
}

And it is also applies to social media links.

Feedback

If you have a question or you need to customize Blusukan - Responsive App Showcase template, please contact me at: info@aryandhani.com. Thank you :)