Front-end foundation for WordPress projects
PHP
Latest commit 8f3d558 Jun 15, 2013 @noeltock Update WPThumb
Failed to load latest commit information.
WPThumb @ 846113f Update WPThumb Jun 15, 2013
images Subdir Sep 9, 2012
js Update versions May 19, 2013
less .font() Nov 28, 2012
wp-less @ 8c68692 Update versions May 19, 2013
.gitmodules Submodules, etc. Sep 9, 2012
README.md Readme Oct 2, 2012
page-themestyles.php Update Oct 2, 2012
prometheus.less Clean-up Sep 10, 2012
prometheus.php Scripts update Nov 29, 2012

README.md

prometheus

Front-end foundation for WordPress projects including a page template to view all your styles on one go.

Installation

1) Adding it to your theme

Add this repository to your theme by submoduling it in.

git submodule add git@github.com:noeltock/prometheus.git

2) LESS

This provides a base foundation for styling, including normalize, mixins, etc. Can be included at the top of your master LESS stylesheets:

@import 'prometheus/prometheus.less' 

3) Tools

To pull in wp-less and wpthumb, you can include this line near the top of your functions.php

require_once( 'prometheus/prometheus.php' );

Other Information

View your Theme Styles

To see the majority of selectors and DOM elements on a single page (instead of having to create dummy content every time), you can select the following page template:

Theme Styles

To view an example, check out the very simple noeltock.com theme styles

WPThumb

I don't like default resizing or timthumb, so I use WPThumb in my themes, like this:

$newimageurl = wpthumb( $imageurl, 'width=200&height=200&crop=1', false );

Full list of parameters and defaults:

$arg_defaults = array(
        'width'                 => 0,
        'height'                => 0,
        'crop'                  => false,
        'crop_from_position'    => 'center,center',
        'resize'                => true,
        'watermark_options'     => array(),
        'cache'                 => true,
        'default'               => null,
        'jpeg_quality'          => 80,
        'resize_animations'     => true,
        'return'                => 'url',
        'background_fill'       => null
);

JavaScript

Includes various polyfill's/fixes for older browsers.