MDL-39812: bootstrapbase theme: Fix breadcrumbs layout for narrow screens

2013-07-05 10:54:26 +08:00
parent f8e6e5bc30
commit c72106b277
6 changed files with 22 additions and 8 deletions
@@ -50,9 +50,9 @@ echo $OUTPUT->doctype() ?>
 <div id="page" class="container-fluid">

    <header id="page-header" class="clearfix">
-        <div id="page-navbar">
+        <div id="page-navbar" class="clearfix">
+            <div class="breadcrumb-nav"><?php echo $OUTPUT->navbar(); ?></div>
            <nav class="breadcrumb-button"><?php echo $OUTPUT->page_heading_button(); ?></nav>
-            <?php echo $OUTPUT->navbar(); ?>
        </div>
        <?php echo $OUTPUT->page_heading(); ?>
        <div id="course-header">
@@ -51,9 +51,9 @@ echo $OUTPUT->doctype() ?>
 <div id="page" class="container-fluid">

    <header id="page-header" class="clearfix">
-        <div id="page-navbar">
+        <div id="page-navbar" class="clearfix">
+            <div class="breadcrumb-nav"><?php echo $OUTPUT->navbar(); ?></div>
            <nav class="breadcrumb-button"><?php echo $OUTPUT->page_heading_button(); ?></nav>
-            <?php echo $OUTPUT->navbar(); ?>
        </div>
        <?php echo $OUTPUT->page_heading(); ?>
        <div id="course-header">
@@ -56,9 +56,9 @@ echo $OUTPUT->doctype() ?>
 <div id="page" class="container-fluid">

    <header id="page-header" class="clearfix">
-        <div id="page-navbar">
+        <div id="page-navbar" class="clearfix">
+            <div class="breadcrumb-nav"><?php echo $OUTPUT->navbar(); ?></div>
            <nav class="breadcrumb-button"><?php echo $OUTPUT->page_heading_button(); ?></nav>
-            <?php echo $OUTPUT->navbar(); ?>
        </div>
        <?php echo $OUTPUT->page_heading(); ?>
        <div id="course-header">
@@ -1897,3 +1897,13 @@ div.badge .expireimage {
    padding: 0;
    border-width: 0;
 }
+.breadcrumb-nav {
+    float: left;
+    margin-bottom: 10px;
+}
+.breadcrumb-button .singlebutton div {
+    margin-right: 0;
+}
+.breadcrumb-nav .breadcrumb {
+    margin: 0;
+}
@@ -231,6 +231,9 @@
  .row-fluid .desktop-first-column {
      margin-left: 0;
  }
+  #page-navbar .breadcrumb-button {
+      display: inline;
+  }
 }
@media (max-width : 767px) {
  .row-fluid .desktop-first-column {