luckyimnotanigger/forgejo
1
0
Fork 0
mirror of https://codeberg.org/forgejo/forgejo.git synced 2025-05-25 11:22:16 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

Improve wiki sidebar and TOC (#25460) (#25477)

Browse source 
Backport #25460 by @wxiaoguang

Close #20976
Close #20975

1. Fix the bug: the TOC in footer was incorrectly rendered as main
content's TOC
2. Fix the layout: on mobile, the TOC is put above the main content,
while the sidebar is put below the main content
3. Auto collapse the TOC on mobile

ps: many styles of "wiki.css" are moved from old css files, so leave
nits to following PRs.

### for desktop


![image](6c84201c-0648-465a-99e6-c53cdaee53c0)

### for mobile


![image](9cb4fdfe-b6ab-4e6f-ae82-219ddb8fa27e)

### other changed pages

<details>


![image](ef077736-2c3e-4e3d-82fe-d9bf1ebcca98)


![image](bb528429-ad5f-4258-a5c4-05f997c624ea)

</details>

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
Giteabot 2023-06-23 22:16:15 -04:00 • committed by GitHub
parent b0de3d08b8
commit 51789ba12d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 129 additions and 117 deletions
Download patch file Download diff file Expand all files Collapse all files

63
web_src/css/repo/wiki.css Normal file
View file

@ -0,0 +1,63 @@
.repository.wiki .wiki-pages-list .wiki-git-entry {
margin-left: 10px;
display: none;
}
.repository.wiki .wiki-pages-list td:hover .wiki-git-entry {
display: inline-block;
}
.repository.wiki .markup {
overflow: visible;
}
.repository.wiki .wiki-content-parts .markup {
border: 1px solid var(--color-secondary);
padding: 1em;
margin-top: 1em;
font-size: 1em;
}
.repository.wiki .wiki-content-main.with-sidebar {
float: left;
width: 80%;
max-width: calc(100% - 150px - 1em); /* match the min-width of .wiki-content-sidebar */
}
.repository.wiki .wiki-content-sidebar {
float: right;
width: calc(20% - 1em);
min-width: 150px;
}
.repository.wiki .wiki-content-sidebar .ui.message.unicode-escape-prompt p {
display: none;
}
.repository.wiki .wiki-content-footer {
margin-top: 1em;
}
.repository.wiki .wiki-content-toc ul {
margin: 0;
list-style: none;
padding: 5px 0 5px 1em;
}
.repository.wiki .wiki-content-toc ul ul {
border-left: 1px var(--color-secondary);
border-left-style: dashed;
}
@media (max-width: 767.98px) {
.repository.wiki #clone-panel #repo-clone-url {
width: 160px;
}
.repository.wiki .wiki-content-main.with-sidebar,
.repository.wiki .wiki-content-sidebar {
float: none;
width: 100%;
min-width: unset;
max-width: unset;
}
}