themes lib MDL-24895 Multiple fixes to better handle overflow.

Major tasks undertaken in this patch:
* New format_text argument, overflowdiv.
* New page layout Report.
* Review of all format_text calls.
* Added support for the report layout to all themes.
* Changed forum post display from tables to divs.
This commit is contained in:
Sam Hemelryk 2010-11-05 02:53:47 +00:00
parent 2412f8b882
commit 367a75fae4
125 changed files with 3366 additions and 2062 deletions

View file

@ -36,8 +36,8 @@ $THEME->name = 'sky_high';
$THEME->parents = array(
'canvas',
'base',
'canvas',
'base',
);
/////////////////////////////////////////////////////
@ -52,9 +52,9 @@ $THEME->parents = array(
$THEME->sheets = array(
'core',
'pagelayout',
'menu'
'core',
'pagelayout',
'menu'
);
////////////////////////////////////////////////////
@ -63,12 +63,12 @@ $THEME->sheets = array(
////////////////////////////////////////////////////
$THEME->parents_exclude_sheets = array(
'base'=>array(
'pagelayout',
),
'canvas'=>array(
'pagelayout',
),
'base'=>array(
'pagelayout',
),
'canvas'=>array(
'pagelayout',
),
);
@ -154,7 +154,7 @@ $THEME->layouts = array(
'options' => array('nofooter'=>true, 'nonavbar'=>true),
),
'embedded' => array(
'theme' => 'canvas',
'theme' => 'canvas',
'file' => 'embedded.php',
'regions' => array(),
'options' => array('nofooter'=>true, 'nonavbar'=>true),
@ -165,7 +165,11 @@ $THEME->layouts = array(
'regions' => array(),
'options' => array('nofooter'=>true, 'nonavbar'=>false, 'noblocks'=>true),
),
'report' => array(
'file' => 'general.php',
'regions' => array('side-pre'),
'defaultregion' => 'side-pre',
)
);
///////////////////////////////////////////////////////////////

View file

@ -0,0 +1,136 @@
<?php
$hassidepre = (empty($PAGE->layout_options['noblocks']) && $PAGE->blocks->region_has_content('side-pre', $OUTPUT));
$hasnavbar = (empty($PAGE->layout_options['nonavbar']) && $PAGE->has_navbar());
$showsidepre = ($hassidepre && !$PAGE->blocks->region_completely_docked('side-pre', $OUTPUT));
$custommenu = $OUTPUT->custom_menu();
$hascustommenu = (empty($PAGE->layout_options['nocustommenu']) && !empty($custommenu));
$bodyclasses = array();
if (!$showsidepre) {
$bodyclasses[] = 'content-only';
}
if ($hassidepre) {
$bodyclasses[] = 'background';
}
if (!empty($PAGE->theme->settings->logo)) {
$logourl = $PAGE->theme->settings->logo;
} else {
$logourl = NULL;
}
if (!empty($PAGE->theme->settings->footnote)) {
$footnote = $PAGE->theme->settings->footnote;
} else {
$footnote = '<!-- There was no custom footnote set -->';
}
echo $OUTPUT->doctype() ?>
<html <?php echo $OUTPUT->htmlattributes() ?>>
<head>
<title><?php echo $PAGE->title ?></title>
<link rel="shortcut icon" href="<?php echo $OUTPUT->pix_url('favicon', 'theme')?>" />
<meta name="description" content="<?php echo strip_tags(format_text($SITE->summary, FORMAT_HTML)) ?>" />
<?php echo $OUTPUT->standard_head_html() ?>
</head>
<body id="<?php echo $PAGE->bodyid ?>" class="<?php echo $PAGE->bodyclasses.' '.join(' ', $bodyclasses) ?>">
<?php echo $OUTPUT->standard_top_of_body_html() ?>
<div id="page">
<div id="wrapper" class="clearfix">
<!-- START OF HEADER -->
<div id="page-header" class="clearfix">
<div id="page-header-wrapper">
<?php if($logourl == NULL) { ?>
<h1 class="headermain">
<?php echo $PAGE->heading ?>
</h1>
<?php } else { ?>
<img class="logo" src="<?php echo $logourl;?>" alt="Custom logo here" /><h1 class="headerwlogo">- <?php echo $PAGE->heading ?></h1>
<?php } ?>
<div class="headermenu">
<?php
echo $OUTPUT->login_info();
if (!empty($PAGE->layout_options['langmenu'])) {
echo $OUTPUT->lang_menu();
}
echo $PAGE->headingmenu
?>
</div>
</div>
</div>
<!-- END OF HEADER -->
<!-- START OF CONTENT -->
<?php if ($hascustommenu) { ?>
<div id="custommenu"><?php echo $custommenu; ?></div>
<?php } ?>
<div class="navbar clearfix">
<?php if ($hasnavbar) { ?>
<div class="breadcrumb"><?php echo $OUTPUT->navbar(); ?></div>
<div class="navbutton"> <?php echo $PAGE->button; ?></div>
<?php } ?>
</div>
<div id="page-content-wrapper">
<div id="page-content">
<div id="region-main-box">
<div id="region-post-box">
<div id="region-main-wrap">
<div id="region-main">
<div class="region-content">
<?php echo core_renderer::MAIN_CONTENT_TOKEN ?>
</div>
</div>
</div>
<?php if ($hassidepre) { ?>
<div id="region-pre" class="block-region">
<div class="region-content">
<?php echo $OUTPUT->blocks_for_region('side-pre') ?>
</div>
</div>
<?php } ?>
</div>
</div>
</div>
</div>
<!-- END OF CONTENT -->
<!-- START OF FOOTER -->
<div id="page-footer">
<div class="footnote"><?php echo $footnote; ?></div>
<?php
echo $OUTPUT->login_info();
echo $OUTPUT->standard_footer_html();
?>
</div>
<!-- END OF FOOTER -->
</div>
</div>
<p class="helplink">
<?php echo page_doc_link(get_string('moodledocslink')) ?>
</p><center>
<?php
echo $OUTPUT->home_link();
echo $OUTPUT->standard_end_of_body_html() ?>
</center>
</body>
</html>

View file

@ -8,165 +8,154 @@
.pagelayout-admin,
.pagelayout-mydashboard,
.pagelayout-mypublic,
.pagelayout-login
{
background:url([[pix:theme|body]]) top left repeat-x #dcecf9;
.pagelayout-login,
.pagelayout-report {
background:url([[pix:theme|body]]) top left repeat-x #dcecf9;
}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,dl,input,textarea
{
font-family:Arial, Helvetica, sans-serif;
color:#333;
body,h1,h2,h3,h4,h5,h6,p,ul,ol,dl,input,textarea {
font-family:Arial, Helvetica, sans-serif;
color:#333;
}
#wrapper
{
background:#fff;
margin:20px 5% 0px 5%;
padding:0px;
border:1px solid #c1bc9d;
#wrapper {
background:#fff;
margin:20px 5% 0px 5%;
padding:0px;
border:1px solid #c1bc9d;
}
#page-content-wrapper {
padding: 0px;
padding-top: 0px;
background: #ebf6f9;
border-top: 1px solid #ccc;
padding: 0px;
padding-top: 0px;
background: #ebf6f9;
border-top: 1px solid #ccc;
}
.pagelayout-frontpage #page-content #region-main-box #region-post-box {
padding-top: 0;
}
a:link, a:visited
{
color: #003466;
text-decoration: none;
a:link, a:visited {
color: #003466;
text-decoration: none;
}
a:hover, a:active, a:focus
{
color: #4785ac;
text-decoration: none;
a:hover, a:active, a:focus {
color: #4785ac;
text-decoration: none;
}
#region-main-box {
border: 0px none;
border: 0px none;
}
#newmessageoverlay {
background: #f9f9d4;
margin-left: 55px;
margin-top: 10px;
padding: 10px;
border-right: 2px solid #5ea4dc;
border-bottom: 2px solid #5ea4dc;
filter:alpha(opacity=90);
-moz-opacity:0.9;
-khtml-opacity: 0.9;
opacity: 0.9;
background: #f9f9d4;
margin-left: 55px;
margin-top: 10px;
padding: 10px;
border-right: 2px solid #5ea4dc;
border-bottom: 2px solid #5ea4dc;
filter:alpha(opacity=90);
-moz-opacity:0.9;
-khtml-opacity: 0.9;
opacity: 0.9;
}
#newmessageoverlay #newmessagelinks {
border-top: 1px dashed #ccc;
padding-top: 5px;
margin-top: 5px;
border-top: 1px dashed #ccc;
padding-top: 5px;
margin-top: 5px;
}
#newmessageoverlay a {
font-weight: bold;
font-style: italic;
font-weight: bold;
font-style: italic;
}
/* @end */
/* @group Header */
#page-header
{
background:#97d3f4 url([[pix:theme|header]]) no-repeat top right;
margin-bottom: 0px;
height: 80px;
border-bottom: 1px solid #fff;
}
#page-header .sitelogo {
#page-header {
background:#97d3f4 url([[pix:theme|header]]) no-repeat top right;
margin-bottom: 0px;
height: 80px;
border-bottom: 1px solid #fff;
}
.logo {
height: 50px;
float: left;
padding-left: 10px;
padding-top: 18px;
padding-right: 0px;
height: 50px;
float: left;
padding-left: 10px;
padding-top: 18px;
padding-right: 0px;
}
.headermain {
font-weight:normal;
margin:.8em 0.5em 0.75em;
font-weight:normal;
margin:.8em 0.5em 0.75em;
}
h1.headermain
{
color: #006699;
font-weight: normal;
font-size: 1.85em !important;
padding-left: 0px;
margin-top: 30px;
h1.headermain {
color: #006699;
font-weight: normal;
font-size: 1.85em !important;
padding-left: 0px;
margin-top: 30px;
}
h1.headerwlogo {
color: #006699;
font-weight: normal;
font-size: 1.45em !important;
display: block;
float: left;
margin-top: 35px;
color: #006699;
font-weight: normal;
font-size: 1.45em !important;
display: block;
float: left;
margin-top: 35px;
}
.tagline
{
color: #006699 !important;
padding-top: 7px;
font-size: .45em;
text-transform: uppercase;
.tagline {
color: #006699 !important;
padding-top: 7px;
font-size: .45em;
text-transform: uppercase;
}
.headermenu {
font-size: .9em;
font-size: .9em;
}
p.helplink {
text-align: center;
text-align: center;
}
/* @end */
/* @group Navbar */
.navbar {
background: #fff;
height: 20px;
padding-top: 5px;
padding-bottom: 4px;
margin-left: 4px;
margin-right: 4px;
background: #fff;
height: 20px;
padding-top: 5px;
padding-bottom: 4px;
margin-left: 4px;
margin-right: 4px;
}
.breadcrumb {
text-transform: uppercase;
font-weight: bold;
font-size: .9em;
margin-left: 7px;
text-transform: uppercase;
font-weight: bold;
font-size: .9em;
margin-left: 7px;
}
.breadcrumb a {
color: #336699 !important;
color: #336699 !important;
}
.breadcrumb ul {
color: #666;
color: #666;
}
.arrow, .arrow_button input {
color: #aaa;
color: #aaa;
}
/* @end */
@ -174,79 +163,75 @@ p.helplink {
/* @group Blocks */
.block_action {
padding:0px;
padding:0px;
}
.block .content {
background:#c7eafd;
border:1px solid #867f6a;
background:#c7eafd;
border:1px solid #867f6a;
}
.block .minicalendar td,
.block .minicalendar th {
border: none;
border: none;
}
.block
{
border: 0px none;
.block {
border: 0px none;
}
.block .header
{
border: 1px solid #ccc;
background: #fff;
padding-left:5px;
.block .header {
border: 1px solid #ccc;
background: #fff;
padding-left:5px;
}
.block .title h2
{
text-transform: uppercase;
padding-bottom: 0px;
color: #336699;
font-size: .95em;
.block .title h2 {
text-transform: uppercase;
padding-bottom: 0px;
color: #336699;
font-size: .95em;
}
.block .content
{
background: #fff;
border: 1px solid #ccc;
padding: 10px;
margin-top: -2px;
.block .content {
background: #fff;
border: 1px solid #ccc;
padding: 10px;
margin-top: -2px;
}
.block_calendar_month table.minicalendar.calendartable td,.block_calendar_month table.minicalendar.calendartable th {
border: none !important;
border: none !important;
}
/* @end */
/* @group Course */
.headingblock {
border: 0px none;
border-bottom: 1px solid #98bcd6;
padding-bottom: 0px;
padding-top: 5px;
color: #336699;
font-size: 1.8em;
font-weight: normal;
border: 0px none;
border-bottom: 1px solid #98bcd6;
padding-bottom: 0px;
padding-top: 5px;
color: #336699;
font-size: 1.8em;
font-weight: normal;
}
.completionprogress {
color: #336699;
text-transform: uppercase;
font-size: .85em;
color: #336699;
text-transform: uppercase;
font-size: .85em;
}
.course-content ul.topics li.section,
.course-content ul.weeks li.section {
border: 1px solid #ccc;
margin-right: 20px;
border: 1px solid #ccc;
margin-right: 20px;
}
.path-course-view li.activity {
border-bottom: 1px dashed #c3daf9;
padding-top: 10px;
padding-bottom: 5px;
border-bottom: 1px dashed #c3daf9;
padding-top: 10px;
padding-bottom: 5px;
}
/* @end */
@ -254,98 +239,107 @@ p.helplink {
/* @group Dock */
body.has_dock {
margin:0;
margin:0;
}
#dock {
border-right: 0px none;
background: url([[pix:theme|dock]]) repeat-y top right #fff;
border-right: 0px none;
background: url([[pix:theme|dock]]) repeat-y top right #fff;
}
#dock .controls {
bottom:auto;
background-color:#5ea4dc;
bottom:auto;
background-color:#5ea4dc;
}
#dock .dockeditem {
background: url([[pix:theme|dock]]) repeat-y top right #fff;
padding:2px;
padding-right:0px;
background: url([[pix:theme|dock]]) repeat-y top right #fff;
padding:2px;
padding-right:0px;
}
#dock .dockedtitle {
border-width:0;
border-width:0;
}
#dock .dockedtitle h2 {
margin:0;
padding:10px 3px;
margin:0;
padding:10px 3px;
}
#dock .dockedtitle.activeitem {
background-color:#407ea8;
border-top: 1px solid #6f6856;
background-color:#407ea8;
border-top: 1px solid #6f6856;
}
#dockeditempanel {
background-color:#5ea4dc;
margin-left:0px;
border-left: none;
background-color:#5ea4dc;
margin-left:0px;
border-left: none;
}
#dockeditempanel .dockeditempanel_content {
border-color:#6f6856;
border-left: none;
border-color:#6f6856;
border-left: none;
}
#dockeditempanel .dockeditempanel_hd {
background: #407ea8;
border-width:0;
background: #407ea8;
border-width:0;
}
#dockeditempanel .dockeditempanel_hd h2 {
font-size:1em;
color:#fff;
font-size:1em;
color:#fff;
}
/* @end */
/* @group Footer */
#page-footer{
padding: 20px 0 30px;
clear: both;
background: url([[pix:theme|footer]]) no-repeat top right #dfdfdf;
margin-top: 0px;
border: 1px solid #98bcd6;
border-top: 5px solid #98bcd6;
height: 75px;
padding: 20px 0 30px;
clear: both;
background: url([[pix:theme|footer]]) no-repeat top right #dfdfdf;
margin-top: 0px;
border: 1px solid #98bcd6;
border-top: 5px solid #98bcd6;
height: 75px;
}
.footnote {
float: left;
padding-top: 80px;
padding-left: 20px;
float: left;
padding-top: 80px;
padding-left: 20px;
}
#page-footer .logininfo {
padding-top: 80px;
text-align: right;
padding-top: 80px;
text-align: right;
}
/* @end */
/* @group Forums */
.forumpost {
border: 1px solid #ccc;
border: 1px solid #ccc;
background: #c7eafd;
}
.forumpost .left {
background: #c7eafd;
background: #c7eafd;
}
.forumpost .topic {
border-bottom: 2px solid #94b9d3;
background: #d6e2f2;
.forumpost .header {
background: #d6e2f2;
}
.forumpost .no-overflow {
border-top: 2px solid #94b9d3;background: #FFF;
}
.forumpost .content .posting {
padding:4px;
}
.forumpost .options {
background: #FFF;
padding:4px;
}
@ -355,5 +349,4 @@ body.has_dock {
[[setting:customcss]]
/* @end */
/* @end */

View file

@ -2,93 +2,93 @@
/*********************************************************************************************
left column: 230px
right column: 330px
padding left/right column: 10px
padding center column: 30px
left column: 230px
right column: 330px
padding left/right column: 10px
padding center column: 30px
**********************************************************************************************/
body {
margin:auto 0px;
width:auto;
margin:auto 0px;
width:auto;
}
#page {
width:100%;
max-width: 1600px;
overflow:hidden;
width:100%;
max-width: 1600px;
overflow:hidden;
margin:0 auto;
}
#page-content {
clear: both;
overflow: hidden;
position: relative;
width: 100%;
clear: both;
overflow: hidden;
position: relative;
width: 100%;
}
/* @group Pre and Post */
#page-content #region-main-box {
float: left;
margin-left: -[[setting:regionwidth]];
position: relative;
width: 200%;
right: 100%;
float: left;
margin-left: -[[setting:regionwidth]];
position: relative;
width: 200%;
right: 100%;
}
#page-content #region-main-box #region-post-box {
float: left;
margin-left: -[[setting:regionwidth]];
width: 100%;
border-right: 2px solid #98bcd6;
background: url([[pix:theme|top_bg]]) repeat-x top #fff;
#page-content #region-post-box {
float: left;
margin-left: -[[setting:regionwidth]];
width: 100%;
border-right: 2px solid #98bcd6;
background: url([[pix:theme|top_bg]]) repeat-x top #fff;
}
#page-content #region-main-box #region-post-box #region-main-wrap {
float: left;
width: 50%;
margin-left: 20px;
#page-content #region-main-wrap {
float: left;
width: 50%;
}
#page-content #region-main-box #region-post-box #region-main-wrap #region-main {
overflow: hidden;
position: relative;
margin-left: [[setting:regionwidthdouble]];
left: 100%;
#page-content #region-main {
overflow: hidden;
position: relative;
margin-left: [[setting:regionwidthdouble]];
left: 100%;
}
#page-content #region-main-box #region-post-box #region-pre {
float: right;
position: relative;
left: [[setting:leftregionwidthmargin]];
width: [[setting:regionwidth]];
background: transparent;
#page-content #region-pre {
float: right;
position: relative;
left: [[setting:leftregionwidthmargin]];
width: [[setting:regionwidth]];
background: transparent;
}
#page-content #region-main-box #region-post-box #region-post {
float: right;
position: relative;
left: [[setting:rightregionwidthmargin]];
width: [[setting:regionwidth]];
background: transparent;
#page-content #region-post {
float: right;
position: relative;
left: [[setting:rightregionwidthmargin]];
width: [[setting:regionwidth]];
background: transparent;
}
#page-content #region-main-box #region-post-box #region-main-wrap #region-main .region-content {
overflow: hidden;
padding: 20px 40px 20px 0px;
#page-content #region-main .region-content {
overflow: hidden;
margin: 20px;
}
#page-content #region-main-box #region-post-box #region-pre .region-content,
#page-content #region-main-box #region-post-box #region-post .region-content {
overflow: hidden;
padding: 20px 10px;
#page-content #region-pre .region-content,
#page-content #region-post .region-content {
overflow: hidden;
padding: 20px 10px;
}
#page-footer {
clear: both;
float: left;
width: 100%;
clear: both;
float: left;
width: 100%;
}
@ -98,24 +98,24 @@ body {
/* @group Pre Side Only */
.side-pre-only #page-content #region-main-box {
margin-left: 0px;
margin-left: 0px;
}
.side-pre-only #page-content #region-main-box #region-post-box {
margin-left: -[[setting:regionwidth]];
.side-pre-only #page-content #region-post-box {
margin-left: -[[setting:regionwidth]];
}
.side-pre-only #page-content #region-main-box #region-post-box #region-main-wrap #region-main {
margin-left: [[setting:regionwidth]];
.side-pre-only #page-content #region-main {
margin-left: [[setting:regionwidth]];
}
.side-pre-only #page-content #region-main-box #region-post-box #region-pre {
left: [[setting:regionwidth]];
width: [[setting:regionwidth]];
.side-pre-only #page-content #region-pre {
left: [[setting:regionwidth]];
width: [[setting:regionwidth]];
}
.side-pre-only #page-content #region-main-box #region-post-box #region-post {
width: 0%;
.side-pre-only #page-content #region-post {
width: 0%;
}
@ -125,24 +125,24 @@ body {
/* @group Post Side Only */
.side-post-only #page-content #region-main-box {
margin-left: 0px;
margin-left: 0px;
}
.side-post-only #page-content #region-main-box #region-post-box {
margin-left: -[[setting:regionwidth]];
margin-left: -[[setting:regionwidth]];
}
.side-post-only #page-content #region-main-box #region-post-box #region-main-wrap #region-main {
margin-left: [[setting:regionwidth]];
margin-left: [[setting:regionwidth]];
}
.side-post-only #page-content #region-main-box #region-post-box #region-post {
left: [[setting:regionwidthdouble]];
width: [[setting:regionwidth]];
left: [[setting:regionwidthdouble]];
width: [[setting:regionwidth]];
}
.has_dock.side-post-only .page-middle #region-main-box #region-post-box #region-main-wrap #region-main {
margin-left: 200px;
margin-left: 200px;
}
@ -152,25 +152,31 @@ body {
/* @group No Blocks */
.content-only #page-content #region-main-box {
margin-left: 0px;
margin-left: 0px;
}
.content-only #page-content #region-main-box #region-post-box {
margin-left: 0px;
margin-left: 0px;
}
.content-only #page-content #region-main-box #region-post-box #region-main-wrap #region-main {
margin-left: 0px;
margin-left: 0px;
}
.content-only #page-content #region-main-box #region-post-box #region-pre {
width: 0px;
width: 0px;
}
.content-only #page-content #region-main-box #region-post-box #region-post {
width: 0px;
width: 0px;
}
/* @end */
/* @end */
.pagelayout-report #page-content #region-main {
overflow:auto;
}
.pagelayout-report #page-content #region-main .region-content {
overflow:visible;
}