Browse Source

More responsive stuff

Julio Montoya 13 years ago
parent
commit
40c5200227

+ 2 - 176
main/css/base.css

@@ -58,30 +58,6 @@ legend {
 }
 
 /* Fixing old chamilo forms */
-
-
-/* Subnav */
-.subnav {
-  width:100%;  
-  height: 36px;
-  
-  -webkit-border-radius: 4px;
-     -moz-border-radius: 4px;
-          border-radius: 4px;
-  
-}
-
-.subnav .nav {
-    display: block;
-    float: left;
-    left: 0;
-    margin-bottom: 0;
-    margin-left: 0;
-    margin-right: 10px;
-    margin-top: 0;
-    position: relative;
-}
-
 #header4 {
 	height:26px;
     padding:0px;
@@ -89,9 +65,7 @@ legend {
     width: 100%;	
     /*margin-top:35px;*/
     margin-bottom:5px;    
-    background-repeat:repeat-x;
-    
-    
+    background-repeat:repeat-x;        
 }
 
 form .label {
@@ -118,153 +92,6 @@ form .formw input {
 
 /* end chamilo forms fixes */
 
-
-/* media queries responsive */
-
-/* Responsive Docs
--------------------------------------------------- */
-@media (max-width: 480px) {
-
-    h3 {
-        font-size: 18px;
-    }
-    
-    h4 {
-        font-size: 16px;
-    }
-}
-
-
-@media (max-width: 768px) {
-    
-    h3 {
-        font-size: 18px;
-    }
-
-    h4 {
-        font-size: 16px;
-    }
-    
-
-  /* Remove any padding from the body */
-  body {
-    padding-top: 0;
-  }
-
-  /* Jumbotron buttons */
-  .jumbotron .btn {
-    margin-bottom: 10px;
-  }
-
-  /* Subnav */
-  .subnav {
-    position: static;
-    top: auto;
-    z-index: auto;
-    width: auto;
-    height: auto;
-    background: #fff; /* whole background property since we use a background-image for gradient */
-    -webkit-box-shadow: none;
-       -moz-box-shadow: none;
-            box-shadow: none;
-  }
-  .subnav .nav > li {
-    float: none;
-  }
-  .subnav .nav > li > a {
-    border: 0;
-  }
-  .subnav .nav > li + li > a {
-    border-top: 1px solid #e5e5e5;
-  }
-  .subnav .nav > li:first-child > a,
-  .subnav .nav > li:first-child > a:hover {
-      -webkit-border-radius: 4px 4px 0 0;
-         -moz-border-radius: 4px 4px 0 0;
-              border-radius: 4px 4px 0 0;
-  }
-
-  /* Popovers */
-  .large-bird {
-    display: none;
-  }
-  .popover-well .popover-wrapper {
-    margin-left: 0;
-  }
-
-  /* Space out the show-grid examples */
-  .show-grid [class*="span"] {
-    margin-bottom: 5px;
-  }
-
-  /* Unfloat the back to top link in footer */
-  .footer .pull-right {
-    float: none;
-  }
-  .footer p {
-    margin-bottom: 9px;
-  }
-
-}
-
-
-@media (min-width: 480px) and (max-width: 768px) {    
-        
-    h3 {
-        font-size: 18px;
-    }
-
-    h4 {
-        font-size: 16px;
-    }
-}
-
-
-@media (min-width: 768px) and (max-width: 980px) {
-
-  /* Remove any padding from the body */
-  body {
-    padding-top: 0;
-  }
-
-  /* Scale down the jumbotron content */
-  .jumbotron h1 {
-    font-size: 72px;
-  }
-
-}
-
-
-@media (max-width: 980px) {
-
-  /* Unfloat brand */
-  .navbar-fixed-top .brand {
-    float: left;
-    margin-left: 0;
-    padding-left: 10px;
-    padding-right: 10px;
-  }
-
-  /* Inline-block quick links for more spacing */
-  .quick-links li {
-    display: inline-block;
-    margin: 5px;
-  }
-
-}
-
-
-/* LARGE DESKTOP SCREENS */
-@media (min-width: 1210px) {
-
-  /* Update subnav container */
-  .subnav-fixed .nav {
-    width: 1168px; /* 2px less to account for left/right borders being removed when in fixed mode */
-  }
-
-}
-
-
 * {
     /* outline :none; */
 }
@@ -817,8 +644,7 @@ a.personal_agenda:hover, a.personal_agenda:hover {
       /* height: 150px; */ 
 }
 .social-home-anonymous-online {
-     width: 200px;
-     margin: -10px 0 0 -50px;
+     width: 200px;     
       /* height: 150px; */ 
 }
 

+ 1 - 11
main/css/base_chamilo.css

@@ -322,9 +322,7 @@ input.link_alike:hover {
 #current {
     color:#FFFFFF;
     cursor:pointer;
-    display:block;
-    float:left;
-
+    display:block;    
     overflow:hidden;
     padding-bottom:6px;
     margin-right:-3px;    
@@ -2395,14 +2393,6 @@ span.form_required  {
   /*background-color: #eeeeee; */
 }
 
-/* logout fix*/
-.subnav  .nav {
-  display: block;
-  float: left;
-  margin: 0 10px 0 0;
-  position: relative;
-  left: 0;
-}
 
 /*  New forum table */
 

+ 1 - 1
main/css/chamilo/default.css

@@ -253,4 +253,4 @@ input.arrowl {
 
 .portal {
     background-image:url(images/portal.png);
-}
+}

+ 114 - 0
main/css/responsive.css

@@ -0,0 +1,114 @@
+
+/* media queries responsive */
+
+/* Responsive Docs
+-------------------------------------------------- */
+@media (max-width: 480px) {
+    
+    h3 {
+        font-size: 18px;
+    }
+    
+    h4 {
+        font-size: 16px;
+    }
+}
+
+@media (max-width: 768px) {
+
+  /* Remove any padding from the body */
+  body {
+    padding-top: 0;
+  }
+  
+  #topbar_push {
+      height: 0px;
+  }
+  
+  /* Removing just for now*/
+  #header4{
+      display:none;
+  }
+  
+  #header2 {
+        
+  }
+  
+  /* Subnav */
+  .subnav {           
+    border:1px solid #fff;
+    position: static;
+    top: auto;
+    z-index: auto;
+    width: 100%;
+    height: auto;    
+    -webkit-box-shadow: none;
+       -moz-box-shadow: none;
+            box-shadow: none;
+  }
+  .subnav .nav > li {
+    float: none;    
+  }
+  .subnav .nav > li > a {
+    border: 0;
+  }
+  .subnav .nav > li + li > a {
+    border-top: 1px solid #e5e5e5;
+  }
+  .subnav .nav > li:first-child > a,
+  .subnav .nav > li:first-child > a:hover {
+      -webkit-border-radius: 4px 4px 0 0;
+         -moz-border-radius: 4px 4px 0 0;
+              border-radius: 4px 4px 0 0;
+  }
+
+  /* Popovers */
+  .large-bird {
+    display: none;
+  }
+  .popover-well .popover-wrapper {
+    margin-left: 0;
+  }
+
+  /* Space out the show-grid examples */
+  .show-grid [class*="span"] {
+    margin-bottom: 5px;
+  }
+
+  /* Unfloat the back to top link in footer */
+  .footer .pull-right {
+    float: none;
+  }
+  .footer p {
+    margin-bottom: 9px;
+  }
+}
+
+
+@media (min-width: 480px) and (max-width: 768px) {    
+
+}
+
+
+@media (min-width: 768px) and (max-width: 980px) {
+   
+}
+
+
+@media (max-width: 980px) {
+
+  /* Remove any padding from the body */
+  body {
+    padding-top: 0;
+  }
+  
+  #topbar_push {
+      height: 0px;
+  }
+
+}
+
+
+/* LARGE DESKTOP SCREENS */
+@media (min-width: 1210px) {
+}

+ 1 - 1
main/inc/lib/social.lib.php

@@ -824,7 +824,7 @@ class SocialManager extends UserManager {
                     }                    
                     $table_row[] = Display::url(Display::div(Display::div($img, array('class'=>$clip)), array('class'=>'clip-wrapper')) , $url);                        
                 }                
-				$table_row[] = Display::div($status_icon).'<a href="'.$url.'">'.$name.'</a><br><br><a class="a_button medium white">Send message</a>';
+				$table_row[] = Display::div($status_icon).'<a href="'.$url.'">'.$name.'</a><br>';
 				$table_data[] = $table_row;
 			}
 			$table_header[] = array(get_lang('UserPicture'), false, 'width="90"');

+ 6 - 1
main/inc/lib/template.lib.php

@@ -229,7 +229,7 @@ class Template extends Smarty {
 		//Base CSS
 		$style_html = '@import "'.api_get_path(WEB_CSS_PATH).'base.css";'."\n";
         
-        $style_html .= '@import "'.api_get_path(WEB_CSS_PATH).'bootstrap-responsive.css";'."\n";
+        
 		
 		//Default theme CSS
 		$style_html .= '@import "'.api_get_path(WEB_CSS_PATH).$this->theme.'/default.css";'."\n";
@@ -240,6 +240,11 @@ class Template extends Smarty {
 		if ($navigator_info['name']=='Internet Explorer' &&  $navigator_info['version']=='6') {
 			$style_html .= 'img, div { behavior: url('.api_get_path(WEB_LIBRARY_PATH).'javascript/iepngfix/iepngfix.htc) } '."\n";
 		}
+        
+        $style_html .= '@import "'.api_get_path(WEB_CSS_PATH).'bootstrap-responsive.css";'."\n";
+        
+        $style_html .= '@import "'.api_get_path(WEB_CSS_PATH).'responsive.css";'."\n";
+        
 		
 		$this->assign('css_style', $style_html);
 		

+ 6 - 7
main/template/default/layout/hot_courses.tpl

@@ -1,7 +1,5 @@
 <script type="text/javascript">
 $(document).ready( function() {
-	
-		
 	$('.star-rating li a').live('click', function(event) {
         var id = $(this).parents('ul').attr('id');                      
            $('#vote_label2_' + id).html("{'Loading'|get_lang}");           
@@ -18,13 +16,13 @@ $(document).ready( function() {
                    }
                }
            })
-       });
-	
+       });	
 });
 </script>
 
-{if !(empty($hot_courses)) }	
-	 <h3>{"HottestCourses"|get_lang}</h3>
+{if !(empty($hot_courses)) }		 
+    <div class="span8">
+    <h3>{"HottestCourses"|get_lang}</h3>
 	{foreach $hot_courses as $hot_course}										
 		<div class="categories-block-course">
 			<div class="categories-content-course">
@@ -58,6 +56,7 @@ $(document).ready( function() {
 					</div>
 				{/if}				
 			</div>
-		</div>
+		</div>            
 	{/foreach}
+     </div>
 {/if}

+ 1 - 1
main/template/default/layout/layout_2_col.tpl

@@ -14,7 +14,7 @@
 	 	{include file="default/layout/sniff.tpl"}
 	{/if}
 	
-	<div id="maincontent" class="span9">
+	<div class="span9">
 		
 		{* Course plugin block*}
         <section id="courses_plugin">

+ 1 - 1
main/template/default/layout/main_footer.tpl

@@ -1,4 +1,4 @@
-            <div class="clear">&nbsp;</div> <!-- 'clearing' div to make sure that footer stays below the main and right column sections -->
+            
         </div> <!-- end of #main" started at the end of banner.inc.php -->
     </div> <!-- end of #main" started at the end of banner.inc.php -->
     <div class="push"></div>

+ 5 - 7
main/template/default/layout/topbar.tpl

@@ -18,13 +18,11 @@
                 {if $_u.logged}
                     
                 <div class="nav-collapse">
-                    
                     <ul class="nav">
                         <li class="active"><a href="{$_p.web}user_portal.php">{"MyCourses"|get_lang}</a></li>
-
                         {if 0}
                         <li class="dropdown">
-                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">{'Teaching'|get_lang}</a>
+                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">{'Teaching'|get_lang}<b class="caret"></b></a>
                             <ul class="dropdown-menu">
                                 <li><a href="{$_p.web_main}create_course/add_course.php">{"AddCourse"|get_lang}</a></li>
                                 <li><a href="{$_p.web_main}auth/courses.php">{"Catalog"|get_lang}</a></li>
@@ -32,7 +30,7 @@
                         </li>
                         {/if}
                         <li class="dropdown">
-                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">{'Tracking'|get_lang}</a>
+                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">{'Tracking'|get_lang}<b class="caret"></b></a>
                             <ul class="dropdown-menu">
                                 <li><a href="{$_p.web_main}mySpace/">{"CoursesReporting"|get_lang}</a></li>
                                 <li><a href="{$_p.web_main}mySpace/index.php?view=admin">{"AdminReports"|get_lang}</a></li>
@@ -43,7 +41,7 @@
                         </li>
                         {if $_u.is_admin == 1}
                         <li class="dropdown">
-                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">{'Administration'|get_lang}</a>
+                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">{'Administration'|get_lang}<b class="caret"></b></a>
                             <ul class="dropdown-menu">
                                 <li><a href="{$_p.web_main}admin/">{"Home"|get_lang}</a></li>
                                 <li><a href="{$_p.web_main}admin/user_list.php">{"UserList"|get_lang}</a></li>
@@ -58,7 +56,7 @@
 
                     {if $_u.is_admin == 1}
                     <form class="navbar-search pull-left" action="{$_p.web_main}admin/user_list.php" method="get">
-                        <input type="text" placeholder="{'SearchUsers'|get_lang}" name="keyword">
+                        <input type="text" class="search-query span2" placeholder="{'SearchUsers'|get_lang}" name="keyword">
                     </form>
                     {/if}
 
@@ -66,7 +64,7 @@
                     <ul class="nav pull-right">
                         <li><a href="{$_p.web_main}social/home.php"><img src="{$_u.avatar_small}"/></a></li>
                         <li class="dropdown">
-                            <a class="dropdown-toggle" data-toggle="dropdown"  href="#">{$_u.complete_name}</a>
+                            <a class="dropdown-toggle" data-toggle="dropdown"  href="#">{$_u.complete_name}<b class="caret"></b></a>
                             <ul class="dropdown-menu">
                                 <li><a href="{$_p.web_main}social/home.php">{"Profile"|get_lang}</a></li>
                                 <li><a href="{$_p.web_main}calendar/agenda_js.php?type=personal">{"MyAgenda"|get_lang}</a></li>