Skip to content

Instantly share code, notes, and snippets.

View tammyhart's full-sized avatar

Tammy Hart tammyhart

View GitHub Profile
@tammyhart
tammyhart / Icon.js
Created July 20, 2017 04:15
SVG Icon React Component
import React from 'react';
class Icon extends React.Component {
render() {
const icons = {
menu: <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
<line x1="3" y1="12" x2="21" y2="12"/>
<line x1="3" y1="6" x2="21" y2="6"/>
<line x1="3" y1="18" x2="21" y2="18"/>
</svg>,
@tammyhart
tammyhart / wordpress-events-filter-and-order.php
Last active January 18, 2016 21:34
A pre_get_posts action that will first skip past events, then order them by the date meta value ascending
/**
* Order Events by date and skip them completely if they are past
*/
function coh_event_post_order( $query ) {
// do not modify queries in the admin
if( is_admin() ) {
return $query;
}
@tammyhart
tammyhart / toggle.js
Created January 12, 2016 16:56
Use to toggle single items, or work in pairs to toggle between related items
var $toggle = $( '[data-toggle]' );
function toggleOpen(event) {
var $this = $( this ),
object = $this.data( 'toggle' ),
$object = $( '.' + object ), // the object we're toggling
rel = $this.attr( 'rel' ), // the name of any related toggles
$other = $toggle.filter( '[rel=' + rel + ']' ).not( $this ), // find another toggle with the same rel
@tammyhart
tammyhart / traverse_results.php
Last active August 29, 2015 14:20
Traverse WordPress Search Results
<?php
/**
* Return search array
*/
function loopconf_search_array( $search_hash ) {
// check for existence of unique transient
if ( false === ( $search_array = get_transient( 'loopconf_search_' . $search_hash ) ) ) {
global $wpdb;
@tammyhart
tammyhart / image-sprite-mixins
Created December 9, 2014 03:04
Image Sprite Mixins
@mixin sprite-bg-size( $divisor: 2 ) {
$width: 240px;
$height: 360px;
$new-width: $width / $divisor;
$new-height: $height / $divisor;
background-size: round($new-width) round($new-height);
}
@tammyhart
tammyhart / highlight_cpt_menu_item.php
Created April 9, 2014 08:31
Highlight correct menu item for custom post types
add_filter( 'nav_menu_css_class', 'thd_menu_classes', 10, 2 );
function thd_menu_classes( $classes , $item ){
if ( get_post_type() == 'event' || is_archive( 'event' ) ) {
// remove that unwanted classes if it's found
$classes = str_replace( 'current_page_parent', '', $classes );
// find the url you want and add the class you want
if ( $item->url == '/events' ) {
$classes = str_replace( 'menu-item', 'menu-item current_page_item', $classes );
remove_filter( 'nav_menu_css_class', 'thd_menu_classes', 10, 2 );
}
@tammyhart
tammyhart / tooltip.js
Last active December 27, 2015 19:39
Super easy tooltips. example html: <a href="#" class="tooltip" title="title here">Link Text</a> In CSS, set .tooltip to relative postion, and .title to absolute position, with whatever styling you want such as background and padding.
function onHoverToggleTooltip( e ) {
var $this = $( this ),
title = $this.attr( 'title' ),
type = e.type,
offset = $this.offset(),
xOffset = e.pageX - offset.left + 10,
yOffset = e.pageY - offset.top + 30;
if( type == 'mouseenter' ) {
$this.data( 'tipText', title ).removeAttr( 'title' );
@tammyhart
tammyhart / blog-page-title.php
Created October 16, 2013 15:43
Echo WordPress "Posts Page" title
// blog title
function tammyhart_blog_title( $title = 'Blog' ) {
if ( get_option( 'show_on_front' ) == 'page' ) {
$page_id = get_option( 'page_for_posts' );
$title = get_the_title( $page_id );
}
if ( is_category() )
$title = 'Category: ' . single_cat_title( '', false );
@tammyhart
tammyhart / inline-labels.js
Created October 16, 2013 15:39
Fade out symmantic labels positioned over fields
// labels
function inlineLabels() {
var $this = $( this ),
id = $this.attr( 'id' ),
$label = $( 'label[for=' + id + ']' );
if ( $this.val() != '' )
$label.css( 'opacity', 0 );
$this.on( 'focus', function() {
@tammyhart
tammyhart / jquery-media-queries.js
Last active June 16, 2016 07:57
Set the window width to on load and on resize so you can run jQuery at certain browser sizes
var windowWidth;
function setWidth() {
windowWidth = $( window ).width();
}
setWidth();
$( window ).resize( setWidth );