github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-24 23:48:45 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Merge pull request #3741 from scossar/reorder-menu-components-in-markup

Browse Source 
FIX: reorder header markup so it works in LTR and RTL layouts
This commit is contained in:
Robin Ward 2015-09-10 13:47:52 -04:00
commit e29d24fefa
3 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/assets/javascripts/discourse/components/menu-panel.js.es6
View File

@ -28,11 +28,9 @@ export default Ember.Component.extend({
const $buttonPanel = $('header ul.icons'); const $buttonPanel = $('header ul.icons');
if ($buttonPanel.length === 0) { return; } if ($buttonPanel.length === 0) { return; }
const buttonPanelPos = $buttonPanel.offset(); // These values need to be set here, not in the css file - this is to deal with the
const posTop = parseInt(buttonPanelPos.top + $buttonPanel.height() - $('header.d-header').offset().top); // possibility of the window being resized and the menu changing from .slide-in to .drop-down.
const posLeft = parseInt(buttonPanelPos.left + $buttonPanel.width() - width); this.$().css({ top: '100%', height: 'auto' });
this.$().css({ left: posLeft + "px", top: posTop + "px", height: 'auto' });
// adjust panel height // adjust panel height
const fullHeight = parseInt($window.height()); const fullHeight = parseInt($window.height());

9
app/assets/javascripts/discourse/templates/header.hbs
View File

@ -1,8 +1,3 @@
{{plugin-outlet "header-before-dropdowns"}}
{{user-menu visible=userMenuVisible logoutAction="logout"}}
{{hamburger-menu visible=hamburgerVisible showKeyboardAction="showKeyboardShortcutsHelp"}}
{{search-menu visible=searchVisible}}
<div class='wrap'> <div class='wrap'>
<div class='contents clearfix'> <div class='contents clearfix'>
{{home-logo minimized=showExtraInfo}} {{home-logo minimized=showExtraInfo}}
@ -54,6 +49,10 @@
{{/header-dropdown}} {{/header-dropdown}}
{{/if}} {{/if}}
</ul> </ul>
{{plugin-outlet "header-before-dropdowns"}}
{{user-menu visible=userMenuVisible logoutAction="logout"}}
{{hamburger-menu visible=hamburgerVisible showKeyboardAction="showKeyboardShortcutsHelp"}}
{{search-menu visible=searchVisible}}
</div> </div>
{{#if showExtraInfo}} {{#if showExtraInfo}}

5
app/assets/stylesheets/common/base/menu-panel.scss
View File

@ -1,5 +1,6 @@
.menu-panel.slide-in { .menu-panel.slide-in {
position: fixed; position: fixed;
// positions are relative to the .d-header .panel div
right: 0; right: 0;
top: 0; top: 0;
@ -13,6 +14,9 @@
.menu-panel.drop-down { .menu-panel.drop-down {
position: absolute; position: absolute;
// positions are relative to the .d-header .panel div
top: 100%; // directly underneath .panel
right: -10px; // 10px to the right of .panel - adjust as needed
} }
.menu-panel { .menu-panel {
@ -20,7 +24,6 @@
box-shadow: 0 2px 2px rgba(0,0,0, .25); box-shadow: 0 2px 2px rgba(0,0,0, .25);
background-color: $secondary; background-color: $secondary;
z-index: 1100; z-index: 1100;
overflow: none;
padding: 0.5em; padding: 0.5em;
width: 300px; width: 300px;