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">
This commit is contained in:
parent
d44a415bf0
commit
da6df0d063
2 changed files with 24 additions and 5 deletions
|
@ -3,9 +3,9 @@
|
|||
<div class="ui middle very relaxed page grid">
|
||||
<div class="column">
|
||||
{{template "repo/migrate/helper" .}}
|
||||
<div class="ui three stackable cards">
|
||||
<div class="ui cards migrate-entries">
|
||||
{{range .Services}}
|
||||
<a class="ui card gt-df gt-ac" href="{{AppSubUrl}}/repo/migrate?service_type={{.}}&org={{$.Org}}&mirror={{$.Mirror}}">
|
||||
<a class="ui card migrate-entry gt-df gt-ac" href="{{AppSubUrl}}/repo/migrate?service_type={{.}}&org={{$.Org}}&mirror={{$.Mirror}}">
|
||||
{{if eq .Name "github"}}
|
||||
{{svg "octicon-mark-github" 184 "gt-p-4"}}
|
||||
{{else if eq .Name "gitlab"}}
|
||||
|
|
|
@ -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 {
|
||||
|
|
Loading…
Reference in a new issue