Continuing work on boxxie theme
authorPatrick Malley <ptrkmkl@newschoollearning.com>
Mon, 19 Apr 2010 03:50:06 +0000 (03:50 +0000)
committerPatrick Malley <ptrkmkl@newschoollearning.com>
Mon, 19 Apr 2010 03:50:06 +0000 (03:50 +0000)
theme/boxxie/config.php
theme/boxxie/layout/frontpage.php [new file with mode: 0644]
theme/boxxie/layout/general.php
theme/boxxie/style/boilerplate.css [new file with mode: 0644]
theme/boxxie/style/pagelayout.css [new file with mode: 0644]
theme/boxxie/style/screen.css

index 48182ce..2a05f94 100644 (file)
@@ -21,7 +21,7 @@ $THEME->parents = array('base');
 ////////////////////////////////////////////////////
 
 
-$THEME->sheets = array('screen');
+$THEME->sheets = array('pagelayout', 'boilerplate', 'screen');
 
 ////////////////////////////////////////////////////
 // Name of the stylesheet(s) you've including in 
@@ -69,7 +69,7 @@ $THEME->layouts = array(
     ),
     'frontpage' => array(
         'theme' => 'boxxie',
-        'file' => 'general.php',
+        'file' => 'frontpage.php',
         'regions' => array('side-pre', 'side-post'),
         'defaultregion' => 'side-post',
     ),
diff --git a/theme/boxxie/layout/frontpage.php b/theme/boxxie/layout/frontpage.php
new file mode 100644 (file)
index 0000000..72a9f45
--- /dev/null
@@ -0,0 +1,113 @@
+<?php
+
+$hasheading = ($PAGE->heading);
+$hasnavbar = (empty($PAGE->layout_options['nonavbar']) && $PAGE->has_navbar());
+$hasfooter = (empty($PAGE->layout_options['nofooter']));
+$hassidepre = $PAGE->blocks->region_has_content('side-pre', $OUTPUT);
+$hassidepost = $PAGE->blocks->region_has_content('side-post', $OUTPUT);
+
+$bodyclasses = array();
+if ($hassidepre && !$hassidepost) {
+    $bodyclasses[] = 'side-pre-only';
+} else if ($hassidepost && !$hassidepre) {
+    $bodyclasses[] = 'side-post-only';
+} else if (!$hassidepost && !$hassidepre) {
+    $bodyclasses[] = 'content-only';
+}
+
+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')?>" />
+  <?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() ?>
+
+<?php if ($hasheading || $hasnavbar) { ?>
+
+<div id="page-wrapper">
+  <div id="page" class="clearfix">
+    
+    <div id="page-header">
+      <?php if ($PAGE->heading) { ?>
+        <h1 class="headermain"><?php echo $PAGE->heading ?></h1>
+        <div class="headermenu">
+          <?php echo $OUTPUT->login_info();
+          if (!empty($PAGE->layout_options['langmenu'])) {
+            echo $OUTPUT->lang_menu();
+          }
+          echo $PAGE->headingmenu; ?>
+        </div>
+      <?php } ?>
+    </div>
+
+      
+      <?php if ($hasnavbar) { ?>
+        <div class="navbar clearfix">
+          <div class="breadcrumb"><?php echo $OUTPUT->navbar(); ?></div>
+          <div class="navbutton"> <?php echo $PAGE->button; ?></div>
+        </div>
+      <?php } ?>
+  
+<?php } ?>
+      
+    <div id="page-content">
+      <div id="regions">
+        <div id="regions-mask">
+        
+          <div id="region-main">
+            <div id="region-main-mask">
+              <div class="region-content">
+                <?php echo core_renderer::MAIN_CONTENT_TOKEN ?>
+              </div>
+            </div>
+          </div>
+          
+          <?php if ($hassidepre) { ?>
+          <div id="region-pre">
+            <div class="region-content">
+              <?php echo $OUTPUT->blocks_for_region('side-pre') ?>
+            </div>
+          </div>
+          <?php } ?>
+          
+          <?php if ($hassidepost) { ?>
+          <div id="region-post">
+            <div class="region-content">
+              <?php echo $OUTPUT->blocks_for_region('side-post') ?>
+            </div>
+          </div>
+          <?php } ?>
+        
+        </div>
+      </div>
+    </div>
+    
+<?php if ($hasfooter) { ?>
+  
+    <div id="page-footer" class="clearfix">
+      <p class="helplink"><?php echo page_doc_link(get_string('moodledocslink')) ?></p>
+      <?php
+        echo $OUTPUT->login_info();
+        echo $OUTPUT->home_link();
+        echo $OUTPUT->standard_footer_html();
+      ?>
+    </div>
+
+<?php }
+
+if ($hasheading || $hasnavbar) { ?>
+  
+  </div> <!-- END #page -->
+</div> <!-- END #page-wrapper -->
+
+<?php } ?>
+      
+
+<?php echo $OUTPUT->standard_end_of_body_html() ?>
+</body>
+</html>
\ No newline at end of file
index 7ac5747..ddf90bc 100644 (file)
@@ -66,7 +66,7 @@ echo $OUTPUT->doctype() ?>
               </div>
             </div>
           </div>
-                
+          
           <?php if ($hassidepre) { ?>
           <div id="region-pre">
             <div class="region-content">
@@ -74,7 +74,7 @@ echo $OUTPUT->doctype() ?>
             </div>
           </div>
           <?php } ?>
-
+          
           <?php if ($hassidepost) { ?>
           <div id="region-post">
             <div class="region-content">
@@ -82,7 +82,7 @@ echo $OUTPUT->doctype() ?>
             </div>
           </div>
           <?php } ?>
-              
+        
         </div>
       </div>
     </div>
@@ -91,11 +91,7 @@ echo $OUTPUT->doctype() ?>
   
     <div id="page-footer" class="clearfix">
       <p class="helplink"><?php echo page_doc_link(get_string('moodledocslink')) ?></p>
-      <?php
-        echo $OUTPUT->login_info();
-        echo $OUTPUT->home_link();
-        echo $OUTPUT->standard_footer_html();
-      ?>
+      <?php echo $OUTPUT->login_info(); ?>
     </div>
 
 <?php }
@@ -106,7 +102,14 @@ if ($hasheading || $hasnavbar) { ?>
 </div> <!-- END #page-wrapper -->
 
 <?php } ?>
-      
+
+<?php if ($hasfooter) {
+
+  echo $OUTPUT->home_link();
+  echo $OUTPUT->standard_footer_html();
+
+} ?>
+     
 
 <?php echo $OUTPUT->standard_end_of_body_html() ?>
 </body>
diff --git a/theme/boxxie/style/boilerplate.css b/theme/boxxie/style/boilerplate.css
new file mode 100644 (file)
index 0000000..1360a61
--- /dev/null
@@ -0,0 +1,148 @@
+/* -------------------------------------------------------------- 
+  
+   Boilerplate reset.css
+   * Resets default browser CSS.
+   
+-------------------------------------------------------------- */
+
+html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
+body { line-height: 1.5; background: #fff; margin: 0; }
+table { border-collapse: collapse; border-spacing: 0; }
+caption, th, td { text-align: left; font-weight:400; }
+blockquote:before, blockquote:after, q:before, q:after { content: ""; }
+blockquote, q { quotes: "" ""; }
+a img { border: none; }
+input,textarea { margin: 0; }
+
+/* Removes Firefox imposed outline */
+a { outline: none; }
+
+/* Clearing floats without extra markup  */
+.wrapper { display: inline-block; }
+.wrapper:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
+* html .wrapper { height: 1%; }
+.wrapper { display: block; }
+
+/* -------------------------------------------------------------- 
+   
+   Boilerplate typography.css
+   * Sets up some sensible default typography.
+  
+-------------------------------------------------------------- */
+
+/* This is where you set your desired font size. The line-heights 
+   and vertical margins are automatically calculated from this. 
+   The percentage is of 16px (0.75 * 16px = 12px). */
+body { font-size: 85%; }
+
+
+/* Default fonts and colors. */
+body,h1,h2,h3,h4,h5,h6,p,ul,ol,dl,input,textarea { font-family: Helvetica, Arial, sans-serif; }
+
+
+/* Headings
+-------------------------------------------------------------- */
+
+h1,h2,h3,h4,h5,h6 { font-weight: bold; }
+
+h1 { font-size: 2.25em; line-height: 1; margin-bottom: 0.5em; }
+h2 { font-size: 1.75em; margin-bottom: 0.5em; }
+h3 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; }
+h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1em; }
+h5 { font-size: 1em; margin-bottom: 1.5em; }
+h6 { font-size: 1em; }
+
+
+/* Text elements
+-------------------------------------------------------------- */
+
+p { margin: 0 0 1em; }
+
+ul, ol { margin: 0 1.5em 1.5em 1.5em; }
+ul { list-style-type: circle; }
+ol { list-style-type: decimal; }
+
+dl { margin: 0 0 1.5em 0; }
+dl dt { font-weight: bold; }
+dl dd { margin-left: 1.5em; }
+
+abbr, acronym { border-bottom: 1px dotted #000; }
+address { margin-top: 1.5em; font-style: italic; }
+del { color: #000; }
+
+a { color: #009; text-decoration: none; }
+a:hover { text-decoration: underline; }
+
+blockquote { margin: 1.5em; }
+strong { font-weight: bold; }
+em, dfn { font-style: italic; }
+dfn { font-weight: bold; }
+pre, code { margin: 1.5em 0; white-space: pre; }
+pre, code, tt { font: 1.2em monospace; line-height: 1.5; } 
+tt { display: block; margin: 1.5em 0; line-height: 1.5; }
+
+
+/* Tables
+-------------------------------------------------------------- */
+
+table { margin-bottom: 1.4em; }
+th { border-bottom: 2px solid #ddd; font-weight: bold; }
+th,td { padding: 4px 10px 4px 0; }
+tfoot { font-style: italic; }
+caption { background: #ffc; }
+
+
+/* Some default classes
+-------------------------------------------------------------- */
+
+.small { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
+.large { font-size: 1.25em; line-height:1.5em; margin-bottom: 1em; }
+.quiet { color: #999; }
+
+.hide { display: none; }
+.highlight { background: #ffc; }
+
+.top { margin-top: 0; padding-top: 0; }
+.bottom { margin-bottom: 0; padding-bottom: 0; }
+
+/* -------------------------------------------------------------- 
+   
+   Boilerplate forms.css
+   * Sets up some default styling for forms
+   
+-------------------------------------------------------------- */
+
+label { font-weight: bold; }
+
+/* Fieldsets */
+fieldset { padding: 1.4em; margin: 0 0 1.5em 0; border: 1px solid #ddd; }
+legend { padding: 0 .4em; font-weight: bold; font-size: 1.2em; }
+
+/* Textareas */
+textarea { margin: 0.5em 0.5em 0 0; }
+textarea { padding: .4em; }
+
+
+/* hForm
+-------------------------------------------------------------- */
+form.hform p { margin: 0 0 .5em; }
+form.hform p label { float: left; width: 100px; }
+
+form.hform p input { width: 200px; }
+form.hform p select { width: 200px; }
+
+form.hform p input.button { width: auto; }
+form.hform p input.checkbox { width: auto; }
+form.hform p input.radio { width: auto; }
+
+form.hform p.checkbox { margin-left: 100px; }
+form.hform p.checkbox label { float: none; }
+form.hform p.checkbox input { width: auto; }
+
+
+/* vForm
+-------------------------------------------------------------- */
+form.vform p { margin: 0 0 .5em; }
+form.vform p label { display: block; }
+
+form.vform p.checkbox label { display: inline; }
diff --git a/theme/boxxie/style/pagelayout.css b/theme/boxxie/style/pagelayout.css
new file mode 100644 (file)
index 0000000..a5a6048
--- /dev/null
@@ -0,0 +1,57 @@
+
+/*-----------------------------------------------------------------------------------|
+|--------------LEFT--------------------MIDDLE-------------------RIGHT----------------|
+|--------------210px--------------------------------------------210px----------------|
+|-----------------------------------------------------------------------------------*/
+
+#page-content #regions {
+  left: 210px; /* Width of left sideblock */
+}
+
+#page-content #regions #regions-mask {
+  margin-left: -420px; /* Twice width of left sideblock */
+  padding-top: 5px;
+}
+
+#page-content #regions #regions-mask #region-main #region-main-mask {
+  margin-left: 420px; /* Twice width of left sideblock */
+  padding: 0 15px; /* Padding around middle column */
+}
+
+#page-content #regions #regions-mask #region-pre {
+  left: 210px; /* Width of left sideblock */
+  width: 210px; /* Width of left sideblock */
+}
+
+#page-content #regions #regions-mask #region-post {
+  width: 210px; /* Width of right sideblock */
+}
+
+#page-content #regions .region-content {
+  padding: 0;
+}
+
+/** Only side pre **/
+
+.side-pre-only #page-content #regions #regions-mask {
+  margin-left: -210px; 
+}
+
+.side-pre-only #page-content #regions #regions-mask #region-main #region-main-mask {
+  margin-left: 210px;
+}
+
+/** Only side post **/
+
+.side-post-only #page-content #regions #regions-mask {
+  margin-left: -210px;
+}
+
+.side-post-only #page-content #regions #regions-mask #region-main #region-main-mask {
+  margin-left: 210px;
+}
+
+
+.has_dock.side-post-only .page-middle #regions #regions-mask #region-main #region-main-mask {
+  margin-left: 210px;
+}      
\ No newline at end of file
index 02c5734..7809583 100644 (file)
@@ -1,4 +1,5 @@
-html {
+html,
+body {
   background: #6e8c45;
 }
 
@@ -22,7 +23,18 @@ a:visited {
 
 a:hover,
 a:active {
-  text-decoration: underline;
+  color: #41512f;
+}
+
+h2.main {
+  text-align: center;
+  margin-bottom: 25px;
+}
+
+
+.rolelink {
+  text-align: right;
+  margin: 10px 0;
 }
 
 /* Header */
@@ -40,20 +52,51 @@ a:active {
 #page-header h1.headermain {
   color: #fff;
   font-weight: normal;
-  margin:1em;
+  margin: 1em;
+  font-size: 2em;
+}
+
+.pagelayout-frontpage #page-header h1.headermain {
+  font-size: 2.75em;
+}
+
+/* Navbar */
+
+.navbar {
+  padding: 4px 2px;
+  font-size: 0.95em;
+  color: #333;
+}
+
+.navbar .sep {
+  color: #999;
+}
+
+.navicon {
+  display: none;
+}
+
+/* Content */
+
+.sitetopic {
+  border: none;
 }
 
+/* Sideblock */
+
 .sideblock {
   border: none;
 }
 
 .sideblock .header {
   background: #69804e;
-  padding:2px 5px;
+  padding: 2px 5px;
 }
 
 .sideblock .header h2 {
   color: #fff;
+  font-size: 1.2em;
+  line-height: 1;
 }
 
 .sideblock .content {
@@ -61,6 +104,11 @@ a:active {
   border-width: 1px;
   border-color: #69804e;
   border-style: solid;
+  padding: 4px;
+}
+
+.block_js_expansion .block_tree {
+  overflow: auto;
 }
 
 /* Course */
@@ -69,8 +117,23 @@ a:active {
   border-bottom: 1px solid #eee;
 }
 
+.coursebox .info {
+  width: 35%;
+}
+
+.coursebox .summary {
+  width: 63%;
+}
+
 .coursebox h3.name {
-  margin-top: 0;
+  margin: 0;
+  font-size: 1.2em;
+  line-height: 1.4;
+}
+
+.coursebox .info .teachers {
+  margin-left: 0.6em;
+  font-size: 0.95em;
 }
 
 .categorybox {
@@ -78,12 +141,287 @@ a:active {
 }
 
 h2.headingblock {
-  font-weight: normal;
   border-bottom: 1px solid #eee;
+  font-size: 1.5em;
+}
+
+#page-course-category .categorypicker {
+  text-align: center;
+  margin: 10px 0 20px;
+}
+
+#page-course-category .buttons {
+  text-align: center;
+}
+
+/* Users */
+
+/* Tabs */
+
+.tabtree ul {
+  text-align: center;
+}
+
+.tabtree .tabrow0 {
+  width: 100%;
+  margin: 1em 0px;
+}
+
+.tabtree .tabrow0 li {
+  margin-right: -4px;
+}
+
+.tabtree .tabrow0 li.here {
+  font-weight: bold;
+}
+
+.tabtree .tabrow0 li.here a {
+  position: relative;
+  z-index: 102;
+}
+
+.tabtree .tabrow0 li a {
+  background:#f3f8ed;
+  border-width:1px 1px 0;
+  border-style: solid;
+  font-weight: bold;
+  border-color: #dadfd5;
+  padding:6px 6px 5px;
+  margin-right: 3px;
+  color: #3b4c25;
+}
+
+.tabtree .tabrow0 li.here a {
+  background: #fff;
+  border-color: #5b7439;
+  border-bottom-width: 0;
+  cursor: pointer;
+}
+
+.tabtree .tabrow0 li a:hover {
+  background:#fff;
+  border-color: #84a754;
+}
+
+.tabtree .tabrow0 ul,
+.tabtree .tabrow0 div {
+  font-weight: normal;
+  background:#fff;
+  border-top: 1px solid #5b7439;
+  padding: 0;
+  margin: 0;
+}
+
+.tabtree tabrow2 ul {
+  border: none;
+}
+
+.tabtree .tabrow0 li.here .empty {
+  display: block;
+  height: 1px;
+  overflow: hidden;
+  padding: 0px;
+  position: absolute;
+  width: 100%;
+  background: #fff;
+}
+
+.tabtree .tabrow1 li a,
+.tabtree .tabrow1 li a:hover,
+.tabtree .tabrow1 li a span,
+.tabtree .tabrow1 li a:hover span {
+  background: none !important;
+  border: none;
+  font-size: 0.95em;
+}
+
+.tabtree a.nolink,
+.tabtree .here ul a.nolink,
+.tabtree a.nolink:hover,
+.tabtree .here ul a.nolink:hover {
+  color: #888;
+  text-decoration: none;
+}
+
+.tabtree .here a.nolink,
+.tabtree .here ul .here a.nolink,
+.tabtree .here a.nolink:hover,
+.tabtree .here ul .here a.nolink:hover {
+  color: black;
+  text-decoration: none;
+}
+
+.ie7 .tabtree .tabrow0 li {
+  margin-left: 0;
+}
+
+.ie7 .tabtree .tabrow0 li.first {
+  margin-right: -4px;
+}
+
+.ie7 .tabtree .tabrow0 li.onerow {
+  margin-right: 0;
+}
+
+.ie7 .tabtree .tabrow0 a {
+  display: inline-block;
+  padding: 8px 0 0.35em 13px;
+  line-height: 1.5em;
+}
+
+.ie7 .tabtree .tabrow0 a span {
+  padding: 10px 1em 10px 0;
+}
+
+.ie7 .tabtree .tabrow0 div {
+  top: 2.6em;
+  padding: 0.2em 0;
+}
+
+.ie7 .tabtree .tabrow0 div.empty {
+  margin-right: 0;
+}
+
+.ie7.mod-quiz div.tabtree a span img.iconsmall {
+  margin: 0;
+  vertical-align: baseline;
+  position: relative;
+  top: 2px;
+}
+
+.ie6 .tabtree {
+  height: 100%;
+}
+
+.ie6 .tabtree .tabrow0 {
+  padding-top: 10px;
+}
+
+.ie6 .tabtree .tabrow0 li {
+  margin-left: 0;
+}
+
+.ie6 .tabtree .tabrow0 li.first {
+  margin-left: -4px;
+  margin-right: -4px;
+}
+
+.ie6 .tabtree .tabrow0 li.last a {
+  margin-right: 0;
+}
+
+.ie6 .tabtree .tabrow0 li.onerow {
+  margin-right: 0;
+}
+
+.ie6 .tabtree .tabrow0 a {
+  padding: 0 0 0 13px;
+}
+
+.ie6 .tabtree .tabrow0 a span {
+  padding: 12px 1em 4px 0;
+}
+
+.ie6 .tabtree .tabrow0 div {
+  top: 3.5em;
+  padding: 0.2em 0;
 }
 
 /* Forum */
 
+.forumpost {
+  border: none;
+}
+
 .forumpost .topic {
   background: #c9dfb2;
+  border: 1px solid #a0c278;
+  padding: 5px 10px;
+}
+
+.forumpost .subject {
+  font-size: 1.2em;
+}
+
+.forumpost .author {
+  font-style: italic;
+  color: #555;
+  font-size: 0.95em;
+}
+
+.forumpost .author a:link,
+.forumpost .author a:visited {
+  color: #566b3f;
+  text-decoration: underline;
+}
+
+.forumpost .author a:hover {
+  text-decoration: none;
+}
+
+.forumpost .content {
+  border-width: 0 1px 1px;
+  border-color: #a0c278;
+  border-style: solid;
+  padding: 5px 10px;
+}
+
+.forumaddnew {
+  text-align: center;
+  margin-bottom: 15px;
+}
+
+/* Footer */
+
+#page-footer {
+  background: #4e6632;
+  color: #fff;
+}
+
+#page-footer a {
+  color: #b3c79d;
+}
+
+#page-footer a:hover {
+  color: #fff;
+}
+
+#page-footer .logininfo {
+  float: left;
+  padding: 5px;
+  margin: 0;
+}
+
+#page-footer .helplink {
+  float: right;
+  padding: 5px;
+  margin: 0;
+}
+
+.homelink,
+.performanceinfo {
+  text-align: center;
+  margin: 10px 20%;
+}
+
+.performanceinfo span {
+  display: block;
+}
+
+.validators {
+  margin-top: 40px;
+  padding-top: 5px;
+  border-top: 1px dotted gray;
+}
+
+.validators ul {
+  margin: 0px;
+  padding: 0px;
+  list-style-type: none;
+}
+
+.validators ul li {
+  display: inline;
+  margin-right: 10px;
+  margin-left: 10px;
 }
\ No newline at end of file