diff options
author | cash <cash@36083f99-b078-4883-b0ff-0f9b5a30f544> | 2010-12-14 22:07:38 +0000 |
---|---|---|
committer | cash <cash@36083f99-b078-4883-b0ff-0f9b5a30f544> | 2010-12-14 22:07:38 +0000 |
commit | b5aed25425ff58d544726f97d3cca0ef142f8c94 (patch) | |
tree | 3ac2467d223c274f55ceb26547d785934ca9ee19 /views/default/css/elements | |
parent | 7caac9640259aacabbf19c22f7cbbf77ae97b4e3 (diff) | |
download | elgg-b5aed25425ff58d544726f97d3cca0ef142f8c94.tar.gz elgg-b5aed25425ff58d544726f97d3cca0ef142f8c94.tar.bz2 |
moving more css into the skin view - including page layout information
git-svn-id: http://code.elgg.org/elgg/trunk@7621 36083f99-b078-4883-b0ff-0f9b5a30f544
Diffstat (limited to 'views/default/css/elements')
-rw-r--r-- | views/default/css/elements/core.php | 8 | ||||
-rw-r--r-- | views/default/css/elements/layout.php | 69 | ||||
-rw-r--r-- | views/default/css/elements/page_layout.php | 222 | ||||
-rw-r--r-- | views/default/css/elements/skin.php | 148 | ||||
-rw-r--r-- | views/default/css/elements/typography.php | 12 |
5 files changed, 229 insertions, 230 deletions
diff --git a/views/default/css/elements/core.php b/views/default/css/elements/core.php index 65c5f2a2e..f46ec11d9 100644 --- a/views/default/css/elements/core.php +++ b/views/default/css/elements/core.php @@ -9,11 +9,6 @@ /* *************************************** Core *************************************** */ -body { - font-size: 80%; - line-height: 1.4em; - font-family: "Lucida Grande",Arial,Tahoma,Verdana,sans-serif; -} a:hover, a.selected { text-decoration: underline; @@ -45,8 +40,6 @@ dd { margin: 0 0 1em 1em; } pre, code { - font-family:Monaco,"Courier New",Courier,monospace; - font-size:12px; background:#EBF5FF; color:#000000; overflow:auto; @@ -69,7 +62,6 @@ pre { blockquote { padding:3px 15px; margin:0px 0 15px 0; - line-height:1.3em; background:#EBF5FF; border:none; -webkit-border-radius: 4px; diff --git a/views/default/css/elements/layout.php b/views/default/css/elements/layout.php new file mode 100644 index 000000000..945a4a951 --- /dev/null +++ b/views/default/css/elements/layout.php @@ -0,0 +1,69 @@ +<?php +/** + * Reusable layout objects and elements + * + * @package Elgg.Core + * @subpackage UI + */ +?> + +/** + * 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; + 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_inner { +} + +.elgg-footer { +} + +.elgg-media { + padding: 3px 0; +} + +.elgg-media .elgg-pict { + float: left; + margin-right: 5px; +} +.elgg-media .elgg-pict-alt { + float: right; + margin-left: 5px; +} + +.elgg-list { + border-top: 1px dotted #CCCCCC; + margin: 5px 0; + clear: both; +} + +.elgg-list li { + border-bottom: 1px dotted #CCCCCC; +} + +.elgg-center { + margin: 0 auto; +} + +.elgg-width-classic { + width: 990px; +} diff --git a/views/default/css/elements/page_layout.php b/views/default/css/elements/page_layout.php deleted file mode 100644 index 24445ea01..000000000 --- a/views/default/css/elements/page_layout.php +++ /dev/null @@ -1,222 +0,0 @@ -<?php -/** - * Page Layout - * - * @package Elgg.Core - * @subpackage UI - */ -?> -/* *************************************** - Page Layout -*************************************** */ - -/* 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; - 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-sidebar .elgg-module { - margin-top: 20px; -} - -.elgg_inner { -} - -.elgg-sidebar .elgg-module .elgg-head { - border-bottom: 1px solid #CCCCCC; - margin-bottom: 5px; - padding-bottom: 5px; -} - -.elgg-footer { -} - -.elgg-media { - padding: 3px 0; -} - -.elgg-media .elgg-pict { - float: left; - margin-right: 5px; -} -.elgg-media .elgg-pict-alt { - float: right; - margin-left: 5px; -} - - - -.elgg-list { - border-top: 1px dotted #CCCCCC; - margin: 5px 0; - clear: both; -} - -.elgg-list li { - border-bottom: 1px dotted #CCCCCC; -} - - -.elgg-center { - margin: 0 auto; -} - -.elgg-width-classic { - width: 990px; -} - -/* *************************************** - ELGG TOPBAR -*************************************** */ -.elgg-page-topbar { - background: #333333 url(<?php echo elgg_get_site_url(); ?>_graphics/toptoolbar_background.gif) repeat-x top left; - border-bottom: 1px solid #000000; - min-width: 998px; - position: relative; - height: 24px; - z-index: 9000; -} -.elgg-page-header .elgg-inner { - width: 990px; - margin: 0 auto; - height: 90px; - position: relative; -} -.elgg-page-topbar .elgg-inner { - padding: 2px 10px 2px 8px; -} -.elgg-page-topbar a { - color: #eeeeee; - float: left; - margin: 2px 30px 0 0; - line-height: 1.1em; -} -.elgg-page-topbar a.alt { - float: right; - margin: 2px 0 0 30px; -} -.elgg-page-topbar a:hover { - color: #71cbff; - text-decoration: none; -} -/* elgg logo and user avatar need to be adjusted slightly */ -.elgg-page-topbar img { - margin-top: -1px; -} - -/* *************************************** - HEADER -*************************************** */ -.elgg-page-header { - x-overflow: hidden; - position: relative; - background-color: #4690D6; - background-image: url(<?php echo elgg_get_site_url(); ?>_graphics/header_shadow.png); - background-repeat: repeat-x; - background-position: bottom left; -} -.elgg-page-header h1 a { - font-size: 2em; - line-height: 1.4em; - color: white; - font-style: italic; - font-family: Georgia, times, serif; - text-shadow: 1px 2px 4px #333333; - text-decoration: none; -} -/* *************************************** - BODY -*************************************** */ - -.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; - 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; -} - -.elgg-main-header { - border-bottom: 1px solid #CCCCCC; - padding-bottom: 3px; -} - -.elgg-main-heading { - float: left; - max-width: 530px; - margin-right: 10px; -} - -/* *************************************** - FOOTER -*************************************** */ -.elgg-page-footer { - position: relative; - z-index: 999; -} -.elgg-page-footer .elgg-inner { - width: 990px; - margin: 0 auto; - padding: 5px 0; - border-top: 1px solid #DEDEDE; -} - -.elgg-page-footer .elgg-inner, -.elgg-page-footer .elgg-inner a, -.elgg-page-footer .elgg-inner p { - color:#999999; -} -.elgg-page-footer .elgg-inner a:hover { - color:#666666; -} -.elgg-page-footer .elgg-inner p { - margin:0; -} diff --git a/views/default/css/elements/skin.php b/views/default/css/elements/skin.php index a8f8db7ba..a37b5a584 100644 --- a/views/default/css/elements/skin.php +++ b/views/default/css/elements/skin.php @@ -2,6 +2,10 @@ /** * Skin of the theme * + * - theme chrome + * - page layout + * - icons + * * @package Elgg.Core * @subpackage UI */ @@ -20,9 +24,153 @@ a:hover, a.selected { color: #555555; } + +/* *************************************** + PAGE LAYOUT +*************************************** */ + +/***** TOPBAR ******/ + +.elgg-page-topbar { + background: #333333 url(<?php echo elgg_get_site_url(); ?>_graphics/toptoolbar_background.gif) repeat-x top left; + border-bottom: 1px solid #000000; + min-width: 998px; + position: relative; + height: 24px; + z-index: 9000; +} +.elgg-page-header .elgg-inner { + width: 990px; + margin: 0 auto; + height: 90px; + position: relative; +} +.elgg-page-topbar .elgg-inner { + padding: 2px 10px 2px 8px; +} +.elgg-page-topbar a { + color: #eeeeee; + float: left; + margin: 2px 30px 0 0; + line-height: 1.1em; +} +.elgg-page-topbar a.alt { + float: right; + margin: 2px 0 0 30px; +} +.elgg-page-topbar a:hover { + color: #71cbff; + text-decoration: none; +} +/* elgg logo and user avatar need to be adjusted slightly */ +.elgg-page-topbar img { + margin-top: -1px; +} + +/***** PAGE HEADER ******/ + +.elgg-page-header { + x-overflow: hidden; + position: relative; + background-color: #4690D6; + background-image: url(<?php echo elgg_get_site_url(); ?>_graphics/header_shadow.png); + background-repeat: repeat-x; + background-position: bottom left; +} +.elgg-page-header h1 a { + font-size: 2em; + line-height: 1.4em; + color: white; + font-style: italic; + font-family: Georgia, times, serif; + text-shadow: 1px 2px 4px #333333; + text-decoration: none; +} + +/***** PAGE BODY ******/ + +.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; + 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; +} +.elgg-main-header { + border-bottom: 1px solid #CCCCCC; + padding-bottom: 3px; +} +.elgg-main-heading { + float: left; + max-width: 530px; + margin-right: 10px; +} + +/***** PAGE SIDEBAR ******/ + +.elgg-sidebar .elgg-module { + margin-top: 20px; +} +.elgg-sidebar .elgg-module .elgg-head { + border-bottom: 1px solid #CCCCCC; + margin-bottom: 5px; + padding-bottom: 5px; +} + +/***** PAGE FOOTER ******/ + +.elgg-page-footer { + position: relative; + z-index: 999; +} +.elgg-page-footer .elgg-inner { + width: 990px; + margin: 0 auto; + padding: 5px 0; + border-top: 1px solid #DEDEDE; +} +.elgg-page-footer .elgg-inner, +.elgg-page-footer .elgg-inner a, +.elgg-page-footer .elgg-inner p { + color: #999999; +} +.elgg-page-footer .elgg-inner a:hover { + color: #666666; +} +.elgg-page-footer .elgg-inner p { + margin: 0; +} + /* *************************************** ICONS *************************************** */ + .elgg-icon { background: transparent url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png) no-repeat left; width: 16px; diff --git a/views/default/css/elements/typography.php b/views/default/css/elements/typography.php index 869b74bf8..ac98c87f1 100644 --- a/views/default/css/elements/typography.php +++ b/views/default/css/elements/typography.php @@ -9,3 +9,15 @@ /* *************************************** Typography *************************************** */ +body { + font-size: 80%; + line-height: 1.4em; + font-family: "Lucida Grande",Arial,Tahoma,Verdana,sans-serif; +} +pre, code { + font-family:Monaco,"Courier New",Courier,monospace; + font-size:12px; +} +blockquote { + line-height:1.3em; +}
\ No newline at end of file |