Skip to content

Commit f8f4370

Browse files
JuliaKirschenheuterJuliaKirschenheuter
authored
Merge pull request #40576 from nextcloud/fix/36915-_The_page_only_has_one_h1_heading
Split list to navigation for the left sidebar
2 parents cfda046 + 5693092 commit f8f4370

7 files changed

Lines changed: 73 additions & 70 deletions

File tree

‎apps/settings/templates/settings/frame.php‎

Lines changed: 51 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -29,58 +29,60 @@
2929

3030
?>
3131

32-
<div id="app-navigation" role="navigation">
33-
<ul tabindex="0">
34-
<?php if (!empty($_['forms']['admin'])) { ?>
35-
<li class="app-navigation-caption"><?php p($l->t('Personal')); ?></li>
36-
<?php
37-
}
38-
foreach ($_['forms']['personal'] as $form) {
39-
if (isset($form['anchor'])) {
40-
$anchor = \OC::$server->getURLGenerator()->linkToRoute('settings.PersonalSettings.index', ['section' => $form['anchor']]);
41-
$class = 'nav-icon-' . $form['anchor'];
42-
$sectionName = $form['section-name']; ?>
43-
<li <?php print_unescaped($form['active'] ? ' class="active"' : ''); ?> data-section-id="<?php print_unescaped($form['anchor']); ?>" data-section-type="personal">
44-
<a href="<?php p($anchor); ?>"<?php print_unescaped($form['active'] ? ' aria-current="page"' : ''); ?>>
45-
<?php if (!empty($form['icon'])) { ?>
46-
<img alt="" src="<?php print_unescaped($form['icon']); ?>">
47-
<span><?php p($form['section-name']); ?></span>
48-
<?php } else { ?>
49-
<span class="no-icon"><?php p($form['section-name']); ?></span>
50-
<?php } ?>
51-
</a>
52-
</li>
53-
<?php
32+
<div id="app-navigation">
33+
<?php if (!empty($_['forms']['admin'])): ?>
34+
<div id="app-navigation-caption-personal" class="app-navigation-caption"><?php p($l->t('Personal')); ?></div>
35+
<?php endif; ?>
36+
<nav class="app-navigation-personal" aria-labelledby="app-navigation-caption-personal">
37+
<ul tabindex="0">
38+
<?php foreach ($_['forms']['personal'] as $form) {
39+
if (isset($form['anchor'])) {
40+
$anchor = \OC::$server->getURLGenerator()->linkToRoute('settings.PersonalSettings.index', ['section' => $form['anchor']]);
41+
$class = 'nav-icon-' . $form['anchor'];
42+
$sectionName = $form['section-name']; ?>
43+
<li <?php print_unescaped($form['active'] ? ' class="active"' : ''); ?> data-section-id="<?php print_unescaped($form['anchor']); ?>" data-section-type="personal">
44+
<a href="<?php p($anchor); ?>"<?php print_unescaped($form['active'] ? ' aria-current="page"' : ''); ?>>
45+
<?php if (!empty($form['icon'])) { ?>
46+
<img alt="" src="<?php print_unescaped($form['icon']); ?>">
47+
<span><?php p($form['section-name']); ?></span>
48+
<?php } else { ?>
49+
<span class="no-icon"><?php p($form['section-name']); ?></span>
50+
<?php } ?>
51+
</a>
52+
</li>
53+
<?php
54+
}
5455
}
55-
}
56-
?>
57-
58-
<?php
59-
if (!empty($_['forms']['admin'])) {
6056
?>
61-
<li class="app-navigation-caption"><?php p($l->t('Administration')); ?></li>
62-
<?php
63-
}
64-
foreach ($_['forms']['admin'] as $form) {
65-
if (isset($form['anchor'])) {
66-
$anchor = \OC::$server->getURLGenerator()->linkToRoute('settings.AdminSettings.index', ['section' => $form['anchor']]);
67-
$class = 'nav-icon-' . $form['anchor'];
68-
$sectionName = $form['section-name']; ?>
69-
<li <?php print_unescaped($form['active'] ? ' class="active"' : ''); ?> data-section-id="<?php print_unescaped($form['anchor']); ?>" data-section-type="admin">
70-
<a href="<?php p($anchor); ?>"<?php print_unescaped($form['active'] ? ' aria-current="page"' : ''); ?>>
71-
<?php if (!empty($form['icon'])) { ?>
72-
<img alt="" src="<?php print_unescaped($form['icon']); ?>">
73-
<span><?php p($form['section-name']); ?></span>
74-
<?php } else { ?>
75-
<span class="no-icon"><?php p($form['section-name']); ?></span>
76-
<?php } ?>
77-
</a>
78-
</li>
79-
<?php
57+
</ul>
58+
</nav>
59+
60+
<?php if (!empty($_['forms']['admin'])): ?>
61+
<div id="app-navigation-caption-administration" class="app-navigation-caption"><?php p($l->t('Administration')); ?></div>
62+
<?php endif; ?>
63+
<nav class="app-navigation-administration" aria-labelledby="app-navigation-caption-administration">
64+
<ul tabindex="0">
65+
<?php foreach ($_['forms']['admin'] as $form) {
66+
if (isset($form['anchor'])) {
67+
$anchor = \OC::$server->getURLGenerator()->linkToRoute('settings.AdminSettings.index', ['section' => $form['anchor']]);
68+
$class = 'nav-icon-' . $form['anchor'];
69+
$sectionName = $form['section-name']; ?>
70+
<li <?php print_unescaped($form['active'] ? ' class="active"' : ''); ?> data-section-id="<?php print_unescaped($form['anchor']); ?>" data-section-type="admin">
71+
<a href="<?php p($anchor); ?>"<?php print_unescaped($form['active'] ? ' aria-current="page"' : ''); ?>>
72+
<?php if (!empty($form['icon'])) { ?>
73+
<img alt="" src="<?php print_unescaped($form['icon']); ?>">
74+
<span><?php p($form['section-name']); ?></span>
75+
<?php } else { ?>
76+
<span class="no-icon"><?php p($form['section-name']); ?></span>
77+
<?php } ?>
78+
</a>
79+
</li>
80+
<?php
81+
}
8082
}
81-
}
82-
?>
83-
</ul>
83+
?>
84+
</ul>
85+
</nav>
8486
</div>
8587
<div id="app-content" tabindex="0" data-active-section-id="<?php print_unescaped($_['activeSectionId']) ?>">
8688
<?php print_unescaped($_['content']); ?>

‎core/css/apps.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎core/css/apps.css.map‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎core/css/apps.scss‎

Lines changed: 17 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -138,6 +138,22 @@ kbd {
138138
flex-direction: column;
139139
flex-grow: 0;
140140
flex-shrink: 0;
141+
}
142+
.app-navigation-caption,
143+
.app-navigation-caption {
144+
font-weight: bold;
145+
line-height: 44px;
146+
padding: 10px 44px 0 44px;
147+
white-space: nowrap;
148+
text-overflow: ellipsis;
149+
box-shadow: none !important;
150+
user-select: none;
151+
pointer-events:none;
152+
margin-left: 10px;
153+
}
154+
155+
.app-navigation-personal,
156+
.app-navigation-administration {
141157

142158
/* 'New' button */
143159
.app-navigation-new {
@@ -239,21 +255,6 @@ kbd {
239255
}
240256
}
241257

242-
&.app-navigation-caption {
243-
font-weight: bold;
244-
line-height: 44px;
245-
padding: 0 44px;
246-
white-space: nowrap;
247-
text-overflow: ellipsis;
248-
box-shadow: none !important;
249-
user-select: none;
250-
pointer-events:none;
251-
252-
&:not(:first-child) {
253-
margin-top: 22px;
254-
}
255-
}
256-
257258
/* Second level nesting for lists */
258259
> ul {
259260
flex: 0 1 auto;
@@ -344,7 +345,7 @@ kbd {
344345
}
345346
}
346347
&:first-child img {
347-
margin-right: 11px;
348+
margin-right: 11px!important;
348349
width: 16px;
349350
height: 16px;
350351
// Legacy invert if bright background

‎core/css/server.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)