Skip to content

Commit da6df0d

Browse files
authored
Fix migrate page layout on mobile (#25507)
Fixes: #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">
1 parent d44a415 commit da6df0d

File tree

2 files changed

+24
-5
lines changed

2 files changed

+24
-5
lines changed

templates/repo/migrate/migrate.tmpl

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,9 @@
33
<div class="ui middle very relaxed page grid">
44
<div class="column">
55
{{template "repo/migrate/helper" .}}
6-
<div class="ui three stackable cards">
6+
<div class="ui cards migrate-entries">
77
{{range .Services}}
8-
<a class="ui card gt-df gt-ac" href="{{AppSubUrl}}/repo/migrate?service_type={{.}}&org={{$.Org}}&mirror={{$.Mirror}}">
8+
<a class="ui card migrate-entry gt-df gt-ac" href="{{AppSubUrl}}/repo/migrate?service_type={{.}}&org={{$.Org}}&mirror={{$.Mirror}}">
99
{{if eq .Name "github"}}
1010
{{svg "octicon-mark-github" 184 "gt-p-4"}}
1111
{{else if eq .Name "gitlab"}}

web_src/css/repo.css

+22-3
Original file line numberDiff line numberDiff line change
@@ -3100,18 +3100,37 @@ tbody.commit-list {
31003100
}
31013101
}
31023102

3103-
.repository.migrate .card {
3103+
.migrate-entries {
3104+
display: grid !important;
3105+
grid-template-columns: repeat(3, 1fr);
3106+
gap: 25px;
3107+
margin: 0 !important;
3108+
}
3109+
3110+
@media (max-width: 767.98px) {
3111+
.migrate-entries {
3112+
grid-template-columns: repeat(1, 1fr);
3113+
}
3114+
}
3115+
3116+
.migrate-entry {
31043117
transition: all 0.1s ease-in-out;
31053118
box-shadow: none !important;
31063119
border: 1px solid var(--color-secondary);
3107-
color: var(--color-text);
3120+
color: var(--color-text) !important;
3121+
width: auto !important;
3122+
margin: 0 !important;
31083123
}
31093124

3110-
.repository.migrate .card:hover {
3125+
.migrate-entry:hover {
31113126
transform: scale(105%);
31123127
box-shadow: 0 0.5rem 1rem var(--color-shadow) !important;
31133128
}
31143129

3130+
.migrate-entry .description {
3131+
text-wrap: balance;
3132+
}
3133+
31153134
@media (max-width: 767.98px) {
31163135
.repository.file.list #repo-files-table .entry,
31173136
.repository.file.list #repo-files-table .commit-list {

0 commit comments

Comments
 (0)