From c16961925597b2c62962b08dcb06ecefebad9a16 Mon Sep 17 00:00:00 2001 From: Dany De Bontridder Date: Fri, 28 Feb 2014 00:12:44 +0100 Subject: [PATCH] Responsive for style-light.css + correct esthetic --- html/js/card.js | 12 +-- html/js/scripts.js | 4 +- html/recherche.php | 8 ++ html/style-light.css | 147 +++++++++++++++++++++++++------- html/user_login.php | 4 +- include/balance.inc.php | 2 +- include/class_pre_operation.php | 2 +- 7 files changed, 135 insertions(+), 44 deletions(-) diff --git a/html/js/card.js b/html/js/card.js index 316be2910..c848f5683 100644 --- a/html/js/card.js +++ b/html/js/card.js @@ -104,7 +104,7 @@ function search_card(obj) sx=document.body.scrollTop+60; } - var div_style="top:"+sx+"px;width:60%;heigth:80%"; + var div_style="top:"+sx+"px;height:80%"; add_div({id:'search_card',cssclass:'inner_box',html:loading(),style:div_style,drag:true}); var action=new Ajax.Request ( 'ajax_card.php', @@ -440,7 +440,7 @@ function select_card_type(obj) sx=document.body.scrollTop+60; } - var str_style="top:"+sx+"px;left:25%;width:50%;height:30%"; + var str_style="top:"+sx+"px;left:25%;height:30%"; var popup={'id': content,'cssclass':'inner_box','style':str_style,'html':loading(),'drag':true}; @@ -504,9 +504,9 @@ function dis_blank_card(obj) ref='&ref'; } var content='div_new_card'; - var nTop=posY-40; - var nLeft=posX-20; - var str_style="top:"+nTop+"px;left:"+nLeft+"px;width:60em;height:auto"; + var nTop=calcy(30); + var nLeft=posX; + var str_style="top:"+nTop+"px;right:"+nLeft+"px;height:auto"; var popup={'id': content,'cssclass':'inner_box','style':str_style,'html':loading(),'drag':true}; if ( $(content)) {removeDiv(content);} @@ -609,7 +609,7 @@ function add_category(obj) sx=document.body.scrollTop+120; } - var div_style="top:"+sx+"px;width:60%;heigth:80%"; + var div_style="top:"+sx+"px;width:60%;height:80%"; // show ipopup var div={id:obj.ipopup, cssclass:"inner_box",drag:1,style:div_style}; diff --git a/html/js/scripts.js b/html/js/scripts.js index 89f99fb4d..2815a5a3d 100644 --- a/html/js/scripts.js +++ b/html/js/scripts.js @@ -2220,7 +2220,7 @@ function action_tag_select(p_dossier, ag_id) } var code_html = getNodeText(html[0]); code_html = unescape_xml(code_html); - add_div({id: 'tag_div', style: 'width:40%;', cssclass: 'inner_box', drag: 1}); + add_div({id: 'tag_div', style: '', cssclass: 'inner_box', drag: 1}); $('tag_div').style.top = posY - 70; $('tag_div').style.left = posX - 70; remove_waiting_box(); @@ -2335,7 +2335,7 @@ function search_display_tag(p_dossier, p_prefix) var code_html = getNodeText(html[0]); code_html = unescape_xml(code_html); remove_waiting_box(); - add_div({id: p_prefix + 'tag_div', style: 'width:40%', cssclass: 'inner_box', drag: 1}); + add_div({id: p_prefix + 'tag_div', style: '', cssclass: 'inner_box', drag: 1}); $(p_prefix + 'tag_div').style.top = posY - 80; $(p_prefix + 'tag_div').style.left = posX - 200; remove_waiting_box(); diff --git a/html/recherche.php b/html/recherche.php index b9356b20d..0bb4c2126 100644 --- a/html/recherche.php +++ b/html/recherche.php @@ -63,6 +63,10 @@ echo '
'; echo '
'; echo $search_box; echo HtmlInput::submit("viewsearch",_("Recherche")); +?> + + +'; //----------------------------------------------------- @@ -103,6 +107,10 @@ if ( isset ($_GET['viewsearch'])) echo HtmlInput::hidden('act','CSV:histo'); echo HtmlInput::submit('viewsearch','Export vers CSV'); echo HtmlInput::hidden('p_action','ALL'); + ?> + + +'; } echo '
'; diff --git a/html/style-light.css b/html/style-light.css index e285dc527..fcfe28b2a 100644 --- a/html/style-light.css +++ b/html/style-light.css @@ -549,6 +549,7 @@ h1.legend, legend { font-weight: bold; font-style: italic; + font-size: 1.2rem; } fieldset fieldset legend { color:grey; @@ -753,10 +754,18 @@ div.pc_calendar table { } div.pc_calendar tr{ } -div.pc_calendar tr{ - height:40; - - +div.content div.pc_calendar tr{ + height:40px; +} +@media only screen and (min-width: 640px) { + div.pc_calendar tr{ + height:110px; + } +} +@media only screen and (max-width: 640px) { + div.pc_calendar tr{ + height:40px; + } } div.pc_calendar td{ width:14%; @@ -773,7 +782,6 @@ div.pc_calendar td.workday{ div.pc_calendar span.day{ font-weight: bold; display:block; - } div.pc_calendar span.event{ font-weight: bolder; @@ -920,6 +928,16 @@ div.inner_box { box-shadow: 10px 10px 5px #888; font-size:0.90rem; } +@media only screen and (min-width: 1024px) { +div.inner_box { + width: 35%; + } +} +@media only screen and (max-width: 1024px) { +div.inner_box { + width: 80%; + } +} div.op_detail_title { background-color:grey; /* width:500;*/ @@ -951,9 +969,16 @@ div#search_form width:50%; display:none; background-color:#e4e7ed; --moz-box-shadow: 10px 10px 5px #888; --webkit-box-shadow: 10px 10px 5px #888; -box-shadow: 10px 10px 5px #888; + -moz-box-shadow: 10px 10px 5px #888; + -webkit-box-shadow: 10px 10px 5px #888; + box-shadow: 10px 10px 5px #888; +} +@media only screen and (max-width: 995px) { + div#search_form { + width:90%; + margin-left:5%; + left:0px; + } } table.sortable td, table.table_large td, table.result td @@ -985,17 +1010,26 @@ span.remain { color:black; } -div#jrn_name_div -{ - float: right; - margin-right:150px; +@media only screen and (min-width: 955px) { + div#jrn_name_div + { + float: right; + margin-right:150px; + } + #predef_form { + margin-left:20%; + width:60%; + position: absolute; + } } -#predef_form { - margin-left:20%; - width:60%; - position: absolute; +@media only screen and (max-width: 955px) { + div#jrn_name_div + { + } + #predef_form { + } } #direct { @@ -1114,6 +1148,7 @@ a.nav:hover,div.content a.nav:hover,div.redcontent a.nav:hover { background-color:darkblue; color:white; } +@media only screen and (min-width: 955px) { #dossier { display:inline; float:left; @@ -1122,9 +1157,25 @@ a.nav:hover,div.content a.nav:hover,div.redcontent a.nav:hover { text-align: center; font-variant:small-caps; font-weight: bolder; + } } +@media only screen and (max-width: 955px) { +#dossier { + display:inline; + float:left; + width:100%; + top:0px; + text-align: left; + font-variant:small-caps; + font-weight: bolder; + } +} + div.foldercontent { - padding:20px 30px 0px 40px; + font-size:14px; + font-size:0.95rem; + width: 80%; + margin-left: 10%; } h1.title { @@ -1187,12 +1238,12 @@ div.menu3 { margin-left:30px; } #folder { - width:auto; border-width:0px; - border-collapse:collapse; - - -} + border-collapse: collapse; + } + #folder tr { + height: 30px; + } /*#folder tr.odd,#folder tr.even { font-size : 1.2em; }*/ @@ -1202,7 +1253,21 @@ textarea.itextarea{ margin-left:5%; height:120px; } -div#modele_op_div{ + +div#notice { + position:absolute; + right:5%; + top:200px; + background-color:yellow; + border: 1px solid black; +} +@media only screen and (min-width: 955px) { + div.name { + position:absolute; + top:0px; + left:0px; + } + div#modele_op_div{ display: none; background-color:#e4e7ed; font-family: Arial, Helvetica, "Liberation Sans", FreeSans, sans-serif; @@ -1211,22 +1276,33 @@ div#modele_op_div{ overflow:hidden; z-index:3; position:absolute; - left:30%; - width:40%; + left: 17.5%; border:1px solid darkblue; + width: 75%; } -div#notice { - position:absolute; - right:5%; - top:200px; - background-color:yellow; - border: 1px solid black; } -div.name { +@media only screen and (max-width: 955px) { + div.name { position:absolute; top:0px; left:0px; + display:none; + } + div#modele_op_div{ + display: none; + background-color:#e4e7ed; + font-family: Arial, Helvetica, "Liberation Sans", FreeSans, sans-serif; + padding:0px; + margin:0px; + overflow:hidden; + z-index:3; + position:absolute; + left: 10%; + border:1px solid darkblue; + width: 80%; } +} + div#box_search_card { position:absolute; right:15.625%; @@ -1321,3 +1397,10 @@ div.box { font-size:14px; font-size:0.90rem; } +@media only screen and (max-width: 955px) { + div.box { + width: 95%; + + height: 380px; +} +} \ No newline at end of file diff --git a/html/user_login.php b/html/user_login.php index 5b2226134..ea77f1610 100644 --- a/html/user_login.php +++ b/html/user_login.php @@ -157,8 +157,8 @@ echo '
'.$result.'
'; echo ''; ?>
-'._('Choississez votre dossier').'';?> - +'._('Choississez un dossier').'';?> + diff --git a/include/balance.inc.php b/include/balance.inc.php index 8dfd387d9..4a47b1558 100644 --- a/include/balance.inc.php +++ b/include/balance.inc.php @@ -42,7 +42,7 @@ echo '
'; /* * Let you change the exercice */ -echo '
'._('Choississez un autre exercice').'';; +echo '
'._('Choississez un autre exercice').'';; echo ''; echo 'Choississez un autre exercice :'; $ex=new Exercice($cn); diff --git a/include/class_pre_operation.php b/include/class_pre_operation.php index 1c76aa480..1be1a2704 100644 --- a/include/class_pre_operation.php +++ b/include/class_pre_operation.php @@ -246,7 +246,7 @@ class Pre_operation_detail function form_get ($p_url) { $r=HtmlInput::button_action("Modèle d'opérations", ' $(\'modele_op_div\').style.display=\'block\';$(\'lk_modele_op_tab\').focus();'); - $r.='
'; + $r.='
'; $r.=HtmlInput::title_box("Modèle d'opérations ", 'modele_op_div', 'hide'); $hid=new IHidden(); $r.=$hid->input("action","use_opd");