[ticket/11935] Merge remote-tracking branch 'upstream/develop'

PHPBB3-11935

phpBB/styles/prosilver/template/drafts.html

@@ -13,26 +13,31 @@
 <div class="<!-- IF not S_PRIVMSGS -->forumbg<!-- ELSE -->panel<!-- ENDIF -->">
 	<div class="inner">
 
-	<ul class="topiclist">
+	<ul class="topiclist two-long-columns">
 		<li class="header">
 			<dl>
 				<dt>{L_LOAD_DRAFT}</dt>
-				<dd class="posted">{L_SAVE_DATE}</dd>
+				<dd class="info">{L_SAVE_DATE}</dd>
 			</dl>
 		</li>
 	</ul>
-	<ul class="topiclist<!-- IF not S_PRIVMSGS --> topics<!-- ELSE --> cplist<!-- ENDIF -->">
+	<ul class="topiclist two-long-columns<!-- IF not S_PRIVMSGS --> topics<!-- ELSE --> cplist<!-- ENDIF -->">
 
 	<!-- BEGIN draftrow -->
 	<li class="row<!-- IF draftrow.S_ROW_COUNT is even --> bg1<!-- ELSE --> bg2<!-- ENDIF -->">
 		<dl>
 			<dt>
-				<a href="{draftrow.U_INSERT}" title="{L_LOAD_DRAFT}" class="topictitle">{draftrow.DRAFT_SUBJECT}</a><br />
-				<!-- IF not S_PRIVMSGS --><!-- IF draftrow.S_LINK_TOPIC -->{L_TOPIC}{L_COLON} <a href="{draftrow.U_VIEW}">{draftrow.TITLE}</a>
-				<!-- ELSEIF draftrow.S_LINK_FORUM -->{L_FORUM}{L_COLON} <a href="{draftrow.U_VIEW}">{draftrow.TITLE}</a>
-				<!-- ELSE -->{L_NO_TOPIC_FORUM}<!-- ENDIF --><!-- ENDIF -->
+				<div class="list-inner">
+					<a href="{draftrow.U_INSERT}" title="{L_LOAD_DRAFT}" class="topictitle">{draftrow.DRAFT_SUBJECT}</a><br />
+					<!-- IF not S_PRIVMSGS --><!-- IF draftrow.S_LINK_TOPIC -->{L_TOPIC}{L_COLON} <a href="{draftrow.U_VIEW}">{draftrow.TITLE}</a>
+					<!-- ELSEIF draftrow.S_LINK_FORUM -->{L_FORUM}{L_COLON} <a href="{draftrow.U_VIEW}">{draftrow.TITLE}</a>
+					<!-- ELSE -->{L_NO_TOPIC_FORUM}<!-- ENDIF --><!-- ENDIF -->
+					<div class="responsive-show" style="display: none;">
+						{L_SAVE_DATE}{L_COLON} <strong>{draftrow.DATE}</strong>
+					</div>
+				</div>
 			</dt>
-			<dd class="posted">{draftrow.DATE}</dd>
+			<dd class="info"><span>{draftrow.DATE}</span></dd>
 		</dl>
 	</li>
 	<!-- END draftrow -->

phpBB/styles/prosilver/template/forum_fn.js

@@ -409,6 +409,548 @@ function insert_single_user(formId, user)
 	self.close();
 }
 
+/**
+* Parse document block
+*/
+function parse_document(container) 
+{
+	var test = document.createElement('div'),
+		oldBrowser = (typeof test.style.borderRadius == 'undefined');
+
+	delete test;
+
+	/**
+	* Reset avatar dimensions when changing URL or EMAIL
+	*/
+	container.find('input[data-reset-on-edit]').bind('keyup', function() {
+		$(this.getAttribute('data-reset-on-edit')).val('');
+	});
+
+	/**
+	* Pagination
+	*/
+	container.find('a.pagination-trigger').click(function() {
+		jumpto($(this));
+	});
+
+	/**
+	* Adjust HTML code for IE8 and older versions		
+	*/
+	if (oldBrowser) {
+		// Fix .linklist.bulletin lists
+		container.find('ul.linklist.bulletin li:first-child, ul.linklist.bulletin li.rightside:last-child').addClass('no-bulletin');
+
+		// Do not run functions below for old browsers
+		return;
+	}
+
+	/**
+	* Resize navigation block to keep all links on same line
+	*/
+	container.find('.navlinks').each(function() {
+		var $this = $(this),
+			left = $this.children().not('.rightside'),
+			right = $this.children('.rightside');
+
+		if (left.length !== 1 || !right.length) return;
+
+		function resize() {
+			var width = 0,
+				diff = left.outerWidth(true) - left.width();
+
+			right.each(function() {
+				width += $(this).outerWidth(true);
+			});
+			left.css('max-width', Math.floor($this.width() - width - diff) + 'px');
+		}
+
+		resize();
+		$(window).resize(resize);
+	});
+
+	/**
+	* Makes breadcrumbs responsive
+	*/
+	container.find('.breadcrumbs:not([data-skip-responsive])').each(function() {
+		var $this = $(this),
+			$body = $('body'),
+			links = $this.find('.crumb'),
+			length = links.length,
+			classes = ['wrapped-max', 'wrapped-wide', 'wrapped-medium', 'wrapped-small', 'wrapped-tiny'],
+			classesLength = classes.length,
+			maxHeight = 0,
+			lastWidth = false,
+			wrapped = false;
+
+		// Set tooltips
+		$this.find('a').each(function() {
+			var $link = $(this);
+			$link.attr('title', $link.text());
+		});
+
+		// Funciton that checks breadcrumbs
+		function check() {
+			var height = $this.height(),
+				width = $body.width(),
+				link, i, j;
+
+			maxHeight = parseInt($this.css('line-height')) | 0;
+			links.each(function() {
+				if ($(this).height() > 0) {
+					maxHeight = Math.max(maxHeight, $(this).outerHeight(true));
+				}
+			});
+
+			if (height <= maxHeight) {
+				if (!wrapped || lastWidth === false || lastWidth >= width) {
+					lastWidth = width;
+					return;
+				}
+			}
+			lastWidth = width;
+
+			if (wrapped) {
+				$this.removeClass('wrapped').find('.crumb.wrapped').removeClass('wrapped ' + classes.join(' '));
+				wrapped = false;
+				if ($this.height() <= maxHeight) {
+					return;
+				}
+			}
+
+			wrapped = true;
+			$this.addClass('wrapped');
+			if ($this.height() <= maxHeight) {
+				return;
+			}
+
+			for (i = 0; i < classesLength; i ++) {
+				for (j = length - 1; j >= 0; j --) {
+					links.eq(j).addClass('wrapped ' + classes[i]);
+					if ($this.height() <= maxHeight) {
+						return;
+					}
+				}
+			}
+		}
+
+		// Run function and set event
+		check();
+		$(window).resize(check);
+	});
+
+	/**
+	* Adjust topiclist lists with check boxes
+	*/
+	container.find('ul.topiclist dd.mark').siblings('dt').children('.list-inner').addClass('with-mark');
+
+	/**
+	* Appends contents of all extra columns to first column in
+	* .topiclist lists for mobile devices. Copies contents as is.
+	*
+	* To add that functionality to .topiclist list simply add
+	* responsive-show-all to list of classes
+	*/
+	container.find('.topiclist.responsive-show-all > li > dl').each(function() {
+		var $this = $(this),
+			block = $this.find('dt .responsive-show:last-child'),
+			first = true;
+
+		// Create block that is visible only on mobile devices
+		if (!block.length) {
+			$this.find('dt > .list-inner').append('<div class="responsive-show" style="display:none;" />');
+			block = $this.find('dt .responsive-show:last-child');
+		}
+		else {
+			first = (block.text().trim().length == 0);
+		}
+
+		// Copy contents of each column
+		$this.find('dd').not('.mark').each(function() {
+			var column = $(this),
+				children = column.children(),
+				html = column.html();
+
+			if (children.length == 1 && children.text() == column.text()) {
+				html = children.html();
+			}
+
+			block.append((first ? '' : '<br />') + html);
+
+			first = false;
+		});
+	});
+
+	/**
+	* Same as above, but prepends text from header to each
+	* column before contents of that column.
+	*
+	* To add that functionality to .topiclist list simply add
+	* responsive-show-columns to list of classes
+	*/
+	container.find('.topiclist.responsive-show-columns').each(function() {
+		var list = $(this),
+			headers = [],
+			headersLength = 0;
+
+		// Find all headers, get contents
+		list.prev('.topiclist').find('li.header dd').not('.mark').each(function() {
+			headers.push($(this).text());
+			headersLength ++;
+		});
+
+		if (!headersLength) {
+			return;
+		}
+
+		// Parse each row
+		list.find('dl').each(function() {
+			var $this = $(this),
+				block = $this.find('dt .responsive-show:last-child'),
+				first = true;
+
+			// Create block that is visible only on mobile devices
+			if (!block.length) {
+				$this.find('dt > .list-inner').append('<div class="responsive-show" style="display:none;" />');
+				block = $this.find('dt .responsive-show:last-child');
+			}
+			else {
+				first = (block.text().trim().length == 0);
+			}
+
+			// Copy contents of each column
+			$this.find('dd').not('.mark').each(function(i) {
+				var column = $(this),
+					children = column.children(),
+					html = column.html();
+
+				if (children.length == 1 && children.text() == column.text()) {
+					html = children.html();
+				}
+
+				// Prepend contents of matching header before contents of column
+				if (i < headersLength) {
+					html = headers[i] + ': <strong>' + html + '</strong>';
+				}
+
+				block.append((first ? '' : '<br />') + html);
+
+				first = false;
+			});
+		});
+	});
+
+	/**
+	* Responsive tables
+	*/
+	container.find('table.table1').not('.not-responsive').each(function() {
+		var $this = $(this),
+			th = $this.find('thead > tr > th'),
+			columns = th.length,
+			headers = [],
+			totalHeaders = 0,
+			i, headersLength;
+
+		// Find each header
+		th.each(function(column) {
+			var cell = $(this),
+				colspan = parseInt(cell.attr('colspan')),
+				dfn = cell.attr('data-dfn'),
+				text = dfn ? dfn : cell.text();
+
+			colspan = isNaN(colspan) || colspan < 1 ? 1 : colspan;
+
+			for (i=0; i<colspan; i++) {
+				headers.push(text);
+			}
+			totalHeaders ++;
+
+			if (dfn && !column) {
+				$this.addClass('show-header');
+			}
+		});
+		
+		headersLength = headers.length;
+
+		// Add header text to each cell as <dfn>
+		$this.addClass('responsive');
+
+		if (totalHeaders < 2) {
+			$this.addClass('show-header');
+			return;
+		}
+
+		$this.find('tbody > tr').each(function() {
+			var row = $(this),
+				cells = row.children('td'),
+				column = 0;
+
+			if (cells.length == 1) {
+				row.addClass('big-column');
+				return;
+			}
+
+			cells.each(function() {
+				var cell = $(this),
+					colspan = parseInt(cell.attr('colspan')),
+					text = cell.text().trim();
+
+				if (headersLength <= column) {
+					return;
+				}
+
+				if ((text.length && text !== '-') || cell.children().length) {
+					cell.prepend('<dfn style="display: none;">' + headers[column] + '</dfn>');
+				}
+				else {
+					cell.addClass('empty');
+				}
+
+				colspan = isNaN(colspan) || colspan < 1 ? 1 : colspan;
+				column += colspan;
+			});
+		});
+	});
+
+	/**
+	* Hide empty responsive tables
+	*/
+	container.find('table.responsive > tbody').each(function() {
+		var items = $(this).children('tr');
+		if (items.length == 0)
+		{
+			$(this).parent('table:first').addClass('responsive-hide');
+		}
+	});
+
+	/**
+	* Responsive link lists
+	*/
+	container.find('.linklist:not(.navlinks, [data-skip-responsive]), .postbody ul.profile-icons:not([data-skip-responsive])').each(function() {
+		var $this = $(this),
+			$body = $('body'),
+			filterSkip = '.breadcrumbs, [data-skip-responsive]',
+			filterLast = '.pagination, .icon-notifications, .icon-pm, .icon-logout, .icon-login, .mark-read, .edit-icon, .quote-icon',
+			allLinks = $this.children(),
+			links = allLinks.not(filterSkip),
+			html = '<li class="responsive-menu" style="display:none;"><a href="javascript:void(0);" class="responsive-menu-link">&nbsp;</a><div class="dropdown" style="display:none;"><div class="pointer"><div class="pointer-inner" /></div><ul class="dropdown-contents" /></div></li>',
+			filterLastList = links.filter(filterLast);
+
+		if (links.is('.rightside'))
+		{
+			links.filter('.rightside:first').before(html);
+		}
+		else
+		{
+			$this.append(html);
+		}
+
+		var item = $this.children('.responsive-menu'),
+			menu = item.find('.dropdown-contents'),
+			lastWidth = false,
+			compact = false,
+			responsive = false,
+			copied = false;
+
+		function check() {
+			var width = $body.width();
+			if (responsive && width <= lastWidth) {
+				return;
+			}
+
+			// Reset responsive and compact layout
+			if (responsive) {
+				responsive = false;
+				$this.removeClass('responsive');
+				links.css('display', '');
+				item.css('display', 'none');
+			}
+
+			if (compact) {
+				compact = false;
+				$this.removeClass('compact');
+			}
+
+			// Find tallest element
+			var maxHeight = 0;
+			allLinks.each(function() {
+				if (!$(this).height()) return;
+				maxHeight = Math.max(maxHeight, $(this).outerHeight(true));
+			});
+
+			if (maxHeight < 1) {
+				return;
+			}
+
+			// Nothing to resize if block's height is not bigger than tallest element's height
+			if ($this.height() <= maxHeight) {
+				return;
+			}
+
+			// Enable compact layout, find tallest element, compare to height of whole block
+			compact = true;
+			$this.addClass('compact');
+
+			var compactMaxHeight = 0;
+			allLinks.each(function() {
+				if (!$(this).height()) return;
+				compactMaxHeight = Math.max(compactMaxHeight, $(this).outerHeight(true));
+			});
+
+			if ($this.height() <= maxHeight) {
+				return;
+			}
+
+			// Compact layout did not resize block enough, switch to responsive layout
+			compact = false;
+			$this.removeClass('compact');
+			responsive = true;
+
+			if (!copied) {
+				var clone = links.clone(true);
+				clone.filter('.rightside').each(function() {
+					menu.prepend(this);
+				});
+				menu.prepend(clone.not('.rightside'));
+				menu.find('li.leftside, li.rightside').removeClass('leftside rightside');
+				menu.find('.inputbox').parents('li:first').css('white-space', 'normal');
+				copied = true;
+			}
+			else {
+				menu.children().css('display', '');
+			}
+
+			item.css('display', '');
+			$this.addClass('responsive');
+
+			// Try to not hide filtered items
+			if (filterLastList.length) {
+				links.not(filterLast).css('display', 'none');
+
+				maxHeight = 0;
+				filterLastList.each(function() {
+					if (!$(this).height()) return;
+					maxHeight = Math.max(maxHeight, $(this).outerHeight(true));
+				});
+
+				if ($this.height() <= maxHeight) {
+					menu.children().filter(filterLast).css('display', 'none');
+					return;
+				}
+			}
+
+			links.css('display', 'none');
+		}
+
+		phpbb.registerDropdown(item.find('a.responsive-menu-link'), item.find('.dropdown'));
+
+		check();
+		$(window).resize(check);
+	});
+
+	/**
+	* Responsive tabs
+	*/
+	container.find('#tabs, #minitabs').not('[data-skip-responsive]').each(function() {
+		var $this = $(this),
+			$body = $('body'),
+			ul = $this.children(),
+			tabs = ul.children().not('[data-skip-responsive]'),
+			links = tabs.children('a'),
+			item = ul.append('<li class="responsive-tab" style="display:none;"><a href="javascript:void(0);" class="responsive-tab-link"><span>&nbsp;</span></a><div class="dropdown tab-dropdown" style="display: none;"><div class="pointer"><div class="pointer-inner" /></div><ul class="dropdown-contents" /></div></li>').find('li.responsive-tab'),
+			menu = item.find('.dropdown-contents'),
+			maxHeight = 0,
+			lastWidth = false,
+			responsive = false;
+
+		links.each(function() {
+			var link = $(this);
+			maxHeight = Math.max(maxHeight, Math.max(link.outerHeight(true), link.parent().outerHeight(true)));
+		})
+
+		function check() {
+			var width = $body.width(),
+				height = $this.height();
+
+			if (arguments.length == 0 && (!responsive || width <= lastWidth) && height <= maxHeight) {
+				return;
+			}
+
+			tabs.show();
+			item.hide();
+
+			lastWidth = width;
+			height = $this.height();
+			if (height <= maxHeight) {
+				responsive = false;
+				if (item.hasClass('dropdown-visible')) {
+					phpbb.toggleDropdown.call(item.find('a.responsive-tab-link').get(0));
+				}
+				return;
+			}
+
+			responsive = true;
+			item.show();
+			menu.html('');
+
+			var availableTabs = tabs.filter(':not(.activetab, .responsive-tab)'),
+				total = availableTabs.length,
+				i, tab;
+
+			for (i = total - 1; i >= 0; i --) {
+				tab = availableTabs.eq(i);
+				menu.prepend(tab.clone(true));
+				tab.hide();
+				if ($this.height() <= maxHeight) {
+					menu.find('a').click(function() { check(true); });
+					return;
+				}
+			}
+			menu.find('a').click(function() { check(true); });
+		}
+
+		phpbb.registerDropdown(item.find('a.responsive-tab-link'), item.find('.dropdown'), {visibleClass: 'activetab'});
+
+		check(true);
+		$(window).resize(check);
+	});
+
+	/**
+	 * Hide UCP/MCP navigation if there is only 1 item
+	 */
+	container.find('#navigation').each(function() {
+		var items = $(this).children('ol, ul').children('li');
+		if (items.length == 1)
+		{
+			$(this).addClass('responsive-hide');
+		}
+	});
+
+	/**
+	* Replace responsive text
+	*/
+	container.find('[data-responsive-text]').each(function() {
+		var $this = $(this),
+			fullText = $this.text(),
+			responsiveText = $this.attr('data-responsive-text'),
+			responsive = false;
+
+		function check() {
+			if ($(window).width() > 700) {
+				if (!responsive) return;
+				$this.text(fullText);
+				responsive = false;
+				return;
+			}
+			if (responsive) return;
+			$this.text(responsiveText);
+			responsive = true;
+		}
+
+		check();
+		$(window).resize(check);
+	});
+}
+
 /**
 * Run onload functions
 */
@@ -422,412 +964,6 @@ function insert_single_user(formId, user)
 			$('#' + this.getAttribute('data-focus')).focus();
 		});
 
-		// Reset avatar dimensions when changing URL or EMAIL
-		$('input[data-reset-on-edit]').bind('keyup', function() {
-			$(this.getAttribute('data-reset-on-edit')).val('');
-		});
-
-		// Pagination
-		$('a.pagination-trigger').click(function() {
-			jumpto($(this));
-		});
-
-		// Adjust HTML code for IE8 and older versions		
-		var test = document.createElement('div'),
-			oldBrowser = (typeof test.style.borderRadius == 'undefined');
-		delete test;
-
-		if (oldBrowser) {
-			// Fix .linklist.bulletin lists
-			$('ul.linklist.bulletin li:first-child, ul.linklist.bulletin li.rightside:last-child').addClass('no-bulletin');
-
-			// Do not run functions below for old browsers
-			return;
-		}
-
-		// Adjust topiclist lists with check boxes
-		$('ul.topiclist dd.mark').siblings('dt').children('.list-inner').addClass('with-mark');
-
-		// Resize navigation block to keep all links on same line
-		$('.navlinks').each(function() {
-			var $this = $(this),
-				left = $this.children().not('.rightside'),
-				right = $this.children('.rightside');
-
-			if (left.length !== 1 || !right.length) return;
-
-			function resize() {
-				var width = 0,
-					diff = left.outerWidth(true) - left.width();
-
-				right.each(function() {
-					width += $(this).outerWidth(true);
-				});
-				left.css('max-width', Math.floor($this.width() - width - diff) + 'px');
-			}
-
-			resize();
-			$(window).resize(resize);
-		});
-
-		// Responsive breadcrumbs
-		$('.breadcrumbs:not(.skip-responsive, .linklist.leftside .breadcrumbs)').each(function() {
-			var $this = $(this),
-				$body = $('body'),
-				links = $this.find('.crumb'),
-				length = links.length,
-				classes = ['wrapped-wide', 'wrapped-medium', 'wrapped-small'],
-				classesLength = classes.length,
-				maxHeight = 0,
-				lastWidth = false,
-				wrapped = false;
-
-			// Test height by setting nowrap
-			$this.css('white-space', 'nowrap');
-			maxHeight = $this.height() + 1;
-			$this.css('white-space', '');
-
-			// Set tooltips
-			$this.find('a').each(function() {
-				var $link = $(this);
-				$link.attr('title', $link.text());
-			});
-
-			// Funciton that checks breadcrumbs
-			function check() {
-				var height = $this.height(),
-					width = $body.width(),
-					link, i, j;
-
-				if (height <= maxHeight) {
-					if (!wrapped || lastWidth === false || lastWidth >= width) {
-						lastWidth = width;
-						return;
-					}
-				}
-				lastWidth = width;
-
-				if (wrapped) {
-					$this.removeClass('wrapped').find('.crumb.wrapped').removeClass('wrapped ' + classes.join(' '));
-					wrapped = false;
-					if ($this.height() <= maxHeight) {
-						return;
-					}
-				}
-
-				wrapped = true;
-				$this.addClass('wrapped');
-				if ($this.height() <= maxHeight) {
-					return;
-				}
-
-				for (i = 0; i < classesLength; i ++) {
-					for (j = length - 1; j >= 0; j --) {
-						links.eq(j).addClass('wrapped ' + classes[i]);
-						if ($this.height() <= maxHeight) {
-							return;
-						}
-					}
-				}
-			}
-
-			// Run function and set event
-			check();
-			$(window).resize(check);
-		});
-
-		// Responsive tables
-		$('table.table1').not('.not-responsive').each(function() {
-			var $this = $(this),
-				th = $this.find('thead > tr > th'),
-				columns = th.length,
-				headers = [],
-				totalHeaders = 0,
-				i, headersLength;
-
-			// Find each header
-			th.each(function() {
-				var cell = $(this),
-					colspan = parseInt(cell.attr('colspan')),
-					dfn = cell.attr('data-dfn'),
-					text = dfn ? dfn : cell.text();
-
-				colspan = isNaN(colspan) || colspan < 1 ? 1 : colspan;
-
-				for (i=0; i<colspan; i++) {
-					headers.push(text);
-				}
-				totalHeaders ++;
-			});
-			
-			headersLength = headers.length;
-
-			// Add header text to each cell as <dfn>
-			$this.addClass('responsive');
-
-			if (totalHeaders < 2) {
-				$this.addClass('show-header');
-				return;
-			}
-
-			$this.find('tbody > tr').each(function() {
-				var row = $(this),
-					cells = row.children('td'),
-					column = 0;
-
-				if (cells.length == 1) {
-					row.addClass('big-column');
-					return;
-				}
-
-				cells.each(function() {
-					var cell = $(this),
-						colspan = parseInt(cell.attr('colspan')),
-						text = cell.text().trim();
-
-					if (headersLength <= column) {
-						return;
-					}
-
-					if (text.length && text !== '-') {
-						cell.prepend('<dfn style="display: none;">' + headers[column] + '</dfn>');
-					}
-					else {
-						cell.addClass('empty');
-					}
-
-					colspan = isNaN(colspan) || colspan < 1 ? 1 : colspan;
-					column += colspan;
-				});
-			});
-		});
-
-		// Responsive link lists
-		$('.linklist:not(.navlinks, .skip-responsive), .postbody ul.profile-icons:not(.skip-responsive)').each(function() {
-			var $this = $(this),
-				$body = $('body'),
-				links = $this.children().not('.skip-responsive'),
-				html = '<li class="responsive-menu" style="display:none;"><a href="javascript:void(0);" class="responsive-menu-link">&nbsp;</a><ul class="responsive-popup" style="display:none;" /></li>',
-				// List of items that should be hidden last
-				filterString = '.pagination, .icon-notifications, .icon-pm, .icon-logout, .icon-login, .mark-read, .breadcrumbs, .edit-icon, .quote-icon',
-				filtered = links.filter(filterString);
-
-			if (links.is('.rightside'))
-			{
-				links.filter('.rightside:first').before(html);
-			}
-			else
-			{
-				$this.append(html);
-			}
-
-			var toggle = $this.children('.responsive-menu'),
-				toggleLink = toggle.find('a.responsive-menu-link'),
-				menu = toggle.find('ul.responsive-popup'),
-				lastWidth = false,
-				compact = false,
-				responsive = false,
-				copied = false;
-
-			function check() {
-				var width = $body.width();
-				if (responsive && width <= lastWidth) {
-					return;
-				}
-
-				// Reset responsive and compact layout
-				if (responsive) {
-					responsive = false;
-					$this.removeClass('responsive');
-					links.css('display', '');
-					toggle.css('display', 'none');
-				}
-
-				if (compact) {
-					compact = false;
-					$this.removeClass('compact');
-				}
-
-				// Find tallest element
-				var maxHeight = 0;
-				links.each(function() {
-					if (!$(this).height()) return;
-					maxHeight = Math.max(maxHeight, $(this).outerHeight(true));
-				});
-
-				if (maxHeight < 1) {
-					return;
-				}
-
-				// Nothing to resize if block's height is not bigger than tallest element's height
-				if ($this.height() <= maxHeight) {
-					toggle.removeClass('visible');
-					menu.hide();
-					return;
-				}
-
-				// Enable compact layout, find tallest element, compare to height of whole block
-				compact = true;
-				$this.addClass('compact');
-
-				var compactMaxHeight = 0;
-				links.each(function() {
-					if (!$(this).height()) return;
-					compactMaxHeight = Math.max(compactMaxHeight, $(this).outerHeight(true));
-				});
-
-				if ($this.height() <= maxHeight) {
-					toggle.removeClass('visible');
-					menu.hide();
-					return;
-				}
-
-				// Compact layout did not resize block enough, switch to responsive layout
-				compact = false;
-				$this.removeClass('compact');
-				responsive = true;
-
-				if (!copied) {
-					if (menu.parents().is('.rightside')) {
-						menu.addClass('responsive-rightside');
-					}
-					menu.append(links.clone(true));
-					menu.find('li.leftside, li.rightside').removeClass('leftside rightside');
-					menu.find('.inputbox').parents('li:first').css('white-space', 'normal');
-					copied = true;
-				}
-				else {
-					menu.children().css('display', '');
-				}
-
-				toggle.css('display', '');
-				$this.addClass('responsive');
-
-				// Try to not hide filtered items
-				if (filtered.length) {
-					links.not(filterString).css('display', 'none');
-
-					maxHeight = 0;
-					filtered.each(function() {
-						if (!$(this).height()) return;
-						maxHeight = Math.max(maxHeight, $(this).outerHeight(true));
-					});
-
-					if ($this.height() <= maxHeight) {
-						menu.children().filter(filterString).css('display', 'none');
-						return;
-					}
-				}
-
-				links.css('display', 'none');
-			}
-
-			toggleLink.click(function() {
-				if (!responsive) return;
-				if (!toggle.hasClass('visible')) {
-					// Hide other popups
-					$('.responsive-menu.visible').removeClass('visible').find('.responsive-popup').hide();
-				}
-				toggle.toggleClass('visible');
-				menu.toggle();
-			});
-
-			check();
-			$(window).resize(check);
-		});
-
-		// Responsive tabs
-		$('#tabs, #minitabs').not('.skip-responsive').each(function() {
-			var $this = $(this),
-				$body = $('body'),
-				ul = $this.children(),
-				tabs = ul.children().not('.skip-responsive'),
-				links = tabs.children('a'),
-				toggle = ul.append('<li class="responsive-tab" style="display:none;"><a href="javascript:void(0);" class="responsive-tab-link"><span>&nbsp;</span></a><ul class="responsive-tabs" style="display:none;" /></li>').find('li.responsive-tab'),
-				toggleLink = toggle.find('a.responsive-tab-link'),
-				menu = toggle.find('ul.responsive-tabs'),
-				maxHeight = 0,
-				lastWidth = false,
-				responsive = false;
-
-			links.each(function() {
-				maxHeight = Math.max(maxHeight, $(this).outerHeight(true));
-			})
-
-			function check() {
-				var width = $body.width(),
-					height = $this.height();
-
-				if (arguments.length == 0 && (!responsive || width <= lastWidth) && height <= maxHeight) {
-					return;
-				}
-
-				tabs.show();
-				toggle.hide();
-
-				lastWidth = width;
-				height = $this.height();
-				if (height <= maxHeight) {
-					responsive = false;
-					return;
-				}
-
-				responsive = true;
-				toggle.show();
-				menu.hide().html('');
-
-				var availableTabs = tabs.filter(':not(.activetab, .responsive-tab)'),
-					total = availableTabs.length,
-					i, tab;
-
-				for (i = total - 1; i >= 0; i --) {
-					tab = availableTabs.eq(i);
-					menu.prepend(tab.clone(true));
-					tab.hide();
-					if ($this.height() <= maxHeight) {
-						menu.find('a').click(function() { check(true); });
-						return;
-					}
-				}
-				menu.find('a').click(function() { check(true); });
-			}
-
-			toggleLink.click(function() {
-				if (!responsive) return;
-				menu.toggle();
-			});
-
-			check(true);
-			$(window).resize(check);
-		});
-
-		// Hide responsive menu and tabs
-		$('#phpbb').click(function(e) {
-			var parents = $(e.target).parents();
-			if (!parents.is('.responsive-menu.visible')) {
-				$('.responsive-menu.visible').removeClass('visible').find('.responsive-popup').hide();
-			}
-			if (!parents.is('.responsive-tab')) {
-				$('.responsive-tabs').hide();
-			}
-		});
-
-		// Hide *CP navigation if there is only 1 item
-		$('#navigation').each(function() {
-			var items = $(this).children('ol, ul').children('li');
-			if (items.length == 1)
-			{
-				$(this).addClass('responsive-hide');
-			}
-		});
-
-		// Hide empty responsive tables
-		$('table.responsive > tbody').each(function() {
-			var items = $(this).children('tr');
-			if (items.length == 0)
-			{
-				$(this).parent('table:first').addClass('responsive-hide');
-			}
-		});
+		parse_document($('body'));
 	});
 })(jQuery);

phpBB/styles/prosilver/template/forumlist_body.html

@@ -42,6 +42,16 @@
 								<a href="{forumrow.subforum.U_SUBFORUM}" class="subforum<!-- IF forumrow.subforum.S_UNREAD --> unread<!-- ELSE --> read<!-- ENDIF -->" title="<!-- IF forumrow.subforum.UNREAD -->{L_UNREAD_POSTS}<!-- ELSE -->{L_NO_UNREAD_POSTS}<!-- ENDIF -->">{forumrow.subforum.SUBFORUM_NAME}</a><!-- IF not forumrow.subforum.S_LAST_ROW -->,<!-- ENDIF -->
 							<!-- END subforum -->
 						<!-- ENDIF -->
+
+						<!-- IF not S_IS_BOT -->
+						<div class="responsive-show" style="display: none;">
+							<!-- IF forumrow.CLICKS -->
+								{L_REDIRECTS}{L_COLON} <strong>{forumrow.CLICKS}</strong>
+							<!-- ELSEIF not forumrow.S_IS_LINK and forumrow.TOPICS -->
+								{L_TOPICS}{L_COLON} <strong>{forumrow.TOPICS}</strong>
+							<!-- ENDIF -->
+						</div>
+						<!-- ENDIF -->
 					</div>
 				</dt>
 				<!-- IF forumrow.CLICKS -->

phpBB/styles/prosilver/template/index_body.html

@@ -1,7 +1,7 @@
 <!-- INCLUDE overall_header.html -->
 
 <p class="{S_CONTENT_FLOW_END} responsive-center<!-- IF S_USER_LOGGED_IN --> rightside<!-- ENDIF -->"><!-- IF S_USER_LOGGED_IN -->{LAST_VISIT_DATE}<!-- ELSE -->{CURRENT_TIME}<!-- ENDIF --></p>
-<!-- IF U_MCP --><p class="responsive-center">{CURRENT_TIME} <br />[&nbsp;<a href="{U_MCP}">{L_MCP}</a>&nbsp;]</p><!-- ELSEIF S_USER_LOGGED_IN --><p>{CURRENT_TIME}</p><!-- ENDIF -->
+<!-- IF U_MCP --><p class="responsive-center">{CURRENT_TIME} <br />[&nbsp;<a href="{U_MCP}">{L_MCP}</a>&nbsp;]</p><!-- ELSEIF S_USER_LOGGED_IN --><p class="responsive-center">{CURRENT_TIME}</p><!-- ENDIF -->
 
 <!-- IF S_DISPLAY_SEARCH or (S_USER_LOGGED_IN and not S_IS_BOT) -->
 <ul class="linklist bulletin">
@@ -25,10 +25,10 @@
 	<form method="post" action="{S_LOGIN_ACTION}" class="headerspace">
 	<h3><a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a><!-- IF S_REGISTER_ENABLED -->&nbsp; &bull; &nbsp;<a href="{U_REGISTER}">{L_REGISTER}</a><!-- ENDIF --></h3>
 		<fieldset class="quick-login">
-			<label for="username">{L_USERNAME}{L_COLON}</label>&nbsp;<input type="text" name="username" id="username" size="10" class="inputbox" title="{L_USERNAME}" />
-			<label for="password">{L_PASSWORD}{L_COLON}</label>&nbsp;<input type="password" name="password" id="password" size="10" class="inputbox" title="{L_PASSWORD}" />
+			<label for="username"><span>{L_USERNAME}{L_COLON}</span> <input type="text" name="username" id="username" size="10" class="inputbox" title="{L_USERNAME}" /></label>
+			<label for="password"><span>{L_PASSWORD}{L_COLON}</span> <input type="password" name="password" id="password" size="10" class="inputbox" title="{L_PASSWORD}" /></label>
 			<!-- IF S_AUTOLOGIN_ENABLED -->
-				| <label for="autologin">{L_LOG_ME_IN} <input type="checkbox" name="autologin" id="autologin" /></label>
+				<span class="responsive-hide">|</span> <label for="autologin">{L_LOG_ME_IN} <input type="checkbox" name="autologin" id="autologin" /></label>
 			<!-- ENDIF -->
 			<input type="submit" name="login" value="{L_LOGIN}" class="button2" />
 			{S_LOGIN_REDIRECT}

phpBB/styles/prosilver/template/mcp_forum.html

@@ -63,7 +63,15 @@
 						</ul>
 					</div>
 					<!-- ENDIF -->
-					<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->{L_POST_BY_AUTHOR} {topicrow.TOPIC_AUTHOR_FULL} &raquo; {topicrow.FIRST_POST_TIME}
+					<div class="responsive-hide">
+						<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->
+						{L_POST_BY_AUTHOR} {topicrow.TOPIC_AUTHOR_FULL} &raquo; {topicrow.FIRST_POST_TIME}
+					</div>
+					<div class="responsive-show" style="display: none;">
+						<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->
+						{L_LAST_POST} {L_POST_BY_AUTHOR} {topicrow.LAST_POST_AUTHOR_FULL} &laquo; {topicrow.LAST_POST_TIME}<br />
+						{L_REPLIES}{L_COLON} <strong>{topicrow.REPLIES}</strong>
+					</div>
 
 					</div>
 				</dt>

phpBB/styles/prosilver/template/mcp_front.html

@@ -21,7 +21,7 @@
 					</dl>
 				</li>
 			</ul>
-			<ul class="topiclist cplist missing-column">
+			<ul class="topiclist cplist missing-column responsive-show-all">
 
 			<!-- BEGIN unapproved -->
 			<li class="row<!-- IF unapproved.S_ROW_COUNT is odd --> bg1<!-- ELSE --> bg2<!-- ENDIF -->">
@@ -75,7 +75,7 @@
 					</dl>
 				</li>
 			</ul>
-			<ul class="topiclist cplist two-long-columns">
+			<ul class="topiclist cplist two-long-columns responsive-show-all">
 
 			<!-- BEGIN report -->
 			<li class="row<!-- IF report.S_ROW_COUNT is odd --> bg1<!-- ELSE --> bg2<!-- ENDIF -->">
@@ -116,7 +116,7 @@
 					</dl>
 				</li>
 			</ul>
-			<ul class="topiclist cplist two-long-columns">
+			<ul class="topiclist cplist two-long-columns responsive-show-all">
 
 			<!-- BEGIN pm_report -->
 			<li class="row<!-- IF pm_report.S_ROW_COUNT is odd --> bg1<!-- ELSE --> bg2<!-- ENDIF -->">

phpBB/styles/prosilver/template/mcp_queue.html

@@ -35,7 +35,7 @@
 				</dl>
 			</li>
 			</ul>
-			<ul class="topiclist cplist missing-column">
+			<ul class="topiclist cplist missing-column responsive-show-all">
 
 		<!-- BEGIN postrow -->
 

phpBB/styles/prosilver/template/mcp_reports.html

@@ -48,6 +48,9 @@
 							<a href="{postrow.U_VIEW_DETAILS}" class="topictitle">{postrow.PM_SUBJECT}</a> {postrow.ATTACH_ICON_IMG}<br />
 							<span>{L_MESSAGE_BY_AUTHOR} {postrow.PM_AUTHOR_FULL} &raquo; {postrow.PM_TIME}</span><br />
 							<span>{L_MESSAGE_TO} {postrow.RECIPIENTS}</span>
+							<div class="responsive-show" style="display: none;">
+								{L_REPORTER}{L_COLON} {postrow.REPORTER_FULL} &laquo; {postrow.REPORT_TIME}
+							</div>
 						</div>
 					</dt>
 					<dd class="moderation">
@@ -58,6 +61,10 @@
 						<div class="list-inner">
 							<a href="{postrow.U_VIEW_DETAILS}" class="topictitle">{postrow.POST_SUBJECT}</a> {postrow.ATTACH_ICON_IMG}<br />
 							<span>{L_POSTED} {L_POST_BY_AUTHOR} {postrow.POST_AUTHOR_FULL} &raquo; {postrow.POST_TIME}</span>
+							<div class="responsive-show" style="display: none;">
+								{L_REPORTER}{L_COLON} {postrow.REPORTER_FULL} &laquo; {postrow.REPORT_TIME}<br />
+								<!-- IF postrow.U_VIEWFORUM -->{L_FORUM}{L_COLON} <a href="{postrow.U_VIEWFORUM}">{postrow.FORUM_NAME}</a><!-- ELSE -->{postrow.FORUM_NAME}<!-- ENDIF -->
+							</div>
 						</div>
 					</dt>
 					<dd class="moderation">

phpBB/styles/prosilver/template/overall_footer.html

@@ -5,7 +5,7 @@
 	<div class="navbar">
 		<div class="inner">
 
-		<ul class="linklist leftside bulletin">
+		<ul class="linklist bulletin">
 			<li class="icon-home breadcrumbs"><!-- IF U_SITE_HOME --><span class="crumb"><a href="{U_SITE_HOME}">{L_SITE_HOME}</a> <strong>&#8249;</strong></span> <!-- ENDIF --><span class="crumb"><a href="{U_INDEX}" accesskey="h">{L_INDEX}</a></span>
 				<!-- EVENT overall_footer_breadcrumb_append -->
 			</li>
@@ -15,11 +15,9 @@
 				<!-- IF U_BOOKMARK_TOPIC --><li class="icon-bookmark"><a href="{U_BOOKMARK_TOPIC}" title="{L_BOOKMARK_TOPIC}" data-ajax="alt_text" data-alt-text="{S_BOOKMARK_TOGGLE}">{S_BOOKMARK_TOPIC}</a></li><!-- ENDIF -->
 				<!-- IF U_BUMP_TOPIC --><li class="icon-bump"><a href="{U_BUMP_TOPIC}" title="{L_BUMP_TOPIC}" data-ajax="true">{L_BUMP_TOPIC}</a></li><!-- ENDIF -->
 			<!-- ENDIF -->
-		</ul>
-		<ul class="linklist rightside bulletin">
-			<!-- IF U_TEAM --><li><a href="{U_TEAM}">{L_THE_TEAM}</a><!-- ENDIF -->
-			<!-- IF not S_IS_BOT --><li><a href="{U_DELETE_COOKIES}" data-ajax="true" data-refresh="true">{L_DELETE_COOKIES}</a></li><!-- ENDIF -->
-			<li>{S_TIMEZONE}</li>
+			<li class="rightside">{S_TIMEZONE}</li>
+			<!-- IF not S_IS_BOT --><li class="rightside"><a href="{U_DELETE_COOKIES}" data-ajax="true" data-refresh="true">{L_DELETE_COOKIES}</a></li><!-- ENDIF -->
+			<!-- IF U_TEAM --><li class="rightside"><a href="{U_TEAM}">{L_THE_TEAM}</a><!-- ENDIF -->
 		</ul>
 
 		</div>

phpBB/styles/prosilver/template/overall_header.html

@@ -29,7 +29,7 @@
 <!-- IF S_ALLOW_CDN --><link href="//fonts.googleapis.com/css?family=Open+Sans:600&amp;subset=latin,cyrillic-ext,latin-ext,cyrillic,greek-ext,greek,vietnamese" rel="stylesheet" type="text/css" media="screen, projection" /><!-- ENDIF -->
 <link href="{T_STYLESHEET_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />
 <link href="{T_STYLESHEET_LANG_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />
-<link href="{T_THEME_PATH}/responsive.css" rel="stylesheet" type="text/css" media="only screen and (max-width: 700px), only screen and (max-device-width: 700px)" />
+<link href="{T_THEME_PATH}/responsive.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet" type="text/css" media="only screen and (max-width: 700px), only screen and (max-device-width: 700px)" />
 
 <!-- IF S_CONTENT_DIRECTION eq 'rtl' -->
 	<link href="{T_THEME_PATH}/bidi.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet" type="text/css" media="screen, projection" />
@@ -97,43 +97,45 @@
 				<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH --><li class="responsive-search rightside" style="display: none;"><a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH}</a></li><!-- ENDIF -->
 			</ul>
 
+			<ul class="linklist bulletin">
 			<!-- IF not S_IS_BOT and S_USER_LOGGED_IN -->
-			<ul class="linklist leftside bulletin">
 				<!-- IF S_NOTIFICATIONS_DISPLAY -->
-				<li class="icon-notification skip-responsive">
+				<li class="icon-notification" data-skip-responsive="true">
 					<a href="{U_VIEW_ALL_NOTIFICATIONS}" id="notification_list_button"><span>{L_NOTIFICATIONS} [</span><strong>{NOTIFICATIONS_COUNT}</strong><span>]</span></a>
-					<div id="notification_list" class="notification_list">
-						<div class="pointer"><div class="pointer_inner"></div></div>
-						<div class="header">
-							{L_NOTIFICATIONS}
-							<span class="header_settings"><a href="{U_NOTIFICATION_SETTINGS}">{L_SETTINGS}</a></span>
-						</div>
+					<div id="notification_list" class="dropdown notification_list">
+						<div class="pointer"><div class="pointer-inner"></div></div>
+						<div class="dropdown-contents">
+							<div class="header">
+								{L_NOTIFICATIONS}
+								<span class="header_settings"><a href="{U_NOTIFICATION_SETTINGS}">{L_SETTINGS}</a></span>
+							</div>
 
-						<ul>
-							<!-- IF not .notifications -->
-								<li>
-									{L_NO_NOTIFICATIONS}
-								</li>
-							<!-- ENDIF -->
-							<!-- BEGIN notifications -->
-								<li class="<!-- IF notifications.UNREAD --> bg2<!-- ENDIF -->">
-									<!-- IF notifications.URL --><a href="<!-- IF notifications.UNREAD -->{notifications.U_MARK_READ}<!-- ELSE -->{notifications.URL}<!-- ENDIF -->"><!-- ENDIF -->
-										<!-- IF notifications.AVATAR -->{notifications.AVATAR}<!-- ELSE --><img src="{T_THEME_PATH}/images/no_avatar.gif" alt="" /><!-- ENDIF -->
-										<div class="notification_text">
-											<p>{notifications.FORMATTED_TITLE}</p>
-											<p>&raquo; {notifications.TIME}</p>
+							<ul>
+								<!-- IF not .notifications -->
+									<li>
+										{L_NO_NOTIFICATIONS}
+									</li>
+								<!-- ENDIF -->
+								<!-- BEGIN notifications -->
+									<li class="<!-- IF notifications.UNREAD --> bg2<!-- ENDIF -->">
+										<!-- IF notifications.URL --><a href="<!-- IF notifications.UNREAD -->{notifications.U_MARK_READ}<!-- ELSE -->{notifications.URL}<!-- ENDIF -->"><!-- ENDIF -->
+											<!-- IF notifications.AVATAR -->{notifications.AVATAR}<!-- ELSE --><img src="{T_THEME_PATH}/images/no_avatar.gif" alt="" /><!-- ENDIF -->
+											<div class="notification_text">
+												<p>{notifications.FORMATTED_TITLE}</p>
+												<p>&raquo; {notifications.TIME}</p>
 
-											<!-- IF not notifications.URL and notifications.U_MARK_READ -->
-												<p><a href="{notifications.U_MARK_READ}">{L_MARK_READ}</a></p>
-											<!-- ENDIF -->
-										</div>
-									<!-- IF notifications.URL --></a><!-- ENDIF -->
-								</li>
-				   			<!-- END notifications -->
-						</ul>
+												<!-- IF not notifications.URL and notifications.U_MARK_READ -->
+													<p><a href="{notifications.U_MARK_READ}">{L_MARK_READ}</a></p>
+												<!-- ENDIF -->
+											</div>
+										<!-- IF notifications.URL --></a><!-- ENDIF -->
+									</li>
+					   			<!-- END notifications -->
+							</ul>
 
-						<div class="footer">
-							<a href="{U_VIEW_ALL_NOTIFICATIONS}"><span>{L_SEE_ALL}</span></a>
+							<div class="footer">
+								<a href="{U_VIEW_ALL_NOTIFICATIONS}"><span>{L_SEE_ALL}</span></a>
+							</div>
 						</div>
 					</div>
 				</li>
@@ -152,18 +154,16 @@
 				<!-- IF U_RESTORE_PERMISSIONS -->
 					<li class="icon-restore-permissions"><a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSIONS}</a></li>
 				<!-- ENDIF -->
-			</ul>
 			<!-- ENDIF -->
 
-			<ul class="linklist rightside<!-- IF S_IS_BOT or not S_USER_LOGGED_IN --> fullwidth<!-- ENDIF -->">
-				<!-- EVENT overall_header_navigation_prepend -->
-				<li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>
-				<!-- IF not S_IS_BOT -->
-					<!-- IF S_DISPLAY_MEMBERLIST --><li class="icon-members"><a href="{U_MEMBERLIST}" title="{L_MEMBERLIST_EXPLAIN}">{L_MEMBERLIST}</a></li><!-- ENDIF -->
-					<!-- IF not S_USER_LOGGED_IN and S_REGISTER_ENABLED and not (S_SHOW_COPPA or S_REGISTRATION) --><li class="icon-register"><a href="{U_REGISTER}">{L_REGISTER}</a></li><!-- ENDIF -->
-					<li class="icon-logout"><a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="x">{L_LOGIN_LOGOUT}</a></li>
-				<!-- ENDIF -->
 				<!-- EVENT overall_header_navigation_append -->
+				<!-- IF not S_IS_BOT -->
+					<li class="icon-logout rightside no-bulletin"><a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="x">{L_LOGIN_LOGOUT}</a></li>
+					<!-- IF not S_USER_LOGGED_IN and S_REGISTER_ENABLED and not (S_SHOW_COPPA or S_REGISTRATION) --><li class="icon-register rightside no-bulletin"><a href="{U_REGISTER}">{L_REGISTER}</a></li><!-- ENDIF -->
+					<!-- IF S_DISPLAY_MEMBERLIST --><li class="icon-members rightside no-bulletin"><a href="{U_MEMBERLIST}" title="{L_MEMBERLIST_EXPLAIN}">{L_MEMBERLIST}</a></li><!-- ENDIF -->
+				<!-- ENDIF -->
+				<li class="icon-faq rightside no-bulletin"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>
+				<!-- EVENT overall_header_navigation_prepend -->
 			</ul>
 
 			</div>

phpBB/styles/prosilver/template/simple_header.html

@@ -12,7 +12,7 @@
 <!-- IF S_ALLOW_CDN --><link href="//fonts.googleapis.com/css?family=Open+Sans:600&amp;subset=latin,cyrillic-ext,latin-ext,cyrillic,greek-ext,greek,vietnamese" rel="stylesheet" type="text/css" media="screen, projection" /><!-- ENDIF -->
 <link href="{T_STYLESHEET_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />
 <link href="{T_STYLESHEET_LANG_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />
-<link href="{T_THEME_PATH}/responsive.css" rel="stylesheet" type="text/css" media="only screen and (max-width: 700px), only screen and (max-device-width: 700px)" />
+<link href="{T_THEME_PATH}/responsive.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet" type="text/css" media="only screen and (max-width: 700px), only screen and (max-device-width: 700px)" />
 
 <!-- IF S_CONTENT_DIRECTION eq 'rtl' -->
 	<link href="{T_THEME_PATH}/bidi.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet" type="text/css" media="screen, projection" />

phpBB/styles/prosilver/template/ucp_attachments.html

@@ -31,7 +31,7 @@
 				</dl>
 			</li>
 		</ul>
-		<ul class="topiclist cplist">
+		<ul class="topiclist cplist responsive-show-columns">
 
 		<!-- BEGIN attachrow -->
 		<li class="row<!-- IF attachrow.S_ROW_COUNT is odd --> bg1<!-- ELSE --> bg2<!-- ENDIF -->">

phpBB/styles/prosilver/template/ucp_auth_link_oauth.html

@@ -20,7 +20,7 @@
 					<dt>&nbsp;</dt>
 					<dd><input type="submit" name="submit" tabindex="6" value="{L_UCP_AUTH_LINK_LINK}" class="button1" /></dd>
 				</dl>
-			<!-- ENDIF-->
+			<!-- ENDIF -->
 		</fieldset>
 		{oauth.HIDDEN_FIELDS}
 		{S_HIDDEN_FIELDS}

phpBB/styles/prosilver/template/ucp_groups_manage.html

@@ -214,7 +214,7 @@
 				</dl>
 			</li>
 		</ul>
-		<ul class="topiclist cplist two-long-columns">
+		<ul class="topiclist cplist two-long-columns responsive-show-all">
 
 		<!-- BEGIN leader -->
 		<li class="row<!-- IF attachrow.S_ROW_COUNT is odd --> bg1<!-- ELSE --> bg2<!-- ENDIF -->">

phpBB/styles/prosilver/template/ucp_main_bookmarks.html

@@ -54,7 +54,15 @@
 							</ul>
 						</div>
 						<!-- ENDIF -->
-						<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->{L_POST_BY_AUTHOR} {topicrow.TOPIC_AUTHOR_FULL} &raquo; {topicrow.FIRST_POST_TIME}
+						<div class="responsive-hide">
+							<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->
+							{L_POST_BY_AUTHOR} {topicrow.TOPIC_AUTHOR_FULL} &raquo; {topicrow.FIRST_POST_TIME}
+						</div>
+						<div class="responsive-show" style="display: none;">
+							<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->
+							{L_LAST_POST} {L_POST_BY_AUTHOR} {topicrow.LAST_POST_AUTHOR_FULL} &laquo;
+							<a href="{topicrow.U_LAST_POST}">{topicrow.LAST_POST_TIME}</a>
+						</div>
 					</div>
 				</dt>
 				<dd class="lastpost"><span><dfn>{L_LAST_POST} </dfn>{L_POST_BY_AUTHOR} {topicrow.LAST_POST_AUTHOR_FULL}

phpBB/styles/prosilver/template/ucp_main_drafts.html

@@ -45,6 +45,10 @@
 							<!-- ELSEIF draftrow.S_LINK_FORUM -->{L_FORUM}{L_COLON} <a href="{draftrow.U_VIEW}">{draftrow.TITLE}</a>
 							<!-- ELSEIF S_PRIVMSGS -->
 							<!-- ELSE -->{L_NO_TOPIC_FORUM}<!-- ENDIF -->
+							<div class="responsive-show" style="display: none;">
+								{L_SAVE_DATE}{L_COLON} <strong>{draftrow.DATE}</strong><br />
+								<!-- IF draftrow.U_INSERT --><a href="{draftrow.U_INSERT}">{L_LOAD_DRAFT}</a> &bull; <!-- ENDIF --><a href="{draftrow.U_VIEW_EDIT}">{L_VIEW_EDIT}</a>
+							</div>
 						</div>
 					</dt>
 					<dd class="info"><span>{draftrow.DATE}<br /><!-- IF draftrow.U_INSERT --><a href="{draftrow.U_INSERT}">{L_LOAD_DRAFT}</a> &bull; <!-- ENDIF --><a href="{draftrow.U_VIEW_EDIT}">{L_VIEW_EDIT}</a></span></dd>

phpBB/styles/prosilver/template/ucp_main_front.html

@@ -31,7 +31,14 @@
 							</ul>
 						</div>
 						<!-- ENDIF -->
-						<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->{L_POST_BY_AUTHOR} {topicrow.TOPIC_AUTHOR_FULL} &raquo; {topicrow.FIRST_POST_TIME}
+						<div class="responsive-hide">
+							<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->
+							{L_POST_BY_AUTHOR} {topicrow.TOPIC_AUTHOR_FULL} &raquo; {topicrow.FIRST_POST_TIME}
+						</div>
+						<div class="responsive-show" style="display: none;">
+							<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->
+							{L_LAST_POST} {L_POST_BY_AUTHOR} {topicrow.LAST_POST_AUTHOR_FULL} &laquo; <a href="{topicrow.U_LAST_POST}">{topicrow.LAST_POST_TIME}</a>
+						</div>
 					</div>
 				</dt>
 				<dd class="lastpost"><span>{L_LAST_POST} {L_POST_BY_AUTHOR} {topicrow.LAST_POST_AUTHOR_FULL}

phpBB/styles/prosilver/template/ucp_main_subscribed.html

@@ -23,7 +23,17 @@
 	<!-- BEGIN forumrow -->
 		<li class="row<!-- IF forumrow.S_ROW_COUNT is odd --> bg1<!-- ELSE --> bg2<!-- ENDIF -->">
 			<dl class="icon {forumrow.FORUM_IMG_STYLE}">
-				<dt><div class="list-inner"><a href="{forumrow.U_VIEWFORUM}" class="forumtitle">{forumrow.FORUM_NAME}</a><br />{forumrow.FORUM_DESC}</div></dt>
+				<dt>
+					<div class="list-inner">
+						<a href="{forumrow.U_VIEWFORUM}" class="forumtitle">{forumrow.FORUM_NAME}</a><br />
+						{forumrow.FORUM_DESC}
+						<!-- IF forumrow.LAST_POST_TIME -->
+						<div class="responsive-show" style="display: none;">
+							{L_LAST_POST} {L_POST_BY_AUTHOR} {forumrow.LAST_POST_AUTHOR_FULL} &laquo; <a href="{topicrow.U_LAST_POST}">{forumrow.LAST_POST_TIME}</a>
+						</div>
+						<!-- ENDIF -->
+					</div>
+				</dt>
 				<dd class="lastpost"><!-- IF forumrow.LAST_POST_TIME --><span><dfn>{L_LAST_POST} </dfn>{L_POST_BY_AUTHOR} {forumrow.LAST_POST_AUTHOR_FULL}
 					<a href="{topicrow.U_LAST_POST}">{LAST_POST_IMG}</a> <br />{forumrow.LAST_POST_TIME}</span>
 					<!-- ELSE -->{L_NO_POSTS}<br />&nbsp;<!-- ENDIF -->
@@ -79,7 +89,14 @@
 							</ul>
 						</div>
 						<!-- ENDIF -->
-						<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->{L_POST_BY_AUTHOR} {topicrow.TOPIC_AUTHOR_FULL} &raquo; {topicrow.FIRST_POST_TIME}
+						<div class="responsive-hide">
+							<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->
+							{L_POST_BY_AUTHOR} {topicrow.TOPIC_AUTHOR_FULL} &raquo; {topicrow.FIRST_POST_TIME}
+						</div>
+						<div class="responsive-show" style="display: none;">
+							<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->
+							{L_LAST_POST} {L_POST_BY_AUTHOR} {topicrow.LAST_POST_AUTHOR_FULL} &laquo; <a href="{topicrow.U_LAST_POST}">{topicrow.LAST_POST_TIME}</a>
+						</div>
 					</div>
 				</dt>
 				<dd class="lastpost"><span><dfn>{L_LAST_POST} </dfn>{L_POST_BY_AUTHOR} {topicrow.LAST_POST_AUTHOR_FULL}

phpBB/styles/prosilver/template/ucp_pm_viewfolder.html

@@ -53,7 +53,7 @@
 				</dl>
 			</li>
 		</ul>
-		<ul class="topiclist cplist pmlist <!-- IF S_SHOW_RECIPIENTS -->missing-column<!-- ELSE -->two-columns<!-- ENDIF -->">
+		<ul class="topiclist cplist pmlist responsive-show-all <!-- IF S_SHOW_RECIPIENTS -->missing-column<!-- ELSE -->two-columns<!-- ENDIF -->">
 
 		<!-- BEGIN messagerow -->
 			<li class="row<!-- IF messagerow.S_ROW_COUNT is odd --> bg1<!-- ELSE --> bg2<!-- ENDIF --><!-- IF messagerow.PM_CLASS --> {messagerow.PM_CLASS}<!-- ENDIF -->">

phpBB/styles/prosilver/template/viewforum_body.html

@@ -163,8 +163,19 @@
 							</ul>
 						</div>
 						<!-- ENDIF -->
-						<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->{L_POST_BY_AUTHOR} {topicrow.TOPIC_AUTHOR_FULL} &raquo; {topicrow.FIRST_POST_TIME}
-						<!-- IF topicrow.S_POST_GLOBAL and FORUM_ID != topicrow.FORUM_ID --> &raquo; {L_IN} <a href="{topicrow.U_VIEW_FORUM}">{topicrow.FORUM_NAME}</a><!-- ENDIF -->
+						<div class="responsive-hide">
+							<!-- IF topicrow.ATTACH_ICON_IMG -->{topicrow.ATTACH_ICON_IMG} <!-- ENDIF -->
+							{L_POST_BY_AUTHOR} {topicrow.TOPIC_AUTHOR_FULL} &raquo; {topicrow.FIRST_POST_TIME}
+							<!-- IF topicrow.S_POST_GLOBAL and FORUM_ID != topicrow.FORUM_ID --> &raquo; {L_IN} <a href="{topicrow.U_VIEW_FORUM}">{topicrow.FORUM_NAME}</a><!-- ENDIF -->
+						</div>
+						<!-- IF not S_IS_BOT -->
+						<div class="responsive-show" style="display: none;">
+							{L_LAST_POST} {L_POST_BY_AUTHOR} {topicrow.LAST_POST_AUTHOR_FULL} &laquo; <a href="{topicrow.U_LAST_POST}">{topicrow.LAST_POST_TIME}</a>
+							<!-- IF topicrow.S_POST_GLOBAL and FORUM_ID != topicrow.FORUM_ID --><br />{L_POSTED} {L_IN} <a href="{topicrow.U_VIEW_FORUM}">{topicrow.FORUM_NAME}</a><!-- ENDIF -->
+							<!-- IF topicrow.REPLIES --><br />{L_REPLIES}{L_COLON} <strong>{topicrow.REPLIES}</strong><!-- ENDIF -->
+						</div>
+						<!-- ENDIF -->
+
 						<!-- EVENT topiclist_row_append -->
 					</div>
 				</dt>

phpBB/styles/prosilver/template/viewtopic_body.html

@@ -193,7 +193,7 @@
 			<!-- ENDIF -->
 		<!-- ENDIF -->
 
-			<p class="author"><!-- IF S_IS_BOT -->{postrow.MINI_POST_IMG}<!-- ELSE --><a href="{postrow.U_MINI_POST}">{postrow.MINI_POST_IMG}</a><!-- ENDIF -->{L_POST_BY_AUTHOR} <strong>{postrow.POST_AUTHOR_FULL}</strong> &raquo; {postrow.POST_DATE} </p>
+			<p class="author"><!-- IF S_IS_BOT -->{postrow.MINI_POST_IMG}<!-- ELSE --><a href="{postrow.U_MINI_POST}">{postrow.MINI_POST_IMG}</a><!-- ENDIF --><span class="responsive-hide">{L_POST_BY_AUTHOR} <strong>{postrow.POST_AUTHOR_FULL}</strong> &raquo; </span>{postrow.POST_DATE} </p>
 
 			<!-- IF postrow.S_POST_UNAPPROVED -->
 			<form method="post" class="mcp_approve" action="{postrow.U_APPROVE_ACTION}">