diff options
-rw-r--r-- | .gitignore | 12 | ||||
-rw-r--r-- | Makefile | 37 | ||||
-rw-r--r-- | css_shadow.php | 151 | ||||
-rw-r--r-- | header.php | 95 | ||||
-rw-r--r-- | header.php.patch | 52 | ||||
-rw-r--r-- | logo-style.scss.php | 49 | ||||
-rw-r--r-- | style.css | 68 | ||||
-rw-r--r-- | style.scss | 94 |
8 files changed, 395 insertions, 163 deletions
diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..4537eb6 --- /dev/null +++ b/.gitignore @@ -0,0 +1,12 @@ +# DO NOT EDIT, this file is automatically made by `Makefile' +# +# ignore everyting +* +# but these: +!img/swoosh.png +!style.scss +!header.php.patch +!Makefile +!logo-style.scss.php +!license.txt +!css_shadow.php diff --git a/Makefile b/Makefile new file mode 100644 index 0000000..62429bb --- /dev/null +++ b/Makefile @@ -0,0 +1,37 @@ +RM = rm -f +CP = cp +PATCH = patch +SASS = sass +PHP = php5 + +srcfiles = \ + img/swoosh.png \ + style.scss \ + header.php.patch \ + Makefile \ + logo-style.scss.php \ + license.txt \ + css_shadow.php + +all: header.php style.css .gitignore + +style.css: logo-style.scss + +%: %.patch ../twentyeleven/% + $(RM) $@ + $(CP) ../twentyeleven/$@ $@ + $(PATCH) $@ < $@.patch + +%.css: %.scss + $(SASS) $< $@ + +%: %.php + $(PHP) -f $< > $@ + +.gitignore: Makefile + echo "# DO NOT EDIT, this file is automatically made by \`Makefile'" >$@ + echo '# ' >> '$@' + echo '# ignore everyting' >> '$@' + echo '*' >> '$@' + echo '# but these:' >> '$@' + for file in $(srcfiles); do echo !"$$file" >> '$@'; done diff --git a/css_shadow.php b/css_shadow.php new file mode 100644 index 0000000..bdd4adb --- /dev/null +++ b/css_shadow.php @@ -0,0 +1,151 @@ +<?php +class css_shadow { + /** Create a point */ + public static function xy($x, $y) { + return array('x'=>$x, 'y'=>$y); + } + + /** Draw a "line" of shadows between two points */ + public static function draw_line($p1, $p2, $steps, $color) { + $x1 = $p1['x']; + $y1 = $p1['y']; + $x2 = $p2['x']; + $y2 = $p2['y']; + + $xstep = ($x2-$x1)/($steps-1); + $ystep = ($y2-$y1)/($steps-1); + + $x = $x1; + $y = $y1; + $str = ''; + for ($i=0; $i<$steps; $i++) { + $str.= sprintf ("\t%fem %fem %s,\n", $x, $y, $color); + $x+=$xstep; + $y+=$ystep; + } + return $str; + } + + /** Connect the dots */ + public static function draw_multiline($points, $steps, $color) { + $str = ''; + foreach ($points as $point) { + if (isset($prev_point)) { + $str.= self::draw_line($prev_point, $point, $steps, $color); + } + $prev_point = $point; + } + return $str; + } + + public static function points_border($args) { + $left = $right = $top = $bottom = $xoffset = $yoffset = 0; + if (isset($args['width'])) { + $left = $right = $top = $bottom = $args['width']; + } + if (isset($args['x'])) { + $left = $right = $args['x']; + } + if (isset($args['y'])) { + $top = $bottom = $args['y']; + } + if (isset($args['left'])) { + $left = $args['left']; + } + if (isset($args['right'])) { + $right = $args['right']; + } + if (isset($args['top'])) { + $top = $args['top']; + } + if (isset($args['bottom'])) { + $bottom = $args['bottom']; + } + if (isset($args['xoffset'])) { + $xoffset = $args['xoffset']; + } + if (isset($args['yoffset'])) { + $yoffset = $args['yoffset']; + } + $p = array('tl'=>self::xy($xoffset-$left , $yoffset-$top ), + 'tr'=>self::xy($xoffset+$right, $yoffset-$top ), + 'bl'=>self::xy($xoffset-$left , $yoffset+$bottom), + 'br'=>self::xy($xoffset+$right, $yoffset+$bottom)); + return $p; + } + public static function points_border_drop($args) { + $xoffset = $yoffset = $xdrop = $ydrop = 0; + if (isset($args['xoffset'])) { + $xoffset = $args['xoffset']; + } + if (isset($args['yoffset'])) { + $yoffset = $args['yoffset']; + } + if (isset($args['drop'])) { + $xdrop = $ydrop = $args['drop']; + } + if (isset($args['xdrop'])) { + $xdrop = $args['xdrop']; + } + if (isset($args['ydrop'])) { + $ydrop = $args['ydrop']; + } + + $base = self::points_border($args); + if ($xdrop==$ydrop && $xdrop==0) { return $base; } + $args['xoffset'] = $xoffset+$xdrop; + $args['yoffset'] = $yoffset+$ydrop; + $drop = self::points_border($args); + + $right = ($xdrop > 0); + $bottom = ($ydrop > 0); + + /* 0|1 + * -+- + * 2|3 + */ + $q = 0; + if ($right) $q+=1; + if ($bottom) $q+=2; + + switch ($q) { + case 0: // top-left (or bottom-right) + // clockwise, start in top-left + $ret = array($drop['tl'], + $drop['tr'], + $base['tr'], + $base['br'], + $base['bl'], + $drop['bl'], + $drop['tl']); + return $ret; + case 1: // top-right (or bottom-left) + // clockwise, start in top-right + $ret = array($drop['tr'], + $drop['br'], + $base['br'], + $base['bl'], + $base['tl'], + $drop['tl'], + $drop['tr']); + return $ret; + case 2: /* TODO */ break; + case 3: // top-left (or bottom-right) + // clockwise, start in top-left + $ret = array($base['tl'], + $base['tr'], + $drop['tr'], + $drop['br'], + $drop['bl'], + $base['bl'], + $base['tl']); + return $ret; + } + } + public static function draw_border($args) { + $steps = 0; $color = '#000000'; + if (isset($args['steps'])) { $steps = $args['steps']; } + if (isset($args['color'])) { $color = $args['color']; } + return self::draw_multiline(self::points_border_drop($args), $steps, $color); + } +} diff --git a/header.php b/header.php deleted file mode 100644 index 192b59f..0000000 --- a/header.php +++ /dev/null @@ -1,95 +0,0 @@ -<?php -/** - * The Header for our theme. - * - * Displays all of the <head> section and everything up till <div id="main"> - * - * @package WordPress - * @subpackage Twenty_Eleven - * @since Twenty Eleven 1.0 - */ -?><!DOCTYPE html> -<!--[if IE 6]> -<html id="ie6" <?php language_attributes(); ?>> -<![endif]--> -<!--[if IE 7]> -<html id="ie7" <?php language_attributes(); ?>> -<![endif]--> -<!--[if IE 8]> -<html id="ie8" <?php language_attributes(); ?>> -<![endif]--> -<!--[if !(IE 6) | !(IE 7) | !(IE 8) ]><!--> -<html <?php language_attributes(); ?>> -<!--<![endif]--> -<head> -<meta charset="<?php bloginfo( 'charset' ); ?>" /> -<meta name="viewport" content="width=device-width" /> -<title><?php - /* - * Print the <title> tag based on what is being viewed. - */ - global $page, $paged; - - wp_title( '|', true, 'right' ); - - // Add the blog name. - bloginfo( 'name' ); - - // Add the blog description for the home/front page. - $site_description = get_bloginfo( 'description', 'display' ); - if ( $site_description && ( is_home() || is_front_page() ) ) - echo " | $site_description"; - - // Add a page number if necessary: - if ( $paged >= 2 || $page >= 2 ) - echo ' | ' . sprintf( __( 'Page %s', 'twentyeleven' ), max( $paged, $page ) ); - - ?></title> -<link rel="profile" href="http://gmpg.org/xfn/11" /> -<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" /> -<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" /> -<!--[if lt IE 9]> -<script src="<?php echo get_template_directory_uri(); ?>/js/html5.js" type="text/javascript"></script> -<![endif]--> -<?php - /* We add some JavaScript to pages with the comment form - * to support sites with threaded comments (when in use). - */ - if ( is_singular() && get_option( 'thread_comments' ) ) - wp_enqueue_script( 'comment-reply' ); - - /* Always have wp_head() just before the closing </head> - * tag of your theme, or you will break many plugins, which - * generally use this hook to add elements to <head> such - * as styles, scripts, and meta tags. - */ - wp_head(); -?> -</head> - -<body <?php body_class(); ?>> -<div id="page" class="hfeed"> - <header id="branding" role="banner"> - <hgroup> - <?php $url = esc_url(home_url('/')); ?> - <h1 id="team-name" class="logo-nowhite"><a href="<?php echo $url;?>" rel="home">Kil-a-Bytes</a></h1> - <h2 class="logo-nowhite"><a href="<?php echo $url;?>">M<span class="lower">c</span>Kenzie Center for Innovation and Technology</a></h2> - <h1 id="team-number" class="logo-white"><a href="<?php echo $url;?>">1024</a></h1> - </hgroup> - - <div class="only-search with-image"> - <?php get_search_form(); ?> - </div> - - <nav id="access" role="navigation"> - <h3 class="assistive-text"><?php _e( 'Main menu', 'twentyeleven' ); ?></h3> - <?php /* Allow screen readers / text browsers to skip the navigation menu and get right to the good stuff. */ ?> - <div class="skip-link"><a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to primary content', 'twentyeleven' ); ?>"><?php _e( 'Skip to primary content', 'twentyeleven' ); ?></a></div> - <div class="skip-link"><a class="assistive-text" href="#secondary" title="<?php esc_attr_e( 'Skip to secondary content', 'twentyeleven' ); ?>"><?php _e( 'Skip to secondary content', 'twentyeleven' ); ?></a></div> - <?php /* Our navigation menu. If one isn't filled out, wp_nav_menu falls back to wp_page_menu. The menu assiged to the primary position is the one used. If none is assigned, the menu with the lowest ID is used. */ ?> - <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?> - </nav><!-- #access --> - </header><!-- #branding --> - - - <div id="main">
\ No newline at end of file diff --git a/header.php.patch b/header.php.patch new file mode 100644 index 0000000..9fba494 --- /dev/null +++ b/header.php.patch @@ -0,0 +1,52 @@ +--- ../twentyeleven/header.php 2011-06-23 16:03:46.000000000 -0700 ++++ header.php 2011-08-18 21:17:57.000000000 -0700 +@@ -71,43 +71,15 @@ + <div id="page" class="hfeed"> + <header id="branding" role="banner"> + <hgroup> +- <h1 id="site-title"><span><a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></span></h1> +- <h2 id="site-description"><?php bloginfo( 'description' ); ?></h2> ++ <?php $url = esc_url(home_url('/')); ?> ++ <h1 id="team-name"><a href="<?php echo $url;?>" rel="home">Kil-a-Bytes</a></h1> ++ <h2><a href="<?php echo $url;?>">M<span class="lower">c</span>Kenzie Center for Innovation and Technology</a></h2> ++ <h1 id="team-number"><a href="<?php echo $url;?>">1024</a></h1> + </hgroup> + +- <?php +- // Check to see if the header image has been removed +- $header_image = get_header_image(); +- if ( ! empty( $header_image ) ) : +- ?> +- <a href="<?php echo esc_url( home_url( '/' ) ); ?>"> +- <?php +- // The header image +- // Check if this is a post or page, if it has a thumbnail, and if it's a big one +- if ( is_singular() && +- has_post_thumbnail( $post->ID ) && +- ( /* $src, $width, $height */ $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), array( HEADER_IMAGE_WIDTH, HEADER_IMAGE_WIDTH ) ) ) && +- $image[1] >= HEADER_IMAGE_WIDTH ) : +- // Houston, we have a new header image! +- echo get_the_post_thumbnail( $post->ID, 'post-thumbnail' ); +- else : ?> +- <img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" /> +- <?php endif; // end check for featured image or standard header ?> +- </a> +- <?php endif; // end check for removed header image ?> +- +- <?php +- // Has the text been hidden? +- if ( 'blank' == get_header_textcolor() ) : +- ?> +- <div class="only-search<?php if ( ! empty( $header_image ) ) : ?> with-image<?php endif; ?>"> +- <?php get_search_form(); ?> +- </div> +- <?php +- else : +- ?> ++ <div class="only-search with-image"> + <?php get_search_form(); ?> +- <?php endif; ?> ++ </div> + + <nav id="access" role="navigation"> + <h3 class="assistive-text"><?php _e( 'Main menu', 'twentyeleven' ); ?></h3> diff --git a/logo-style.scss.php b/logo-style.scss.php new file mode 100644 index 0000000..1c9c062 --- /dev/null +++ b/logo-style.scss.php @@ -0,0 +1,49 @@ +<?php +require_once('css_shadow.php'); + +$blue = css_shadow::draw_border(array('width'=>.02, + 'xdrop'=>.03, + 'ydrop'=>.02, + 'steps'=>10, + 'color'=>'#0000FF')); + +$white = css_shadow::draw_border(array('left' =>.04, 'top' =>.04, + 'right'=>.03, 'bottom'=>.03, + 'xdrop'=>.05, + 'ydrop'=>.04, + 'steps'=>10, + 'color'=>'#FFFFFF')); +?> +@import 'http://fonts.googleapis.com/css?family=Anton'; + +@mixin transform($arg) { + transform: $arg; + -webkit-transform: $arg; + -khtml-transform: $arg; + -moz-transform: $arg; + -ms-transform: $arg; + -o-transform: $arg; +} + +@mixin logo { + font-family: Anton, sans-serif; + font-style: oblique; + font-variant: small-caps; + font-weight: normal; + color: #FFFF00; + @include transform(skewX(-20deg)); + .lower { + text-transform: none; + } + text-transform: uppercase; + line-height: 1em; +} +@mixin logo-white { + @include logo; + text-shadow: <?php echo "\n$blue$white"; ?> 0 0 #000000; +} + +@mixin logo-nowhite { + @include logo; + text-shadow: <?php echo "\n$blue"; ?> 0 0 #000000; +} diff --git a/style.css b/style.css deleted file mode 100644 index 98a53c0..0000000 --- a/style.css +++ /dev/null @@ -1,68 +0,0 @@ -/* -Theme Name: Kil-a-Bytes -Theme URI: http://mckenzierobotics.org - -Author: Luke Shumaker -Author URI: http://lukeshu.ath.cx - -License: GNU General Public License -License URI: license.txt - -Description: HTML5 Theme for FRC team 1024, a child theme of Twenty-Eleven -Version: 0.1 - -Template: twentyeleven -*/ - -@import url("../twentyeleven/style.css"); -@import url("/logo-style.css.php"); - -/* -yellow : #FFFF00 -background-blue: #2210D2 -highlight-blue : #0000FF <-lighter that background, darker than light -light-blue : #1E90FF -*/ - -header#branding hgroup { - margin: 0; - - min-height: 175px; - background: url('img/swoosh.png') no-repeat right bottom; - - padding: 2em 50% 0 3em; - overflow: hidden; - /* border: solid 1px red; */ -} - -header#branding hgroup a { - text-decoration: inherit; - color: inherit; -} - -#team-number { - position: absolute; - bottom: 0.2em; - right: 0.4em; - font-size: 130px; - line-height: 1em; -} - -#team-name { - font-size: 80px; -} -header#branding hgroup h2 { - font-size: 40px; -} - -.logo-white, .logo-nowhite { - line-height: 1em; - text-transform: uppercase; -} -.logo-white .lower, .logo-nowhite .lower { - text-transform: none; -} - -div.menu-wp_nav_menu-container { - margin: 0 .5em !important; -}
\ No newline at end of file diff --git a/style.scss b/style.scss new file mode 100644 index 0000000..9fabbf6 --- /dev/null +++ b/style.scss @@ -0,0 +1,94 @@ +/* +Theme Name: Kil-a-Bytes +Theme URI: http://mckenzierobotics.org + +Author: Luke Shumaker +Author URI: http://lukeshu.ath.cx + +License: GNU General Public License +License URI: license.txt + +Description: HTML5 Theme for FRC team 1024, a child theme of Twenty-Eleven +Version: 0.1 + +Template: twentyeleven +*/ + +@import "../twentyeleven/style.css"; +@import "logo-style.scss"; + +$yellow : #FFFF00; +$background-blue: #2210D2; +$highlight-blue : #0000FF; //<-lighter that background, darker than light +$light-blue : #1E90FF; + +@mixin gradient($color1, $color2) { + background-color: $color1; + filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#{$color1}, endColorstr=#{$color2}); + background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from($color1), to($color2)); // older syntax + background-image: -webkit-linear-gradient($color1, $color2); + background-image: -moz-linear-gradient($color1, $color2); + background-image: -o-linear-gradient($color1, $color2); + background-image: linear-gradient($color1, $color2); +} + +body { + background-color: $background-blue; + #page { + box-shadow: 0 .1em 0 #AAAAFF inset; + border: { + style: solid; + width: 0.1em; + color: #000099; + radius: 2em 2em 0 0; + } + header#branding { + border: none; + hgroup { + margin: 0; + + min-height: 175px; + background: { + //color: $background-blue; + image: url('img/swoosh.png'); + repeat: no-repeat; + position: right bottom; + } + + padding: 2em 50% 0 3em; + overflow: hidden; + /* border: solid 1px red; */ + a { + text-decoration: inherit; + color: inherit; + } + #team-name { + font-size: 80px; + @include logo-nowhite; + } + h2 { + font-size: 40px; + @include logo-nowhite; + } + #team-number { + position: absolute; + bottom: 0.2em; + right: 0.4em; + font-size: 130px; + line-height: 1em; + @include logo-white; + } + } + } + #access { + box-shadow: none; + border-top: solid 0.2em $yellow; + @include gradient($light-blue, $highlight-blue); + } + } +} + +/*div.menu-wp_nav_menu-container { + margin: 0 .5em !important; +} +*/
\ No newline at end of file |