Module:NavboxMobile/doc

This module implements the Navbox template for mobile devices when Extension:MobileFrontend is installed. An overview is described in Template:Navbox.

Implementation
The module was copied from Module:Navbox, Module:Navbox/configuration, Module:Navbox/styles.css and modified as follows.

Module
The configuration filename was changed:

Add function at line 72: local function addTableRow(tbl)		-- added -- If any other rows have already been added, then we add a 2px gutter row. if tableRowAdded then tbl :tag('tr') :css('height', '2px') :tag('td') :attr('colspan',2) end

tableRowAdded = true

return tbl:tag('tr') end

Comment out code at line 118: --if args[cfg.arg.imageleft] then titleColspan = titleColspan + 1 end	if args[cfg.arg.image] then titleColspan = titleColspan + 1 end

Comment out code at line 141: --if args[cfg.arg.imageleft] then ret = ret + 1 end	if args[cfg.arg.image] then ret = ret + 1 end

Comment out code at line 179: --if index == 1 and args[cfg.arg.imageleft] then		row			:tag('td')				:addClass(cfg.class.noviewer)				:addClass(cfg.class.navbox_image)				:addClass(args[cfg.arg.imageclass])				:css('width', '1px')              -- Minimize width				:css('padding', '0 2px 0 0')				:cssText(args[cfg.arg.imageleftstyle])				:attr('rowspan', listnums_size)				:tag('div')					:wikitext(processItem(args[cfg.arg.imageleft]))	end

Add line 218: local row = addTableRow(tbl)		-- added

Comment out code at line 265: --if index == 1 and args[cfg.arg.image] then		row			:tag('td')				:addClass(cfg.class.noviewer)				:addClass(cfg.class.navbox_image)				:addClass(args[cfg.arg.imageclass])				:css('width', '1px')              -- Minimize width				:css('padding', '0 0 0 2px')				:cssText(args[cfg.arg.imagestyle])				:attr('rowspan', listnums_size)				:tag('div')					:wikitext(processItem(args[cfg.arg.image]))	end

Comment out code from lines 396 - 404: --local state = args[cfg.arg.state] --if args[cfg.arg.title] and state ~= cfg.keyword.state_plain and state ~= cfg.keyword.state_off then --	if state == cfg.keyword.state_collapsed then --		state = cfg.class.collapsed --	end --	tbl --		:addClass(cfg.class.collapsible) --		:addClass(state or cfg.class.autocollapse) -- end

Rename function at line 559: function p.navboxMobile(frame)

Configuration
In Module:NavboxMobile/configuration:

Line 2: aria_label = 'navboxMobile',

Line 5: name = 'templatestyles', args = { src = 'Module:NavboxMobile/styles.css' }

Line 44. Note the developer warning to not change the class, as doing so may cause the class to become visible in a mobile device. The class has been changed and does indeed appear in the mobile device. The  variable change causes the class to be visible when the CSS is implemented as described in Template:Navbox. -- Warning navbox = 'navboxMobile', -- WMF currently hides 'navbox' from mobile, -- so you probably shouldn't change the navbox class. navbox_abovebelow = 'navboxMobile-abovebelow', navbox_group = 'navboxMobile-group', navbox_image = 'navboxMobile-image', navbox_inner = 'navboxMobile-inner', navbox_list = 'navboxMobile-list', navbox_list_with_group = 'navboxMobile-list-with-group', navbox_part = 'navboxMobile-', -- do not l10n navbox_styles = 'navboxMobile-styles', navbox_subgroup = 'navboxMobile-subgroup', navbox_title = 'navboxMobile-title', -- l10n only if you change pattern.navbox_title below navbox_odd_part = 'odd', -- do not l10n navbox_even_part = 'even', -- do not l10n nomobile = 'onlymobile',		-- 2023-01-06 was nomobile

Line 70: navbox_title = ']*"navboxMobile%-title"',

Styles.css
In Module:NavboxMobile/styles.css, replace all occurrences of the  class with .

Example
The following example is located in Module talk:NavboxMobile and shows how a navigation template is displayed with a mobile device.

If this is viewed on a desktop, the mobile device will always expand the template and the collapse / expand feature in the top-right corner is not shown.

This example also shows how to supply template parameters directly to the Lua module.