Skip to content
Browse files

Built Portfolio page out, added javascript interactions for showing/h…

…iding project slideshows.
  • Loading branch information...
1 parent 0eb1c88 commit 2bc9386e8f4b3e8baa8000faec575769fd2bd91c Cale Woodley committed May 2, 2012
View
21 wp-content/themes/cobalt343/media/stylesheets/compiled/style.css
@@ -142,9 +142,30 @@ body.home .flex-control-nav a {
background-position: 0 -8px; }
body.page-template-portfolio-php article.portfolio-item {
+ margin-bottom: 20px;
width: 100%; }
+ body.page-template-portfolio-php article.portfolio-item a {
+ color: #27bad5;
+ text-decoration: none; }
+ body.page-template-portfolio-php article.portfolio-item a:hover {
+ text-decoration: underline; }
+ body.page-template-portfolio-php article.portfolio-item h2 {
+ line-height: 20px;
+ margin-bottom: 0; }
body.page-template-portfolio-php article.portfolio-item header.meta .five {
+ line-height: 18px;
text-align: right; }
+ body.page-template-portfolio-php article.portfolio-item div.banner img {
+ border: 3px solid #cbcbcb;
+ display: block; }
+ body.page-template-portfolio-php article.portfolio-item footer {
+ clear: both;
+ display: block;
+ text-align: center;
+ width: 100%; }
+ body.page-template-portfolio-php article.portfolio-item div.flexslider {
+ display: none;
+ margin-bottom: 20px; }
/* #Media Queries
================================================== */
View
36 wp-content/themes/cobalt343/media/stylesheets/sass/style.scss
@@ -34,6 +34,8 @@ html, body {height: 100%;}
.alignright {display:inline;float:right;}
@mixin alignright {display:inline;float:right;}
+$highlight:#27bad5;
+
img.alignright, .alignright img {margin: 0 0 20px 20px;}
img.alignleft, .alignleft img {margin: 0 20px 20px 0;}
@@ -173,14 +175,48 @@ body.home {
body.page-template-portfolio-php {
article.portfolio-item {
+ margin-bottom: 20px;
width: 100%;
+ a {
+ color: $highlight;
+ text-decoration:none;
+
+ &:hover {text-decoration:underline;}
+ }
+
+ h2 {
+ line-height:20px;
+ margin-bottom:0;
+ }
+
header.meta {
.five {
+ line-height:18px;
text-align:right;
}
}
+
+ div.banner {
+ img {
+ border:3px solid #cbcbcb;
+ display: block;
+ }
+ }
+
+ footer {
+ clear:both;
+ display: block;
+ text-align:center;
+ width: 100%;
+ }
+
+ div.flexslider {
+ display: none;
+ margin-bottom:20px;
+ }
+
}
}
View
26 wp-content/themes/cobalt343/portfolio.php
@@ -28,8 +28,11 @@
Studio: <?php echo get('info_studio'); ?>
</div>
</header>
- <div class="slideshow">
- <div class="flexslider">
+ <div class="slideshow thirteen columns alpha omega">
+ <div class="banner">
+ <?php echo get_image('info_banner'); ?>
+ </div>
+ <div class="flexslider post_<?php the_ID(); ?>">
<ul class="slides nostyle">
<?php
$slides = getFieldOrder('slideshow_image');
@@ -42,6 +45,9 @@
</ul>
</div>
</div>
+ <footer class="clearfix">
+ <a href="#" class="post_<?php the_ID(); ?>">Show</a>
+ </footer>
</article>
<?php endwhile; ?>
<?php endif; wp_reset_query(); ?>
@@ -58,6 +64,22 @@
slideshowSpeed: "3000"
});
});
+
+
+ jQuery(document).ready(function($) {
+ $('footer.clearfix a').click(function(event) {
+ var linkID = $(this).attr('class');
+ var parentArticle = $('article#'+linkID);
+
+ $('article#'+linkID+' div.banner').slideToggle('slow');
+ $('div.'+linkID).slideToggle('slow');
+
+ var text = $(this).text();
+ $(this).text(
+ text == "Show" ? "Hide" : "Show");
+ });
+ });
+
</script>
<?php get_footer(); ?>

0 comments on commit 2bc9386

Please sign in to comment.
Something went wrong with that request. Please try again.