MMF/smf-theme
1
1
Fork 0
Code Issues 8 Pull requests Projects Releases Packages Wiki Activity Actions

Handle buttons with sub-buttons in CSS instead of JS

Browse source
This commit is contained in:
Antoine Le Gonidec 2024-07-26 12:39:19 +02:00
parent 1bb554069a
commit f4d58a1ef7
Signed by: vv221
GPG key ID: 636B78F91CEB80D8
2 changed files with 48 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
css/index.css
View file

@ -224,6 +224,18 @@ summary {
margin: 5px 0; margin: 5px 0;
} }
/* Handle buttons with sub-buttons in CSS instead of JS. */
details > summary {
list-style: none;
margin: 0;
}
details > summary::before {
content: "▼";
}
details[open] > summary::before {
content: "▲";
}
/* Define strong as bold, and em as italics */ /* Define strong as bold, and em as italics */
/* Note: in some particular places, strong has been redefined as font-weight: 600; */ /* Note: in some particular places, strong has been redefined as font-weight: 600; */
/* This gives a better effect for those areas, and will default to bold for fonts which do not support numerical font-weight */ /* This gives a better effect for those areas, and will default to bold for fonts which do not support numerical font-weight */

37
index.template.php
View file

@ -670,37 +670,50 @@ function template_button_strip_single_button($key, $value, $buttons) {
// 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!) // 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['test']) || !empty($context[$value['test']]))
{ {
// Buttons used to spawn another list of options are handled in a dedicated function.
if (!empty($value['sub_buttons']))
return template_button_strip_single_button_with_sub_buttons($key, $value, $buttons);
if (!isset($value['id'])) if (!isset($value['id']))
$value['id'] = $key; $value['id'] = $key;
$button = ' $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>'; <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'])) $buttons[] = $button;
{ }
return $buttons;
}
function template_button_strip_single_button_with_sub_buttons($key, $value, $buttons) {
global $context, $txt;
if (!isset($value['id']))
$value['id'] = $key;
$button = '
<details>
<summary>
<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>
</summary>';
$button .= ' $button .= '
<div class="top_menu dropmenu ' . $key . '_dropdown"> <ul>';
<div class="viewport">
<div class="overview">';
foreach ($value['sub_buttons'] as $element) foreach ($value['sub_buttons'] as $element)
{ {
if (isset($element['test']) && empty($context[$element['test']])) if (isset($element['test']) && empty($context[$element['test']]))
continue; continue;
$button .= ' $button .= '
<a href="' . $element['url'] . '"><strong>' . $txt[$element['text']] . '</strong>'; <li><a href="' . $element['url'] . '"><strong>' . $txt[$element['text']] . '</strong>';
if (isset($txt[$element['text'] . '_desc'])) if (isset($txt[$element['text'] . '_desc']))
$button .= '<br><span>' . $txt[$element['text'] . '_desc'] . '</span>'; $button .= '<br><span>' . $txt[$element['text'] . '_desc'] . '</span>';
$button .= '</a>'; $button .= '</a></li>';
} }
$button .= ' $button .= '
</div><!-- .overview --> </ul>
</div><!-- .viewport --> </details>';
</div><!-- .top_menu -->';
}
$buttons[] = $button; $buttons[] = $button;
}
return $buttons; return $buttons;
} }