diff --git a/phpBB/styles/prosilver/template/forum_fn.js b/phpBB/styles/prosilver/template/forum_fn.js index 1b2b1954ef..d4653c1be3 100644 --- a/phpBB/styles/prosilver/template/forum_fn.js +++ b/phpBB/styles/prosilver/template/forum_fn.js @@ -433,6 +433,39 @@ function parse_document(container) jumpto($(this)); }); + /** + * Dropdowns + */ + container.find('.dropdown-container').each(function() { + var $this = $(this), + trigger = $this.find('.dropdown-trigger:first'), + contents = $this.find('.dropdown'), + options = { + direction: 'auto', + verticalDirection: 'auto' + }, + data; + + if (!trigger.length) { + data = $this.attr('data-dropdown-trigger'); + trigger = data ? $this.children(data) : $this.children('a:first'); + } + + if (!contents.length) { + data = $this.attr('data-dropdown-contents'); + contents = data ? $this.children(data) : $this.children('div:first'); + } + + if (!trigger.length || !contents.length) return; + + if ($this.hasClass('dropdown-up')) options.verticalDirection = 'up'; + if ($this.hasClass('dropdown-down')) options.verticalDirection = 'down'; + if ($this.hasClass('dropdown-left')) options.verticalDirection = 'left'; + if ($this.hasClass('dropdown-right')) options.verticalDirection = 'right'; + + phpbb.registerDropdown(trigger, contents, options); + }); + /** * Adjust HTML code for IE8 and older versions */ diff --git a/phpBB/styles/prosilver/theme/common.css b/phpBB/styles/prosilver/theme/common.css index 225673a932..41cfb37cf2 100644 --- a/phpBB/styles/prosilver/theme/common.css +++ b/phpBB/styles/prosilver/theme/common.css @@ -407,6 +407,14 @@ li.responsive-menu .dropdown .dropdown-contents { padding: 0 5px; } +ul.linklist .dropdown-down .dropdown { + top: 22px; +} + +ul.linklist .dropdown-up .dropdown { + bottom: 18px; +} + ul.linklist .dropdown li { clear: both; } @@ -437,10 +445,18 @@ ul.linklist.bulletin li.no-bulletin:before { /* Dropdown menu ----------------------------------------*/ +.dropdown-container { + position: relative; +} + +.nojs .dropdown-container:hover .dropdown { + display: block !important; +} + .dropdown { position: absolute; left: 0; - top: 22px; + top: 1.2em; z-index: 2; border: 1px solid transparent; border-radius: 5px; @@ -449,16 +465,15 @@ ul.linklist.bulletin li.no-bulletin:before { .dropdown-up .dropdown { top: auto; - bottom: 18px; + bottom: 1.2em; padding: 0 0 9px; } -.dropdown-left .dropdown { +.dropdown-left .dropdown, .nojs .rightside .dropdown { left: auto; right: 0; } - .dropdown .pointer, .dropdown .pointer-inner { position: absolute; width: 0; @@ -488,7 +503,7 @@ ul.linklist.bulletin li.no-bulletin:before { top: auto; } -.dropdown-left .dropdown .pointer { +.dropdown-left .dropdown .pointer, .nojs .rightside .dropdown .pointer { left: auto; right: 10px; }