whizark

<?php
interface FlyableThingInterface
{
    public function fly();
}

interface AnimalInterface
{
    public function eat();
}

whizark

<?php
trait FirstTrait
{
    public function firstMethod() {
        echo 'This is the firstMethod()' . PHP_EOL;
    }
}

trait SecondTrait
{

whizark

<?php
interface PersonInterface
{
    public function getFullname();
}

trait PersonTrait
{
    private $name;
    

whizark

<?php
interface AccountInterface
{
    public function getBalance();
    public function increase($money);
    public function decrease($money);
}

trait AccountTrait
{

whizark

<?php
// This is just an example FOR WORDPRESS USERS.
//
// To make this better:
//  * use namespace/class/closure etc.
//  * use autoloader
//  * create & use service provider classes
//  * create & use factory for WP_Query, WP_User etc.

// interface ContainerInterface

whizark

// ----
// Sass (v3.4.1)
// Compass (v1.0.1)
// ----

// A property map
$properties: (
  prop-1: "raw-prop-1-value",
  prop-2: "raw-prop-2-value"
);

whizark

<a class="button" href="#">&lt;a&gt; button</a>
<button class="button">&lt;button&gt; button</button>

whizark

<div class="collection">
  <div class="collection__item">Item 1</div>
  <div class="collection__item">Item 2</div>
  <div class="collection__item">Item 3</div>
</div>

<ul class="collection">
  <li class="collection__item">Item 1</li>
  <li class="collection__item">Item 2</li>
  <li class="collection__item">Item 3</li>

whizark

// ----
// Sass (v3.4.1)
// Compass (v1.0.1)
// ----

// Sass: Typed value factory & validator using Map

// Direction type that accepts only top, right, left, bottom
// Direction type factory
@function dir-new($dir) {

whizark

<div class="container--micro">
  <!-- The style attributes only for the purpose of the demo -->
  <div style="float: left; height: 100px; background: #0f0;">
    content
  </div>
  <div style="float: left; height: 100px; background: #00f;">
    content
  </div>
</div>