{{template "repo/header" .}}
-
- {{svg "octicon-book" 32}} +
+ {{svg "octicon-book" 48}}

{{.locale.Tr "repo.wiki.welcome"}}

{{.locale.Tr "repo.wiki.welcome_desc"}}

{{if and .CanWriteWiki (not .Repository.IsMirror)}} diff --git a/templates/repo/wiki/view.tmpl b/templates/repo/wiki/view.tmpl index ee9a3b214..c294af316 100644 --- a/templates/repo/wiki/view.tmpl +++ b/templates/repo/wiki/view.tmpl @@ -63,39 +63,41 @@

{{.FormatWarning}}

{{end}} -
-
+ +
+ {{if .sidebarTocContent}} +
+ {{.sidebarTocContent | Safe}} +
+ {{end}} + +
{{template "repo/unicode_escape_prompt" dict "EscapeStatus" .EscapeStatus "root" $}} {{.content | Safe}}
- {{if or .sidebarPresent .sidebarTocContent}} -
- {{if .sidebarTocContent}} -
- {{.sidebarTocContent | Safe}} -
+ + {{if .sidebarPresent}} +
+ {{if and .CanWriteWiki (not .Repository.IsMirror)}} + {{svg "octicon-pencil"}} {{end}} - {{if .sidebarPresent}} -
- {{if and .CanWriteWiki (not .Repository.IsMirror)}} - {{svg "octicon-pencil"}} - {{end}} - {{template "repo/unicode_escape_prompt" dict "EscapeStatus" .sidebarEscapeStatus "root" $}} - {{.sidebarContent | Safe}} -
+ {{template "repo/unicode_escape_prompt" dict "EscapeStatus" .sidebarEscapeStatus "root" $}} + {{.sidebarContent | Safe}} +
+ {{end}} + +
+ + {{if .footerPresent}} +
+ {{if and .CanWriteWiki (not .Repository.IsMirror)}} + {{svg "octicon-pencil"}} {{end}} + {{template "repo/unicode_escape_prompt" dict "footerEscapeStatus" .sidebarEscapeStatus "root" $}} + {{.footerContent | Safe}}
{{end}}
- {{if .footerPresent}} -
- {{if and .CanWriteWiki (not .Repository.IsMirror)}} - {{svg "octicon-pencil"}} - {{end}} - {{template "repo/unicode_escape_prompt" dict "footerEscapeStatus" .sidebarEscapeStatus "root" $}} - {{.footerContent | Safe}} -
- {{end}}
diff --git a/web_src/css/helpers.css b/web_src/css/helpers.css index eae3d3375..090993226 100644 --- a/web_src/css/helpers.css +++ b/web_src/css/helpers.css @@ -85,6 +85,7 @@ Gitea's private styles use `g-` prefix. .gt-float-left { float: left !important; } .gt-float-right { float: right !important; } +.gt-clear-both { clear: both !important; } .gt-font-light { font-weight: var(--font-weight-light) !important; } .gt-font-normal { font-weight: var(--font-weight-normal) !important; } diff --git a/web_src/css/index.css b/web_src/css/index.css index 21ae4c1b1..66a1a9ffd 100644 --- a/web_src/css/index.css +++ b/web_src/css/index.css @@ -45,6 +45,7 @@ @import "./repo/issue-list.css"; @import "./repo/list-header.css"; @import "./repo/linebutton.css"; +@import "./repo/wiki.css"; @import "./editor/fileeditor.css"; @import "./editor/combomarkdowneditor.css"; diff --git a/web_src/css/markup/content.css b/web_src/css/markup/content.css index 5905657e1..2a645e522 100644 --- a/web_src/css/markup/content.css +++ b/web_src/css/markup/content.css @@ -514,20 +514,6 @@ padding-left: 2em; } -.repository.wiki.revisions .ui.container > .ui.stackable.grid { - -ms-flex-direction: row-reverse; - flex-direction: row-reverse; -} - -.repository.wiki.revisions .ui.container > .ui.stackable.grid > .header { - margin-top: 0; -} - -.repository.wiki.revisions .ui.container > .ui.stackable.grid > .header .sub.header { - padding-left: 52px; - word-break: break-word; -} - .file-revisions-btn { display: block; float: left; diff --git a/web_src/css/repo.css b/web_src/css/repo.css index 13fd9d1f2..79a4206c1 100644 --- a/web_src/css/repo.css +++ b/web_src/css/repo.css @@ -1887,50 +1887,9 @@ white-space: nowrap; } -.repository.wiki.start .ui.segment { - padding-top: 70px; - padding-bottom: 100px; -} - -.repository.wiki.start .ui.segment .svg { - height: 48px; -} - -.repository.wiki.new .ui.attached.tabular.menu.previewtabs { - margin-bottom: 15px; -} - .file-view.markup { padding: 1em 2em; } - -.wiki-content-main { - padding: 1em 2em !important; - margin-left: 1em !important; -} - -.wiki-pages-list .wiki-git-entry { - margin-left: 10px; - display: none; -} - -.wiki-pages-list td:hover .wiki-git-entry { - display: inline-block; -} - -@media (max-width: 767.98px) { - .repository.wiki .dividing.header .stackable.grid .button { - margin-top: 2px; - margin-bottom: 2px; - } -} - -@media (max-width: 767.98px) { - .repository.wiki #clone-panel #repo-clone-url { - width: 160px; - } -} - .repository .activity-header { display: flex; justify-content: space-between; @@ -2988,22 +2947,6 @@ tbody.commit-list { flex-direction: column; } -.wiki-content-sidebar .ui.message.unicode-escape-prompt p, -.wiki-content-footer .ui.message.unicode-escape-prompt p { - display: none; -} - -.wiki-content-toc ul { - margin: 0; - list-style: none; - padding: 5px 0 5px 1em; -} - -.wiki-content-toc ul ul { - border-left: 1px var(--color-secondary); - border-left-style: dashed; -} - /* fomantic's last-child selector does not work with hidden last child */ .ui.buttons .unescape-button { border-top-right-radius: 0.28571429rem; diff --git a/web_src/css/repo/wiki.css b/web_src/css/repo/wiki.css new file mode 100644 index 000000000..b13679f61 --- /dev/null +++ b/web_src/css/repo/wiki.css @@ -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; + } +} diff --git a/web_src/js/features/repo-wiki.js b/web_src/js/features/repo-wiki.js index c37da4599..58036fde3 100644 --- a/web_src/js/features/repo-wiki.js +++ b/web_src/js/features/repo-wiki.js @@ -1,6 +1,7 @@ import $ from 'jquery'; import {initMarkupContent} from '../markup/content.js'; import {validateTextareaNonEmpty, initComboMarkdownEditor} from './comp/ComboMarkdownEditor.js'; +import {fomanticMobileScreen} from '../modules/fomantic.js'; const {csrfToken} = window.config; @@ -70,6 +71,17 @@ async function initRepoWikiFormEditor() { }); } +function collapseWikiTocForMobile(collapse) { + if (collapse) { + document.querySelector('.wiki-content-toc details')?.removeAttribute('open'); + } +} + export function initRepoWikiForm() { + if (!document.querySelector('.page-content.repository.wiki')) return; + + fomanticMobileScreen.addEventListener('change', (e) => collapseWikiTocForMobile(e.matches)); + collapseWikiTocForMobile(fomanticMobileScreen.matches); + initRepoWikiFormEditor(); } diff --git a/web_src/js/modules/fomantic.js b/web_src/js/modules/fomantic.js index 1495b311c..5988584ac 100644 --- a/web_src/js/modules/fomantic.js +++ b/web_src/js/modules/fomantic.js @@ -3,6 +3,8 @@ import {initAriaCheckboxPatch} from './aria/checkbox.js'; import {initAriaDropdownPatch} from './aria/dropdown.js'; import {svg} from '../svg.js'; +export const fomanticMobileScreen = window.matchMedia('only screen and (max-width: 767.98px)'); + export function initGiteaFomantic() { // Silence fomantic's error logging when tabs are used without a target content element $.fn.tab.settings.silent = true;