diff --git a/VERSIONS_WIP/49216 b/VERSIONS_WIP/49216 new file mode 100644 index 0000000000000000000000000000000000000000..0f946841a235651552ed854be8b64c56a54f3d7e --- /dev/null +++ b/VERSIONS_WIP/49216 @@ -0,0 +1 @@ + - ticket #49216 : CSS : Menu verticaux dans la bannière / Responsive [Contractuel CAVY] \ No newline at end of file diff --git a/public/opac/css/responsive.css b/public/opac/css/responsive.css index 59471f5cbdf645620af67a4d3f33ab981f43135a..7beac40c235f8e4d0dfbfd7d658029b4a6956cc1 100644 --- a/public/opac/css/responsive.css +++ b/public/opac/css/responsive.css @@ -43,8 +43,8 @@ } - .boite[class*="menu"] .contenu, - .boite[class*="menu"] .content, + .boite[class*="menu_horizontal"] .contenu, + .boite[class*="menu_horizontal"] .content, #menu_horizontal , #header , #header > * { @@ -59,26 +59,26 @@ #menu_horizontal, - #header div[class*="menu"] { + #header div[class*="menu_horizontal"] { position: relative !important; } - div[class*="menu"].show_menu > ul ul, - div[class*="menu"].show_menu > ul li { + div[class*="menu_horizontal"].show_menu > ul ul, + div[class*="menu_horizontal"].show_menu > ul li { min-width: 0 !important; } - div[class*="menu"] li img { + div[class*="menu_horizontal"] li img { display: none !important; } - div[class*="menu"]:not(.show_menu) > ul > li , - div[class*="menu"]:not(.show_menu) > ul > li > ul , - div[class*="menu"]:not(.show_menu) > ul > li > ul > li { + div[class*="menu_horizontal"]:not(.show_menu) > ul > li , + div[class*="menu_horizontal"]:not(.show_menu) > ul > li > ul , + div[class*="menu_horizontal"]:not(.show_menu) > ul > li > ul > li { position: absolute !important; top: 0 !important; left: 0 !important; @@ -87,12 +87,12 @@ } - div[class*="menu"].show_menu > ul li { + div[class*="menu_horizontal"].show_menu > ul li { margin: auto !important } - div[class*="menu"] > ul > li { + div[class*="menu_horizontal"] > ul > li { display: block !important; height: auto !important; } @@ -101,8 +101,8 @@ #header > *, #menu_horizontal, - #header div[class*="menu"] , - div[class*="menu"] * { + #header div[class*="menu_horizontal"] , + div[class*="menu_horizontal"] * { display: block !important; left: auto !important; top: auto !important; @@ -391,7 +391,7 @@ /** MENU **/ - div:not(.show_menu)[class*="menu"], + div:not(.show_menu)[class*="menu_horizontal"], #menu_horizontal { background: none; height: auto; @@ -400,21 +400,21 @@ } - div[class*="menu"] * { + div[class*="menu_horizontal"] * { transition: none; } - div[class*="menu"] > ul { + div[class*="menu_horizontal"] > ul { } - div[class*="menu"] > ul > li > a { + div[class*="menu_horizontal"] > ul > li > a { text-transform: uppercase; } - div[class*="menu"] > ul { + div[class*="menu_horizontal"] > ul { display: block; position: absolute; height: 0; @@ -422,8 +422,8 @@ } - div[class*="menu"].show_menu > ul ul, - div[class*="menu"].show_menu > ul li, + div[class*="menu_horizontal"].show_menu > ul ul, + div[class*="menu_horizontal"].show_menu > ul li, #menu_horizontal.show_menu > ul ul, #menu_horizontal.show_menu > ul li { display: block; @@ -440,7 +440,7 @@ #menu_horizontal.show_menu > ul > li, - div[class*="menu"].show_menu > ul > li { + div[class*="menu_horizontal"].show_menu > ul > li { float: left; width: 100%; border-bottom: 1px solid #efefef; @@ -448,15 +448,15 @@ #menu_horizontal.show_menu > ul > li:last-of-type, - div[class*="menu"].show_menu > ul > li:last-of-type { + div[class*="menu_horizontal"].show_menu > ul > li:last-of-type { border: none; } - div[class*="menu"] > ul ul, - div[class*="menu"] > ul li, - div[class*="menu"] > ul li a, - div[class*="menu"] > ul li ul li a, + div[class*="menu_horizontal"] > ul ul, + div[class*="menu_horizontal"] > ul li, + div[class*="menu_horizontal"] > ul li a, + div[class*="menu_horizontal"] > ul li ul li a, #menu_horizontal > ul ul, #menu_horizontal > ul li, #menu_horizontal > ul li a , @@ -465,9 +465,9 @@ } - div[class*="menu"].show_menu > ul ul, - div[class*="menu"].show_menu > ul li, - div[class*="menu"].show_menu > ul li a, + div[class*="menu_horizontal"].show_menu > ul ul, + div[class*="menu_horizontal"].show_menu > ul li, + div[class*="menu_horizontal"].show_menu > ul li a, #menu_horizontal.show_menu > ul ul, #menu_horizontal.show_menu > ul li, #menu_horizontal.show_menu > ul li a { @@ -476,7 +476,7 @@ } - div[class*="menu"].show_menu > ul li { + div[class*="menu_horizontal"].show_menu > ul li { line-height: 2em; } @@ -487,17 +487,17 @@ #menu_horizontal, - #header div[class*="menu"] , - div[class*="menu"].show_menu > ul, + #header div[class*="menu_horizontal"] , + div[class*="menu_horizontal"].show_menu > ul, #menu_horizontal.show_menu > ul , - div:not(.show_menu)[class*="menu"] li.selected_profil > a[href*="/"], + div:not(.show_menu)[class*="menu_horizontal"] li.selected_profil > a[href*="/"], #menu_horizontal:not(.show_menu) li.selected_profil > a[href*="/"] , - div:not(.boite)[class*="menu"]:after { + div:not(.boite)[class*="menu_horizontal"]:after { background-color: #333; } - div[class*="menu"].show_menu > ul, + div[class*="menu_horizontal"].show_menu > ul, #menu_horizontal.show_menu > ul{ visibility: visible; width: auto; @@ -510,12 +510,12 @@ } - div[class*="menu"] li.selected_profil > a[href*="/"]:only-child { + div[class*="menu_horizontal"] li.selected_profil > a[href*="/"]:only-child { visibility: visible; } - div:not(.show_menu)[class*="menu"] li.selected_profil > a[href*="/"]:only-child, + div:not(.show_menu)[class*="menu_horizontal"] li.selected_profil > a[href*="/"]:only-child, #menu_horizontal:not(.show_menu) li.selected_profil > a[href*="/"]:only-child{ float: left; line-height: 3em; @@ -524,7 +524,7 @@ } - div[class*="menu"].show_menu li.selected_profil > a[href*="/"]:only-child, + div[class*="menu_horizontal"].show_menu li.selected_profil > a[href*="/"]:only-child, #menu_horizontal.show_menu li.selected_profil > a[href*="/"]:only-child { border-left: 5px solid #00C000; margin-left: -10px; @@ -532,7 +532,7 @@ } - div:not(.boite)[class*="menu"]:after { + div:not(.boite)[class*="menu_horizontal"]:after { content: ''; height: 3em; width: 3em; @@ -543,7 +543,7 @@ } - div:not(.boite)[class*="menu"].show_menu:after { + div:not(.boite)[class*="menu_horizontal"].show_menu:after { background: #333 url(../images/buttons/close_menu.png) no-repeat center center / 2em; } @@ -749,4 +749,4 @@ max-width: 100%; min-width: 100%; } -} \ No newline at end of file +} diff --git a/public/opac/js/responsive.js b/public/opac/js/responsive.js index 8052bee673164b2c92c4064e92c73bbcd6776880..2c1d0ec63802d2cb9fdc601214b2dae4feb6a14e 100644 --- a/public/opac/js/responsive.js +++ b/public/opac/js/responsive.js @@ -1,11 +1,11 @@ $(document).ready(function() { var enableMenuButton = function() { - $("div:not(.boite)[class*='menu']").click(function(e) { - $("div:not(.boite)[class*='menu']").not(this).removeClass('show_menu'); + $("div:not(.boite)[class*='menu_horizontal']").click(function(e) { + $("div:not(.boite)[class*='menu_horizontal']").not(this).removeClass('show_menu'); $(this).toggleClass('show_menu'); }); - $("div:not(.boite)[class*='menu'] * ").not('.configuration_module *').click(function(e) { + $("div:not(.boite)[class*='menu_horizontal'] * ").not('.configuration_module *').click(function(e) { e.stopImmediatePropagation(); }); }