- truncate to max length 40 - add CSS ellipsis
This commit is contained in:
		
							parent
							
								
									b337c606d3
								
							
						
					
					
						commit
						3a4801d195
					
				
					 11 changed files with 39 additions and 28 deletions
				
			
		|  | @ -20,18 +20,18 @@ | |||
| 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> | ||||
| 							<span class="text" title="{{.ContextUser.Name}}"> | ||||
| 								{{avatar .ContextUser 28 "mini"}} | ||||
| 								{{.ContextUser.ShortName 20}} | ||||
| 								{{.ContextUser.ShortName 40}} | ||||
| 							</span> | ||||
| 							{{svg "octicon-triangle-down" 14 "dropdown icon"}} | ||||
| 							<div class="menu"> | ||||
| 								<div class="item" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}"> | ||||
| 									{{avatar .SignedUser 28 "mini"}} | ||||
| 									{{.SignedUser.ShortName 20}} | ||||
| 									{{.SignedUser.ShortName 40}} | ||||
| 								</div> | ||||
| 								{{range .Orgs}} | ||||
| 									<div class="item" data-value="{{.ID}}" title="{{.Name}}"> | ||||
| 										{{avatar . 28 "mini"}} | ||||
| 										{{.ShortName 20}} | ||||
| 										{{.ShortName 40}} | ||||
| 									</div> | ||||
| 								{{end}} | ||||
| 							</div> | ||||
|  |  | |||
|  | @ -49,18 +49,18 @@ | |||
| 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> | ||||
| 							<span class="text" title="{{.ContextUser.Name}}"> | ||||
| 								{{avatar .ContextUser}} | ||||
| 								{{.ContextUser.ShortName 20}} | ||||
| 								{{.ContextUser.ShortName 40}} | ||||
| 							</span> | ||||
| 							{{svg "octicon-triangle-down" 14 "dropdown icon"}} | ||||
| 							<div class="menu" title="{{.SignedUser.Name}}"> | ||||
| 								<div class="item" data-value="{{.SignedUser.ID}}"> | ||||
| 									{{avatar .SignedUser}} | ||||
| 									{{.SignedUser.ShortName 20}} | ||||
| 									{{.SignedUser.ShortName 40}} | ||||
| 								</div> | ||||
| 								{{range .Orgs}} | ||||
| 									<div class="item" data-value="{{.ID}}" title="{{.Name}}"> | ||||
| 										{{avatar .}} | ||||
| 										{{.ShortName 20}} | ||||
| 										{{.ShortName 40}} | ||||
| 									</div> | ||||
| 								{{end}} | ||||
| 							</div> | ||||
|  |  | |||
|  | @ -83,18 +83,18 @@ | |||
| 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> | ||||
| 							<span class="text" title="{{.ContextUser.Name}}"> | ||||
| 								{{avatar .ContextUser}} | ||||
| 								{{.ContextUser.ShortName 20}} | ||||
| 								{{.ContextUser.ShortName 40}} | ||||
| 							</span> | ||||
| 							{{svg "octicon-triangle-down" 14 "dropdown icon"}} | ||||
| 							<div class="menu" title="{{.SignedUser.Name}}"> | ||||
| 								<div class="item" data-value="{{.SignedUser.ID}}"> | ||||
| 									{{avatar .SignedUser}} | ||||
| 									{{.SignedUser.ShortName 20}} | ||||
| 									{{.SignedUser.ShortName 40}} | ||||
| 								</div> | ||||
| 								{{range .Orgs}} | ||||
| 								<div class="item" data-value="{{.ID}}" title="{{.Name}}"> | ||||
| 									{{avatar .}} | ||||
| 									{{.ShortName 20}} | ||||
| 									{{.ShortName 40}} | ||||
| 								</div> | ||||
| 								{{end}} | ||||
| 							</div> | ||||
|  |  | |||
|  | @ -83,18 +83,18 @@ | |||
| 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> | ||||
| 							<span class="text" title="{{.ContextUser.Name}}"> | ||||
| 								{{avatar .ContextUser 28 "mini"}} | ||||
| 								{{.ContextUser.ShortName 20}} | ||||
| 								{{.ContextUser.ShortName 40}} | ||||
| 							</span> | ||||
| 							{{svg "octicon-triangle-down" 14 "dropdown icon"}} | ||||
| 							<div class="menu" title="{{.SignedUser.Name}}"> | ||||
| 								<div class="item" data-value="{{.SignedUser.ID}}"> | ||||
| 									{{avatar .SignedUser 28 "mini"}} | ||||
| 									{{.SignedUser.ShortName 20}} | ||||
| 									{{.SignedUser.ShortName 40}} | ||||
| 								</div> | ||||
| 								{{range .Orgs}} | ||||
| 									<div class="item" data-value="{{.ID}}" title="{{.Name}}"> | ||||
| 										{{avatar . 28 "mini"}} | ||||
| 										{{.ShortName 20}} | ||||
| 										{{.ShortName 40}} | ||||
| 									</div> | ||||
| 								{{end}} | ||||
| 							</div> | ||||
|  |  | |||
|  | @ -83,18 +83,18 @@ | |||
| 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> | ||||
| 							<span class="text" title="{{.ContextUser.Name}}"> | ||||
| 								{{avatar .ContextUser 28 "mini"}} | ||||
| 								{{.ContextUser.ShortName 20}} | ||||
| 								{{.ContextUser.ShortName 40}} | ||||
| 							</span> | ||||
| 							{{svg "octicon-triangle-down" 14 "dropdown icon"}} | ||||
| 							<div class="menu" title="{{.SignedUser.Name}}"> | ||||
| 								<div class="item" data-value="{{.SignedUser.ID}}"> | ||||
| 									{{avatar .SignedUser 28 "mini"}} | ||||
| 									{{.SignedUser.ShortName 20}} | ||||
| 									{{.SignedUser.ShortName 40}} | ||||
| 								</div> | ||||
| 								{{range .Orgs}} | ||||
| 									<div class="item" data-value="{{.ID}}" title="{{.Name}}"> | ||||
| 										{{avatar . 28 "mini"}} | ||||
| 										{{.ShortName 20}} | ||||
| 										{{.ShortName 40}} | ||||
| 									</div> | ||||
| 								{{end}} | ||||
| 							</div> | ||||
|  |  | |||
|  | @ -85,18 +85,18 @@ | |||
| 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> | ||||
| 							<span class="text" title="{{.ContextUser.Name}}"> | ||||
| 								{{avatar .ContextUser}} | ||||
| 								{{.ContextUser.ShortName 20}} | ||||
| 								{{.ContextUser.ShortName 40}} | ||||
| 							</span> | ||||
| 							{{svg "octicon-triangle-down" 14 "dropdown icon"}} | ||||
| 							<div class="menu" title="{{.SignedUser.Name}}"> | ||||
| 								<div class="item" data-value="{{.SignedUser.ID}}"> | ||||
| 									{{avatar .SignedUser}} | ||||
| 									{{.SignedUser.ShortName 20}} | ||||
| 									{{.SignedUser.ShortName 40}} | ||||
| 								</div> | ||||
| 								{{range .Orgs}} | ||||
| 								<div class="item" data-value="{{.ID}}" title="{{.Name}}"> | ||||
| 									{{avatar .}} | ||||
| 									{{.ShortName 20}} | ||||
| 									{{.ShortName 40}} | ||||
| 								</div> | ||||
| 								{{end}} | ||||
| 							</div> | ||||
|  |  | |||
|  | @ -15,20 +15,20 @@ | |||
| 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> | ||||
| 							<span class="text" title="{{.ContextUser.Name}}"> | ||||
| 								{{avatar .ContextUser 28 "mini"}} | ||||
| 								{{.ContextUser.ShortName 20}} | ||||
| 								{{.ContextUser.ShortName 40}} | ||||
| 							</span> | ||||
| 							{{svg "octicon-triangle-down" 14 "dropdown icon"}} | ||||
| 							<div class="menu"> | ||||
| 								{{if .CanForkToUser}} | ||||
| 									<div class="item" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}"> | ||||
| 										{{avatar .SignedUser 28 "mini"}} | ||||
| 										{{.SignedUser.ShortName 20}} | ||||
| 										{{.SignedUser.ShortName 40}} | ||||
| 									</div> | ||||
| 								{{end}} | ||||
| 								{{range .Orgs}} | ||||
| 									<div class="item" data-value="{{.ID}}" title="{{.Name}}"> | ||||
| 										{{avatar . 28 "mini"}} | ||||
| 										{{.ShortName 20}} | ||||
| 										{{.ShortName 40}} | ||||
| 									</div> | ||||
| 								{{end}} | ||||
| 							</div> | ||||
|  |  | |||
|  | @ -4,7 +4,7 @@ | |||
| 			<div class="ui floating dropdown link jump"> | ||||
| 				<span class="text"> | ||||
| 					{{avatar .ContextUser}} | ||||
| 					{{.ContextUser.ShortName 20}} | ||||
| 					{{.ContextUser.ShortName 40}} | ||||
| 					{{if .ContextUser.IsOrganization}} | ||||
| 						<span class="org-visibility"> | ||||
| 							{{if .ContextUser.Visibility.IsLimited}}<div class="ui orange tiny horizontal label">{{.i18n.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}} | ||||
|  | @ -20,12 +20,12 @@ | |||
| 					<div class="scrolling menu items"> | ||||
| 						<a class="{{if eq .ContextUser.ID .SignedUser.ID}}active selected{{end}} item" href="{{AppSubUrl}}/{{if .PageIsIssues}}issues{{else if .PageIsPulls}}pulls{{else if .PageIsMilestonesDashboard}}milestones{{end}}"> | ||||
| 							{{avatar .SignedUser}} | ||||
| 							{{.SignedUser.ShortName 20}} | ||||
| 							{{.SignedUser.ShortName 40}} | ||||
| 						</a> | ||||
| 						{{range .Orgs}} | ||||
| 							<a class="{{if eq $.ContextUser.ID .ID}}active selected{{end}} item" title="{{.Name}}" href="{{AppSubUrl}}/org/{{.Name}}/{{if $.PageIsIssues}}issues{{else if $.PageIsPulls}}pulls{{else if $.PageIsMilestonesDashboard}}milestones{{else}}dashboard{{end}}"> | ||||
| 								{{avatar .}} | ||||
| 								{{.ShortName 20}} | ||||
| 								{{.ShortName 40}} | ||||
| 								<span class="org-visibility"> | ||||
| 									{{if .Visibility.IsLimited}}<div class="ui orange tiny horizontal label">{{$.i18n.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}} | ||||
| 									{{if .Visibility.IsPrivate}}<div class="ui red tiny horizontal label">{{$.i18n.Tr "org.settings.visibility.private_shortname"}}</div>{{end}} | ||||
|  | @ -94,7 +94,7 @@ | |||
| 				{{end}} | ||||
| 				<div class="item"> | ||||
| 					<a class="ui blue basic button" href="{{.ContextUser.HomeLink}}" title='{{.i18n.Tr "home.view_home" .ContextUser.Name}}'> | ||||
| 						{{.i18n.Tr "home.view_home" (.ContextUser.ShortName 20)}} | ||||
| 						{{.i18n.Tr "home.view_home" (.ContextUser.ShortName 40)}} | ||||
| 					</a> | ||||
| 				</div> | ||||
| 			</div> | ||||
|  |  | |||
|  | @ -15,18 +15,18 @@ | |||
| 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> | ||||
| 							<span class="text" title="{{.ContextUser.Name}}"> | ||||
| 								{{avatar .ContextUser 28 "mini"}} | ||||
| 								{{.ContextUser.ShortName 20}} | ||||
| 								{{.ContextUser.ShortName 40}} | ||||
| 							</span> | ||||
| 							{{svg "octicon-triangle-down" 14 "dropdown icon"}} | ||||
| 							<div class="menu"> | ||||
| 								<div class="item" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}"> | ||||
| 									{{avatar .SignedUser 28 "mini"}} | ||||
| 									{{.SignedUser.ShortName 20}} | ||||
| 									{{.SignedUser.ShortName 40}} | ||||
| 								</div> | ||||
| 								{{range .Orgs}} | ||||
| 								<div class="item" data-value="{{.ID}}" title="{{.Name}}"> | ||||
| 									{{avatar . 28 "mini"}} | ||||
| 									{{.ShortName 20}} | ||||
| 									{{.ShortName 40}} | ||||
| 								</div> | ||||
| 								{{end}} | ||||
| 							</div> | ||||
|  |  | |||
|  | @ -347,6 +347,9 @@ a.muted:hover, | |||
| 
 | ||||
| .ui.selection.dropdown .menu > .item { | ||||
|   border-color: var(--color-secondary); | ||||
|   white-space: nowrap; | ||||
|   overflow: hidden; | ||||
|   text-overflow: ellipsis; | ||||
| } | ||||
| 
 | ||||
| .ui.selection.visible.dropdown > .text:not(.default) { | ||||
|  | @ -387,6 +390,10 @@ a.muted:hover, | |||
| 
 | ||||
| .ui.menu .ui.dropdown .menu > .item { | ||||
|   color: var(--color-text) !important; | ||||
|   white-space: nowrap; | ||||
|   overflow: hidden; | ||||
|   text-overflow: ellipsis; | ||||
|   display: block; | ||||
| } | ||||
| 
 | ||||
| .ui.menu .ui.dropdown .menu > .item:hover { | ||||
|  |  | |||
|  | @ -278,6 +278,10 @@ textarea:focus, | |||
|     form { | ||||
|       .dropdown .text { | ||||
|         margin-right: 0 !important; | ||||
| 
 | ||||
|         white-space: nowrap; | ||||
|         overflow: hidden; | ||||
|         text-overflow: ellipsis; | ||||
|       } | ||||
| 
 | ||||
|       .header { | ||||
|  |  | |||
		Loading…
	
		Reference in a new issue