From 4e5029c4b7d8cad33ac69f30a920477f52bd010c Mon Sep 17 00:00:00 2001 From: Dany De Bontridder Date: Sat, 21 Mar 2020 11:41:14 +0100 Subject: [PATCH] Output_Html_Tab : cosmetic --- html/style-classic.css | 9 +++- html/style-classic7.css | 71 ++++++++++++++++++++------- html/style-light.css | 19 ++++++- include/lib/html_tab.class.php | 22 ++++++++- include/lib/output_html_tab.class.php | 37 ++++++++++++-- 5 files changed, 131 insertions(+), 27 deletions(-) diff --git a/html/style-classic.css b/html/style-classic.css index c24061e9e..e830a15b2 100644 --- a/html/style-classic.css +++ b/html/style-classic.css @@ -2419,4 +2419,11 @@ span.warning { color:white; display:block; background-color: lightblue; - } \ No newline at end of file + } +span.tab_row { + font-style: italic; + font-size:90%; +} +span.title_tab_row { + +} \ No newline at end of file diff --git a/html/style-classic7.css b/html/style-classic7.css index 0842dec2b..5b3233330 100644 --- a/html/style-classic7.css +++ b/html/style-classic7.css @@ -55,7 +55,6 @@ input:focus { font-style: italic; } - a.mtitle span.notice { text-decoration: underline; } @@ -2329,13 +2328,13 @@ span.warning { * Tabs like row ****************************************************************************/ ul.tab_row { - padding-top: 15px; + padding-top: 25px; display:block; - width:96%; - padding-left:2%; - padding-right:2%; + width:100%; + padding-left:0%; + padding-right:0%; list-style: none; - margin-left:2px; + margin-left:0px; } ul.tab_row a { display:block; @@ -2343,7 +2342,7 @@ span.warning { } li.tab_row_selected { display:block; - width:90%; + width:96%; background: #C2E3FC; /* Old browsers */ background: -moz-linear-gradient(top, #C2E3FC 0%, #6393c1 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#C2E3FC), color-stop(100%,#6393c1)); /* Chrome,Safari4+ */ @@ -2353,7 +2352,7 @@ span.warning { background: linear-gradient(to bottom, #C2E3FC 0%,#6393c1 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#C2E3FC', endColorstr='#6393c1',GradientType=0 ); /* IE6-9 */ color:whitesmoke; - margin-left: 2px; + /*! margin-left: 2px; */ border-top-left-radius: 10px; border-top-right-radius: 10px; border:1px #879ed4 solid; @@ -2362,15 +2361,17 @@ span.warning { margin-top:13px; + padding-left: 2%; + padding-right: 2%; } li.tab_row { display:block; - width:90%; + width:auto; background-color: inherit; color:inherit;/*! margin-left: 0px; */ - /*! padding: 5px; */ - /*! border-top-left-radius: 10px; */ - /*! border-top-right-radius: 10px; */ + padding: 5px; + border-top-left-radius: 10px; + border-top-right-radius: 10px; border:1px #879ed4 solid; background: whitesmoke; margin-top:13px; @@ -2391,9 +2392,8 @@ span.warning { li.tab_row { display:block; background-color: inherit; - - - padding: 15px 7px 0px 10px; + padding: 20px 15px 15px 20px; + margin: 20px 15px 15px 15px; border-top-left-radius: 10px; border-top-right-radius: 10px; border:1px #879ed4 solid; @@ -2403,13 +2403,15 @@ span.warning { display:block; background-color: lightblue; color:wheat;margin-left: 2px; - padding: 15px 7px 0px 10px; + padding: 20px 15px 15px 20px; + margin: 20px 15px 15px 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; border:1px #879ed4 solid; } li.tab_row_selected { - padding: 12px 15px 15px 15px; + padding: 20px 15px 15px 20px; + margin:20px 15px 15px 15px; } } ul.tab_row a { @@ -2420,10 +2422,43 @@ span.warning { width: 100%; height: 100%; cursor :pointer; + text-align: center; + + + } ul.tab_row a:hover { text-decoration: none; color:white; display:block; background-color: lightblue; - } \ No newline at end of file + /*! text-align: center; */ + } + div.tab_row { + background-color: aliceblue; + border-color: #879ed4; + border-width: 1px; + border-style: solid; + } +span.tab_row { + font-style: italic; + font-size:90%; +} +span.title_tab_row { + font-size:105%; + font-weight: bold; + background-color: darkblue; + color:white; + padding : 3px; +} +span.tab_row { + font-style: italic; + font-size:90%; +} +span.title_tab_row { + font-size:105%; + font-weight: bold; + background-color: darkblue; + color:white; + padding : 3px; +} \ No newline at end of file diff --git a/html/style-light.css b/html/style-light.css index df96649ce..95b758593 100644 --- a/html/style-light.css +++ b/html/style-light.css @@ -2292,6 +2292,7 @@ span.warning { border:1px #879ed4 solid; background: whitesmoke; margin-top:13px; + padding:5px; } li.tab_row:hover { @@ -2311,7 +2312,7 @@ span.warning { background-color: inherit; - padding: 15px 7px 0px 10px; + padding: 15px 7px 15px 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; border:1px #879ed4 solid; @@ -2338,10 +2339,24 @@ span.warning { width: 100%; height: 100%; cursor :pointer; + padding: 3px; } ul.tab_row a:hover { text-decoration: none; color:white; display:block; background-color: lightblue; - } \ No newline at end of file + } + +span.tab_row { + font-style: italic; + font-size:90%; +} +span.title_tab_row { + font-size:105%; + font-weight: bold; + background-color: darkblue; + color:white; + padding : 3px; + +} \ No newline at end of file diff --git a/include/lib/html_tab.class.php b/include/lib/html_tab.class.php index ee3304a39..55b51c090 100644 --- a/include/lib/html_tab.class.php +++ b/include/lib/html_tab.class.php @@ -35,7 +35,7 @@ class Html_Tab private $content ; //!< static content of the tab private $mode ; //!< possible values are static if the content is static, ajax for calling an ajax, link for a html link, default static private $link; //!< the javascript or an html link, depending of the $mode - + private $comment; //!< comment to add when we use the row /** *@example html_tab.test.php */ @@ -44,7 +44,27 @@ class Html_Tab $this->id=$p_id; $this->title=$p_title; $this->mode='static'; + $this->comment=""; } + + /** + * @return string + */ + public function get_comment() + { + return $this->comment; + return $this; + } + + /** + * @param string $comment + */ + public function set_comment($comment) + { + $this->comment = $comment; + return $this; + } + public function get_id() { return $this->id; diff --git a/include/lib/output_html_tab.class.php b/include/lib/output_html_tab.class.php index cf54c5831..c8af50d90 100644 --- a/include/lib/output_html_tab.class.php +++ b/include/lib/output_html_tab.class.php @@ -155,10 +155,10 @@ class Output_Html_Tab } } elseif ($this->get_mode()=="row") { if ( $this->a_tabs[$i]->get_id() != $p_not_hidden) { - $r .= sprintf("Effect.BlindUp('div%s',{duration : 1.0});",$this->a_tabs[$i]->get_id() ); + $r .= sprintf("Effect.BlindUp('div%s',{duration : 0.7});",$this->a_tabs[$i]->get_id() ); $r .= sprintf("$('tab%s').className='%s';",$this->a_tabs[$i]->get_id(),$this->class_tab ); } else { - $r .= sprintf("Effect.SlideDown('div%s',{duration : 1.0});",$p_not_hidden ); + $r .= sprintf("Effect.SlideDown('div%s',{duration : 0.7});",$p_not_hidden ); $r .= sprintf("$('tab%s').className='%s';",$p_not_hidden ,$this->class_tab_selected); } @@ -166,6 +166,18 @@ class Output_Html_Tab } return $r; } + + /** + * When printing row , a comment is written if not empty + * @param $p_index + */ + protected function print_comment($p_index) { + printf (' %s ', + $this->get_class_tab(), + $this->a_tabs[$p_index]->get_comment() + ); + + } /** * print the html + javascript code of the tabs and the div * @@ -188,7 +200,10 @@ class Output_Html_Tab printf ('', $this->a_tabs[$i]->get_id(), $this->a_tabs[$i]->get_link()); - echo $this->a_tabs[$i]->get_title(); + printf (' %s ', + $this->get_class_tab(), + $this->a_tabs[$i]->get_title() + ); echo ''; break; @@ -196,6 +211,11 @@ class Output_Html_Tab printf('', $this->a_tabs[$i]->get_id(), $this->a_tabs[$i]->get_link()); + printf (' %s ', + $this->get_class_tab(), + $this->a_tabs[$i]->get_title() + ); + echo $this->a_tabs[$i]->get_title(); echo ''; break; @@ -203,13 +223,20 @@ class Output_Html_Tab // show one , hide other $script=$this->build_js($this->a_tabs[$i]->get_id()); printf('', $script); - echo $this->a_tabs[$i]->get_title(); + printf (' %s ', + $this->get_class_tab(), + $this->a_tabs[$i]->get_title() + ); + echo ''; break; default: break; } + if ( $this->get_mode()=="row") { + $this->print_comment($i); + } echo ''; if ( $this->get_mode()=="row") { $this->print_div($i); @@ -226,7 +253,7 @@ class Output_Html_Tab } private function print_div($p_index) { - printf('