Merge branch 'main' into lunny/issue_dev

web_src/css/base.css

@@ -580,14 +580,6 @@ img.ui.avatar,
   box-shadow: 0 6px 18px var(--color-shadow) !important;
 }
 
-.ui .text.left {
-  text-align: left !important;
-}
-
-.ui .text.right {
-  text-align: right !important;
-}
-
 .ui .text.truncate {
   overflow-x: hidden;
   text-overflow: ellipsis;
@@ -1188,3 +1180,13 @@ the "!important" is necessary to override Fomantic UI menu item styles, meanwhil
   overflow: hidden !important;
   text-overflow: ellipsis !important;
 }
+
+.ui.dropdown.text-flex-grow {
+  display: flex;
+}
+
+.ui.dropdown.text-flex-grow > .text {
+  display: flex;
+  flex-grow: 1;
+  justify-content: space-between;
+}

web_src/css/editor/fileeditor.css

@@ -74,12 +74,3 @@
   padding: 1rem;
   text-align: center;
 }
-
-.edit-diff {
-  padding: 0 !important;
-}
-
-.edit-diff > div > .ui.table {
-  border-top: none !important;
-  border-bottom: none !important;
-}

web_src/css/form.css

@@ -243,7 +243,7 @@ textarea:focus,
     height: 76px !important;
   }
   .m-captcha-style {
-    width: 50%;
+    max-width: 450px;
   }
 }
 
@@ -273,6 +273,10 @@ textarea:focus,
   width: 50%;
 }
 
+.ui.form.left-right-form .inline.field .ui.dropdown input.search {
+  width: 100%;
+}
+
 .ui.form.left-right-form .inline.field .inline-right {
   display: inline-flex;
   flex-direction: column;

web_src/css/index.css

@@ -18,8 +18,8 @@
 @import "./modules/checkbox.css";
 @import "./modules/dimmer.css";
 @import "./modules/modal.css";
+@import "./modules/tab.css";
 
-@import "./modules/select.css";
 @import "./modules/tippy.css";
 @import "./modules/breadcrumb.css";
 @import "./modules/comment.css";

web_src/css/markup/content.css

@@ -285,7 +285,6 @@
 .markup table {
   display: block;
   width: 100%;
-  width: max-content;
   max-width: 100%;
   overflow: auto;
 }
@@ -535,7 +534,7 @@
   user-select: none;
 }
 
-.markup-render {
+.markup-content-iframe {
   display: block;
   border: none;
   width: 100%;

web_src/css/modules/checkbox.css

@@ -119,3 +119,13 @@ input[type="radio"] {
 .ui.toggle.checkbox input:focus:checked ~ label::before {
   background: var(--color-primary) !important;
 }
+
+label.gt-checkbox {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25em;
+}
+
+.ui.form .field > label.gt-checkbox {
+  display: flex;
+}

web_src/css/modules/container.css

@@ -14,7 +14,3 @@
 .ui.container.medium-width {
   width: 800px;
 }
-
-.ui[class*="center aligned"].container {
-  text-align: center;
-}

web_src/css/modules/grid.css

@@ -393,58 +393,6 @@
   margin-right: 2.5rem;
 }
 
-.ui[class*="middle aligned"].grid > .column:not(.row),
-.ui[class*="middle aligned"].grid > .row > .column,
-.ui.grid > [class*="middle aligned"].row > .column,
-.ui.grid > [class*="middle aligned"].column:not(.row),
-.ui.grid > .row > [class*="middle aligned"].column {
-  flex-direction: column;
-  vertical-align: middle;
-  align-self: center !important;
-}
-
-.ui[class*="left aligned"].grid > .column,
-.ui[class*="left aligned"].grid > .row > .column,
-.ui.grid > [class*="left aligned"].row > .column,
-.ui.grid > [class*="left aligned"].column.column,
-.ui.grid > .row > [class*="left aligned"].column.column {
-  text-align: left;
-  align-self: inherit;
-}
-
-.ui[class*="center aligned"].grid > .column,
-.ui[class*="center aligned"].grid > .row > .column,
-.ui.grid > [class*="center aligned"].row > .column,
-.ui.grid > [class*="center aligned"].column.column,
-.ui.grid > .row > [class*="center aligned"].column.column {
-  text-align: center;
-  align-self: inherit;
-}
-.ui[class*="center aligned"].grid {
-  justify-content: center;
-}
-
-.ui[class*="right aligned"].grid > .column,
-.ui[class*="right aligned"].grid > .row > .column,
-.ui.grid > [class*="right aligned"].row > .column,
-.ui.grid > [class*="right aligned"].column.column,
-.ui.grid > .row > [class*="right aligned"].column.column {
-  text-align: right;
-  align-self: inherit;
-}
-
-.ui[class*="equal width"].grid > .column:not(.row),
-.ui[class*="equal width"].grid > .row > .column,
-.ui.grid > [class*="equal width"].row > .column {
-  display: inline-block;
-  flex-grow: 1;
-}
-.ui[class*="equal width"].grid > .wide.column,
-.ui[class*="equal width"].grid > .row > .wide.column,
-.ui.grid > [class*="equal width"].row > .wide.column {
-  flex-grow: 0;
-}
-
 @media only screen and (max-width: 767.98px) {
   .ui[class*="mobile reversed"].grid,
   .ui[class*="mobile reversed"].grid > .row,

web_src/css/modules/modal.css

@@ -67,6 +67,7 @@ These inconsistent layouts should be refactored to simple ones.
   border-radius: 0 0 var(--border-radius) var(--border-radius);
 }
 
+.ui.modal .content > form > .actions,
 .ui.modal .content > .actions {
   padding-top: 1em; /* if the "actions" is in the "content", some paddings are already added by the "content" */
   text-align: right;

web_src/css/modules/segment.css

@@ -123,13 +123,6 @@
   clear: both;
 }
 
-.ui[class*="left aligned"].segment {
-  text-align: left;
-}
-.ui[class*="center aligned"].segment {
-  text-align: center;
-}
-
 .ui.secondary.segment {
   background: var(--color-secondary-bg);
   color: var(--color-text-light);

web_src/css/modules/select.css

@@ -1,25 +0,0 @@
-.gitea-select {
-  position: relative;
-}
-
-.gitea-select select {
-  appearance: none; /* hide default triangle */
-}
-
-/* ::before and ::after pseudo elements don't work on select elements,
-   so we need to put it on the parent. */
-.gitea-select::after {
-  position: absolute;
-  top: 12px;
-  right: 8px;
-  pointer-events: none;
-  content: "";
-  width: 14px;
-  height: 14px;
-  mask-size: cover;
-  -webkit-mask-size: cover;
-  mask-image: var(--octicon-chevron-right);
-  -webkit-mask-image: var(--octicon-chevron-right);
-  transform: rotate(90deg); /* point the chevron down */
-  background: currentcolor;
-}

web_src/css/modules/svg.css

@@ -4,6 +4,10 @@
   fill: currentcolor;
 }
 
+.svg.git-entry-icon {
+  fill: transparent; /* some material icons have dark background fill, so need to reset */
+}
+
 .middle .svg {
   vertical-align: middle;
 }

web_src/css/modules/tab.css

@@ -0,0 +1,7 @@
+.ui.tab {
+  display: none;
+}
+
+.ui.tab.active {
+  display: block;
+}

web_src/css/modules/table.css

@@ -152,31 +152,6 @@
   }
 }
 
-.ui.table[class*="left aligned"],
-.ui.table [class*="left aligned"] {
-  text-align: left;
-}
-
-.ui.table[class*="center aligned"],
-.ui.table [class*="center aligned"] {
-  text-align: center;
-}
-
-.ui.table[class*="right aligned"],
-.ui.table [class*="right aligned"] {
-  text-align: right;
-}
-
-.ui.table[class*="top aligned"],
-.ui.table [class*="top aligned"] {
-  vertical-align: top;
-}
-
-.ui.table[class*="middle aligned"],
-.ui.table [class*="middle aligned"] {
-  vertical-align: middle;
-}
-
 .ui.table th.collapsing,
 .ui.table td.collapsing {
   width: 1px;

web_src/css/repo.css

@@ -1085,10 +1085,6 @@ td .commit-summary {
   height: 30px;
 }
 
-.repository .diff-box .resolved-placeholder .button {
-  padding: 8px 12px;
-}
-
 .repository .diff-file-box .header {
   background-color: var(--color-box-header);
 }

web_src/css/repo/home-file-list.css

@@ -14,10 +14,6 @@
   }
 }
 
-#repo-files-table .repo-file-cell.name .svg {
-  margin-right: 2px;
-}
-
 #repo-files-table .svg.octicon-file-directory-fill,
 #repo-files-table .svg.octicon-file-submodule {
   color: var(--color-primary);
@@ -70,11 +66,25 @@
 }
 
 #repo-files-table .repo-file-cell.name {
+  display: flex;
+  align-items: center;
+  gap: 0.5em;
+  overflow: hidden;
+}
+
+#repo-files-table .repo-file-cell.name > a,
+#repo-files-table .repo-file-cell.name > span {
+  flex-shrink: 0;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 
+#repo-files-table .repo-file-cell.name .entry-name {
+  flex-shrink: 1;
+  min-width: 3em;
+}
+
 @media (max-width: 767.98px) {
   #repo-files-table .repo-file-cell.name {
     max-width: 35vw;

web_src/css/repo/home.css

@@ -49,6 +49,21 @@
   }
 }
 
+.repo-view-container {
+  display: flex;
+  gap: var(--page-spacing);
+}
+
+.repo-view-container .repo-view-file-tree-container {
+  flex: 0 0 15%;
+  min-width: 0;
+  max-height: 100vh;
+}
+
+.repo-view-content {
+  flex: 1;
+}
+
 .language-stats {
   display: flex;
   gap: 2px;

web_src/css/repo/release-tag.css

@@ -45,7 +45,7 @@
     display: flex;
     align-items: center;
   }
-  #release-list .js-branch-tag-selector {
+  #release-list .release-branch-tag-selector {
     margin-left: auto;
   }
   #release-list .branch-selector-dropdown .menu { /* open menu to left */

web_src/css/shared/milestone.css

@@ -12,7 +12,7 @@
   border-top: 1px solid var(--color-secondary);
 }
 
-.milestone-card .content {
+.milestone-card .render-content {
   padding-top: 10px;
 }
 

web_src/css/themes/theme-gitea-auto-protanopia-deuteranopia.css

@@ -1,2 +1,6 @@
 @import "./theme-gitea-light-protanopia-deuteranopia.css" (prefers-color-scheme: light);
 @import "./theme-gitea-dark-protanopia-deuteranopia.css" (prefers-color-scheme: dark);
+
+gitea-theme-meta-info {
+  --theme-display-name: "Auto (Red/Green Colorblind-friendly)";
+}

web_src/css/themes/theme-gitea-auto.css

@@ -1,2 +1,6 @@
 @import "./theme-gitea-light.css" (prefers-color-scheme: light);
 @import "./theme-gitea-dark.css" (prefers-color-scheme: dark);
+
+gitea-theme-meta-info {
+  --theme-display-name: "Auto";
+}

web_src/css/themes/theme-gitea-dark-protanopia-deuteranopia.css

@@ -1,5 +1,9 @@
 @import "./theme-gitea-dark.css";
 
+gitea-theme-meta-info {
+  --theme-display-name: "Dark (Red/Green Colorblind-friendly)";
+}
+
 /* red/green colorblind-friendly colors */
 /* from GitHub: --diffBlob-addition-*, --diffBlob-deletion-*, etc */
 :root {

web_src/css/themes/theme-gitea-dark.css

@@ -1,6 +1,10 @@
 @import "../chroma/dark.css";
 @import "../codemirror/dark.css";
 
+gitea-theme-meta-info {
+  --theme-display-name: "Dark";
+}
+
 :root {
   --is-dark-theme: true;
   --color-primary: #4183c4;

web_src/css/themes/theme-gitea-light-protanopia-deuteranopia.css

@@ -1,5 +1,9 @@
 @import "./theme-gitea-light.css";
 
+gitea-theme-meta-info {
+  --theme-display-name: "Light (Red/Green Colorblind-friendly)";
+}
+
 /* red/green colorblind-friendly colors */
 /* from GitHub: --diffBlob-addition-*, --diffBlob-deletion-*, etc */
 :root {

web_src/css/themes/theme-gitea-light.css

@@ -1,6 +1,10 @@
 @import "../chroma/light.css";
 @import "../codemirror/light.css";
 
+gitea-theme-meta-info {
+  --theme-display-name: "Light";
+}
+
 :root {
   --is-dark-theme: false;
   --color-primary: #4183c4;