Skip to content

[3.0] Puts the forum title and logo back in a band of their own #9427

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
live627 merged 2 commits into from
Aug 9, 2026
Merged

[3.0] Puts the forum title and logo back in a band of their own #9427

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
765cfa0
Puts the forum title and logo back in a band of their own
albertlast Aug 9, 2026
74c6e24
Gives the top bar tokens of its own
albertlast Aug 9, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 9 additions & 11 deletions Sources/Tasks/ExportProfileData.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -135,17 +135,15 @@ class ExportProfileData extends BackgroundTask
</head>
<body>
<div id="footerfix">
<header id="header">
<div class="content_wrapper">
<h1 class="forumtitle">
<a id="top">
<xsl:attribute name="href">
<xsl:value-of select="$scripturl"/>
</xsl:attribute>
<xsl:value-of select="@forum-name"/>
</a>
</h1>
</div>
<header id="header" class="content_wrapper">
<h1 class="forumtitle">
<a id="top">
<xsl:attribute name="href">
<xsl:value-of select="$scripturl"/>
</xsl:attribute>
<xsl:value-of select="@forum-name"/>
</a>
</h1>
</header>
<div id="wrapper" class="content_wrapper">
<div id="inner_wrap">
Expand Down
8 changes: 3 additions & 5 deletions Themes/default/MaintenanceTemplate.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,11 +52,9 @@ public static function header(): void
</head>
<body>
<div id="footerfix">
<header id="header">
<div class="content_wrapper">
<h1 class="forumtitle">', Maintenance::$tool->getScriptName(), '</h1>
<img id="smflogo" src="', Maintenance::$theme_url, '/images/smflogo.svg" alt="Simple Machines Forum" title="Simple Machines Forum">
</div>
<header id="header" class="content_wrapper">
<h1 class="forumtitle">', Maintenance::$tool->getScriptName(), '</h1>
<img id="smflogo" src="', Maintenance::$theme_url, '/images/smflogo.svg" alt="Simple Machines Forum" title="Simple Machines Forum">
</header>
<div id="wrapper" class="content_wrapper">';

Expand Down
44 changes: 19 additions & 25 deletions Themes/default/css/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1223,6 +1223,22 @@ html[lang="el-GR"] .inline_mod_check {
}

/* The framing graphics */
/* The top bar. A band across the page above the header, holding everything to
/* do with the current user. Same gradient and bottom border as the menu band
/* under the header; it carries a shadow of its own on top of those. */
#top_section {
background: var(--topsection-bg);
border-color: var(--topsection-border-color);
border-style: var(--topsection-border-style);
border-width: var(--topsection-border-width);
box-shadow: var(--topsection-box-shadow);
clear: both;
}
#top_section::after {
content: "";
display: block;
clear: both;
}
#top_info {
padding: 5px 0;
line-height: 1.3em;
Expand Down Expand Up @@ -1255,39 +1271,17 @@ html[lang="el-GR"] .inline_mod_check {
#languages_form {
margin: 0 0 0 10px;
}
/* The header. Full width, with its contents lined up with the rest of the
/* page by the wrapper inside it. */
/* The logo and slogan. */
#header {
background: var(--header-bg);
border-color: var(--header-border-color);
border-radius: var(--header-border-radius);
border-style: var(--header-border-style);
border-width: var(--header-border-width);
box-shadow: var(--header-box-shadow);
margin: 0;
min-height: var(--header-height);
padding: .5em .2em;
}
#header .content_wrapper {
align-items: center;
padding: 2px 2px 12px 2px;
display: flex;
gap: .5em;
justify-content: space-between;
min-height: var(--header-height);
align-items: flex-end;
}
#header::after {
content: "";
display: block;
clear: both;
}
/* Everything about the current user sits at the end of the header, stacked. */
.user_panel {
align-content: space-between;
display: inline-grid;
flex: 1;
gap: .5em;
justify-content: flex-end;
}
/* The main title. */
h1.forumtitle {
font-size: 1.8em;
Expand Down
16 changes: 7 additions & 9 deletions Themes/default/css/variables.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,22 +71,20 @@
--footer-link-text-shadow_focus: none;
--footer-link-text-shadow_hover: none;

/** Top Bar **/
--topsection-bg: linear-gradient(#e2e9f3 0%, #fff 70%);
--topsection-border-color: #bbb;
--topsection-border-style: solid;
--topsection-border-width: 0 0 1px 0;
--topsection-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.16);

/** Main Menu **/
--mainmenu-bg: linear-gradient(#e2e9f3 0%, #fff 70%);
--mainmenu-border-color: #bbb;
--mainmenu-border-style: solid;
--mainmenu-border-width: 0 0 1px 0;
--mainmenu-box-shadow: none;

/** Header **/
--header-bg: #fff;
--header-border-color: transparent;
--header-border-radius: 0;
--header-border-style: solid;
--header-border-width: 0;
--header-box-shadow: none;
--header-height: 80px;

/** HTML **/
--html-bg: #3e5a78;

Expand Down
41 changes: 23 additions & 18 deletions Themes/default/index.template.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -228,22 +228,16 @@ functions on the SMF wiki.
*/
function template_body_above()
{
// The header holds the forum title on one side and everything to do with
// the current user on the other. h1 a is the target for "Go up" links.
// Wrapper div now echoes permanently for better layout options. h1 a is now target for "Go up" links.
echo '
<header id="header">
<div class="content_wrapper">
<h1 class="forumtitle">
<a id="top" href="', Config::$scripturl, '">', empty(Utils::$context['header_logo_url_html_safe']) ? Utils::$context['forum_name_html_safe'] : '<img src="' . Utils::$context['header_logo_url_html_safe'] . '" alt="' . Utils::$context['forum_name_html_safe'] . '">', '</a>
</h1>
', empty(Theme::$current->settings['site_slogan']) ? '<img id="smflogo" src="' . Theme::$current->settings['images_url'] . '/smflogo.svg" alt="Simple Machines Forum" title="Simple Machines Forum">' : '<div id="siteslogan">' . Theme::$current->settings['site_slogan'] . '</div>', '
<div class="user_panel">';
<div id="top_section">
<div class="inner_wrap content_wrapper">';

// If the user is logged in, display some things that might be useful.
if (!User::$me->is_guest) {
// Firstly, the user's menu
echo '
<ul id="top_info">
<ul class="floatleft" id="top_info">
<li>
<a href="', Config::$scripturl, '?action=profile"', !empty(Utils::$context['self_profile']) ? ' class="active"' : '', ' id="profile_menu_top">';

Expand Down Expand Up @@ -297,7 +291,7 @@ function template_body_above()
// Some people like to do things the old-fashioned way.
if (!empty(Theme::$current->settings['login_main_menu'])) {
echo '
<ul id="top_info">
<ul class="floatleft">
<li class="welcome">', Lang::getTxt(
Utils::$context['can_register'] ? 'welcome_guest_register' : 'welcome_guest',
[
Expand All @@ -311,7 +305,7 @@ function template_body_above()
</ul>';
} else {
echo '
<ul id="top_info">
<ul class="floatleft" id="top_info">
<li class="welcome">
', Lang::getTxt('welcome_to_forum', ['forum_name' => Utils::$context['forum_name_html_safe']], file: 'General'), '
</li>
Expand All @@ -337,7 +331,7 @@ function template_body_above()
}
} else { // In maintenance mode, only login is allowed and don't show OverlayDiv
echo '
<ul id="top_info" class="welcome">
<ul class="floatleft welcome">
<li>', Lang::getTxt(
'welcome_guest',
[
Expand All @@ -352,7 +346,7 @@ function template_body_above()

if (!empty(Config::$modSettings['userLanguage']) && !empty(Utils::$context['languages']) && count(Utils::$context['languages']) > 1) {
echo '
<form id="languages_form" method="get">
<form id="languages_form" method="get" class="floatright">
<select id="language_select" name="language" onchange="this.form.submit()">';

foreach (Utils::$context['languages'] as $language) {
Expand All @@ -370,7 +364,7 @@ function template_body_above()

if (Utils::$context['allow_search']) {
echo '
<form id="search_form" action="', Config::$scripturl, '?action=search2" method="post" accept-charset="UTF-8">
<form id="search_form" class="floatright" action="', Config::$scripturl, '?action=search2" method="post" accept-charset="UTF-8">
<input type="search" name="search" value="">&nbsp;';

// Using the quick search dropdown?
Expand Down Expand Up @@ -420,8 +414,19 @@ function template_body_above()
}

echo '
</div><!-- .user_panel -->
</div><!-- .content_wrapper -->
</div><!-- .inner_wrap -->
</div><!-- #top_section -->';

echo '
<header id="header" class="content_wrapper">
<h1 class="forumtitle">
<a id="top" href="', Config::$scripturl, '">', empty(Utils::$context['header_logo_url_html_safe']) ? Utils::$context['forum_name_html_safe'] : '<img src="' . Utils::$context['header_logo_url_html_safe'] . '" alt="' . Utils::$context['forum_name_html_safe'] . '">', '</a>
</h1>';

echo '
', empty(Theme::$current->settings['site_slogan']) ? '<img id="smflogo" src="' . Theme::$current->settings['images_url'] . '/smflogo.svg" alt="Simple Machines Forum" title="Simple Machines Forum">' : '<div id="siteslogan">' . Theme::$current->settings['site_slogan'] . '</div>', '';

echo '
</header>';

// The menu is a band of its own across the page, with its contents lined up
Expand Down Expand Up @@ -507,7 +512,7 @@ function template_body_below()
<li class="helplinks">
<a href="', Config::$scripturl, '?action=help">', Lang::getTxt('help', file: 'General'), '</a>', (!empty(Config::$modSettings['requireAgreement'])) ? '
<a href="' . Config::$scripturl . '?action=agreement">' . Lang::getTxt('terms_and_rules', file: 'General') . '</a>' : '', '
<a href="#header">', Lang::getTxt('go_up', file: 'General'), ' &#9650;</a>
<a href="#top_section">', Lang::getTxt('go_up', file: 'General'), ' &#9650;</a>
</li>
</ul>';

Expand Down