From b9aa2a0396aa5f7db439bc362952f7710c7c24e9 Mon Sep 17 00:00:00 2001 From: raylu Date: Sun, 3 Jul 2011 04:30:08 -0700 Subject: rearrange the header and get rid of wrapper --- views/elements/authnav.html.php | 50 +++---- views/elements/normalnav.html.php | 62 +++------ views/layouts/default.html.php | 155 +++++++++------------ webroot/css/base.css | 276 +++++--------------------------------- 4 files changed, 131 insertions(+), 412 deletions(-) diff --git a/views/elements/authnav.html.php b/views/elements/authnav.html.php index e2f3d99..9b0af38 100644 --- a/views/elements/authnav.html.php +++ b/views/elements/authnav.html.php @@ -1,39 +1,23 @@ + +form->create(null, array('url' => '/search/index/anime', 'class' => 'search', 'method' => 'get')); ?> +form->text('search', array('value' => 'Search...', 'onFocus' => 'clearDefault(this)', 'style' => 'width: 200px')); ?> + +form->end(); ?> + \ No newline at end of file + form->create(); ?> + form->field('username', array('type' => 'textbox')); ?> + form->submit('Add'); ?> + form->end(); ?> + diff --git a/views/elements/normalnav.html.php b/views/elements/normalnav.html.php index c700aba..28eeeff 100644 --- a/views/elements/normalnav.html.php +++ b/views/elements/normalnav.html.php @@ -1,50 +1,24 @@ - - + +form->create(null, array('url' => '/search/index/anime', 'class' => 'search', 'method' => 'get')); ?> +form->text('search', array('value' => 'Search...', 'onFocus' => 'clearDefault(this)', 'style' => 'width: 200px')); ?> + +form->end(); ?> + \ No newline at end of file +

Login

+ form->create(null, array('url' => '/login', 'id' => 'login')); ?> + form->field('username', array('type' => 'textbox')); ?> + form->field('password', array('type' => 'password')); ?> + form->submit('Login'); ?> + form->end(); ?> + diff --git a/views/layouts/default.html.php b/views/layouts/default.html.php index 2ca3fc9..e7a26fa 100644 --- a/views/layouts/default.html.php +++ b/views/layouts/default.html.php @@ -1,108 +1,81 @@ - + - html->charset();?> - OtakuHub > <?php echo $this->title(); ?> - html->style(array('style', 'base', 'grid')); ?> - html->style(array('themes/light', 'themes/green')); ?> - html->style(array('prettyPhoto')); ?> - - - html->style(array('jquery.tagsinput')); ?> - html->script("/js/jquery.tagsinput.min.js"); ?> + html->charset() ?> + OtakuHub > <?= $this->title() ?> + html->style(array('style', 'base', 'grid')) ?> + html->style(array('themes/light', 'themes/green')) ?> + html->style(array('prettyPhoto')) ?> + + html->style(array('jquery.tagsinput')) ?> + html->script("/js/jquery.tagsinput.min.js") ?> - html->link('Icon', null, array('type' => 'icon')); ?> + function clearDefault(el) { + if (el.defaultValue == el.value) + el.value = "" + } + function resetValue(el) { + el.value = "Search..." + } + + html->link('Icon', null, array('type' => 'icon')) ?> - -
-
- -

Kameleon

- - - -_render('element', 'authnav', compact('user')); - } - else { - echo $this->_render('element', 'normalnav', compact('user')); - } - ?> - -
+
+ _render('element', 'authnav', compact('user')); + } + else + { + echo $this->_render('element', 'normalnav', compact('user')); + } + ?> +
- -
- content(); ?> -
- - - - - - - - - - - - - html->script("/js/jquery.anchor.js"); ?> - html->script("/js/jquery.prettyPhoto.js"); ?> +
+ content() ?> +
+ + + + + + + + +html->script("/js/jquery.anchor.js"); ?> +html->script("/js/jquery.prettyPhoto.js"); ?> - scripts(); ?> - +scripts(); ?> + - + diff --git a/webroot/css/base.css b/webroot/css/base.css index 1ad8b29..f9651cd 100644 --- a/webroot/css/base.css +++ b/webroot/css/base.css @@ -1,33 +1,12 @@ -/* -Kameleon Template -Author: Chris Mooney (http://themeforest.net/user/ChrisMooney) -*/ - -/*//// - Body Styles - ////*/ -#wrapper { - width:980px; - margin:0 auto; -} a:hover { text-decoration:none; } -/*//// - Headings - ////*/ h1 { font-weight:bold; font-size:220%; float:left; margin-top:5px; } -h1#logo { - display:inline; - height:38px; - text-indent:-4000px; - width:231px; -} -h1#logo a { - display:block; - height:38px; -} h2 { font-size:200%; margin-bottom:10px; @@ -193,21 +172,21 @@ img.fr { .txt-lighter { color:#666; } -/*//// - Nav - ////*/ +nav { + float: left; +} #nav { - float:right; - line-height:100%; - margin:0; - padding:10px; + line-height: 100%; + margin: 0 auto; + padding: 10px; + width: 100%; } #nav li { - float: left; - position: relative; + display: inline-block; list-style: none; - z-index:100; - margin-left:15px; - padding-bottom:5px; + z-index: 100; + margin-left: 15px; } /* main level link */ #nav a { @@ -234,62 +213,6 @@ img.fr { padding:7px 11px 8px; text-shadow:0 1px 0 #FFFFFF; } -/* sub levels link hover */ -#nav ul li:hover a, #nav li:hover li a { - background: none; - border: none; - color: #666; - -webkit-box-shadow: none; - -moz-box-shadow: none; -} -#nav ul a:hover { - background: #f2f2f2 !important; - color: #1A1A1A !important; - padding:10px; - -webkit-border-radius: 0; - -moz-border-radius: 0; -} -/* dropdown */ -#nav li:hover > ul { - display: block; -} -/* level 2 list */ -#nav ul { - display: none; - margin: 0; - padding: 0; - width: 185px; - position: absolute; - top: 35px; - left: 0; - background: #fafafa; - border: solid 1px #d9d9d9; - z-index:100; - font-size:100%; - -webkit-border-radius: 3px; - -moz-border-radius: 3px; - border-radius: 3px; -} -#nav ul li { - float: none; - margin: 0; - padding: 0; -} -#nav ul a { - font-size:100%; - font-weight:normal; - padding:10px !important; -} -#nav ul a:hover { - font-size:100%; - font-weight:normal; - padding:10px; -} -/* level 3+ list */ -#nav ul ul { - left: 185px; - top: 1px; -} /* rounded corners of first and last link */ #nav ul li:first-child > a { -webkit-border-top-left-radius: 3px; @@ -303,56 +226,28 @@ img.fr { -webkit-border-bottom-right-radius: 3px; -moz-border-radius-bottomright: 3px; } -/* clearfix */ -#nav:after { - content: "."; - display: block; - clear: both; - visibility: hidden; - line-height: 0; - height: 0; -} -#nav { - display: inline-block; -} -html[xmlns] #nav { - display: block; -} -* html #nav { - height: 1%; -} -/*//// - Page - ////*/ + header { - margin:25px 0 20px; + width: 980px; + margin: 25px auto 20px; } footer { - padding:10px 0; -} -.footer-nav { - float:right; -} -.footer-nav li { - display:inline; -} -.footer-nav a, .footer-nav a:visited { - text-decoration:none; - margin:0 10px; -} -footer li a:hover { - color:#666666; - text-decoration:none; + padding: 10px 0; + width: 980px; + margin: 25px auto 20px; } #page { background: #fff; - color:#191919; - border:1px solid #d9d9d9; - padding:40px; - position:relative; - width:898px; - z-index:1; - border-radius:3px; - -moz-border-radius:3px; - -webkit-border-radius:3px; + color: #191919; + border: 1px solid #d9d9d9; + padding: 40px; + position: relative; + width: 898px; + margin: 0 auto; + z-index: 1; + border-radius: 3px; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; } #page-content.two-col { float:left; @@ -504,27 +399,7 @@ blockquote cite { .portfolio-list li p { margin-bottom:15px; } -/*// Sidebar //*/ -.social-list { - margin:0 0 20px; - list-style:none; -} -.social-list li { - display:inline; - margin:0 15px 10px 0; - width:100%; -} -#twitter_update_list { - margin:0 0 40px; - list-style:none; -} -#twitter_update_list li { - margin-bottom:10px; - padding-bottom:10px; - line-height:1.6; - border-bottom:1px solid #d9d9d9; -} -/*//// - General Styling - ////*/ + p { line-height:1.6; margin-bottom:20px; @@ -707,105 +582,21 @@ a.down:active { a.disabled { visibility:hidden !important; } -/* Sidebar Elements */ -.sidebar-nav { - margin:0 0 40px; - list-style:none; -} -.sidebar-nav li { - border:1px solid #d9d9d9; - border-top:0; - background:#f2f2f2; - border-radius:3px 0 0 3px; - -moz-border-radius:3px 0 0 3px; - -webkit-border-radius:3px 0 0 3px; -} -.sidebar-nav li.first { - border-top:1px solid #d9d9d9; -} -.sidebar-nav li a { - background:url("../img/arrow.png") no-repeat 10px 50%; - color:#1A1A1A; - display:block; - width:100%; - padding:10px 27px; - text-decoration:none; -} -.sidebar-nav li:hover { - background:#bebebe; - border-color:#969696; -} -.sidebar-nav li.current { - left:-10px; - position:relative; - width:268px; - background:url("../img/grad-grey.gif") repeat-x scroll center top #166890; - border:1px solid #11506F; -} -.sidebar-nav li a:hover, .sidebar-nav li.current a { - color:#fff; - background:url("../img/arrow-active.png") no-repeat 10px 50%; -} -.sidebar-search { - margin:0 0 40px; - width:100%; -} -.sidebar-latestblog { - margin:-10px 0 40px; - list-style:none; -} -.sidebar-latestblog li { - border-bottom:1px solid #d9d9d9; - padding:10px 0; - width:100%; -} -.sidebar-latestblog img { - float:left; -} -.sidebar-latestblog a { - display:block; - margin-bottom:10px; - margin-left:75px; -} -.sidebar-latestblog time { - display:block; - font-style:italic; - font-size:93%; - color:#666666; - margin-left:75px; -} -.sidebar-latestblog p { - margin-bottom:10px; - margin-left:75px; -} -.sidebar-sponsors { - margin:0; - list-style:none; -} -.sidebar-sponsors li { - margin:0 0 10px; -} -#search { - padding:10px 5px; - background:#fff url(../img/bg-input.gif) repeat-x top; - border:1px solid #D9D9D9; - float:left; - width:168px; - margin-right:5px; - border-radius:3px; - -moz-border-radius:3px; - -webkit-border-radius:3px; + +.search { + float: right; + margin-top: 5px; } button.search { background:#fff url(../img/grad-grey.gif) repeat-x top; border:1px solid #d9d9d9; color:#404040; - float:left; height:38px; line-height:12px; font-size:108%; font-weight:bold; padding:8px 8px 10px; + margin: 0 0 0 5px; text-shadow:0 1px 0 #FFFFFF; border-radius:5px; -moz-border-radius:5px; @@ -874,9 +665,6 @@ button.search { border-bottom:0 none; } /*//// - Forms - ////*/ -form { - margin-bottom:20px; -} body.ie7 form, body.ie8 { margin-bottom:40px; } -- cgit v1.2.3