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="ui middle very relaxed page grid">
 | 
				
			||||||
		<div class="column">
 | 
							<div class="column">
 | 
				
			||||||
			{{template "repo/migrate/helper" .}}
 | 
								{{template "repo/migrate/helper" .}}
 | 
				
			||||||
			<div class="ui three stackable cards">
 | 
								<div class="ui cards migrate-entries">
 | 
				
			||||||
				{{range .Services}}
 | 
									{{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"}}
 | 
											{{if eq .Name "github"}}
 | 
				
			||||||
							{{svg "octicon-mark-github" 184 "gt-p-4"}}
 | 
												{{svg "octicon-mark-github" 184 "gt-p-4"}}
 | 
				
			||||||
						{{else if eq .Name "gitlab"}}
 | 
											{{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;
 | 
					  transition: all 0.1s ease-in-out;
 | 
				
			||||||
  box-shadow: none !important;
 | 
					  box-shadow: none !important;
 | 
				
			||||||
  border: 1px solid var(--color-secondary);
 | 
					  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%);
 | 
					  transform: scale(105%);
 | 
				
			||||||
  box-shadow: 0 0.5rem 1rem var(--color-shadow) !important;
 | 
					  box-shadow: 0 0.5rem 1rem var(--color-shadow) !important;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.migrate-entry .description {
 | 
				
			||||||
 | 
					  text-wrap: balance;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@media (max-width: 767.98px) {
 | 
					@media (max-width: 767.98px) {
 | 
				
			||||||
  .repository.file.list #repo-files-table .entry,
 | 
					  .repository.file.list #repo-files-table .entry,
 | 
				
			||||||
  .repository.file.list #repo-files-table .commit-list {
 | 
					  .repository.file.list #repo-files-table .commit-list {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue