Use flex-container for repo and org settings (#27418) (#27430)

Backport #27418 by @silverwind

Same as https://github.com/go-gitea/gitea/pull/26046 but for repo and
org settings pages, reducing the margins between the boxes:

<img width="1247" alt="Screenshot 2023-10-03 at 23 25 19"
src="https://github.com/go-gitea/gitea/assets/115237/4e68ad5e-5fdc-4466-aefb-ec71bf411d45">
<img width="1255" alt="Screenshot 2023-10-03 at 23 27 12"
src="https://github.com/go-gitea/gitea/assets/115237/9068369b-a75d-401e-8b8d-3bd4bbe097dc">

Co-authored-by: silverwind <me@silverwind.io>

diff --git a/templates/org/settings/layout_head.tmpl b/templates/org/settings/layout_head.tmpl
index c245a3bf62460a4cca932c3dab9cf9ad0b870008..31dad2c14124fce34fbc7b950b3aad2ec3f983dc 100644 (file)
--- a/templates/org/settings/layout_head.tmpl
+++ b/templates/org/settings/layout_head.tmpl
@@ -1,9 +1,9 @@
 {{template "base/head" .ctxData}}
 <div role="main" aria-label="{{.ctxData.Title}}" class="page-content {{.pageClass}}">
        {{template "org/header" .ctxData}}
-       <div class="ui container stackable grid">
+       <div class="ui container flex-container">
                {{template "org/settings/navbar" .ctxData}}
-               <div class="twelve wide column">
+               <div class="flex-container-main">
                        {{template "base/alert" .ctxData}}
                        {{/* block: org-setting-content */}}
 

diff --git a/templates/org/settings/navbar.tmpl b/templates/org/settings/navbar.tmpl
index 201ac3b9f297b8354348ffe8e6588ca70aa99d95..64ae20f0a3b722e3fa3be0765bebef2f676547d7 100644 (file)
--- a/templates/org/settings/navbar.tmpl
+++ b/templates/org/settings/navbar.tmpl
@@ -1,4 +1,4 @@
-<div class="four wide column">
+<div class="flex-container-nav">
        <div class="ui fluid vertical menu">
                <div class="header item">{{ctx.Locale.Tr "org.settings"}}</div>
                <a class="{{if .PageIsSettingsOptions}}active {{end}}item" href="{{.OrgLink}}/settings">

diff --git a/templates/repo/settings/layout_head.tmpl b/templates/repo/settings/layout_head.tmpl
index 3117309831892799db15ebe1ec515f710c17ea30..efec9bf87428d09141faa66f861e01fe7590f6a6 100644 (file)
--- a/templates/repo/settings/layout_head.tmpl
+++ b/templates/repo/settings/layout_head.tmpl
@@ -1,9 +1,9 @@
 {{template "base/head" .ctxData}}
 <div role="main" aria-label="{{.ctxData.Title}}" class="page-content {{.pageClass}}">
        {{template "repo/header" .ctxData}}
-       <div class="ui container stackable grid">
+       <div class="ui container flex-container">
                {{template "repo/settings/navbar" .ctxData}}
-               <div class="twelve wide column">
+               <div class="flex-container-main">
                        {{template "base/alert" .ctxData}}
                        {{/* block: repo-setting-content */}}
 

diff --git a/templates/repo/settings/navbar.tmpl b/templates/repo/settings/navbar.tmpl
index 74c4b86c68edeff54f23a13abaeda7e68282b73b..b16eb6076fad5032eba96c04c67b3d55d5adf8d5 100644 (file)
--- a/templates/repo/settings/navbar.tmpl
+++ b/templates/repo/settings/navbar.tmpl
@@ -1,4 +1,4 @@
-<div class="four wide column">
+<div class="flex-container-nav">
        <div class="ui fluid vertical menu">
                <div class="header item">{{ctx.Locale.Tr "repo.settings"}}</div>
                <a class="{{if .PageIsSettingsOptions}}active {{end}}item" href="{{.RepoLink}}/settings">