Mario Duarte Mario-Duarte

## custom_wp_gallery
/**
 * Custom WP gallery
 */
add_shortcode('gallery', 'my_gallery_shortcode');
function my_gallery_shortcode($attr) {
   $post = get_post();

	static $instance = 0;
	$instance++;

## arcade-buttons.markdown

      
              3 files
            
          
              0 forks
            
          
                0 comments
              
            
              0 stars
            
          
                Mario-Duarte
                / arcade-buttons.markdown
            
            
              Created
              September 17, 2016 12:25
            
              
                Arcade Buttons
              
          
    Arcade Buttons

Arcade looking button mixin  - feel free to fork/use it and give it a like.
A Pen by Mario Duarte on CodePen.
License.

  
## index.html
<div class="wrapper">

	<div class="phone">
		<div class="camera"></div>
		<div class="speaker"></div>
		<div class="screen">
			<div class="inner">
				<!-- your mobile layout here -->
			</div>
		</div>

## _keep-ratio-mixin.scss
@mixin aspect-ratio($percentual-height){
  // Wrapper
  position: relative;
  display: inline-block;
  vertical-align: top;
  &:before {
    padding-top:$percentual-height;
    content: '';
    display: block;
  }

## _variables.scss
//B&W Variables
$black:             #000000;
$asphalt:           #212121;
$choal:             #333333;
$charcoal:          #555555;
$grey:              #999999;
$lightGrey:         #dddddd;
$vapor:             #eeeeee;
$clouds:            #f8f8f8;
$white:             #ffffff;

## data_to_json.php
if (!isset($_POST['data']) && !empty($_POST['data'])) {
        $data = $_POST['data'];

        $jsonObject = json_encode($data);
        file_put_contents('data.json', $jsonObject);
    }

## index.html
<!doctype html>
<html lang="en">
<head>
  <meta charset ="utf-8">
  <title>Name - banner size</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <meta name="ad.size" content="height=0,width=0">

  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>

## app.scss
//This will fix the bug without losing the paralax effect

//turn the webkit backface visible
//NOTE: do not use any force gpu render on the html or body, this will make the background still glitching
html, body, main{
  -webkit-backface-visibility: visible;
  height: 100%;
  min-height: 100%;
}
	/**
	* Custom WP gallery
	*/
	add_shortcode('gallery', 'my_gallery_shortcode');
	function my_gallery_shortcode($attr) {
	$post = get_post();

	static $instance = 0;
	$instance++;
	<div class="wrapper">

	<div class="phone">
	<div class="camera"></div>
	<div class="speaker"></div>
	<div class="screen">
	<div class="inner">
	<!-- your mobile layout here -->
	</div>
	</div>
	@mixin aspect-ratio($percentual-height){
	// Wrapper
	position: relative;
	display: inline-block;
	vertical-align: top;
	&:before {
	padding-top:$percentual-height;
	content: '';
	display: block;
	}
	//B&W Variables
	$black: #000000;
	$asphalt: #212121;
	$choal: #333333;
	$charcoal: #555555;
	$grey: #999999;
	$lightGrey: #dddddd;
	$vapor: #eeeeee;
	$clouds: #f8f8f8;
	$white: #ffffff;
	if (!isset($_POST['data']) && !empty($_POST['data'])) {
	$data = $_POST['data'];

	$jsonObject = json_encode($data);
	file_put_contents('data.json', $jsonObject);
	}
	<!doctype html>
	<html lang="en">
	<head>
	<meta charset ="utf-8">
	<title>Name - banner size</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
	<meta name="ad.size" content="height=0,width=0">

	<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
	//This will fix the bug without losing the paralax effect

	//turn the webkit backface visible
	//NOTE: do not use any force gpu render on the html or body, this will make the background still glitching
	html, body, main{
	-webkit-backface-visibility: visible;
	height: 100%;
	min-height: 100%;
	}