fones 0.1.0

data/layouts/default/css/_print.scss.erb

@@ -0,0 +1,80 @@
+/******************************************************************
+
+Stylesheet: Print Stylesheet
+
+This is the print stylesheet. There's probably not a lot
+of reasons to edit this stylesheet. If you want to
+though, go for it.
+
+******************************************************************/
+
+
+
+  * {
+    background: transparent !important;
+    color: black !important;
+    text-shadow: none !important;
+    filter:none !important;
+    -ms-filter: none !important;
+  }
+
+  a, a:visited {
+    color: #444 !important;
+    text-decoration: underline;
+
+    // show links on printed pages
+    &:after {
+      content: " (" attr(href) ")";
+    }
+
+    // show title too
+    abbr[title]:after {
+      content: " (" attr(title) ")";
+    }
+  }
+
+  .ir a:after,
+  a[href^="javascript:"]:after,
+  a[href^="#"]:after {
+    content: "";
+  }
+
+  pre, blockquote {
+    border: 1px solid #999;
+    page-break-inside: avoid;
+  }
+
+  thead {
+    display: table-header-group;
+  }
+
+  tr, img {
+    page-break-inside: avoid;
+  }
+
+  img {
+    max-width: 100% !important;
+  }
+
+    @page {
+      margin: 0.5cm;
+    }
+
+    p, h2, h3 {
+      orphans: 3;
+      widows: 3;
+    }
+
+    h2,
+    h3 {
+      page-break-after: avoid;
+    }
+
+    // hide content people who print don't need to see
+    .sidebar,
+    .page-navigation,
+    .wp-prev-next,
+    .respond-form,
+    nav {
+      display: none;
+    }

data/layouts/default/css/ie.scss.erb

@@ -0,0 +1,52 @@
+/******************************************************************
+
+Stylesheet: IE Stylesheet
+
+So instead of using the respond.js file to add media query support
+to IE, we're going to use SASS to create an easily readable css file.
+Here, we import all the styles the standard stylesheet gets, only
+without the media queries. No need to worry about editing anything!
+
+******************************************************************/
+
+/*
+Remember, all the BASE styles are called already since IE can
+read those. Below, we need to import only the stuff IE can't 
+understand (what's inside the media queries). We also need to
+import the mixins file so SASS can understand the variables.
+*/
+
+/* import mixins */
+@import "mixins";
+
+@import "grid";
+@import "481up";
+@import "768up";
+@import "1030up";
+
+/* 
+you can call the larger styles if you want, but there's really no need 
+*/
+
+
+/******************************************************************
+ADDITIONAL IE FIXES
+These fixes are now ONLY seen by IE, so you don't have to worry
+about using prefixes, although it's best practice. For more info
+on using Modernizr classes, check out this link:
+http://www.modernizr.com/docs/
+******************************************************************/
+
+/*
+For example, you can use something like:
+
+.no-textshadow .class { ... }
+
+You can also target specific versions by using the classes applied to
+the html element. These can sometimes change, so take a look inside the
+header.php file to see what they are:
+
+
+.lt-ie8 .class { ... }
+
+*/

data/layouts/default/css/login.scss.erb

@@ -0,0 +1,65 @@
+/******************************************************************
+
+Stylesheet: Login Stylesheet
+
+This stylesheet is loaded (if admin.php is setup in your
+functions file) on the login page. This way you can style
+the login page. It won't affect any other page, admin or front-end.
+
+For more info, check out the codex:
+http://codex.wordpress.org/Creating_Admin_Themes
+
+******************************************************************/
+
+
+body.login {}
+
+
+#login {} /* the form box */
+
+/*
+This is the Wordpress logo in the admin area.
+You'll have to load your own images and mess
+with the width and height.
+*/
+.login h1 a {
+	background: url(../img/login-logo.png) no-repeat top center; /* make sure to replace this! */
+	width: 326px;
+	height: 67px;
+	text-indent: -9999px;
+	overflow: hidden;
+	padding-bottom: 15px;
+	display: block;
+}
+
+form {
+	margin-left: 8px;
+	padding: 26px 24px 46px;
+	font-weight: normal;
+	background: white;
+	border: 1px solid #E5E5E5;
+	border-radius: 3px;
+	box-shadow: none;
+}
+
+body form .input {
+	font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",sans-serif;
+	font-weight: 200;
+	font-size: 24px;
+	width: 97%;
+	padding: 3px;
+	margin-top: 2px;
+	margin-right: 6px;
+	margin-bottom: 16px;
+	border: 1px solid #E5E5E5;
+	background: #FBFBFB;
+	outline: none;
+	box-shadow: inset 1px 1px 2px rgba(200,200,200,0.2);
+}
+
+/*
+You'll have to override some of the default styles
+but since we're referencing the id, it should be easy.
+*/
+#wp-submit {} /* login button*/
+

data/layouts/default/css/style.css.scss.erb

@@ -0,0 +1,111 @@
+// WordPress theme header
+@import "header";
+
+
+//
+// IMPORTING STYLES
+//
+
+// import normalize
+@import "normalize";
+
+// import mixins
+@import "mixins";
+
+/*
+BASE (MOBILE) SIZE
+This are the mobile styles. It's what people see on their phones. If
+you set a great foundation, you won't need to add too many styles in
+the other stylesheets. Remember, keep it light: Speed is Important.
+*/
+
+// styles in base.scss
+@import "base";
+
+/*
+LARGER MOBILE DEVICES
+This is for devices like the Galaxy Note or something that's
+larger than an iPhone but smaller than a tablet. Let's call them
+tweeners.
+*/
+@media only screen and (min-width: 481px) {
+
+// styles in 481up.scss
+    @import "481up";
+
+} // end of media query
+
+/*
+TABLET & SMALLER LAPTOPS
+This is the average viewing window. So Desktops, Laptops, and
+in general anyone not viewing on a mobile device. Here's where
+you can add resource intensive styles.
+*/
+@media only screen and (min-width: 768px) {
+
+// import grids
+    @import "grid";
+
+// styles in 768up.scss
+    @import "768up";
+
+} // end of media query
+
+/*
+DESKTOP
+This is the average viewing window. So Desktops, Laptops, and
+in general anyone not viewing on a mobile device. Here's where
+you can add resource intensive styles.
+*/
+@media only screen and (min-width: 1030px) {
+
+// styles in 1030up.scss
+    @import "1030up";
+
+} // end of media query
+
+/*
+LARGE VIEWING SIZE
+This is for the larger monitors and possibly full screen viewers.
+*/
+@media only screen and (min-width: 1240px) {
+
+// styles in 1240up.scss
+    @import "1240up";
+
+} // end of media query
+
+/*
+RETINA (2x RESOLUTION DEVICES)
+This applies to the retina iPhone (4s) and iPad (2,3) along with
+other displays with a 2x resolution. You can also create a media
+query for retina AND a certain size if you want. Go Nuts.
+*/
+@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
+only screen and (min--moz-device-pixel-ratio: 1.5),
+only screen and (min-device-pixel-ratio: 1.5) {
+
+// styles in 2x.scss
+    @import "2x";
+
+} // end of media query
+
+/*
+iPHONE 5 MEDIA QUERY
+Want to get fancy for no good reason? Knock yourself out.
+*/
+@media (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) {
+
+// iPhone 5 or iPod Touch 5th generation styles (you can include your own file if you want)
+
+}
+
+/*
+PRINT STYLESHEET
+Feel free to customize this. Remember to add things that won't make
+sense to print at the bottom. Things like nav, ads, and forms should
+be set to display none.
+*/
+@media print {
+    @import "print";
+}

data/layouts/default/functions/functions.php.erb

@@ -0,0 +1,166 @@
+<?php
+/*
+Author: 
+URL:
+
+This is where you can drop your custom functions or
+just edit things like thumbnail sizes, header images,
+sidebars, comments, ect.
+*/
+
+/************* INCLUDE NEEDED FILES ***************/
+
+/*
+1. library/bones.php
+	- head cleanup (remove rsd, uri links, junk css, ect)
+	- enqueueing scripts & styles
+	- theme support functions
+	- custom menu output & fallbacks
+	- related post function
+	- page-navi function
+	- removing <p> from around images
+- customizing the post excerpt
+- custom google+ integration
+- adding custom fields to user profiles
+*/
+require_once('library/bones.php'); // if you remove this, <%= theme_id %> will break
+
+/*
+2. library/custom-post-type.php
+- an example custom post type
+- example custom taxonomy (like categories)
+- example custom taxonomy (like tags)
+*/
+require_once('library/custom-post-type.php'); // you can disable this if you like
+/*
+3. library/admin.php
+- removing some default WordPress dashboard widgets
+- an example custom dashboard widget
+- adding custom login css
+- changing text in footer of admin
+*/
+// require_once('library/admin.php'); // this comes turned off by default
+/*
+4. library/translation/translation.php
+- adding support for other languages
+*/
+// require_once('library/translation/translation.php'); // this comes turned off by default
+
+/************* THUMBNAIL SIZE OPTIONS *************/
+
+// Thumbnail sizes
+add_image_size( '<%= theme_id %>-thumb-600', 600, 150, true );
+add_image_size( '<%= theme_id %>-thumb-300', 300, 100, true );
+/*
+to add more sizes, simply copy a line from above
+and change the dimensions & name. As long as you
+upload a "featured image" as large as the biggest
+set width or height, all the other sizes will be
+auto-cropped.
+
+To call a different size, simply change the text
+inside the thumbnail function.
+
+For example, to call the 300 x 300 sized image,
+we would use the function:
+<?php the_post_thumbnail( '<%= theme_id %>-thumb-300' ); ?>
+for the 600 x 100 image:
+<?php the_post_thumbnail( '<%= theme_id %>-thumb-600' ); ?>
+
+You can change the names and dimensions to whatever
+you like. Enjoy!
+*/
+
+/************* ACTIVE SIDEBARS ********************/
+
+// Sidebars & Widgetizes Areas
+function <%= theme_id %>_register_sidebars() {
+register_sidebar(array(
+'id' => 'sidebar1',
+'name' => __('Sidebar 1', '<%= theme_id %>theme'),
+'description' => __('The first (primary) sidebar.', '<%= theme_id %>theme'),
+'before_widget' => '<div id="%1$s" class="widget %2$s">',
+  'after_widget' => '</div>',
+'before_title' => '<h4 class="widgettitle">',
+  'after_title' => '</h4>',
+));
+
+/*
+to add more sidebars or widgetized areas, just copy
+and edit the above sidebar code. In order to call
+your new sidebar just use the following code:
+
+Just change the name to whatever your new
+sidebar's id is, for example:
+
+register_sidebar(array(
+'id' => 'sidebar2',
+'name' => __('Sidebar 2', '<%= theme_id %>theme'),
+'description' => __('The second (secondary) sidebar.', '<%= theme_id %>theme'),
+'before_widget' => '<div id="%1$s" class="widget %2$s">',
+  'after_widget' => '</div>',
+'before_title' => '<h4 class="widgettitle">',
+  'after_title' => '</h4>',
+));
+
+To call the sidebar in your template, you can just copy
+the sidebar.php file and rename it to your sidebar's name.
+So using the above example, it would be:
+sidebar-sidebar2.php
+
+*/
+} // don't remove this bracket!
+
+/************* COMMENT LAYOUT *********************/
+
+// Comment Layout
+function <%= theme_id %>_comments($comment, $args, $depth) {
+$GLOBALS['comment'] = $comment; ?>
+<li <?php comment_class(); ?>>
+<article id="comment-<?php comment_ID(); ?>" class="clearfix">
+  <header class="comment-author vcard">
+    <?php
+				/*
+					this is the new responsive optimized comment image. It used the new HTML5 data-attribute to display comment gravatars on larger screens only. What this means is that on larger posts, mobile sites don't have a ton of requests for comment images. This makes load time incredibly fast! If you'd like to change it back, just replace it with the regular wordpress gravatar call:
+					echo get_avatar($comment,$size='32',$default='<path_to_url>' );
+    */
+    ?>
+    <!-- custom gravatar call -->
+    <?php
+					// create variable
+					$bgauthemail = get_comment_author_email();
+				?>
+    <img data-gravatar="http://www.gravatar.com/avatar/<?php echo md5($bgauthemail); ?>?s=32" class="load-gravatar avatar avatar-48 photo" height="32" width="32" src="<?php echo get_template_directory_uri(); ?>/library/images/nothing.gif" />
+    <!-- end custom gravatar call -->
+    <?php printf(__('<cite class="fn">%s</cite>', '<%= theme_id %>theme'), get_comment_author_link()) ?>
+    <time datetime="<?php echo comment_time('Y-m-j'); ?>"><a href="<?php echo htmlspecialchars( get_comment_link( $comment->comment_ID ) ) ?>"><?php comment_time(__('F jS, Y', '<%= theme_id %>theme')); ?> </a></time>
+    <?php edit_comment_link(__('(Edit)', '<%= theme_id %>theme'),'  ','') ?>
+  </header>
+  <?php if ($comment->comment_approved == '0') : ?>
+  <div class="alert alert-info">
+    <p><?php _e('Your comment is awaiting moderation.', '<%= theme_id %>theme') ?></p>
+  </div>
+  <?php endif; ?>
+  <section class="comment_content clearfix">
+    <?php comment_text() ?>
+  </section>
+  <?php comment_reply_link(array_merge( $args, array('depth' => $depth, 'max_depth' => $args['max_depth']))) ?>
+</article>
+<!-- </li> is added by WordPress automatically -->
+<?php
+} // don't remove this bracket!
+
+/************* SEARCH FORM LAYOUT *****************/
+
+// Search Form
+function <%= theme_id %>_wpsearch($form) {
+	$form = '<form role="search" method="get" id="searchform" action="' . home_url( '/' ) . '" >
+<label class="screen-reader-text" for="s">' . __('Search for:', '<%= theme_id %>theme') . '</label>
+<input type="text" value="' . get_search_query() . '" name="s" id="s" placeholder="'.esc_attr__('Search the Site...','<%= theme_id %>theme').'" />
+<input type="submit" id="searchsubmit" value="'. esc_attr__('Search') .'" />
+</form>';
+return $form;
+} // don't remove this bracket!
+
+
+?>