fix all the overflows, remove some unused css

go-gitea · May 31, 2024 · c8f4cde · c8f4cde
1 parent 11ccfb3
commit c8f4cde
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 74 deletions.
diff --git a/templates/repo/commit_page.tmpl b/templates/repo/commit_page.tmpl
@@ -8,7 +8,7 @@
 	<div class="ui container fluid padded">
 		<div class="ui top attached header clearing segment tw-relative commit-header">
 			<div class="tw-flex tw-mb-4 tw-gap-1">
-				<h3 class="tw-mb-0 tw-flex-1"><span class="commit-summary" title="{{.Commit.Summary}}">{{RenderCommitMessage $.Context .Commit.Message ($.Repository.ComposeMetas ctx)}}</span>{{template "repo/commit_statuses" dict "Status" .CommitStatus "Statuses" .CommitStatuses}}</h3>
+				<h3 class="tw-mb-0 tw-flex-1"><span class="commit-summary tw-break-anywhere" title="{{.Commit.Summary}}">{{RenderCommitMessage $.Context .Commit.Message ($.Repository.ComposeMetas ctx)}}</span>{{template "repo/commit_statuses" dict "Status" .CommitStatus "Statuses" .CommitStatuses}}</h3>
 				{{if not $.PageIsWiki}}
 					<div class="commit-header-buttons">
 						<a class="ui primary tiny button" href="{{.SourcePath}}">

diff --git a/templates/repo/commits_list.tmpl b/templates/repo/commits_list.tmpl
@@ -7,10 +7,10 @@
 					<div class="message">
 						<span class="message-wrapper">
 						{{if $.PageIsWiki}}
-							<span class="commit-summary {{if gt .ParentCount 1}} grey text{{end}} tw-max-w-[90%] tw-inline-flex" title="{{.Summary}}">{{.Summary | RenderEmoji $.Context}}</span>
+							<span class="commit-summary{{if gt .ParentCount 1}} grey text{{end}}" title="{{.Summary}}">{{.Summary | RenderEmoji $.Context}}</span>
 						{{else}}
 							{{$commitLink:= printf "%s/commit/%s" $commitRepoLink (PathEscape .ID.String)}}
-							<span class="commit-summary {{if gt .ParentCount 1}} grey text{{end}} tw-max-w-[90%] tw-inline-flex" title="{{.Summary}}">{{RenderCommitMessageLinkSubject $.Context .Message $commitLink ($.Repository.ComposeMetas ctx)}}</span>
+							<span class="commit-summary{{if gt .ParentCount 1}} grey text{{end}}" title="{{.Summary}}">{{RenderCommitMessageLinkSubject $.Context .Message $commitLink ($.Repository.ComposeMetas ctx)}}</span>
 						{{end}}
 						</span>
 						{{if IsMultilineCommitMessage .Message}}

diff --git a/templates/repo/latest_commit.tmpl b/templates/repo/latest_commit.tmpl
@@ -16,7 +16,7 @@
 	{{end}}
 	{{$commitLink:= printf "%s/commit/%s" .RepoLink (PathEscape .LatestCommit.ID.String)}}
 	<span class="grey commit-summary" title="{{.LatestCommit.Summary}}">
-		<span class="message-wrapper tw-ml-2">{{RenderCommitMessageLinkSubject $.Context .LatestCommit.Message $commitLink ($.Repository.ComposeMetas ctx)}}</span>
+		<span class="message-wrapper gt-ellipsis tw-ml-2">{{RenderCommitMessageLinkSubject $.Context .LatestCommit.Message $commitLink ($.Repository.ComposeMetas ctx)}}</span>
 		{{if IsMultilineCommitMessage .LatestCommit.Message}}
 			<button class="ui button js-toggle-commit-body ellipsis-button" aria-expanded="false">...</button>
 			{{template "repo/commit_statuses" dict "Status" .LatestCommitStatus "Statuses" .LatestCommitStatuses}}

diff --git a/web_src/css/base.css b/web_src/css/base.css
@@ -1271,6 +1271,7 @@ table th[data-sortt-desc] .svg {
   font-weight: var(--font-weight-semibold) !important;
   line-height: 6px !important;
   vertical-align: middle !important;
+  flex-shrink: 0;
 }
 
 .truncated-item-name {

diff --git a/web_src/css/repo.css b/web_src/css/repo.css
@@ -169,14 +169,6 @@
   margin-bottom: 5px;
 }
 
-.commit-summary {
-  flex: 1;
-  overflow-wrap: anywhere;
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}
-
 .commit-header .commit-summary,
 td .commit-summary {
   white-space: normal;
@@ -191,6 +183,11 @@ td .commit-summary {
   text-overflow: ellipsis;
 }
 
+.latest-commit .commit-summary {
+  display: flex;
+  overflow: hidden;
+}
+
 @media (max-width: 767.98px) {
   .latest-commit .sha {
     display: none;
@@ -1991,68 +1988,6 @@ td .commit-summary {
   }
 }
 
-tbody.commit-list {
-  vertical-align: baseline;
-}
-
-.message-wrapper,
-.author-wrapper {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  max-width: 100%;
-  display: inline-block;
-  vertical-align: middle;
-}
-
-.author-wrapper {
-  max-width: 180px;
-  align-self: center;
-  white-space: nowrap;
-}
-
-/* in the commit list, messages can wrap so we can use inline */
-.commit-list .message-wrapper {
-  display: inline;
-  overflow-wrap: anywhere;
-}
-
-/* but in the repo-files-table we cannot */
-#repo-files-table .commit-list .message-wrapper {
-  display: inline-block;
-}
-
-@media (max-width: 767.98px) {
-  tr.commit-list {
-    width: 100%;
-  }
-  .author-wrapper {
-    max-width: 80px;
-  }
-}
-
-@media (min-width: 768px) and (max-width: 991.98px) {
-  tr.commit-list {
-    width: 723px;
-  }
-}
-
-@media (min-width: 992px) and (max-width: 1200px) {
-  tr.commit-list {
-    width: 933px;
-  }
-}
-
-@media (min-width: 1201px) {
-  tr.commit-list {
-    width: 1127px;
-  }
-}
-
-.commit-list .commit-status-link {
-  display: inline-block;
-  vertical-align: middle;
-}
-
 .commit-body {
   margin: 0.25em 0;
   white-space: pre-wrap;