[guadec-web] Changed the front page layout, fixed menu styling for active state, added sponsor logos
- From: Fabiana Pedreira Simões <fabianaps src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [guadec-web] Changed the front page layout, fixed menu styling for active state, added sponsor logos
- Date: Fri, 24 May 2013 19:06:51 +0000 (UTC)
commit 7882da2a841dca71d34e5d37ccc3e9e7494e33a6
Author: Fabiana Simões <fabianaps gnome org>
Date: Fri May 24 16:05:09 2013 -0300
Changed the front page layout, fixed menu styling for active state, added sponsor logos
wordcamp-base/front.php | 40 ++++++
wordcamp-base/images/guadec2012.png | Bin 0 -> 932190 bytes
wordcamp-base/index.php | 2 +-
wordcamp-base/lib/structure/class-wcb-header.php | 6 +-
wordcamp-base/loop.php | 2 -
wordcamp-base/page-news.php | 55 ++++++++
wordcamp-base/page.php | 2 +-
wordcamp-base/style.css | 149 ++++++++++++++++++----
8 files changed, 221 insertions(+), 35 deletions(-)
---
diff --git a/wordcamp-base/front.php b/wordcamp-base/front.php
new file mode 100644
index 0000000..fcc863f
--- /dev/null
+++ b/wordcamp-base/front.php
@@ -0,0 +1,40 @@
+ <div class="grid_12 alpha omega front-display">
+
+ <div class="image">
+ <img src="<?php echo get_bloginfo('template_url')?>/images/guadec2012.png" alt="Photo of the
GNOME community at GUADEC 2012" />
+ <h2 class="image-label"><span>GUADEC is the annual conference of the GNOME community, held in
Europe since 2000. GUADEC 2013 will be held in Brno, Czech Republic, a city which has played host to several
other successful GNOME-related hackfests in the past.</span></h2>
+ </div>
+
+ <div class="clear"></div>
+
+ <div class="grid_12 front-container">
+
+ <div class="news-posts">
+<?php
+query_posts('posts_per_page=3');
+
+while ( have_posts() ) : the_post();
+?>
+ <div id="post-<?php the_ID(); ?>" class="front-news">
+ <h2 class="entry-title front-title">
+ <a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink
to %s', 'wordcampbase' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a>
+ </h2>
+
+ <div class="entry-meta"><?php twentyten_posted_on(); ?></div>
+
+ <div class="entry-summary front-summary"><?php the_excerpt(); ?></div>
+
+ <div class="entry-utility">
+ <?php edit_post_link( __( 'Edit', 'wordcampbase' ), '<span
class="meta-sep">|</span> <span class="edit-link">', '</span>' ); ?>
+ </div>
+ </div>
+<?php endwhile; // End the loop. Whew. ?>
+ <a href="<?php echo get_permalink(get_page_by_title( 'News Archive' )); ?>"><div
class="button">News Archive</div></a>
+ </div>
+
+ <div class="sponsors-bar">
+ <img src="<?php echo get_bloginfo('template_url')?>/images/sponsor-google.png" alt="Google" />
+ <img src="<?php echo get_bloginfo('template_url')?>/images/sponsor-redhat.png" alt="Red Hat" />
+ <a href="<?php echo get_permalink(get_page_by_title( 'Sponsors' )); ?>"
class="become-sponsor">Become a sponsor too!</a>
+ </div>
+ </div>
diff --git a/wordcamp-base/images/guadec2012.png b/wordcamp-base/images/guadec2012.png
new file mode 100644
index 0000000..04dc234
Binary files /dev/null and b/wordcamp-base/images/guadec2012.png differ
diff --git a/wordcamp-base/index.php b/wordcamp-base/index.php
index 9f7d240..96b81d2 100644
--- a/wordcamp-base/index.php
+++ b/wordcamp-base/index.php
@@ -23,7 +23,7 @@ get_header(); ?>
* If you want to overload this in a child theme then include a file
* called loop-index.php and that will be used instead.
*/
- get_template_part( 'loop', 'index' );
+ get_template_part( 'front', 'index' );
?>
</div><!-- #content -->
</div><!-- #container -->
diff --git a/wordcamp-base/lib/structure/class-wcb-header.php
b/wordcamp-base/lib/structure/class-wcb-header.php
index 763e89b..18a7272 100644
--- a/wordcamp-base/lib/structure/class-wcb-header.php
+++ b/wordcamp-base/lib/structure/class-wcb-header.php
@@ -11,14 +11,10 @@ class WCB_Header extends WCB_Element {
<a class="event-logo-link" href="<?php echo home_url(); ?>"></a>
</div>
<?php wp_nav_menu(array('menu'=>'main',
- 'container'=>'',
+ 'container_class'=>'main-menu',
'items_wrap'=>'%3$s'));
?>
<div class="clear"></div>
- <div class="grid_12 branding-buildings"> </div>
- <div class="clear"></div>
- <div class="event-date">August 1 — 8, 2013</div>
- <div class="event-location">Brno, Czech Republic</div>
</div>
<?php
}
diff --git a/wordcamp-base/loop.php b/wordcamp-base/loop.php
index f7b06bc..a1355e7 100644
--- a/wordcamp-base/loop.php
+++ b/wordcamp-base/loop.php
@@ -18,7 +18,6 @@
* @since Twenty Ten 1.0
*/
?>
-
<?php /* Display navigation to next/previous pages when applicable */ ?>
<?php if ( $wp_query->max_num_pages > 1 ) : ?>
<div id="nav-above" class="navigation">
@@ -122,7 +121,6 @@
<?php /* How to display all other posts. */ ?>
<?php else : ?>
-
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<h2 class="entry-title"><a href="<?php the_permalink(); ?>" title="<?php printf(
esc_attr__( 'Permalink to %s', 'wordcampbase' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php
the_title(); ?></a></h2>
diff --git a/wordcamp-base/page-news.php b/wordcamp-base/page-news.php
new file mode 100644
index 0000000..a622fb4
--- /dev/null
+++ b/wordcamp-base/page-news.php
@@ -0,0 +1,55 @@
+<?php
+/*
+Template Name: News Archives
+*/
+
+get_header(); ?>
+
+ <div id="container">
+ <div id="content" role="main">
+ <?php query_posts(array('post_type'=>'post')); ?>
+ <?php if ( $wp_query->max_num_pages > 1 ) : ?>
+ <div id="nav-above" class="navigation">
+ <div class="nav-previous"><?php next_posts_link( __( '<span
class="meta-nav">←</span> Older posts', 'wordcampbase' ) ); ?></div>
+ <div class="nav-next"><?php previous_posts_link( __( 'Newer posts
<span class="meta-nav">→</span>', 'wordcampbase' ) ); ?></div>
+ </div>
+ <?php endif; ?>
+
+ <?php /* If there are no posts to display, such as an empty archive page */ ?>
+ <?php if ( ! have_posts() ) : ?>
+ <div id="post-0" class="post error404 not-found">
+ <h1 class="entry-title"><?php _e( 'Not Found', 'wordcampbase' );
?></h1>
+ <div class="entry-content">
+ <p><?php _e( 'Apologies, but no results were found for the
requested archive.
+ Perhaps searching will help find a
related post.', 'wordcampbase' ); ?></p>
+ <?php get_search_form(); ?>
+ </div>
+ </div>
+ <?php endif; ?>
+
+ <?php while ( have_posts() ) : the_post(); ?>
+
+ <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
+ <h2 class="entry-title">
+ <a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__(
'Permalink to %s', 'wordcampbase' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title();
?></a>
+ </h2>
+ <div class="entry-meta"><?php twentyten_posted_on(); ?></div>
+ <div class="entry-content"><?php the_content(); ?></div>
+ <div class="entry-utility">
+ <?php edit_post_link( __( 'Edit', 'wordcampbase' ), '<span
class="meta-sep">|</span> <span class="edit-link">', '</span>' ); ?>
+ </div>
+ </div>
+
+ <?php endwhile; // End the loop. Whew. ?>
+
+ <?php if ( $wp_query->max_num_pages > 1 ) : ?>
+ <div id="nav-below" class="navigation">
+ <div class="nav-previous"><?php next_posts_link( __( '<span
class="meta-nav">←</span> Older posts', 'wordcampbase' ) ); ?></div>
+ <div class="nav-next"><?php previous_posts_link( __( 'Newer posts
<span class="meta-nav">→</span>', 'wordcampbase' ) ); ?></div>
+ </div><!-- #nav-below -->
+<?php endif; ?>
+ </div><!-- #content -->
+ </div><!-- #container -->
+
+<?php get_sidebar(); ?>
+<?php get_footer(); ?>
diff --git a/wordcamp-base/page.php b/wordcamp-base/page.php
index 9120ffe..e8ea6b9 100644
--- a/wordcamp-base/page.php
+++ b/wordcamp-base/page.php
@@ -27,7 +27,7 @@ get_header(); ?>
<?php if ( is_front_page() ) { ?>
<!--<h2 class="entry-title"><?php the_title(); ?></h2>-->
<?php } else { ?>
- <h1 class="entry-title"><?php the_title(); ?></h1>
+ <h1 class="entry-title page-title"><?php the_title(); ?></h1>
<?php } ?>
<div class="entry-content">
diff --git a/wordcamp-base/style.css b/wordcamp-base/style.css
index 5eb28c8..ef982d0 100644
--- a/wordcamp-base/style.css
+++ b/wordcamp-base/style.css
@@ -766,7 +766,6 @@ body.page .edit-link {
#content img {
margin: 0;
height: auto;
- max-width: 640px;
width: auto;
}
#content .attachment img {
@@ -1364,8 +1363,13 @@ code {
/* Custom stuff */
-.entry-title a {
+.entry-title a, .entry-content a, .entry-summary a, .become-sponsor {
color: #6b8e9f !important;
+ outline: 0;
+}
+
+.entry-title a {
+ font-size: 22px !important;
}
.entry-content {
@@ -1376,51 +1380,62 @@ code {
font-size: 14px !important;
}
-.entry-meta {
+.entry-meta, .page-title {
font-weight: normal !important;
border-bottom: 1px solid #ddd;
}
-#content .entry-title {
- color: #6b8e9f !important;
- padding-top: 10px;
+.page-title {
+ margin-bottom: 20px !important;
}
.event-logo {
width: 230px;
- display: table-cell;
+ display: block;
background: url("images/logo.png") no-repeat center center;
height: 65px;
+ margin: 0 auto;
}
.event-logo-link {
display: block;
height: 100%;
width: 100%;
+ outline: 0;
}
.menu-item {
- display: table-cell;
- padding-right: 1em;
- padding-top: 40px;
- padding-bottom: 20px;
- font-size: large;
+ display: inline-block;
+ padding: 0 30px;
+ padding-top: 20px;
+ font-size: 20px;
color: #6b8e9f;
- vertical-align: middle;
}
-.menu-item:before {
- content: "• ";
- padding-right: .5em;
-}
-
-#header li {
- padding-left: .5em;
+.main-menu {
+ display: block;
+ margin: 0 auto;
+ text-align: center;
}
.menu-item a:link,
.menu-item a:visited {
color: #6b8e9f;
+ outline: 0;
+}
+
+.current_page_item a {
+ background: rgba(107, 142, 159, 0.7);
+ border-radius: 10px;
+ color: white !important;
+ padding: 10px 20px;
+ text-align: center;
+ text-decoration: none;
+ outline: 0;
+}
+
+.current_page_item a:hover {
+ text-decoration: none;
}
.event-location,
@@ -1448,13 +1463,15 @@ body, input, textarea, .page-title span, .pingback a.url, h3#comments-title, h3#
font-family: sans-serif !important;
}
-.submit-session-button {
- text-align: center;
- border-radius: 30px;
+.button {
background: #6b8e9f;
- padding: 10px 30px;
- width: 240px;
- margin: auto;
+ border-radius: 30px;
+ color: #fff;
+ float: right;
+ margin-top: 20px;
+ padding: 5px;
+ text-align: center;
+ width: 150px;
}
.widget-area .widget-title .submit-session-button a:hover, .entry-content .submit-session-button a,
.widget-area .submit-session-button a {
@@ -1496,6 +1513,15 @@ body {
background: #f5f5f4 !important;
}
+#content {
+ font-size: 14px;
+}
+
+#content .entry-title {
+ color: #6b8e9f !important;
+ padding-top: 10px;
+}
+
#content h3 {
color: #6b8e9f !important;
margin-bottom: 24px !important;
@@ -1512,3 +1538,74 @@ body {
h1, h2, h3, h4, h5, h6, #site-title, #site-description, #access .menu, #access div.menu ul, #access
a.button, h3#comments-title, h3#reply-title, .entry-title, .entry-meta, .entry-utility, .widget-title,
.callout {
font-family: sans-serif !important;
}
+
+.front-container {
+ margin: 0 !important;
+}
+
+.front-display {
+ margin: 30px 0;
+}
+
+.front-img {
+ padding-right: 10px;
+}
+
+.front-intro {
+ text-align: justify;
+}
+
+.news-posts {
+ width: 605px;
+ display: inline-block;
+ margin-right: 10px;
+ padding: 0;
+ margin: 0;
+}
+
+.front-news {
+ display: inline-block;
+ vertical-align: top;
+}
+
+.front-title {
+ padding-top: 0 !important;
+}
+
+.front-summary {
+ margin-bottom: 0 !important;
+}
+
+.sponsors-bar {
+ width: 310px;
+ float: right;
+}
+
+.sponsors-bar img {
+ padding-left: 10px;
+}
+
+.become-sponsor {
+ float: right;
+}
+
+.image {
+ position: relative;
+ margin-bottom: 20px;
+}
+
+.image-label {
+ position: absolute;
+ bottom: 0;
+ right: 0;
+}
+
+.image-label span {
+ color: white;
+ font-size: 18px;
+ line-height: 32px;
+ background: rgb(107, 142, 159);
+ background: rgba(107, 142, 159, 0.8);
+ padding: 20px;
+ display: block;
+}
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
