Topics index - Make the "new topic" button more visible

MessageIndex.template.php

@@ -120,12 +120,12 @@ function template_main()
 	{
 		echo '
 	<div class="pagesection">
-		', template_button_strip($context['normal_buttons'], ), '
-		', $context['menu_separator'], '
 		<div class="pagelinks">
 			<a href="#bot" class="button">', $txt['go_down'], '</a>
 			', $context['page_index'], '
 		</div>
+		', $context['menu_separator'], '
+		', template_button_strip($context['normal_buttons'], ), '
 		';
 
 		// Mobile action buttons (top)
@@ -338,12 +338,12 @@ function template_main()
 
 		echo '
 	<div class="pagesection">
-		', template_button_strip($context['normal_buttons'], ), '
-		', $context['menu_separator'], '
 		<div class="pagelinks">
 			<a href="#main_content_section" class="button" id="bot">', $txt['go_up'], '</a>
 			', $context['page_index'], '
-		</div>';
+		</div>
+		', $context['menu_separator'], '
+		', template_button_strip($context['normal_buttons'], );
 
 		// Mobile action buttons (bottom)
 		if (!empty($context['normal_buttons']))

css/index.css

@@ -25,6 +25,8 @@ html {
 	--menu-background-hover: #555555;
 	--menu-background-active: black;
 	--menu-font: white;
+	--font-regular: "Cabin", sans-serif;
+	--font-emphasis: "Oswald", sans-serif;
 }
 
 /* Index */
@@ -1133,13 +1135,16 @@ generic_menu .dropmenu .subsections ul li a {
 	border: 1px solid;
 	border-color: var(--bgcolor);
 	border-radius: 3px;
-	box-shadow: 1px 1px 1px rgba(221, 221, 221, 0.57) inset;
 	box-sizing: border-box;
 	vertical-align: middle;
 	background: var(--neutral-color);
 	outline: none;
 	padding: 0 0.4em;
 }
+.button_strip_new_topic {
+	font-weight: 700;
+	font-family: var(--font-emphasis);
+}
 
 a.button, a.button:hover, .button:focus {
 	border-bottom: none;

index.template.php

@@ -634,8 +634,6 @@ function template_menu()
  */
 function template_button_strip($button_strip, $direction = '', $strip_options = array())
 {
-	global $context, $txt;
-
 	if (!is_array($strip_options))
 		$strip_options = array();
 
@@ -643,40 +641,18 @@ function template_button_strip($button_strip, $direction = '', $strip_options =
 	$buttons = array();
 	foreach ($button_strip as $key => $value)
 	{
-		// As of 2.1, the 'test' for each button happens while the array is being generated. The extra 'test' check here is deprecated but kept for backward compatibility (update your mods, folks!)
+		// If a "new topic" button is provided, skip it in this first pass.
-		if (!isset($value['test']) || !empty($context[$value['test']]))
+		// It will be added at the end of the strip.
-		{
+		if ( $key == 'new_topic' ) continue;
-			if (!isset($value['id']))
-				$value['id'] = $key;
 
-			$button = '
+		$buttons = template_button_strip_single_button($key, $value, $buttons);
-				<a class="button button_strip_' . $key . (isset($value['class']) ? ' ' . $value['class'] : '') . '" ' . (!empty($value['url']) ? 'href="' . $value['url'] . '"' : '') . ' ' . (isset($value['custom']) ? ' ' . $value['custom'] : '') . '>'.(!empty($value['icon']) ? '<span class="main_icons '.$value['icon'].'"></span>' : '').'' . $txt[$value['text']] . '</a>';
+	}
+	// If a "new topic" button is provided, add it at the end of the strip.
+	if ( array_key_exists('new_topic', $button_strip) ) {
+		$key = 'new_topic';
+		$value = $button_strip[$key];
 
-			if (!empty($value['sub_buttons']))
+		$buttons = template_button_strip_single_button($key, $value, $buttons);
-			{
-				$button .= '
-					<div class="top_menu dropmenu ' . $key . '_dropdown">
-						<div class="viewport">
-							<div class="overview">';
-				foreach ($value['sub_buttons'] as $element)
-				{
-					if (isset($element['test']) && empty($context[$element['test']]))
-						continue;
-
-					$button .= '
-								<a href="' . $element['url'] . '"><strong>' . $txt[$element['text']] . '</strong>';
-					if (isset($txt[$element['text'] . '_desc']))
-						$button .= '<br><span>' . $txt[$element['text'] . '_desc'] . '</span>';
-					$button .= '</a>';
-				}
-				$button .= '
-							</div><!-- .overview -->
-						</div><!-- .viewport -->
-					</div><!-- .top_menu -->';
-			}
-
-			$buttons[] = $button;
-		}
 	}
 
 	// No buttons? No button strip either.
@@ -688,6 +664,45 @@ function template_button_strip($button_strip, $direction = '', $strip_options =
 			', implode('', $buttons), '
 		</div>';
 }
+function template_button_strip_single_button($key, $value, $buttons) {
+	global $context, $txt;
+
+	// As of 2.1, the 'test' for each button happens while the array is being generated. The extra 'test' check here is deprecated but kept for backward compatibility (update your mods, folks!)
+	if (!isset($value['test']) || !empty($context[$value['test']]))
+	{
+		if (!isset($value['id']))
+			$value['id'] = $key;
+
+		$button = '
+			<a class="button button_strip_' . $key . (isset($value['class']) ? ' ' . $value['class'] : '') . '" ' . (!empty($value['url']) ? 'href="' . $value['url'] . '"' : '') . ' ' . (isset($value['custom']) ? ' ' . $value['custom'] : '') . '>'.(!empty($value['icon']) ? '<span class="main_icons '.$value['icon'].'"></span>' : '').'' . $txt[$value['text']] . '</a>';
+
+		if (!empty($value['sub_buttons']))
+		{
+			$button .= '
+				<div class="top_menu dropmenu ' . $key . '_dropdown">
+					<div class="viewport">
+						<div class="overview">';
+			foreach ($value['sub_buttons'] as $element)
+			{
+				if (isset($element['test']) && empty($context[$element['test']]))
+					continue;
+
+				$button .= '
+							<a href="' . $element['url'] . '"><strong>' . $txt[$element['text']] . '</strong>';
+				if (isset($txt[$element['text'] . '_desc']))
+					$button .= '<br><span>' . $txt[$element['text'] . '_desc'] . '</span>';
+				$button .= '</a>';
+			}
+			$button .= '
+						</div><!-- .overview -->
+					</div><!-- .viewport -->
+				</div><!-- .top_menu -->';
+		}
+
+		$buttons[] = $button;
+	}
+	return $buttons;
+}
 
 /**
  * Generate a list of quickbuttons.