CSS navbar and color tweaks (#13609)
* CSS and color tweaks - Unify navbar-style menus - Fix admin bar overlapping menu bar - Fixes file edit comment box - Fix double border on review box - Fix review timeline icons * Many fixes to new-menu and navbar layout enhancements * misc settings fixes * navbar tweak * fix pr tabs * branch tag and arc color tweaks
This commit is contained in:
		
							parent
							
								
									03fa2eccbc
								
							
						
					
					
						commit
						b2de034278
					
				
					 18 changed files with 267 additions and 291 deletions
				
			
		|  | @ -1,35 +1,37 @@ | |||
| <div class="ui secondary pointing tabular top attached borderless menu stackable new-menu navbar"> | ||||
| 	<a class="{{if .PageIsAdminDashboard}}active{{end}} item" href="{{AppSubUrl}}/admin"> | ||||
| 		{{.i18n.Tr "admin.dashboard"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsAdminUsers}}active{{end}} item" href="{{AppSubUrl}}/admin/users"> | ||||
| 		{{.i18n.Tr "admin.users"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsAdminOrganizations}}active{{end}} item" href="{{AppSubUrl}}/admin/orgs"> | ||||
| 		{{.i18n.Tr "admin.organizations"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsAdminRepositories}}active{{end}} item" href="{{AppSubUrl}}/admin/repos"> | ||||
| 		{{.i18n.Tr "admin.repositories"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsAdminHooks}}active{{end}} item" href="{{AppSubUrl}}/admin/hooks"> | ||||
| 		{{.i18n.Tr "admin.hooks"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsAdminSystemHooks}}active{{end}} item" href="{{AppSubUrl}}/admin/system-hooks"> | ||||
| 		{{.i18n.Tr "admin.systemhooks"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsAdminAuthentications}}active{{end}} item" href="{{AppSubUrl}}/admin/auths"> | ||||
| 		{{.i18n.Tr "admin.authentication"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsAdminEmails}}active{{end}} item" href="{{AppSubUrl}}/admin/emails"> | ||||
| 		{{.i18n.Tr "admin.emails"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsAdminConfig}}active{{end}} item" href="{{AppSubUrl}}/admin/config"> | ||||
| 		{{.i18n.Tr "admin.config"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsAdminNotices}}active{{end}} item" href="{{AppSubUrl}}/admin/notices"> | ||||
| 		{{.i18n.Tr "admin.notices"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsAdminMonitor}}active{{end}} item" href="{{AppSubUrl}}/admin/monitor"> | ||||
| 		{{.i18n.Tr "admin.monitor"}} | ||||
| 	</a> | ||||
| 	<div class="new-menu-inner"> | ||||
| 		<a class="{{if .PageIsAdminDashboard}}active{{end}} item" href="{{AppSubUrl}}/admin"> | ||||
| 			{{.i18n.Tr "admin.dashboard"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsAdminUsers}}active{{end}} item" href="{{AppSubUrl}}/admin/users"> | ||||
| 			{{.i18n.Tr "admin.users"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsAdminOrganizations}}active{{end}} item" href="{{AppSubUrl}}/admin/orgs"> | ||||
| 			{{.i18n.Tr "admin.organizations"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsAdminRepositories}}active{{end}} item" href="{{AppSubUrl}}/admin/repos"> | ||||
| 			{{.i18n.Tr "admin.repositories"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsAdminHooks}}active{{end}} item" href="{{AppSubUrl}}/admin/hooks"> | ||||
| 			{{.i18n.Tr "admin.hooks"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsAdminSystemHooks}}active{{end}} item" href="{{AppSubUrl}}/admin/system-hooks"> | ||||
| 			{{.i18n.Tr "admin.systemhooks"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsAdminAuthentications}}active{{end}} item" href="{{AppSubUrl}}/admin/auths"> | ||||
| 			{{.i18n.Tr "admin.authentication"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsAdminEmails}}active{{end}} item" href="{{AppSubUrl}}/admin/emails"> | ||||
| 			{{.i18n.Tr "admin.emails"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsAdminConfig}}active{{end}} item" href="{{AppSubUrl}}/admin/config"> | ||||
| 			{{.i18n.Tr "admin.config"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsAdminNotices}}active{{end}} item" href="{{AppSubUrl}}/admin/notices"> | ||||
| 			{{.i18n.Tr "admin.notices"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsAdminMonitor}}active{{end}} item" href="{{AppSubUrl}}/admin/monitor"> | ||||
| 			{{.i18n.Tr "admin.monitor"}} | ||||
| 		</a> | ||||
| 	</div> | ||||
| </div> | ||||
|  |  | |||
|  | @ -2,9 +2,11 @@ | |||
| 	<img width="48" height="48" class="ui image commit-avatar" src="{{.SignedUser.RelAvatarLink}}"> | ||||
| 	<div class="commit-form"> | ||||
| 		<h3>{{- if .CanCommitToBranch.WillSign}} | ||||
| 		<i title="{{.i18n.Tr "repo.signing.will_sign" .CanCommitToBranch.SigningKey}}" class="lock green icon"></i>{{.i18n.Tr "repo.editor.commit_signed_changes"}} | ||||
| 			<span title="{{.i18n.Tr "repo.signing.will_sign" .CanCommitToBranch.SigningKey}}">{{svg "octicon-lock" 24}}</span> | ||||
| 			{{.i18n.Tr "repo.editor.commit_signed_changes"}} | ||||
| 		{{- else}} | ||||
| 		<i title="{{.i18n.Tr (printf "repo.signing.wont_sign.%s" .CanCommitToBranch.WontSignReason)}}" class="unlock grey icon"></i>{{.i18n.Tr "repo.editor.commit_changes"}} | ||||
| 			<span title="{{.i18n.Tr (printf "repo.signing.wont_sign.%s" .CanCommitToBranch.WontSignReason)}}">{{svg "octicon-unlock" 24}}</span> | ||||
| 			{{.i18n.Tr "repo.editor.commit_changes"}} | ||||
| 		{{- end}}</h3> | ||||
| 		<div class="field"> | ||||
| 			<input name="commit_summary" placeholder="{{if .PageIsDelete}}{{.i18n.Tr "repo.editor.delete" .TreePath}}{{else if .PageIsUpload}}{{.i18n.Tr "repo.editor.upload_files_to_dir" .TreePath}}{{else if .IsNewFile}}{{.i18n.Tr "repo.editor.add_tmpl"}}{{else}}{{.i18n.Tr "repo.editor.update" .TreePath}}{{end}}" value="{{.commit_summary}}" autofocus> | ||||
|  |  | |||
|  | @ -403,10 +403,10 @@ | |||
| 					<img src="{{.Poster.RelAvatarLink}}"> | ||||
| 				</a> | ||||
| 				{{end}} | ||||
| 				<span class="badge {{if eq .Review.Type 1}}green | ||||
| 				{{- else if eq .Review.Type 2}}grey | ||||
| 				{{- else if eq .Review.Type 3}}red | ||||
| 				{{- else}}grey{{end}}">{{svg (printf "octicon-%s" .Review.Type.Icon)}}</span> | ||||
| 				<span class="badge {{if eq .Review.Type 1}}bg-green | ||||
| 				{{- else if eq .Review.Type 2}}bg-grey | ||||
| 				{{- else if eq .Review.Type 3}}bg-red | ||||
| 				{{- else}}bg-grey{{end}} text-white">{{svg (printf "octicon-%s" .Review.Type.Icon)}}</span> | ||||
| 				<span class="text grey"> | ||||
| 					{{if .OriginalAuthor }} | ||||
| 						<span class="text black"><i class="fa {{MigrationIcon $.Repository.GetOriginalURLHostname}}" aria-hidden="true"></i> {{ .OriginalAuthor }}</span><span class="text grey"> {{if $.Repository.OriginalURL}}</span><span class="text migrate">({{$.i18n.Tr "repo.migrated_from" $.Repository.OriginalURL $.Repository.GetOriginalURLHostname | Safe }}){{end}}</span> | ||||
|  |  | |||
|  | @ -1,29 +1,31 @@ | |||
| <div class="ui secondary pointing tabular top attached borderless menu stackable new-menu navbar"> | ||||
| 	<a class="{{if .PageIsSettingsOptions}}active{{end}} item" href="{{.RepoLink}}/settings"> | ||||
| 		{{.i18n.Tr "repo.settings.options"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsSettingsCollaboration}}active{{end}} item" href="{{.RepoLink}}/settings/collaboration"> | ||||
| 		{{.i18n.Tr "repo.settings.collaboration"}} | ||||
| 	</a> | ||||
| 	{{if not .Repository.IsEmpty}} | ||||
| 		<a class="{{if .PageIsSettingsBranches}}active{{end}} item" href="{{.RepoLink}}/settings/branches"> | ||||
| 			{{.i18n.Tr "repo.settings.branches"}} | ||||
| 	<div class="new-menu-inner"> | ||||
| 		<a class="{{if .PageIsSettingsOptions}}active{{end}} item" href="{{.RepoLink}}/settings"> | ||||
| 			{{.i18n.Tr "repo.settings.options"}} | ||||
| 		</a> | ||||
| 	{{end}} | ||||
| 	<a class="{{if .PageIsSettingsHooks}}active{{end}} item" href="{{.RepoLink}}/settings/hooks"> | ||||
| 		{{.i18n.Tr "repo.settings.hooks"}} | ||||
| 	</a> | ||||
| 	{{if .SignedUser.CanEditGitHook}} | ||||
| 		<a class="{{if .PageIsSettingsGitHooks}}active{{end}} item" href="{{.RepoLink}}/settings/hooks/git"> | ||||
| 			{{.i18n.Tr "repo.settings.githooks"}} | ||||
| 		<a class="{{if .PageIsSettingsCollaboration}}active{{end}} item" href="{{.RepoLink}}/settings/collaboration"> | ||||
| 			{{.i18n.Tr "repo.settings.collaboration"}} | ||||
| 		</a> | ||||
| 	{{end}} | ||||
| 	<a class="{{if .PageIsSettingsKeys}}active{{end}} item" href="{{.RepoLink}}/settings/keys"> | ||||
| 		{{.i18n.Tr "repo.settings.deploy_keys"}} | ||||
| 	</a> | ||||
| 	{{if .LFSStartServer}} | ||||
| 		<a class="{{if .PageIsSettingsLFS}}active{{end}} item" href="{{.RepoLink}}/settings/lfs"> | ||||
| 			{{.i18n.Tr "repo.settings.lfs"}} | ||||
| 		{{if not .Repository.IsEmpty}} | ||||
| 			<a class="{{if .PageIsSettingsBranches}}active{{end}} item" href="{{.RepoLink}}/settings/branches"> | ||||
| 				{{.i18n.Tr "repo.settings.branches"}} | ||||
| 			</a> | ||||
| 		{{end}} | ||||
| 		<a class="{{if .PageIsSettingsHooks}}active{{end}} item" href="{{.RepoLink}}/settings/hooks"> | ||||
| 			{{.i18n.Tr "repo.settings.hooks"}} | ||||
| 		</a> | ||||
| 	{{end}} | ||||
| 		{{if .SignedUser.CanEditGitHook}} | ||||
| 			<a class="{{if .PageIsSettingsGitHooks}}active{{end}} item" href="{{.RepoLink}}/settings/hooks/git"> | ||||
| 				{{.i18n.Tr "repo.settings.githooks"}} | ||||
| 			</a> | ||||
| 		{{end}} | ||||
| 		<a class="{{if .PageIsSettingsKeys}}active{{end}} item" href="{{.RepoLink}}/settings/keys"> | ||||
| 			{{.i18n.Tr "repo.settings.deploy_keys"}} | ||||
| 		</a> | ||||
| 		{{if .LFSStartServer}} | ||||
| 			<a class="{{if .PageIsSettingsLFS}}active{{end}} item" href="{{.RepoLink}}/settings/lfs"> | ||||
| 				{{.i18n.Tr "repo.settings.lfs"}} | ||||
| 			</a> | ||||
| 		{{end}} | ||||
| 	</div> | ||||
| </div> | ||||
|  |  | |||
|  | @ -2,27 +2,29 @@ | |||
| 
 | ||||
| <div class="user link-account"> | ||||
| 	<div class="ui secondary pointing tabular top attached borderless menu new-menu navbar"> | ||||
| 		<!-- TODO handle .ShowRegistrationButton once other login bugs are fixed --> | ||||
| 		<a class="item {{if not .user_exists}}active{{end}}" | ||||
| 			data-tab="auth-link-signup-tab"> | ||||
| 			{{.i18n.Tr "auth.oauth_signup_tab"}} | ||||
| 		</a> | ||||
| 		<a class="item {{if .user_exists}}active{{end}}" | ||||
| 			data-tab="auth-link-signin-tab"> | ||||
| 			{{.i18n.Tr "auth.oauth_signin_tab"}} | ||||
| 		</a> | ||||
| 	</div> | ||||
| 
 | ||||
| 	<div class="ui middle very relaxed page grid"> | ||||
| 		<div class="column"> | ||||
| 			<div class="ui tab {{if not .user_exists}}active{{end}}" | ||||
| 		<div class="new-menu-inner"> | ||||
| 			<!-- TODO handle .ShowRegistrationButton once other login bugs are fixed --> | ||||
| 			<a class="item {{if not .user_exists}}active{{end}}" | ||||
| 				data-tab="auth-link-signup-tab"> | ||||
| 				{{template "user/auth/signup_inner" .}} | ||||
| 			</div> | ||||
| 			<div class="ui tab {{if .user_exists}}active{{end}}" | ||||
| 				{{.i18n.Tr "auth.oauth_signup_tab"}} | ||||
| 			</a> | ||||
| 			<a class="item {{if .user_exists}}active{{end}}" | ||||
| 				data-tab="auth-link-signin-tab"> | ||||
| 				<div class="ui user signin container icon"> | ||||
| 					{{template "user/auth/signin_inner" .}} | ||||
| 				{{.i18n.Tr "auth.oauth_signin_tab"}} | ||||
| 			</a> | ||||
| 		</div> | ||||
| 
 | ||||
| 		<div class="ui middle very relaxed page grid"> | ||||
| 			<div class="column"> | ||||
| 				<div class="ui tab {{if not .user_exists}}active{{end}}" | ||||
| 					data-tab="auth-link-signup-tab"> | ||||
| 					{{template "user/auth/signup_inner" .}} | ||||
| 				</div> | ||||
| 				<div class="ui tab {{if .user_exists}}active{{end}}" | ||||
| 					data-tab="auth-link-signin-tab"> | ||||
| 					<div class="ui user signin container icon"> | ||||
| 						{{template "user/auth/signin_inner" .}} | ||||
| 					</div> | ||||
| 				</div> | ||||
| 			</div> | ||||
| 		</div> | ||||
|  |  | |||
|  | @ -1,19 +1,21 @@ | |||
| {{if or .EnableOpenIDSignIn .EnableSSPI}} | ||||
| <div class="ui secondary pointing tabular top attached borderless menu new-menu navbar"> | ||||
| 	<a class="{{if .PageIsLogin}}active{{end}} item" rel="nofollow" href="{{AppSubUrl}}/user/login"> | ||||
| 		{{.i18n.Tr "auth.login_userpass"}} | ||||
| 	</a> | ||||
| 	{{if .EnableOpenIDSignIn}} | ||||
| 	<a class="{{if .PageIsLoginOpenID}}active{{end}} item" rel="nofollow" href="{{AppSubUrl}}/user/login/openid"> | ||||
| 		<i class="fa fa-openid"></i> | ||||
| 		 OpenID | ||||
| 	</a> | ||||
| 	{{end}} | ||||
| 	{{if .EnableSSPI}} | ||||
| 	<a class="item" rel="nofollow" href="{{AppSubUrl}}/user/login?auth_with_sspi=1"> | ||||
| 		<i class="fa fa-windows"></i> | ||||
| 		 SSPI | ||||
| 	</a> | ||||
| 	{{end}} | ||||
| 	<div class="new-menu-inner"> | ||||
| 		<a class="{{if .PageIsLogin}}active{{end}} item" rel="nofollow" href="{{AppSubUrl}}/user/login"> | ||||
| 			{{.i18n.Tr "auth.login_userpass"}} | ||||
| 		</a> | ||||
| 		{{if .EnableOpenIDSignIn}} | ||||
| 		<a class="{{if .PageIsLoginOpenID}}active{{end}} item" rel="nofollow" href="{{AppSubUrl}}/user/login/openid"> | ||||
| 			<i class="fa fa-openid"></i> | ||||
| 			 OpenID | ||||
| 		</a> | ||||
| 		{{end}} | ||||
| 		{{if .EnableSSPI}} | ||||
| 		<a class="item" rel="nofollow" href="{{AppSubUrl}}/user/login?auth_with_sspi=1"> | ||||
| 			<i class="fa fa-windows"></i> | ||||
| 			 SSPI | ||||
| 		</a> | ||||
| 		{{end}} | ||||
| 	</div> | ||||
| </div> | ||||
| {{end}} | ||||
|  |  | |||
|  | @ -1,11 +1,13 @@ | |||
| <div class="ui secondary pointing tabular top attached borderless menu stackable new-menu navbar"> | ||||
| 	<a class="{{if .PageIsOpenIDConnect}}active{{end}} item" href="{{AppSubUrl}}/user/openid/connect"> | ||||
| 		{{.i18n.Tr "auth.openid_connect_title"}} | ||||
| 	</a> | ||||
| 	{{if .EnableOpenIDSignUp}} | ||||
| 		<a class="{{if .PageIsOpenIDRegister}}active{{end}} item" href="{{AppSubUrl}}/user/openid/register"> | ||||
| 			{{.i18n.Tr "auth.openid_register_title"}} | ||||
| 	<div class="new-menu-inner"> | ||||
| 		<a class="{{if .PageIsOpenIDConnect}}active{{end}} item" href="{{AppSubUrl}}/user/openid/connect"> | ||||
| 			{{.i18n.Tr "auth.openid_connect_title"}} | ||||
| 		</a> | ||||
| 	{{end}} | ||||
| 		{{if .EnableOpenIDSignUp}} | ||||
| 			<a class="{{if .PageIsOpenIDRegister}}active{{end}} item" href="{{AppSubUrl}}/user/openid/register"> | ||||
| 				{{.i18n.Tr "auth.openid_register_title"}} | ||||
| 			</a> | ||||
| 		{{end}} | ||||
| 	</div> | ||||
| </div> | ||||
| 
 | ||||
|  |  | |||
|  | @ -1,5 +1,5 @@ | |||
| {{template "base/head" .}} | ||||
| <div class="user profile"> | ||||
| <div class="user profile mt-5"> | ||||
| 	<div class="ui container"> | ||||
| 		<div class="ui stackable grid"> | ||||
| 			<div class="ui five wide column"> | ||||
|  |  | |||
|  | @ -1,23 +1,25 @@ | |||
| <div class="ui secondary pointing tabular top attached borderless menu stackable new-menu navbar"> | ||||
| 	<a class="{{if .PageIsSettingsProfile}}active{{end}} item" href="{{AppSubUrl}}/user/settings"> | ||||
| 		{{.i18n.Tr "settings.profile"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsSettingsAccount}}active{{end}} item" href="{{AppSubUrl}}/user/settings/account"> | ||||
| 		{{.i18n.Tr "settings.account"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsSettingsSecurity}}active{{end}} item" href="{{AppSubUrl}}/user/settings/security"> | ||||
| 		{{.i18n.Tr "settings.security"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsSettingsApplications}}active{{end}} item" href="{{AppSubUrl}}/user/settings/applications"> | ||||
| 		{{.i18n.Tr "settings.applications"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsSettingsKeys}}active{{end}} item" href="{{AppSubUrl}}/user/settings/keys"> | ||||
| 		{{.i18n.Tr "settings.ssh_gpg_keys"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsSettingsOrganization}}active{{end}} item" href="{{AppSubUrl}}/user/settings/organization"> | ||||
| 		{{.i18n.Tr "settings.organization"}} | ||||
| 	</a> | ||||
| 	<a class="{{if .PageIsSettingsRepos}}active{{end}} item" href="{{AppSubUrl}}/user/settings/repos"> | ||||
| 		{{.i18n.Tr "settings.repos"}} | ||||
| 	</a> | ||||
| 	<div class="new-menu-inner"> | ||||
| 		<a class="{{if .PageIsSettingsProfile}}active{{end}} item" href="{{AppSubUrl}}/user/settings"> | ||||
| 			{{.i18n.Tr "settings.profile"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsSettingsAccount}}active{{end}} item" href="{{AppSubUrl}}/user/settings/account"> | ||||
| 			{{.i18n.Tr "settings.account"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsSettingsSecurity}}active{{end}} item" href="{{AppSubUrl}}/user/settings/security"> | ||||
| 			{{.i18n.Tr "settings.security"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsSettingsApplications}}active{{end}} item" href="{{AppSubUrl}}/user/settings/applications"> | ||||
| 			{{.i18n.Tr "settings.applications"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsSettingsKeys}}active{{end}} item" href="{{AppSubUrl}}/user/settings/keys"> | ||||
| 			{{.i18n.Tr "settings.ssh_gpg_keys"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsSettingsOrganization}}active{{end}} item" href="{{AppSubUrl}}/user/settings/organization"> | ||||
| 			{{.i18n.Tr "settings.organization"}} | ||||
| 		</a> | ||||
| 		<a class="{{if .PageIsSettingsRepos}}active{{end}} item" href="{{AppSubUrl}}/user/settings/repos"> | ||||
| 			{{.i18n.Tr "settings.repos"}} | ||||
| 		</a> | ||||
| 	</div> | ||||
| </div> | ||||
|  |  | |||
|  | @ -44,11 +44,6 @@ | |||
|     } | ||||
|   } | ||||
| 
 | ||||
|   .ui.header, | ||||
|   .ui.segment { | ||||
|     box-shadow: 0 1px 2px 0 var(--color-secondary); | ||||
|   } | ||||
| 
 | ||||
|   &.user { | ||||
|     .email { | ||||
|       max-width: 200px; | ||||
|  |  | |||
|  | @ -84,6 +84,7 @@ | |||
|   --color-input-background: #ffffff; | ||||
|   --color-input-border: #dedede; | ||||
|   --color-input-border-hover: #cecece; | ||||
|   --color-navbar: #f8f8f8; | ||||
| } | ||||
| 
 | ||||
| :root:lang(ja) { | ||||
|  | @ -189,6 +190,9 @@ table { | |||
| ::-webkit-scrollbar-thumb:hover { | ||||
|   box-shadow: inset 0 0 0 6px var(--color-primary-dark-2); | ||||
| } | ||||
| ::-webkit-scrollbar-corner { | ||||
|   background: transparent; | ||||
| } | ||||
| 
 | ||||
| ::selection, | ||||
| .CodeMirror-selected { | ||||
|  | @ -233,6 +237,15 @@ a:hover, | |||
|   margin: 0 -1.25px; | ||||
| } | ||||
| 
 | ||||
| .ui.pointing.dropdown > .menu:not(.hidden)::after { | ||||
|   background: var(--color-box-body); | ||||
|   box-shadow: -1px -1px 0 0 var(--color-secondary); | ||||
| } | ||||
| 
 | ||||
| .ui.progress[data-percent="0"] .bar .progress { | ||||
|   color: var(--color-text); | ||||
| } | ||||
| 
 | ||||
| .ui.attached.table { | ||||
|   border-color: var(--color-secondary); | ||||
| } | ||||
|  | @ -286,9 +299,8 @@ a:hover, | |||
|   margin: 0 !important; | ||||
| 
 | ||||
|   &.light { | ||||
|     background-color: white; | ||||
|     border-bottom: 1px solid #dddddd; | ||||
|     box-shadow: 0 2px 3px rgba(0, 0, 0, .04); | ||||
|     background: var(--color-body); | ||||
|     border-bottom: 1px solid var(--color-secondary); | ||||
|   } | ||||
| 
 | ||||
|   .column .menu { | ||||
|  | @ -376,6 +388,10 @@ a:hover, | |||
|   margin-left: .5rem; | ||||
| } | ||||
| 
 | ||||
| .ui.dropdown .menu { | ||||
|   border-color: var(--color-secondary); | ||||
| } | ||||
| 
 | ||||
| .ui.form .field > .selection.dropdown > .dropdown.icon { | ||||
|   height: auto; | ||||
| } | ||||
|  | @ -966,55 +982,75 @@ footer { | |||
| } | ||||
| 
 | ||||
| .ui.menu.new-menu { | ||||
|   justify-content: center !important; | ||||
|   padding-top: 15px !important; | ||||
|   margin-top: -15px !important; | ||||
|   margin-bottom: 15px !important; | ||||
|   background: #fafafa; | ||||
|   border-width: 1px !important; | ||||
|   padding-top: 15px; | ||||
|   margin-bottom: 15px; | ||||
|   background: var(--color-navbar); | ||||
|   border-bottom: 1px solid var(--color-secondary) !important; | ||||
|   overflow: auto; | ||||
| } | ||||
| 
 | ||||
| @media @mediaLgAndDown { | ||||
| @media @mediaSm { | ||||
|   .ui.menu.new-menu { | ||||
|     overflow-x: auto !important; | ||||
|     justify-content: left !important; | ||||
|     padding-bottom: 2px; | ||||
|     overflow: visible !important; | ||||
|   } | ||||
| } | ||||
| 
 | ||||
|   .ui.menu.new-menu::-webkit-scrollbar { | ||||
|     height: 8px; | ||||
|     display: none; | ||||
|   } | ||||
| .ui.menu.new-menu .new-menu-inner { | ||||
|   display: flex; | ||||
|   margin-left: auto; | ||||
|   margin-right: auto; | ||||
| } | ||||
| 
 | ||||
|   .ui.menu.new-menu:hover::-webkit-scrollbar { | ||||
|     display: block; | ||||
| @media @mediaSm { | ||||
|   .ui.menu.new-menu .new-menu-inner { | ||||
|     flex-wrap: wrap; | ||||
|     margin-left: 0; | ||||
|     margin-right: 0; | ||||
|   } | ||||
| } | ||||
| 
 | ||||
|   .ui.menu.new-menu::-webkit-scrollbar-track { | ||||
|     background: rgba(0, 0, 0, .01); | ||||
|   } | ||||
| .ui.menu.new-menu::after { | ||||
|   position: absolute; | ||||
|   display: block; | ||||
|   background-image: linear-gradient(to right, transparent, var(--color-navbar) 100%); | ||||
|   content: ' '; | ||||
|   right: 0; | ||||
|   height: 39px; | ||||
|   z-index: 1000; | ||||
|   width: 60px; | ||||
|   visibility: visible; | ||||
|   pointer-events: none; | ||||
| } | ||||
| 
 | ||||
|   .ui.menu.new-menu::-webkit-scrollbar-thumb { | ||||
|     background: rgba(0, 0, 0, .2); | ||||
|   } | ||||
| .ui.menu.new-menu .item { | ||||
|   margin: 0 !important; | ||||
| } | ||||
| 
 | ||||
|   .ui.menu.new-menu::after { | ||||
|     position: absolute; | ||||
|     margin-top: -15px; | ||||
|     display: block; | ||||
|     background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 100%); | ||||
|     content: ' '; | ||||
|     right: 0; | ||||
|     height: 53px; | ||||
|     z-index: 1000; | ||||
|     width: 60px; | ||||
|     clear: none; | ||||
|     visibility: visible; | ||||
| @media @mediaSm { | ||||
|   .ui.menu.new-menu .item { | ||||
|     width: auto !important; | ||||
|   } | ||||
| } | ||||
| 
 | ||||
|   .ui.menu.new-menu a.item:last-child { | ||||
|     padding-right: 30px !important; | ||||
|   } | ||||
| .ui.menu.new-menu .item:last-child { | ||||
|   padding-right: 30px !important; | ||||
| } | ||||
| 
 | ||||
| .ui.menu.new-menu::-webkit-scrollbar { | ||||
|   height: 6px; | ||||
|   display: none; | ||||
| } | ||||
| 
 | ||||
| .ui.menu.new-menu::-webkit-scrollbar-track { | ||||
|   background: none !important; | ||||
| } | ||||
| 
 | ||||
| .ui.menu.new-menu::-webkit-scrollbar-thumb { | ||||
|   box-shadow: none !important; | ||||
| } | ||||
| 
 | ||||
| .ui.menu.new-menu:hover::-webkit-scrollbar { | ||||
|   display: block; | ||||
| } | ||||
| 
 | ||||
| [v-cloak] { | ||||
|  | @ -1473,23 +1509,40 @@ table th[data-sortt-desc] { | |||
| } | ||||
| 
 | ||||
| .ui.tabular.menu { | ||||
|   .item { | ||||
|     padding: 11px 12px; | ||||
|     color: rgba(0, 0, 0, .5); | ||||
|   } | ||||
|   border-color: var(--color-secondary); | ||||
| } | ||||
| 
 | ||||
|   .item:hover { | ||||
|     color: rgba(0, 0, 0, .8); | ||||
|   } | ||||
| .ui.tabular.menu .item { | ||||
|   padding: 11px 12px; | ||||
|   color: var(--color-secondary-dark-6); | ||||
| } | ||||
| 
 | ||||
|   .item.active { | ||||
|     color: rgba(0, 0, 0, .9); | ||||
|     margin-top: 1px; /* offset fomantic's margin-bottom: -1px */ | ||||
|   } | ||||
| .ui.tabular.menu .item:hover { | ||||
|   color: var(--color-text); | ||||
| } | ||||
| 
 | ||||
| .ui.tabular.menu .active.item, | ||||
| .ui.tabular.menu .active.item:hover { | ||||
|   background: var(--color-body); | ||||
|   border-color: var(--color-secondary); | ||||
|   color: var(--color-text); | ||||
|   margin-top: 1px; /* offset fomantic's margin-bottom: -1px */ | ||||
| } | ||||
| 
 | ||||
| .ui.secondary.pointing.menu { | ||||
|   border-color: var(--color-secondary); | ||||
| } | ||||
| 
 | ||||
| .ui.secondary.pointing.menu .item { | ||||
|   padding: 12px; | ||||
|   color: var(--color-secondary-dark-6); | ||||
| } | ||||
| 
 | ||||
| .ui.secondary.pointing.menu .active.item, | ||||
| .ui.secondary.pointing.menu .active.item:hover, | ||||
| .ui.secondary.pointing.menu .dropdown.item:hover, | ||||
| .ui.secondary.pointing.menu .link.item:hover, | ||||
| .ui.secondary.pointing.menu a.item:hover { | ||||
|   color: var(--color-text); | ||||
| } | ||||
| 
 | ||||
| .ui.header .ui.label { | ||||
|  |  | |||
|  | @ -1,6 +1,4 @@ | |||
| .dashboard { | ||||
|   padding-top: 15px; | ||||
| 
 | ||||
|   &.feeds, | ||||
|   &.issues { | ||||
|     .context.user.menu { | ||||
|  | @ -71,7 +69,9 @@ | |||
| 
 | ||||
|   .dashboard-navbar { | ||||
|     width: 100vw; | ||||
|     padding: 0 .5rem; | ||||
|     padding-left: .5rem; | ||||
|     padding-right: .5rem; | ||||
|     padding-top: 15px; | ||||
|     .org-visibility .label { | ||||
|       margin-left: 5px; | ||||
|     } | ||||
|  |  | |||
|  | @ -1,12 +1,9 @@ | |||
| .explore { | ||||
|   padding-top: 15px; | ||||
| 
 | ||||
|   .navbar { | ||||
|     justify-content: center; | ||||
|     padding-top: 15px !important; | ||||
|     margin-top: -15px !important; | ||||
|     margin-bottom: 15px !important; | ||||
|     background-color: #fafafa !important; | ||||
|     background-color: var(--color-navbar) !important; | ||||
|     border-width: 1px !important; | ||||
| 
 | ||||
|     .svg { | ||||
|  |  | |||
|  | @ -1,6 +1,4 @@ | |||
| .organization { | ||||
|   padding-top: 15px; | ||||
| 
 | ||||
|   .head { | ||||
|     .ui.header { | ||||
|       .text { | ||||
|  |  | |||
|  | @ -1,6 +1,4 @@ | |||
| .repository { | ||||
|   padding-top: 15px; | ||||
| 
 | ||||
|   .repo-header { | ||||
|     .ui.compact.menu { | ||||
|       margin-left: 1rem; | ||||
|  | @ -144,8 +142,7 @@ | |||
|   } | ||||
| 
 | ||||
|   .header-wrapper { | ||||
|     background-color: #fafafa; | ||||
|     margin-top: -15px; | ||||
|     background-color: var(--color-navbar); | ||||
|     padding-top: 15px; | ||||
| 
 | ||||
|     .ui.tabs.divider { | ||||
|  | @ -519,21 +516,23 @@ | |||
|         padding: 15px; | ||||
|         margin-bottom: 10px; | ||||
|         border: 1px solid var(--color-secondary); | ||||
|         background: var(--color-box-body); | ||||
|         border-radius: 3px; | ||||
|         #avatar-arrow; | ||||
| 
 | ||||
|         &::after { | ||||
|           border-right-color: var(--color-box-header); | ||||
|           border-right-color: var(--color-box-body); | ||||
|         } | ||||
| 
 | ||||
|         .quick-pull-choice { | ||||
|           .branch-name { | ||||
|             display: inline-block; | ||||
|             padding: 3px 6px; | ||||
|             padding: 2px 4px; | ||||
|             font: 12px var(--fonts-monospace); | ||||
|             color: rgba(0, 0, 0, .65); | ||||
|             background-color: rgba(209, 227, 237, .45); | ||||
|             color: var(--color-text); | ||||
|             background: var(--color-secondary); | ||||
|             border-radius: 3px; | ||||
|             margin: 0 2px; | ||||
|           } | ||||
| 
 | ||||
|           .new-branch-name-input { | ||||
|  | @ -741,14 +740,6 @@ | |||
|           align-items: center; | ||||
|         } | ||||
| 
 | ||||
|         .avatar, | ||||
|         .type-icon { | ||||
|           .svg { | ||||
|             width: 23px; | ||||
|             height: 23px; | ||||
|           } | ||||
|         } | ||||
| 
 | ||||
|         .text { | ||||
|           margin: .3em 0 .5em .5em; | ||||
|         } | ||||
|  | @ -2629,10 +2620,6 @@ | |||
| 
 | ||||
|   .list { | ||||
|     > .item { | ||||
|       .green:not(.ui.button) { | ||||
|         color: var(--color-green); | ||||
|       } | ||||
| 
 | ||||
|       &:not(:first-child) { | ||||
|         border-top: 1px solid var(--color-secondary); | ||||
|         padding: 1rem; | ||||
|  |  | |||
|  | @ -180,3 +180,7 @@ a.blob-excerpt:hover { | |||
|     max-width: 900px; | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| .review-box > .segment { | ||||
|   border: none !important; | ||||
| } | ||||
|  |  | |||
|  | @ -1,10 +1,6 @@ | |||
| @import "variables.less"; | ||||
| 
 | ||||
| .user { | ||||
|   &:not(.icon) { | ||||
|     padding-top: 15px; | ||||
|   } | ||||
| 
 | ||||
|   &.profile { | ||||
|     .ui.card { | ||||
|       .header, | ||||
|  |  | |||
|  | @ -72,13 +72,14 @@ | |||
|   --color-body: #383c4a; | ||||
|   --color-box-header: #454a57; | ||||
|   --color-box-body: #353945; | ||||
|   --color-text: #b6bac5; | ||||
|   --color-text: #bbc0ca; | ||||
|   --color-text-light: #969aa5; | ||||
|   --color-timeline: #4a505c; | ||||
|   --color-input-text: #dcdcdc; | ||||
|   --color-input-text: #d5dbe6; | ||||
|   --color-input-background: #2e323e; | ||||
|   --color-input-border: #454a57; | ||||
|   --color-input-border-hover: #505667; | ||||
|   --color-navbar: #2a2e3a; | ||||
| } | ||||
| 
 | ||||
| /* Background */ | ||||
|  | @ -566,7 +567,7 @@ body { | |||
| 
 | ||||
| .following.bar.light { | ||||
|   background: #2e323e; | ||||
|   border-bottom: 1px solid #313131; | ||||
|   border-color: var(--color-secondary-alpha-40); | ||||
| } | ||||
| 
 | ||||
| .ui.secondary.menu .active.item { | ||||
|  | @ -721,10 +722,6 @@ a.ui.basic.green.label:hover { | |||
|   background-color: #87ab63; | ||||
| } | ||||
| 
 | ||||
| .repository .header-wrapper { | ||||
|   background-color: #2a2e3a; | ||||
| } | ||||
| 
 | ||||
| .ui.header, | ||||
| .ui.breadcrumb .divider { | ||||
|   color: var(--color-secondary-dark-6); | ||||
|  | @ -884,35 +881,6 @@ a.ui.basic.green.label:hover { | |||
|   border-bottom: 1px solid #304251; | ||||
| } | ||||
| 
 | ||||
| .ui.tabular.menu { | ||||
|   border-bottom-color: var(--color-secondary); | ||||
| 
 | ||||
|   .item.active { | ||||
|     border-top-color: var(--color-secondary); | ||||
|     border-left-color: var(--color-secondary); | ||||
|     border-right-color: var(--color-secondary); | ||||
|     background: #383c4a; | ||||
|     color: #dbdbdb; | ||||
|   } | ||||
| 
 | ||||
|   .item { | ||||
|     color: var(--color-secondary-dark-6); | ||||
|   } | ||||
| 
 | ||||
|   .item:hover { | ||||
|     color: #dbdbdb; | ||||
|   } | ||||
| 
 | ||||
|   &.navbar { | ||||
|     .item.active { | ||||
|       border-top-color: transparent; | ||||
|       border-left-color: transparent; | ||||
|       border-right-color: transparent; | ||||
|       background: #383c4a; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| .markdown:not(code) .highlight pre, | ||||
| .markdown:not(code) pre { | ||||
|   background-color: #2a2e3a; | ||||
|  | @ -1022,8 +990,9 @@ a.ui.basic.green.label:hover { | |||
|   color: #dedede; | ||||
| } | ||||
| 
 | ||||
| .repository .comment.form .ui.tabular.menu .item.active { | ||||
|   background: #353945; | ||||
| .repository .navbar .active.item, | ||||
| .repository .navbar .active.item:hover { | ||||
|   border-color: transparent !important; | ||||
| } | ||||
| 
 | ||||
| .ui.basic.green.active.button, | ||||
|  | @ -1156,43 +1125,6 @@ td.blob-hunk { | |||
|   background: #353945; | ||||
| } | ||||
| 
 | ||||
| .ui.secondary.pointing.menu { | ||||
|   border-bottom-color: rgba(255, 255, 255, .15); | ||||
| } | ||||
| 
 | ||||
| .ui.secondary.pointing.menu .active.item { | ||||
|   color: #dbdbdb; | ||||
| } | ||||
| 
 | ||||
| .ui.secondary.pointing.menu .active.item:hover { | ||||
|   color: #dbdbdb; | ||||
| } | ||||
| 
 | ||||
| .ui.secondary.pointing.menu .dropdown.item:hover, | ||||
| .ui.secondary.pointing.menu .link.item:hover, | ||||
| .ui.secondary.pointing.menu a.item:hover { | ||||
|   color: #dbdbdb; | ||||
| } | ||||
| 
 | ||||
| .ui.pointing.dropdown > .menu:not(.hidden)::after { | ||||
|   background: #2c303a; | ||||
| } | ||||
| 
 | ||||
| .explore .navbar { | ||||
|   background-color: #2a2e3a !important; | ||||
| } | ||||
| 
 | ||||
| .ui.menu.new-menu { | ||||
|   background: #2a2e3a; | ||||
|   border-color: transparent !important; | ||||
| 
 | ||||
|   @media @mediaLgAndDown { | ||||
|     &::after { | ||||
|       background: linear-gradient(to right, transparent 0%, #2a2e3a 100%); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| .ui.attached.info.message, | ||||
| .ui.info.message { | ||||
|   box-shadow: 0 0 0 1px #4b5e71 inset, 0 0 0 0 transparent; | ||||
|  |  | |||
		Loading…
	
		Reference in a new issue