Browse Source

fix survey css styles - refs BT#12915

Alex Aragon 7 years ago
parent
commit
748b6e6b96

+ 45 - 52
app/Resources/public/css/base.css

@@ -3450,6 +3450,11 @@ i.size-32.icon-new-work{
   -moz-box-sizing:border-box;
   -webkit-box-sizing:border-box;
 }
+.start-survey{
+    margin-top: 20px;
+    padding-top: 20px;
+    margin-bottom: 20px;
+}
 .survey-block .table tbody tr:hover td{
   background-color: #fff6d5 ;
 }
@@ -3468,21 +3473,8 @@ i.size-32.icon-new-work{
   display: inline-block;
   margin-left: 10px;
 }
-#survey_title {
-  font-size: 24px;
-  font-weight: 500;
-  color:#666;
-  padding-top:10px;
-  padding-bottom: 10px;
-  padding-left: 15px;
-  padding-right: 15px;
-  background-color: #ececec;
-}
-#survey_subtitle {
-  background-color:#F7F7E3;
-  color:#666;
-  padding:10px;
-  font-size:14px ;
+#question-survey .start-survey .col-sm-8{
+    text-align: center;
 }
 .survey_content {
   color:#666;
@@ -3495,21 +3487,10 @@ i.size-32.icon-new-work{
   background-color: #ececec;
   text-align: center;
 }
-.survey_question_wrapper {
-  border-top: 1px solid #DADADA;
-  background-color: #ffffff;
-  padding-top: 1em;
-  padding-bottom: 2em;
-  padding-left: 1em;
-  padding-right: 1em;
-  text-align: left;
-}
-.survey_question {
-  /* 264269 4271b5 E5EDF9 */
-  color:#666;
-  padding:5px;
-  font-size: 16px;
-  font-weight: bold;
+.survey_question .title{
+    font-weight: bold;
+    padding-bottom: 10px;
+    margin-bottom: 10px;
 }
 .survey_question_options {
   /* 264269 4271b5 E5EDF9 */
@@ -3517,29 +3498,7 @@ i.size-32.icon-new-work{
   color:#000;
   padding:5px;/*border: 1px solid #264269;*/
 }
-.survey-next.btn{
-  border:1px solid #319265; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;font-size:18px;font-family:arial, helvetica, sans-serif; padding: 10px 20px 10px 20px; text-decoration:none; display:inline-block;font-weight:bold; color: #FFFFFF;
-  background-color: #3FBC82; background-image: -webkit-gradient(linear, left top, left bottom, from(#3FBC82), to(#308E60));
-  background-image: -webkit-linear-gradient(top, #3FBC82, #308E60);
-  background-image: -moz-linear-gradient(top, #3FBC82, #308E60);
-  background-image: -ms-linear-gradient(top, #3FBC82, #308E60);
-  background-image: -o-linear-gradient(top, #3FBC82, #308E60);
-  background-image: linear-gradient(to bottom, #3FBC82, #308E60);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#3FBC82, endColorstr=#308E60);
-  text-shadow:none;
-  margin-top: 1em;
-  margin-bottom: 1em;
-}
 
-.survey-next.btn:hover{
-  border:1px solid #25704d;
-  background-color: #329668; background-image: -webkit-gradient(linear, left top, left bottom, from(#329668), to(#236846));
-  background-image: -webkit-linear-gradient(top, #329668, #236846);
-  background-image: -moz-linear-gradient(top, #329668, #236846);
-  background-image: -ms-linear-gradient(top, #329668, #236846);
-  background-image: -o-linear-gradient(top, #329668, #236846);
-  background-image: linear-gradient(to bottom, #329668, #236846);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#329668, endColorstr=#236846);
-  background-position: 0 0;
-}
 .survey-block .confirmation-message, .survey-block .error-message{
   font-size: 16px;
   text-align: center;
@@ -6788,6 +6747,40 @@ input.form-control[type="color"] {
     .grid-courses .col-sm-6:nth-child(2n+1) {
         clear: left;
     }
+    .form-inline .survey_question .input-group label{
+        display: none;
+    }
+    .form-inline .survey_question.ch_score .input-group label{
+        display: block;
+        width: 100%;
+        font-weight: normal;
+    }
+    .form-inline .survey_question.ch_score .input-group label p{
+        margin: 0;
+    }
+    .form-inline .survey_question.ch_score .input-group{
+        width: 100%;
+    }
+    .form-inline .survey_question .input-group{
+        padding-bottom: 10px;
+        padding-top: 10px;
+    }
+    .form-inline .survey_question .input-group .radio-inline .radio-inline,
+    .form-inline .survey_question .input-group .checkbox-inline .checkbox-inline{
+        display: block;
+    }
+    .form-inline .survey_question .form-group{
+        width: 100%;
+    }
+    .form-inline .survey_question .form-group .form-control{
+        width: 100%;
+    }
+    .form-inline .survey_question .form-group label{
+        display: none;
+    }
+    .form-inline .survey_question .input-group .bootstrap-select{
+        width: 300px;
+    }
 }
 
 /* Medium devices (desktops, 992px and up) */

+ 1 - 1
app/Resources/public/css/themes/chamilo/default.css

@@ -151,4 +151,4 @@ a:focus {
 }
 .page-header{
   margin: 10px 0 10px;
-}
+}

+ 14 - 12
main/survey/preview.php

@@ -96,7 +96,7 @@ if (api_is_course_admin() ||
     api_is_allowed_to_session_edit(false, true)
 ) {
     // Survey information
-    echo '<div id="survey_title">'.$survey_data['survey_title'].'</div>';
+    echo '<div class="page-header"><h2>'.$survey_data['survey_title'].'</h2></div>';
 
     if (!empty($survey_data['survey_subtitle'])) {
         echo '<div id="survey_subtitle">'.$survey_data['survey_subtitle'].'</div>';
@@ -105,7 +105,7 @@ if (api_is_course_admin() ||
     // Displaying the survey introduction
     if (!isset($_GET['show'])) {
         if (!empty($survey_data['survey_introduction'])) {
-            echo '<div id="survey_content" class="survey_content">'.$survey_data['survey_introduction'].'</div>';
+            echo '<div class="survey_content">'.$survey_data['survey_introduction'].'</div>';
         }
         $limit = 0;
     }
@@ -205,34 +205,34 @@ if (api_is_course_admin() ||
     }
 
     $url = api_get_self().'?survey_id='.$survey_id.'&show='.$show;
-    $form = new FormValidator('question', 'post', $url);
-
+    $form = new FormValidator('question-survey', 'post', $url, null, null, FormValidator::LAYOUT_INLINE);
+    
     if (is_array($questions) && count($questions) > 0) {
         foreach ($questions as $key => & $question) {
             $ch_type = 'ch_'.$question['type'];
             /** @var survey_question $display */
             $display = new $ch_type;
-            $form->addHtml('<div class="survey_question_wrapper"><div class="survey_question">');
-            $form->addHtml($question['survey_question']);
+            $form->addHtml('<div class="survey_question '.$ch_type.'">');
+            $form->addHtml('<h5 class="title">'.$question['question_id'].'. '.strip_tags($question['survey_question']).'</h5>');
             $display->render($form, $question);
-            $form->addHtml('</div></div>');
+            $form->addHtml('</div>');
         }
     }
-
+    $form->addHtml('<div class="start-survey">');
     if (($show < $numberofpages) || (!$_GET['show'] && count($questions) > 0)) {
         if ($show == 0) {
             $form->addButton(
                 'next_survey_page',
                 get_lang('StartSurvey'),
                 'arrow-right',
-                'success',
-                'large'
+                'success'
             );
         } else {
             $form->addButton(
                 'next_survey_page',
                 get_lang('NextQuestion'),
-                'arrow-right'
+                'arrow-right',
+                'success'
             );
         }
     }
@@ -245,9 +245,11 @@ if (api_is_course_admin() ||
         $form->addButton(
             'finish_survey',
             get_lang('FinishSurvey'),
-            'arrow-right'
+            'arrow-right',
+            'success'
         );
     }
+    $form->addHtml('</div>');
     $form->display();
 } else {
     echo Display::return_message(get_lang('NotAllowed'), 'error', false);

+ 23 - 25
main/survey/survey.php

@@ -141,42 +141,40 @@ $survey_actions .= '<a href="'.api_get_path(WEB_CODE_PATH).'survey/reporting.php
 echo '<div class="actions">'.$survey_actions.'</div>';
 
 if ($survey_data['survey_type'] == 0) {
-    echo '<div class="panel panel-default">';
-    echo '<div class="panel-body">';
-    echo '<a href="'.api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add&type=yesno&survey_id='.$survey_id.'">'.Display::return_icon('yesno.png', get_lang('YesNo'), null, ICON_SIZE_BIG).'</a>';
-    echo '<a href="'.api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add&type=multiplechoice&survey_id='.$survey_id.'">'.Display::return_icon('mcua.png', get_lang('UniqueSelect'), null, ICON_SIZE_BIG).'</a>';
-    echo '<a href="'.api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add&type=multipleresponse&survey_id='.$survey_id.'">'.Display::return_icon('mcma.png', get_lang('MultipleResponse'), null, ICON_SIZE_BIG).'</a>';
-    echo '<a href="'.api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add&type=open&survey_id='.$survey_id.'">'.Display::return_icon('open_answer.png', get_lang('Open'), null, ICON_SIZE_BIG).'</a>';
-    echo '<a href="'.api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add&type=dropdown&survey_id='.$survey_id.'">'.Display::return_icon('dropdown.png', get_lang('Dropdown'), null, ICON_SIZE_BIG).'</a>';
-    echo '<a href="'.api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add&type=percentage&survey_id='.$survey_id.'">'.Display::return_icon('percentagequestion.png', get_lang('Percentage'), null, ICON_SIZE_BIG).'</a>';
-    echo '<a href="'.api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add&type=score&survey_id='.$survey_id.'">'.Display::return_icon('scorequestion.png', get_lang('Score'), null, ICON_SIZE_BIG).'</a>';
-    echo '<a href="'.api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add&type=comment&survey_id='.$survey_id.'">'.Display::return_icon('commentquestion.png', get_lang('Comment'), null, ICON_SIZE_BIG).'</a>';
-    echo '<a href="'.api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add&type=pagebreak&survey_id='.$survey_id.'">'.Display::return_icon('page_end.png', get_lang('Pagebreak'), null, ICON_SIZE_BIG).'</a>';
+    $urlQuestion = api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add';
+    
+    echo '<div class="well">';
+    echo Display::url(Display::return_icon('yesno.png', get_lang('YesNo'), null, ICON_SIZE_BIG), $urlQuestion.'&type=yesno&survey_id='.$survey_id);
+    echo Display::url(Display::return_icon('mcua.png', get_lang('UniqueSelect'), null, ICON_SIZE_BIG), $urlQuestion.'&type=multiplechoice&survey_id='.$survey_id);
+    echo Display::url(Display::return_icon('mcma.png', get_lang('MultipleResponse'), null, ICON_SIZE_BIG), $urlQuestion.'&type=multipleresponse&survey_id='.$survey_id);
+    echo Display::url(Display::return_icon('open_answer.png', get_lang('Open'), null, ICON_SIZE_BIG), $urlQuestion.'&type=open&survey_id='.$survey_id);
+    echo Display::url(Display::return_icon('dropdown.png', get_lang('Dropdown'), null, ICON_SIZE_BIG), $urlQuestion.'&type=dropdown&survey_id='.$survey_id);
+    echo Display::url(Display::return_icon('percentagequestion.png', get_lang('Percentage'), null, ICON_SIZE_BIG), $urlQuestion.'&type=percentage&survey_id='.$survey_id);
+    echo Display::url(Display::return_icon('scorequestion.png', get_lang('Score'), null, ICON_SIZE_BIG), $urlQuestion.'&type=score&survey_id='.$survey_id);
+    echo Display::url(Display::return_icon('commentquestion.png', get_lang('Comment'), null, ICON_SIZE_BIG), $urlQuestion.'&type=comment&survey_id='.$survey_id);
+    echo Display::url(Display::return_icon('page_end.png', get_lang('Pagebreak'), null, ICON_SIZE_BIG), $urlQuestion.'&type=pagebreak&survey_id='.$survey_id);
     echo '</div>';
-        echo '</div>';
 } else {
-    echo '<div class="panel panel-default">';
-        echo '<div class="panel-body">';
-    echo '<a href="'.api_get_path(WEB_CODE_PATH).'survey/question.php?'.api_get_cidreq().'&action=add&type=personality&survey_id='.$survey_id.'">';
-    echo Display::return_icon("yesno.png");
+    echo '<div class="well">';
+    echo Display::url(Display::return_icon('yesno.png', get_lang('YesNo'), null, ICON_SIZE_BIG), $urlQuestion.'&type=personality&survey_id='.$survey_id);
     echo '</a></div>';
-    echo '</div>';
-        echo '</div>';
 }
 
 // Displaying the table header with all the questions
-echo '<table class="data_table">';
-echo '	<tr class="row_odd">';
-echo '		<th width="15">'.get_lang('QuestionNumber').'</th>';
-echo '		<th>'.get_lang('Title').'</th>';
-echo '		<th>'.get_lang('Type').'</th>';
-echo '		<th width="50" >'.get_lang('NumberOfOptions').'</th>';
-echo '		<th width="100">'.get_lang('Modify').'</th>';
+echo '<table class="table table-bordered">';
+echo '<thead>';
+echo '<tr>';
+echo '		<th width="5%">'.get_lang('NumberAbbreviation').'</th>';
+echo '		<th width="50%">'.get_lang('Title').'</th>';
+echo '		<th width="15%">'.get_lang('Type').'</th>';
+echo '		<th width="15%" >'.get_lang('NumberOfOptions').'</th>';
+echo '		<th width="15%">'.get_lang('Modify').'</th>';
 if ($is_survey_type_1) {
     echo '<th width="100">'.get_lang('Condition').'</th>';
     echo '<th width="40">'.get_lang('Group').'</th>';
 }
 echo '	</tr>';
+echo '</thead>';
 
 // Displaying the table contents with all the questions
 $question_counter = 1;

+ 4 - 2
main/survey/survey_question.php

@@ -309,7 +309,8 @@ class survey_question
             'button',
             'remove_answer',
             get_lang('RemoveAnswer'),
-            'minus'
+            'minus',
+            'default'
         );
 
         if (count($data['answers']) <= 2) {
@@ -322,7 +323,8 @@ class survey_question
             'button',
             'add_answer',
             get_lang('AddAnswer'),
-            'plus'
+            'plus',
+            'default'
         );
     }