From da6df0d0636c9e7bb5481e41dcd7d8f9b46deed5 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Mon, 26 Jun 2023 11:57:36 +0200
Subject: Fix migrate page layout on mobile (#25507)

Fixes: https://github.com/go-gitea/gitea/issues/25462

On supporting browsers, text in description is [wrapped
equally](https://caniuse.com/css-text-wrap-balance).

<img width="488" alt="Screenshot 2023-06-26 at 00 17 21"
src="https://github.com/go-gitea/gitea/assets/115237/cb8e3a50-6225-4a8c-a6c0-f35a17d2af76">

<img width="1254" alt="Screenshot 2023-06-26 at 00 14 51"
src="https://github.com/go-gitea/gitea/assets/115237/0885404e-973e-45ce-b41e-5cb265a4cd1e">
---
 web_src/css/repo.css | 25 ++++++++++++++++++++++---
 1 file changed, 22 insertions(+), 3 deletions(-)

(limited to 'web_src/css/repo.css')

diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index 79a4206c19..825711465e 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -3100,18 +3100,37 @@ tbody.commit-list {
   }
 }
 
-.repository.migrate .card {
+.migrate-entries {
+  display: grid !important;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 25px;
+  margin: 0 !important;
+}
+
+@media (max-width: 767.98px) {
+  .migrate-entries {
+    grid-template-columns: repeat(1, 1fr);
+  }
+}
+
+.migrate-entry {
   transition: all 0.1s ease-in-out;
   box-shadow: none !important;
   border: 1px solid var(--color-secondary);
-  color: var(--color-text);
+  color: var(--color-text) !important;
+  width: auto !important;
+  margin: 0 !important;
 }
 
-.repository.migrate .card:hover {
+.migrate-entry:hover {
   transform: scale(105%);
   box-shadow: 0 0.5rem 1rem var(--color-shadow) !important;
 }
 
+.migrate-entry .description {
+  text-wrap: balance;
+}
+
 @media (max-width: 767.98px) {
   .repository.file.list #repo-files-table .entry,
   .repository.file.list #repo-files-table .commit-list {
-- 
cgit v1.2.3