diff options
| author | cash <cash@36083f99-b078-4883-b0ff-0f9b5a30f544> | 2010-12-04 15:52:14 +0000 |
|---|---|---|
| committer | cash <cash@36083f99-b078-4883-b0ff-0f9b5a30f544> | 2010-12-04 15:52:14 +0000 |
| commit | 58e7394e2dabe3bcf92b5efdc1c3917973cdf943 (patch) | |
| tree | b2cb6dfa30447d537fe10b4ebf312ea0a112f6a0 /views/default | |
| parent | 3d25a1293f4caf6b94e87bc214c1631ea1164229 (diff) | |
| download | elgg-58e7394e2dabe3bcf92b5efdc1c3917973cdf943.tar.gz elgg-58e7394e2dabe3bcf92b5efdc1c3917973cdf943.tar.bz2 | |
refs #1402 first cut of the new sidebar layout code (plus some other stuff - very non-atomic commit). blog plugin uses the one sidebar layout and bookmarks uses the two sidebar layout (for testing purposes)
git-svn-id: http://code.elgg.org/elgg/trunk@7528 36083f99-b078-4883-b0ff-0f9b5a30f544
Diffstat (limited to 'views/default')
| -rw-r--r-- | views/default/content/header.php | 2 | ||||
| -rw-r--r-- | views/default/css/screen.php | 219 | ||||
| -rw-r--r-- | views/default/layouts/one_column.php | 8 | ||||
| -rw-r--r-- | views/default/layouts/one_column_with_sidebar.php | 34 | ||||
| -rw-r--r-- | views/default/layouts/two_sidebar.php | 42 | ||||
| -rw-r--r-- | views/default/page_elements/content.php | 6 | ||||
| -rw-r--r-- | views/default/page_elements/footer.php | 4 | ||||
| -rw-r--r-- | views/default/page_elements/header.php | 4 | ||||
| -rw-r--r-- | views/default/page_elements/header_logo.php | 10 | ||||
| -rw-r--r-- | views/default/page_elements/main_header.php | 27 | ||||
| -rw-r--r-- | views/default/page_elements/main_module.php | 5 | ||||
| -rw-r--r-- | views/default/page_elements/main_nav.php | 32 | ||||
| -rw-r--r-- | views/default/page_elements/topbar.php | 4 |
13 files changed, 179 insertions, 218 deletions
diff --git a/views/default/content/header.php b/views/default/content/header.php index 396e9adc9..469d79269 100644 --- a/views/default/content/header.php +++ b/views/default/content/header.php @@ -37,7 +37,7 @@ if ($context) { } } echo <<<HTML -<div id="elgg-main-header" class="elgg-header clearfix"> +<div class="elgg-main-header clearfix"> <h2 class="elgg-main-heading">$title</h2>$buttons </div> HTML; diff --git a/views/default/css/screen.php b/views/default/css/screen.php index a5e5d19f7..00d4d8f5d 100644 --- a/views/default/css/screen.php +++ b/views/default/css/screen.php @@ -240,7 +240,7 @@ h2 { /* *************************************** PAGE LAYOUT - MAIN BLOCKS POSITIONING *************************************** */ -#elgg-topbar { +#elgg-page-topbar { background: #333333 url(<?php echo elgg_get_site_url(); ?>_graphics/toptoolbar_background.gif) repeat-x top left; color: #eeeeee; border-bottom: 1px solid #000000; @@ -257,124 +257,100 @@ h2 { background-repeat: repeat-x; background-position: bottom left; } -#elgg-sidebar { - background-color: #eeeeee; - border-left: 1px solid #DEDEDE; - float: right; - width: 210px; - padding: 20px 10px; +#elgg-page-footer { position: relative; - min-height: 360px; + z-index: 999; } -#elgg-main { - float: left; - width: 729px; +.elgg-layout-one_column { + padding: 10px 0; +} +.elgg-layout-sidebar { + background-image:url(<?php echo elgg_get_site_url(); ?>_graphics/sidebar_background.gif); + background-repeat:repeat-y; + background-position: right top; +} +.elgg-layout-two-sidebar { + background-image:url(<?php echo elgg_get_site_url(); ?>_graphics/two_sidebar_background.gif); + background-repeat:repeat-y; + background-position: right top; +} +.elgg-main { position: relative; min-height: 360px; - margin: 10px 20px 20px 10px; + padding: 10px; +} +.elgg-aside { + padding: 20px 10px; + position: relative; + min-height: 360px; +} +.elgg-sidebar { + float: right; + width: 210px; + margin-left: 10px; +} +.elgg-sidebar-alt { + float: left; + width: 160px; + margin-right: 10px; } -/* move this to one of the components */ +/* move elgg-body to one of the css components */ +/** + * elgg-body fills the space available to it. + * It uses hidden text to expand itself. The combination of auto width, overflow + * hidden, and the hidden text creates this effect. + * + * This allows us to float fixed width divs to either side of an .elgg-body div + * without having to specify the body div's width. + * + * @todo check what happens with long <pre> tags or large images + */ +.elgg-body { + width: auto; + word-wrap: break-word; + overflow: hidden; +} .elgg-body:after { display: block; visibility: hidden; - overflow: hidden; height: 0 !important; line-height: 0; font-size: xx-large; content: " x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x "; } -#elgg-page-footer { - position: relative; - z-index: 999; -} -#elgg-page-footer-inner { - padding: 5px 0; - border-top:1px solid #DEDEDE; -} -#elgg-main-header { - border-bottom: 1px solid #CCCCCC; - padding-bottom: 3px; -} -#elgg-header-contents { - width:990px; - position: relative; - margin:0 auto; - height:90px; -} -#elgg-search { - bottom:5px; - height:23px; - position:absolute; - right:0; -} -#elgg-main-nav { - z-index: 7000; - position: absolute; - height:23px; - bottom:0; - left:0; - width:auto; -} -#elgg-content { /* wraps sidebar and page contents */ - width:990px; - position: relative; - overflow:hidden; - word-wrap:break-word; - margin:0 auto; - min-height:400px; -} -#elgg-content.sidebar { /* class on #elgg-content div to give a full-height sidebar background */ - background-image:url(<?php echo elgg_get_site_url(); ?>_graphics/sidebar_background.gif); - background-repeat:repeat-y; - background-position: right top; -} -.elgg-layout > .elgg-body { - float:left; - position: relative; - min-height: 360px; - margin:10px 20px 20px 10px; +.elgg-module { } -#elgg-page-contents { /* main page contents */ - float:left; - position: relative; - min-height: 360px; - margin:10px 20px 20px 10px; +.elgg_inner { } -#elgg-page-contents.one-column { /* class on #elgg-page-contents when no sidebar */ - width:970px; - margin-right:10px; -} -.elgg-aside { /* elgg sidebar */ +.elgg-header { + border-bottom: 1px solid #CCCCCC; + margin-bottom: 5px; + margin-top: 20px; + padding-bottom: 5px; } -.elgg-footer { +.elgg-footer { } -.elgg-footer > .elgg-inner { - padding:3px 0 10px 0; -} -#elgg-footer-contents { - border-top:1px solid #DEDEDE; - margin:0 auto; - width:990px; - padding:3px 0 10px 0; - text-align: right; +.elgg-main-header { + border-bottom: 1px solid #CCCCCC; + padding-bottom: 3px; } -.elgg-aside h3 { - border-bottom:1px solid #CCCCCC; - margin-bottom:5px; - margin-top:20px; - padding-bottom:5px; +.elgg-main-heading { + float: left; + max-width: 530px; + margin-right: 10px; } + .elgg-center { margin: 0 auto; } @@ -383,28 +359,27 @@ h2 { width: 990px; } -.elgg-width-content { - width: 730px; -} -.elgg-module { +#elgg-search { + bottom:5px; + height:23px; + position:absolute; + right:0; } - -.elgg-main-heading { - float: left; - max-width: 530px; - margin-right: 10px; +#elgg-main-nav { + z-index: 7000; + position: absolute; + height:23px; + bottom:0; + left:0; + width:auto; } -.elgg-maincontent-header { - border-bottom: 1px solid #CCCCCC; - padding-bottom: 3px; -} /* *************************************** ELGG TOPBAR *************************************** */ -#elgg-topbar a { +#elgg-page-topbar a { margin-right:30px; padding-top:2px; display:inline; @@ -412,54 +387,54 @@ h2 { text-align: left; color:#eeeeee; } -#elgg-topbar a:hover { +#elgg-page-topbar a:hover { color:#71cbff; text-decoration: none; } -#elgg-topbar a img.user-mini-avatar { +#elgg-page-topbar a img.user-mini-avatar { border:1px solid #eeeeee; margin:1px 0 0 10px; display: block; } -#elgg-topbar a img.site-logo { +#elgg-page-topbar a img.site-logo { display: block; margin-left:5px; margin-top: -1px; } -#elgg-topbar .log-out { +#elgg-page-topbar .log-out { float:right; } -#elgg-topbar .log-out a { +#elgg-page-topbar .log-out a { display: inline; text-align: right; margin-right:10px; color:#999999; } -#elgg-topbar .log-out a:hover { +#elgg-page-topbar .log-out a:hover { color:#71cbff; } -#elgg-topbar a.myfriends { +#elgg-page-topbar a.myfriends { background:transparent url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png) no-repeat left -297px; margin-right:30px; text-indent: -900em; width:36px; } -#elgg-topbar a.myfriends:hover { +#elgg-page-topbar a.myfriends:hover { background-position: left -337px; } -#elgg-topbar a.settings { +#elgg-page-topbar a.settings { background:transparent url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png) no-repeat -300px -41px; padding-left:20px !important; float:right; margin-right:30px; } -#elgg-topbar a.admin { +#elgg-page-topbar a.admin { background:transparent url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png) no-repeat -300px -41px; padding-left:20px !important; float:right; margin-right:30px; } -#elgg-topbar a.help { +#elgg-page-topbar a.help { background:transparent url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png) no-repeat -300px -133px; padding-left:18px !important; float:right; @@ -475,7 +450,7 @@ h2 { height: 90px; } -.elgg-header h1 a span.network-title { +#elgg-page-header h1 a span.network-title { font-size: 2em; line-height:1.4em; color: white; @@ -485,7 +460,7 @@ h2 { text-decoration: none; text-shadow:1px 2px 4px #333333; } -.elgg-header #elgg-search input.search-input { +#elgg-page-header #elgg-search input.search-input { -webkit-border-radius: 10px; -moz-border-radius: 10px; background-color:transparent; @@ -500,19 +475,19 @@ h2 { background-position: 2px -220px; background-repeat: no-repeat; } -.elgg-header #elgg-search input.search-input:focus { +#elgg-page-header #elgg-search input.search-input:focus { background-color:white; color:#0054A7; border:1px solid white; background-position: 2px -257px; } -.elgg-header #elgg-search input.search-input:active { +#elgg-page-header #elgg-search input.search-input:active { background-color:white; color:#0054A7; border:1px solid white; background-position: 2px -257px; } -.elgg-header #elgg-search input.search-submit-button { +#elgg-page-header #elgg-search input.search-submit-button { display:none; } @@ -649,6 +624,12 @@ li.navigation-more ul li { /* *************************************** FOOTER CONTENTS *************************************** */ + +#elgg-page-footer-inner { + padding: 5px 0; + border-top:1px solid #DEDEDE; +} + #elgg-footer-contents, #elgg-footer-contents a, #elgg-footer-contents p { diff --git a/views/default/layouts/one_column.php b/views/default/layouts/one_column.php index e3189a309..84a304e14 100644 --- a/views/default/layouts/one_column.php +++ b/views/default/layouts/one_column.php @@ -8,9 +8,9 @@ * @uses $vars['content'] Content string */ ?> -<div class="elgg-body"> - <div class="elgg-layout elgg-center elgg-width-classic clearfix"> - <?php echo $vars['content']; ?> - <?php echo $vars['area1']; ?> +<div class="elgg-layout-one_column elgg-center elgg-width-classic clearfix"> + <div class="elgg-body"> + <?php echo $vars['content']; ?> + <?php echo $vars['area1']; ?> </div> </div>
\ No newline at end of file diff --git a/views/default/layouts/one_column_with_sidebar.php b/views/default/layouts/one_column_with_sidebar.php index daeb26cac..e408c6c1c 100644 --- a/views/default/layouts/one_column_with_sidebar.php +++ b/views/default/layouts/one_column_with_sidebar.php @@ -10,20 +10,22 @@ */ ?> -<div id="elgg-sidebar" class="elgg-aside"> - <?php - echo elgg_view('page_elements/sidebar', $vars); - ?> -</div> - -<div id="elgg-main" class="elgg-body"> - <?php - // @todo deprecated so remove in Elgg 2.0 - if (isset($vars['area1'])) { - echo $vars['area1']; - } - if (isset($vars['content'])) { - echo $vars['content']; - } - ?> +<div class="elgg-layout-sidebar elgg-center elgg-width-classic clearfix"> + <div class="elgg-sidebar elgg-aside"> + <?php + echo elgg_view('page_elements/sidebar', $vars); + ?> + </div> + + <div class="elgg-main elgg-body"> + <?php + // @todo deprecated so remove in Elgg 2.0 + if (isset($vars['area1'])) { + echo $vars['area1']; + } + if (isset($vars['content'])) { + echo $vars['content']; + } + ?> + </div> </div> diff --git a/views/default/layouts/two_sidebar.php b/views/default/layouts/two_sidebar.php new file mode 100644 index 000000000..26fb64920 --- /dev/null +++ b/views/default/layouts/two_sidebar.php @@ -0,0 +1,42 @@ +<?php +/** + * Elgg 2 sidebar layout + * + * @package Elgg + * @subpackage Core + * + * @uses $vars['content'] The content string for the main column + * @uses $vars['sidebar'] Optional content that is displayed in the sidebar + * @uses $vars['sidebar-alt'] Optional content that is displayed in the alternate sidebar + */ +?> + +<div class="elgg-layout-two-sidebar elgg-center elgg-width-classic clearfix"> + <div class="elgg-sidebar elgg-aside"> + <?php + echo elgg_view('page_elements/sidebar', $vars); + ?> + </div> + <div class="elgg-sidebar-alt elgg-aside"> + <?php + //$params = $vars; + //$params['sidebar'] = $vars['sidebar-alt']; + $params = array( + 'sidebar' => elgg_view('layout_elements/module', array('title' => 'Testing', 'body' => 'Hello, world!')) + ); + echo elgg_view('page_elements/sidebar', $params); + ?> + </div> + + <div class="elgg-main elgg-body"> + <?php + // @todo deprecated so remove in Elgg 2.0 + if (isset($vars['area1'])) { + echo $vars['area1']; + } + if (isset($vars['content'])) { + echo $vars['content']; + } + ?> + </div> +</div> diff --git a/views/default/page_elements/content.php b/views/default/page_elements/content.php index 946237828..14292ce59 100644 --- a/views/default/page_elements/content.php +++ b/views/default/page_elements/content.php @@ -7,9 +7,7 @@ $body = elgg_get_array_value('body', $vars, ''); echo <<<HTML -<div id="elgg-page-body" class="elgg-body"> - <div id="elgg_page-body-inner" class="elgg-inner elgg-center elgg-width-classic clearfix"> - $body - </div> +<div id="elgg-page-body"> + $body </div> HTML; diff --git a/views/default/page_elements/footer.php b/views/default/page_elements/footer.php index 0e417e030..42cb6a2fc 100644 --- a/views/default/page_elements/footer.php +++ b/views/default/page_elements/footer.php @@ -9,8 +9,8 @@ */ ?> -<div id="elgg-page-footer" class="elgg-footer"> - <div id="elgg-page-footer-inner" class="elgg-inner elgg-center elgg-width-classic clearfix"> +<div id="elgg-page-footer"> + <div id="elgg-page-footer-inner" class="elgg-center elgg-width-classic clearfix"> <?php echo elgg_view('footer/links'); ?> <a href="http://www.elgg.org" class="right"> <img src="<?php echo elgg_get_site_url(); ?>_graphics/powered_by_elgg_badge_drk_bckgnd.gif" alt="Powered by Elgg" /> diff --git a/views/default/page_elements/header.php b/views/default/page_elements/header.php index f6d158f06..476919591 100644 --- a/views/default/page_elements/header.php +++ b/views/default/page_elements/header.php @@ -5,8 +5,8 @@ **/ ?> -<div id="elgg-page-header" class="elgg-header"> - <div id="elgg-page-header-inner" class="elgg-inner elgg-center elgg-width-classic"> +<div id="elgg-page-header"> + <div id="elgg-page-header-inner" class="elgg-center elgg-width-classic"> <?php // link back to main site. echo elgg_view('page_elements/header_logo', $vars); diff --git a/views/default/page_elements/header_logo.php b/views/default/page_elements/header_logo.php index c782310f0..6ae6a0fab 100644 --- a/views/default/page_elements/header_logo.php +++ b/views/default/page_elements/header_logo.php @@ -2,9 +2,11 @@ /** * Elgg header logo * The logo to display in elgg-header. - **/ + */ ?> -<h1><a href="<?php echo elgg_get_site_url(); ?>"> -<span class='network-title'><?php echo $vars['config']->sitename; ?></span> -</a></h1> +<h1> + <a href="<?php echo elgg_get_site_url(); ?>"> + <span class='network-title'><?php echo $vars['config']->sitename; ?></span> + </a> +</h1> diff --git a/views/default/page_elements/main_header.php b/views/default/page_elements/main_header.php deleted file mode 100644 index 438a6c432..000000000 --- a/views/default/page_elements/main_header.php +++ /dev/null @@ -1,27 +0,0 @@ -<?php -/** - * Header for main module - * - * @uses string $vars['type'] The section type. Should be the same as the page handler. Used for generating URLs. - */ - -$type = $vars['type']; -$username = get_loggedin_user()->username; - -$title = elgg_echo($type); - -$new_button = ''; -if (isloggedin()) { - $new_link = elgg_get_array_value('new_link', $vars, "pg/$type/$username/new"); - $params = array( - 'href' => $new_link = elgg_normalize_url($new_link), - 'text' => elgg_echo("$type:new"), - 'class' => 'action-button right', - ); - $new_button = elgg_view('output/url', $params); -} - -echo <<<HTML -<h2 class="elgg-module-heading">$title</h2> -$new_button -HTML; diff --git a/views/default/page_elements/main_module.php b/views/default/page_elements/main_module.php deleted file mode 100644 index 388a500fe..000000000 --- a/views/default/page_elements/main_module.php +++ /dev/null @@ -1,5 +0,0 @@ -<?php - -$vars['class'] = 'elgg-module-maincontent'; -$vars['header_class'] = 'elgg-maincontent-header clearfix'; -echo elgg_view_layout('module', $vars);
\ No newline at end of file diff --git a/views/default/page_elements/main_nav.php b/views/default/page_elements/main_nav.php deleted file mode 100644 index 0c267b3f2..000000000 --- a/views/default/page_elements/main_nav.php +++ /dev/null @@ -1,32 +0,0 @@ -<?php - -// page handler type -$type = $vars['type']; - -$username = get_loggedin_user()->username; - -// so we know if the user is looking at their own, everyone's or all friends -$filter_context = $vars['context']; - -// generate a list of default tabs -$default_tabs = array( - 'all' => array( - 'title' => elgg_echo('all'), - 'url' => (isset($vars['all_link'])) ? $vars['all_link'] : "pg/$type/", - 'selected' => ($filter_context == 'everyone'), - ), - 'mine' => array( - 'title' => elgg_echo('mine'), - 'url' => (isset($vars['mine_link'])) ? $vars['mine_link'] : "pg/$type/$username", - 'selected' => ($filter_context == 'mine'), - ), - 'friend' => array( - 'title' => elgg_echo('friends'), - 'url' => (isset($vars['friend_link'])) ? $vars['friend_link'] : "pg/$type/$username/friends", - 'selected' => ($filter_context == 'friends'), - ), -); - -// determine if using default or overwritten tabs -$tabs = elgg_get_array_value('tabs', $vars, $default_tabs); -echo elgg_view('navigation/tabs', array('tabs' => $tabs));
\ No newline at end of file diff --git a/views/default/page_elements/topbar.php b/views/default/page_elements/topbar.php index 0ccfc15c6..0f7b8f467 100644 --- a/views/default/page_elements/topbar.php +++ b/views/default/page_elements/topbar.php @@ -6,8 +6,8 @@ $user = get_loggedin_user(); if (($user instanceof ElggUser) && ($user->guid > 0)) { - echo '<div id="elgg-topbar">'; - echo '<div id="elgg-topbar-inner" class="elgg-inner">'; + echo '<div id="elgg-page-topbar">'; + echo '<div id="elgg-page-topbar-inner">'; // Elgg logo echo '<a href="http://www.elgg.org">'; |