jackmakesthings

<div class="wrap -three">
  <div class="block -demo">Hello world!</div>
  <div class="block -demo">Hello world!</div>
  <div class="block -demo">Hello world!</div>
  <div class="block -demo">Hello world!</div>
  <div class="block -demo">Hello world!</div>
</div>
<div class="wrap -four">
  <div class="block -demo">Hello world!</div>
  <div class="block -demo">Hello world!</div>

jackmakesthings

var char_collision_detected = false 

func _ready():
  get_node("Area2D").connect("body_enter", self, "collision_func")
  get_node("Area2D").connect("body_exit", self, "collision_funcB")
  set_fixed_process(true)   

func collision_func(body):
  if body != self: 
    char_collision_detected = true 

jackmakesthings

@charset "UTF-8";
/* line 4, neat/grid/_box-sizing.scss */
html {
  box-sizing: border-box; }

/* line 11, neat/grid/_box-sizing.scss */
*,
*::after,
*::before {
  box-sizing: inherit; }

jackmakesthings

/*!
* toggleAria.js
* Author: Joe Watkins
* usage:

  HTML
  <button aria-pressed="false">Show Content</button>

  $("button").on("click", function(){
    $(this).toggleAria({aria: "pressed"});

jackmakesthings

<!-- <div class="wrap"> -->
<!--nav class="mobile-nav ">
  <button type="button" class="hamburger icon-hamburger"><span class="visually-hidden">Toggle Menu</span></button>
  <a href="/" class="logo icon-logo-icon" data-analytics-button="global-header-logo"><span class="visually-hidden">Morgan Stanley</span></a>
  <div class="search-button">
    <a href="#" class="search icon-search">
      <span class="visually-hidden">Search</span>
    </a>
  </div>
</nav -->

jackmakesthings

Semantic HTML

Intro

What are we talking about?

Semantic = related to the meaning of words In this context, "semantic markup" means "markup that appropriately reflects its contents and purpose". This isn't a new concept - if you have to create an html shopping list and you code it like this

jackmakesthings

/**
 * Makes some sections appear to scroll at different speeds than others
 * @requires requestAnimationFrame
 * @requires getSupportedPropertyName
 * @returns window.Parallax object
 * @author jack@kratedesign.com, updated 6.30.14
 * API:
 *   .add(el) - add [el] to the array of elements being parallaxed
 *   .setAll(array) - set multiple elements and initialize Parallax
 *   .init() - start parallax effects on all els added by 'set'/'setAll' and/or 'fix'

jackmakesthings

<div class="hero">
  <div class="container">
    <div class="text">
      Class members can be exported. This means their value gets saved along with a scene. If class members have initializers to constant expressions, they will be available for editing in the property editor. Exporting is done by using the export keyword:
    </div>
    <div class="img-box">
      <img src="http://fillmurray.com/400/400" alt="">
    </div>
  </div>
</div>

jackmakesthings

<table>
  <tr>
    <td>Cats</td>
    <td>Dogs</td>
    <td>Hyenas</td>
  </tr>
</table>

jackmakesthings

<a>Sign Up on Facebook</a>