Replace fomantic divider module with our own (#25539)

Should look exactly like before for normal dividers. "Horizontal" ones
look better because they no longer use image backgrounds.

<img width="917" alt="Screenshot 2023-06-27 at 19 07 56"
src="https://github.com/go-gitea/gitea/assets/115237/d97d8dec-6859-44a8-85ba-e4549b4dd9df">

<img width="914" alt="Screenshot 2023-06-27 at 19 05 58"
src="https://github.com/go-gitea/gitea/assets/115237/8bf98544-2d82-4ebf-ac68-d6dc237bd6b2">

<img width="1246" alt="Screenshot 2023-06-27 at 19 00 42"
src="https://github.com/go-gitea/gitea/assets/115237/36a6bb21-6029-4f53-8bee-535f55c66fed">

<img width="344" alt="Screenshot 2023-06-27 at 18 58 15"
src="https://github.com/go-gitea/gitea/assets/115237/a9e70aee-8e6b-4ea1-9e93-19c9f96aec6e">
<img width="823" alt="Screenshot 2023-06-27 at 18 56 22"
src="https://github.com/go-gitea/gitea/assets/115237/e7a497cd-f262-4683-8872-23c3c8cce32f">

<img width="330" alt="Screenshot 2023-06-27 at 19 21 11"
src="https://github.com/go-gitea/gitea/assets/115237/42f24149-a655-4c7e-bd26-8ab52db6446b">

9 files changed, 44 insertions, 322 deletions

diff --git a/web_src/css/admin.css b/web_src/css/admin.css
index 58e0527350..07c0190f52 100644
--- a/web_src/css/admin.css
+++ b/web_src/css/admin.css
@@ -15,11 +15,6 @@
   flex-wrap: wrap;
 }
 
-/* divider needs explicit width because the parent container is "display: flex" */
-.admin dl.admin-dl-horizontal .ui.divider {
-  width: 100%;
-}
-
 .admin dl.admin-dl-horizontal dt,
 .admin dl.admin-dl-horizontal dd {
   line-height: 1;
diff --git a/web_src/css/base.css b/web_src/css/base.css
index 016c263e43..8b8d376c57 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -465,15 +465,6 @@ a.label,
   background-color: var(--color-markup-code-block);
 }
 
-.ui.divider {
-  color: var(--color-text);
-}
-
-.ui.divider:not(.vertical,.horizontal) {
-  border-top-color: var(--color-secondary) !important;
-  border-bottom: none !important;
-}
-
 .ui.dividing.header {
   border-bottom-color: var(--color-secondary);
 }
@@ -2083,11 +2074,6 @@ table th[data-sortt-desc] .svg {
   border-radius: 0 0 var(--border-radius) var(--border-radius);
 }
 
-.ui.dropdown .menu > .divider {
-  border-top: 1px solid var(--color-secondary);
-  margin: 4px 0;
-}
-
 .ui.multiple.dropdown > .label {
   box-shadow: 0 0 0 1px var(--color-secondary) inset;
 }
diff --git a/web_src/css/helpers.css b/web_src/css/helpers.css
index 520a199682..68d4a1b021 100644
--- a/web_src/css/helpers.css
+++ b/web_src/css/helpers.css
@@ -76,6 +76,7 @@ Gitea's private styles use `g-` prefix.
 .gt-self-end { align-self: flex-end !important; }
 .gt-no-underline { text-decoration-line: none !important; }
 .gt-w-auto { width: auto !important; }
+.gt-normal-case { text-transform: none !important; }
 
 .gt-overflow-x-auto { overflow-x: auto !important; }
 .gt-overflow-x-scroll { overflow-x: scroll !important; }
diff --git a/web_src/css/index.css b/web_src/css/index.css
index d7ac9f453d..6a3e7d0dd5 100644
--- a/web_src/css/index.css
+++ b/web_src/css/index.css
@@ -9,6 +9,7 @@
 @import "./modules/comment.css";
 @import "./modules/navbar.css";
 @import "./modules/toast.css";
+@import "./modules/divider.css";
 
 @import "./shared/issuelist.css";
 @import "./shared/milestone.css";
diff --git a/web_src/css/modules/divider.css b/web_src/css/modules/divider.css
new file mode 100644
index 0000000000..8c9649d6ba
--- /dev/null
+++ b/web_src/css/modules/divider.css
@@ -0,0 +1,39 @@
+.divider {
+  margin: 1rem 0;
+  height: 0;
+  font-weight: var(--font-weight-medium);
+  text-transform: uppercase;
+  color: var(--color-text);
+  font-size: 1rem;
+  width: 100%;
+}
+
+.divider:not(.divider-text) {
+  border-top: 1px solid var(--color-secondary);
+}
+
+.divider.divider-text {
+  display: flex;
+  align-items: center;
+  padding: 7px 0;
+}
+
+.divider.divider-text::before,
+.divider.divider-text::after {
+  content: "";
+  flex: 1;
+  border-top: 1px solid var(--color-secondary);
+}
+
+.divider.divider-text::before {
+  margin-right: .75em;
+}
+
+.divider.divider-text::after {
+  margin-left: .75em;
+}
+
+.ui.dropdown .menu > .divider {
+  border-top: 1px solid var(--color-secondary);
+  margin: 4px 0;
+}
diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index 0122e79aae..e20355dbc3 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -138,10 +138,6 @@
   background-color: var(--color-header-wrapper);
 }
 
-.repository .header-wrapper .ui.tabs.divider {
-  border-bottom: 0;
-}
-
 .repository .header-wrapper .ui.tabular .svg {
   margin-right: 5px;
 }
@@ -591,6 +587,7 @@
 
 .repository.options .danger .ui.divider {
   margin: 0;
+  border-color: var(--color-error-border);
 }
 
 .repository.new.issue .comment.form .comment .avatar {
@@ -1012,7 +1009,7 @@
 
 .repository.view.issue .comment-list .comment .merge-section .divider {
   margin-left: -1rem;
-  margin-right: -1rem;
+  width: calc(100% + 2rem);
 }
 
 .repository.view.issue .comment-list .comment .merge-section.no-header::before,
diff --git a/web_src/fomantic/build/semantic.css b/web_src/fomantic/build/semantic.css
index c9a5fd4d92..c96c337988 100644
--- a/web_src/fomantic/build/semantic.css
+++ b/web_src/fomantic/build/semantic.css
@@ -3632,302 +3632,6 @@ body.dimmable > .dimmer {
         User Overrides
 *******************************/
 /*!
- * # Fomantic-UI - Divider
- * http://github.com/fomantic/Fomantic-UI/
- *
- *
- * Released under the MIT license
- * http://opensource.org/licenses/MIT
- *
- */
-
-/*******************************
-            Divider
-*******************************/
-
-.ui.divider {
-  margin: 1rem 0;
-  line-height: 1;
-  height: 0;
-  font-weight: 500;
-  text-transform: uppercase;
-  letter-spacing: 0.05em;
-  color: rgba(0, 0, 0, 0.85);
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  user-select: none;
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-}
-
-/*--------------
-      Basic
----------------*/
-
-.ui.divider:not(.vertical):not(.horizontal) {
-  border-top: 1px solid rgba(34, 36, 38, 0.15);
-  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
-}
-
-/*--------------
-    Coupling
----------------*/
-
-/* Allow divider between each column row */
-
-.ui.grid > .column + .divider,
-.ui.grid > .row > .column + .divider {
-  left: auto;
-}
-
-/*--------------
-     Horizontal
-  ---------------*/
-
-.ui.horizontal.divider {
-  display: table;
-  white-space: nowrap;
-  height: auto;
-  margin: '';
-  line-height: 1;
-  text-align: center;
-}
-
-.ui.horizontal.divider:before,
-.ui.horizontal.divider:after {
-  content: '';
-  display: table-cell;
-  position: relative;
-  top: 50%;
-  width: 50%;
-  background-repeat: no-repeat;
-}
-
-.ui.horizontal.divider:before {
-  background-position: right 1em top 50%;
-}
-
-.ui.horizontal.divider:after {
-  background-position: left 1em top 50%;
-}
-
-/*--------------
-      Vertical
-  ---------------*/
-
-.ui.vertical.divider {
-  position: absolute;
-  z-index: 2;
-  top: 50%;
-  left: 50%;
-  margin: 0;
-  padding: 0;
-  width: auto;
-  height: 50%;
-  line-height: 0;
-  text-align: center;
-  transform: translateX(-50%);
-}
-
-.ui.vertical.divider:before,
-.ui.vertical.divider:after {
-  position: absolute;
-  left: 50%;
-  content: '';
-  z-index: 3;
-  border-left: 1px solid rgba(34, 36, 38, 0.15);
-  border-right: 1px solid rgba(255, 255, 255, 0.1);
-  width: 0;
-  height: calc(100% - 1rem);
-}
-
-.ui.vertical.divider:before {
-  top: -100%;
-}
-
-.ui.vertical.divider:after {
-  top: auto;
-  bottom: 0;
-}
-
-/* Inside grid */
-
-@media only screen and (max-width: 767.98px) {
-  .ui.stackable.grid .ui.vertical.divider,
-  .ui.grid .stackable.row .ui.vertical.divider {
-    display: table;
-    white-space: nowrap;
-    height: auto;
-    margin: '';
-    overflow: hidden;
-    line-height: 1;
-    text-align: center;
-    position: static;
-    top: 0;
-    left: 0;
-    transform: none;
-  }
-
-  .ui.stackable.grid .ui.vertical.divider:before,
-  .ui.grid .stackable.row .ui.vertical.divider:before,
-  .ui.stackable.grid .ui.vertical.divider:after,
-  .ui.grid .stackable.row .ui.vertical.divider:after {
-    left: 0;
-    border-left: none;
-    border-right: none;
-    content: '';
-    display: table-cell;
-    position: relative;
-    top: 50%;
-    width: 50%;
-    background-repeat: no-repeat;
-  }
-
-  .ui.stackable.grid .ui.vertical.divider:before,
-  .ui.grid .stackable.row .ui.vertical.divider:before {
-    background-position: right 1em top 50%;
-  }
-
-  .ui.stackable.grid .ui.vertical.divider:after,
-  .ui.grid .stackable.row .ui.vertical.divider:after {
-    background-position: left 1em top 50%;
-  }
-}
-
-/*--------------
-        Icon
-  ---------------*/
-
-.ui.divider > .icon {
-  margin: 0;
-  font-size: 1rem;
-  height: 1em;
-  vertical-align: middle;
-}
-
-/*--------------
-       Header
-  ---------------*/
-
-.ui.horizontal.divider[class*="left aligned"]:before {
-  display: none;
-}
-
-.ui.horizontal.divider[class*="left aligned"]:after {
-  width: 100%;
-}
-
-.ui.horizontal.divider[class*="right aligned"]:before {
-  width: 100%;
-}
-
-.ui.horizontal.divider[class*="right aligned"]:after {
-  display: none;
-}
-
-/*******************************
-          Variations
-*******************************/
-
-/*--------------
-      Hidden
-  ---------------*/
-
-.ui.hidden.divider {
-  border-color: transparent !important;
-}
-
-.ui.hidden.divider:before,
-.ui.hidden.divider:after {
-  display: none;
-}
-
-/*--------------
-    Inverted
----------------*/
-
-/*--------------
-    Fitted
----------------*/
-
-.ui.fitted.divider {
-  margin: 0;
-}
-
-/*--------------
-      Clearing
-  ---------------*/
-
-.ui.clearing.divider {
-  clear: both;
-}
-
-/*--------------
-      Section
-  ---------------*/
-
-.ui.section.divider {
-  margin-top: 2rem;
-  margin-bottom: 2rem;
-}
-
-/*--------------
-     Sizes
----------------*/
-
-.ui.divider {
-  font-size: 1rem;
-}
-
-.ui.mini.divider {
-  font-size: 0.78571429rem;
-}
-
-.ui.tiny.divider {
-  font-size: 0.85714286rem;
-}
-
-.ui.small.divider {
-  font-size: 0.92857143rem;
-}
-
-.ui.large.divider {
-  font-size: 1.14285714rem;
-}
-
-.ui.big.divider {
-  font-size: 1.28571429rem;
-}
-
-.ui.huge.divider {
-  font-size: 1.42857143rem;
-}
-
-.ui.massive.divider {
-  font-size: 1.71428571rem;
-}
-
-/*******************************
-         Theme Overrides
-*******************************/
-
-.ui.horizontal.divider:before,
-.ui.horizontal.divider:after {
-  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC');
-}
-
-@media only screen and (max-width: 767px) {
-  .ui.stackable.grid .ui.vertical.divider:before,
-  .ui.grid .stackable.row .ui.vertical.divider:before,
-  .ui.stackable.grid .ui.vertical.divider:after,
-  .ui.grid .stackable.row .ui.vertical.divider:after {
-    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC');
-  }
-}
-
-/*******************************
-         Site Overrides
-*******************************/
-/*!
  * # Fomantic-UI - Dropdown
  * http://github.com/fomantic/Fomantic-UI/
  *
diff --git a/web_src/fomantic/semantic.json b/web_src/fomantic/semantic.json
index be7519c308..d18ace5aa7 100644
--- a/web_src/fomantic/semantic.json
+++ b/web_src/fomantic/semantic.json
@@ -26,7 +26,6 @@
     "checkbox",
     "container",
     "dimmer",
-    "divider",
     "dropdown",
     "form",
     "grid",
diff --git a/web_src/js/features/repo-issue-list.js b/web_src/js/features/repo-issue-list.js
index 5402f958f2..a5a5bb6286 100644
--- a/web_src/js/features/repo-issue-list.js
+++ b/web_src/js/features/repo-issue-list.js
@@ -128,7 +128,7 @@ function initRepoIssueListAuthorDropdown() {
     if (newMenuHtml) {
       const $newMenuItems = $(newMenuHtml);
       $newMenuItems.addClass('dynamic-item');
-      $menu.append('<div class="ui divider dynamic-item"></div>', ...$newMenuItems);
+      $menu.append('<div class="divider dynamic-item"></div>', ...$newMenuItems);
     }
     $searchDropdown.dropdown('refresh');
     // defer our selection to the next tick, because dropdown will set the selection item after this `menu` function