Menu

$wgHooks['MobileMenu'][] = function ( $name, \MediaWiki\Minerva\Menu\Group &$group ) {

   if ( $name !== 'discovery' ) {
           $group->insert( 'upload' )

->addComponent(

                    $this->msg( 'mobile-frontend-upload-button' )->escaped(),
                   SpecialPage::getTitleFor( 'Upload' )->getLocalUrl() . '#/upload',
                   MobileUI::iconClass( 'mf-upload-invert', 'before' ),

[

                       'id' => 'uploadButton',
                       'data-event-name' => 'upload',
                   ]   

); } };

var

   menuLayout = new OO.ui.MenuLayout( {
       menuPosition: 'top'
   } ),
   menuPanel = new OO.ui.PanelLayout( { padded: true, expanded: true, scrollable: true } ),
   contentPanel = new OO.ui.PanelLayout( { padded: true, expanded: true, scrollable: true } ),
   select = new OO.ui.SelectWidget( {
       items: [
           new OO.ui.OptionWidget( {
               data: 'before',
               label: 'Before',
           } ),
           new OO.ui.OptionWidget( {
               data: 'after',
               label: 'After',
           } ),
           new OO.ui.OptionWidget( {
               data: 'top',
               label: 'Top',
           } ),
           new OO.ui.OptionWidget( {
               data: 'bottom',
               label: 'Bottom',
           } )
       ]
   } ).on( 'select', function ( item ) {
      menuLayout.setMenuPosition( item.getData() );
   } );

   menuLayout.$menu.append(
       menuPanel.$element.append( 'Menu panel', select.$element )
   );
   menuLayout.$content.append(

contentPanel.$element.append( 'Content panel', '

Note that the menu is positioned relative to the content panel: top, bottom, after, before.

')

   );

$( document.body ).append( menuLayout.$element );