Fix tooltips and issue dependency styles (#13458)

- Convert all tooltips to JS-based ones, fixing overflow issues
- Restyle issue dependencies/dependants
- Move popup styles to base style
- CSS Helper tweaks
- Unify pseudo element selectors and lint for it

Fixes: https://github.com/go-gitea/gitea/issues/13400
This commit is contained in:
silverwind 2020-11-10 19:28:07 +01:00 committed by GitHub
parent 9155f13bf8
commit 21d496364a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
15 changed files with 164 additions and 146 deletions

View File

@ -11,5 +11,5 @@ rules:
no-descending-specificity: null no-descending-specificity: null
number-leading-zero: never number-leading-zero: never
rule-empty-line-before: null rule-empty-line-before: null
selector-pseudo-element-colon-notation: null selector-pseudo-element-colon-notation: double
shorthand-property-no-redundant-values: true shorthand-property-no-redundant-values: true

View File

@ -90,7 +90,7 @@
</div> </div>
</div> </div>
<div class="inline field"> <div class="inline field">
<div class="ui checkbox" data-tooltip="{{.i18n.Tr "admin.users.allow_git_hook_tooltip"}}"> <div class="ui checkbox poping up" data-content="{{.i18n.Tr "admin.users.allow_git_hook_tooltip"}}" data-variation="very wide">
<label><strong>{{.i18n.Tr "admin.users.allow_git_hook"}}</strong></label> <label><strong>{{.i18n.Tr "admin.users.allow_git_hook"}}</strong></label>
<input name="allow_git_hook" type="checkbox" {{if .User.CanEditGitHook}}checked{{end}} {{if DisableGitHooks}}disabled{{end}}> <input name="allow_git_hook" type="checkbox" {{if .User.CanEditGitHook}}checked{{end}} {{if DisableGitHooks}}disabled{{end}}>
</div> </div>

View File

@ -17,7 +17,7 @@
<input type="checkbox" name="all" id="all" value="true" {{.All}}> <input type="checkbox" name="all" id="all" value="true" {{.All}}>
<label for="all">{{.i18n.Tr "repo.commits.search_all"}} &nbsp;&nbsp;</label> <label for="all">{{.i18n.Tr "repo.commits.search_all"}} &nbsp;&nbsp;</label>
</div> </div>
<button class="ui primary tiny button mr-0" data-panel="#add-deploy-key-panel" data-tooltip={{.i18n.Tr "repo.commits.search.tooltip"}}>{{.i18n.Tr "repo.commits.find"}}</button> <button class="ui primary tiny button mr-0 poping up" data-panel="#add-deploy-key-panel" data-content={{.i18n.Tr "repo.commits.search.tooltip"}}>{{.i18n.Tr "repo.commits.find"}}</button>
</form> </form>
{{else if .IsDiffCompare}} {{else if .IsDiffCompare}}
<a href="{{$.CommitRepoLink}}/commit/{{.BeforeCommitID}}" class="ui green sha label">{{if not .BaseIsCommit}}{{if .BaseIsBranch}}{{svg "octicon-git-branch"}}{{else if .BaseIsTag}}{{svg "octicon-tag"}}{{end}}{{.BaseBranch}}{{else}}{{ShortSha .BaseBranch}}{{end}}</a> <a href="{{$.CommitRepoLink}}/commit/{{.BeforeCommitID}}" class="ui green sha label">{{if not .BaseIsCommit}}{{if .BaseIsBranch}}{{svg "octicon-git-branch"}}{{else if .BaseIsTag}}{{svg "octicon-tag"}}{{end}}{{.BaseBranch}}{{else}}{{ShortSha .BaseBranch}}{{end}}</a>

View File

@ -73,7 +73,7 @@
<input class="hidden" name="git_content" type="checkbox" tabindex="0" {{if .git_content}}checked{{end}}> <input class="hidden" name="git_content" type="checkbox" tabindex="0" {{if .git_content}}checked{{end}}>
<label>{{.i18n.Tr "repo.template.git_content"}}</label> <label>{{.i18n.Tr "repo.template.git_content"}}</label>
</div> </div>
<div class="ui checkbox" {{if not .SignedUser.CanEditGitHook}}data-tooltip="{{.i18n.Tr "repo.template.git_hooks_tooltip"}}"{{end}}> <div class="ui checkbox{{if not .SignedUser.CanEditGitHook}} poping up{{end}}"{{if not .SignedUser.CanEditGitHook}} data-content="{{.i18n.Tr "repo.template.git_hooks_tooltip"}}"{{end}}>
<input class="hidden" name="git_hooks" type="checkbox" tabindex="0" {{if .git_hooks}}checked{{end}}> <input class="hidden" name="git_hooks" type="checkbox" tabindex="0" {{if .git_hooks}}checked{{end}}>
<label>{{.i18n.Tr "repo.template.git_hooks"}}</label> <label>{{.i18n.Tr "repo.template.git_hooks"}}</label>
</div> </div>

View File

@ -434,32 +434,35 @@
{{if (and (not .BlockedByDependencies) (not .BlockingDependencies))}} {{if (and (not .BlockedByDependencies) (not .BlockingDependencies))}}
<span class="text"><strong>{{.i18n.Tr "repo.issues.dependency.title"}}</strong></span> <span class="text"><strong>{{.i18n.Tr "repo.issues.dependency.title"}}</strong></span>
<br> <br>
<p>{{if .Issue.IsPull}} <p>
{{if .Issue.IsPull}}
{{.i18n.Tr "repo.issues.dependency.pr_no_dependencies"}} {{.i18n.Tr "repo.issues.dependency.pr_no_dependencies"}}
{{else}} {{else}}
{{.i18n.Tr "repo.issues.dependency.issue_no_dependencies"}} {{.i18n.Tr "repo.issues.dependency.issue_no_dependencies"}}
{{end}}</p> {{end}}
</p>
{{end}} {{end}}
{{if .BlockingDependencies}} {{if .BlockingDependencies}}
<span class="text" data-tooltip="{{if .Issue.IsPull}} <span class="text poping up" data-content="{{if .Issue.IsPull}}{{.i18n.Tr "repo.issues.dependency.pr_close_blocks"}}{{else}}{{.i18n.Tr "repo.issues.dependency.issue_close_blocks"}}{{end}}">
{{.i18n.Tr "repo.issues.dependency.pr_close_blocks"}}
{{else}}
{{.i18n.Tr "repo.issues.dependency.issue_close_blocks"}}
{{end}}" data-inverted="">
<strong>{{.i18n.Tr "repo.issues.dependency.blocks_short"}}</strong> <strong>{{.i18n.Tr "repo.issues.dependency.blocks_short"}}</strong>
</span> </span>
<div class="ui relaxed divided list"> <div class="ui relaxed divided list">
{{range .BlockingDependencies}} {{range .BlockingDependencies}}
<div class="item{{if .Issue.IsClosed}} is-closed{{end}}"> <div class="item{{if .Issue.IsClosed}} is-closed{{end}} df ac sb">
<span class="text grey right floated">#{{.Issue.Index}}</span> <div class="item-left df jc fc f1">
<a class="title" href="{{.Repository.Link}}/issues/{{.Issue.Index}}">{{.Issue.Title | RenderEmoji}}</a> <a class="title" href="{{.Repository.Link}}/issues/{{.Issue.Index}}">
<div class="text small">{{.Repository.OwnerName}}/{{.Repository.Name}}</div> #{{.Issue.Index}} {{.Issue.Title | RenderEmoji}}
<div class="ui transparent label right floated nopadding"> </a>
<div class="text small">
{{.Repository.OwnerName}}/{{.Repository.Name}}
</div>
</div>
<div class="item-right df ac">
{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}} {{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
<a class="delete-dependency-button" onclick="window.deleteDependencyModal({{.Issue.ID}}, 'blocking');" <a class="delete-dependency-button poping up ci" onclick="window.deleteDependencyModal({{.Issue.ID}}, 'blocking');"
data-tooltip="{{$.i18n.Tr "repo.issues.dependency.remove_info"}}" data-inverted=""> data-content="{{$.i18n.Tr "repo.issues.dependency.remove_info"}}" data-inverted="">
<i class="delete icon text red nopadding nomargin"></i> {{svg "octicon-trashcan" 16}}
</a> </a>
{{end}} {{end}}
</div> </div>
@ -469,24 +472,25 @@
{{end}} {{end}}
{{if .BlockedByDependencies}} {{if .BlockedByDependencies}}
<span class="text" data-tooltip="{{if .Issue.IsPull}} <span class="text poping up" data-content="{{if .Issue.IsPull}}{{.i18n.Tr "repo.issues.dependency.pr_closing_blockedby"}}{{else}}{{.i18n.Tr "repo.issues.dependency.issue_closing_blockedby"}}{{end}}">
{{.i18n.Tr "repo.issues.dependency.pr_closing_blockedby"}}
{{else}}
{{.i18n.Tr "repo.issues.dependency.issue_closing_blockedby"}}
{{end}}" data-inverted="">
<strong>{{.i18n.Tr "repo.issues.dependency.blocked_by_short"}}</strong> <strong>{{.i18n.Tr "repo.issues.dependency.blocked_by_short"}}</strong>
</span> </span>
<div class="ui relaxed divided list"> <div class="ui relaxed divided list">
{{range .BlockedByDependencies}} {{range .BlockedByDependencies}}
<div class="item{{if .Issue.IsClosed}} is-closed{{end}}"> <div class="item{{if .Issue.IsClosed}} is-closed{{end}} df ac sb">
<span class="text grey right floated">#{{.Issue.Index}}</span> <div class="item-left df jc fc f1">
<a class="title" href="{{.Repository.Link}}/issues/{{.Issue.Index}}">{{.Issue.Title | RenderEmoji}}</a> <a class="title" href="{{.Repository.Link}}/issues/{{.Issue.Index}}">
<div class="text small">{{.Repository.OwnerName}}/{{.Repository.Name}}</div> #{{.Issue.Index}} {{.Issue.Title | RenderEmoji}}
<div class="ui transparent label right floated nopadding"> </a>
<div class="text small">
{{.Repository.OwnerName}}/{{.Repository.Name}}
</div>
</div>
<div class="item-right df ac">
{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}} {{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
<a class="delete-dependency-button" onclick="window.deleteDependencyModal({{.Issue.ID}}, 'blockedBy');" <a class="delete-dependency-button poping up ci" onclick="window.deleteDependencyModal({{.Issue.ID}}, 'blockedBy');"
data-tooltip="{{$.i18n.Tr "repo.issues.dependency.remove_info"}}" data-inverted=""> data-content="{{$.i18n.Tr "repo.issues.dependency.remove_info"}}" data-inverted="">
<i class="delete icon text red nopadding nomargin"></i> {{svg "octicon-trashcan" 16}}
</a> </a>
{{end}} {{end}}
</div> </div>

View File

@ -152,7 +152,9 @@
{{if .Attachments}} {{if .Attachments}}
{{range .Attachments}} {{range .Attachments}}
<li> <li>
<span class="ui text right" data-tooltip="{{$.i18n.Tr "repo.release.download_count" (.DownloadCount | PrettyNumber)}}" data-position="bottom right">{{svg "octicon-info"}}</span> <span class="ui text right poping up" data-content="{{$.i18n.Tr "repo.release.download_count" (.DownloadCount | PrettyNumber)}}">
{{svg "octicon-info"}}
</span>
<a target="_blank" rel="noopener noreferrer" href="{{.DownloadURL}}"> <a target="_blank" rel="noopener noreferrer" href="{{.DownloadURL}}">
<strong><span class="ui image" title='{{.Name}}'>{{svg "octicon-package" 16 "mr-2"}}</span>{{.Name}}</strong> <strong><span class="ui image" title='{{.Name}}'>{{svg "octicon-package" 16 "mr-2"}}</span>{{.Name}}</strong>
<span class="ui text grey right">{{.Size | FileSize}}</span> <span class="ui text grey right">{{.Size | FileSize}}</span>

View File

@ -22,7 +22,7 @@
</div> </div>
{{end}} {{end}}
{{if .LFSLock}} {{if .LFSLock}}
<div class="file-info-entry ui" data-tooltip="{{.LFSLockHint}}" data-inverted=""> <div class="file-info-entry ui poping up" data-content="{{.LFSLockHint}}">
{{svg "octicon-lock" 16 "mr-2"}} {{svg "octicon-lock" 16 "mr-2"}}
<a href="{{AppSubUrl}}/{{.LFSLock.Owner.Name}}">{{.LFSLockOwner}}</a> <a href="{{AppSubUrl}}/{{.LFSLock.Owner.Name}}">{{.LFSLockOwner}}</a>
</div> </div>

View File

@ -362,10 +362,6 @@ a:hover,
background-color: transparent; background-color: transparent;
} }
&.nopadding {
padding: 0;
}
&.menu, &.menu,
&.vertical.menu, &.vertical.menu,
&.segment { &.segment {
@ -506,14 +502,6 @@ a:hover,
&.middle { &.middle {
vertical-align: middle; vertical-align: middle;
} }
&.nopadding {
padding: 0;
}
&.nomargin {
margin: 0;
}
} }
.message { .message {
@ -952,7 +940,7 @@ footer {
background: rgba(0, 0, 0, .2); background: rgba(0, 0, 0, .2);
} }
.ui.menu.new-menu:after { .ui.menu.new-menu::after {
position: absolute; position: absolute;
margin-top: -15px; margin-top: -15px;
display: block; display: block;
@ -1049,12 +1037,12 @@ i.icon.centerlock {
span { span {
&.bottom-line { &.bottom-line {
&:after { &::after {
border-bottom: 1px solid #eaecef; border-bottom: 1px solid #eaecef;
} }
} }
&:after { &::after {
content: attr(data-line-number); content: attr(data-line-number);
line-height: 20px !important; line-height: 20px !important;
padding: 0 10px; padding: 0 10px;
@ -1271,6 +1259,37 @@ i.icon.centerlock {
} }
} }
.ui.popup {
background-color: var(--color-body);
color: var(--color-secondary-dark-6);
border-color: var(--color-secondary);
}
.ui.popup::before {
box-shadow: 1px 1px 0 0 var(--color-secondary);
}
.ui.bottom.popup::before,
.ui.top.popup::before,
.ui.right.center.popup::before,
.ui.left.center.popup::before {
background-color: var(--color-body);
}
.ui.bottom.left.popup::before,
.ui.bottom.right.popup::before,
.ui.bottom.center.popup::before {
box-shadow: -1px -1px 0 0 var(--color-secondary);
}
.ui.left.center.popup::before {
box-shadow: 1px -1px 0 0 var(--color-secondary);
}
.ui.right.center.popup::before {
box-shadow: -1px 1px 0 0 var(--color-secondary);
}
.ui.popup .ui.label { .ui.popup .ui.label {
margin-bottom: .4em; margin-bottom: .4em;
} }

View File

@ -403,10 +403,10 @@
border: 0; border: 0;
} }
pre code:before, pre code::before,
pre code:after, pre code::after,
pre tt:before, pre tt::before,
pre tt:after { pre tt::after {
content: normal; content: normal;
} }

View File

@ -113,24 +113,31 @@
.item { .item {
padding: 0; padding: 0;
white-space: nowrap;
}
.title {
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;
}
@media (max-width: 1200px) {
.title {
max-width: 150px;
}
}
@media (max-width: 1000px) {
.title {
max-width: 100px;
}
} }
.label.color { .label.color {
padding: 0 8px; padding: 0 8px;
margin-right: 5px; margin-right: 5px;
} }
a {
margin: 2px 0;
.text {
color: #444444;
&:hover {
color: #000000;
}
}
}
} }
#deadlineForm input { #deadlineForm input {
@ -520,7 +527,7 @@
border-radius: 3px; border-radius: 3px;
#avatar-arrow; #avatar-arrow;
&:after { &::after {
border-right-color: #ffffff; border-right-color: #ffffff;
} }
@ -590,7 +597,7 @@
margin-left: 4em; margin-left: 4em;
#avatar-arrow; #avatar-arrow;
&:after { &::after {
border-right-color: #ffffff; border-right-color: #ffffff;
} }
@ -771,7 +778,7 @@
} }
.comment-list { .comment-list {
&:not(.prevent-before-timeline):before { &:not(.prevent-before-timeline)::before {
display: block; display: block;
content: ""; content: "";
position: absolute; position: absolute;
@ -791,7 +798,7 @@
margin-left: 40px; margin-left: 40px;
padding-left: 16px; padding-left: 16px;
&:before { //ciara &::before { //ciara
display: block; display: block;
content: ""; content: "";
position: absolute; position: absolute;
@ -1068,7 +1075,7 @@
max-width: 150px; max-width: 150px;
background-color: #ffffff; background-color: #ffffff;
&:before { &::before {
content: ' '; content: ' ';
display: inline-block; display: inline-block;
height: 100%; height: 100%;
@ -1222,7 +1229,7 @@
.form { .form {
#avatar-arrow; #avatar-arrow;
&:after { &::after {
border-right-color: #ffffff; border-right-color: #ffffff;
} }
} }
@ -1362,7 +1369,7 @@
.content { .content {
#avatar-arrow; #avatar-arrow;
&:after { &::after {
border-right-color: #ffffff; border-right-color: #ffffff;
} }
} }
@ -1596,7 +1603,7 @@
padding-right: 2px; padding-right: 2px;
} }
> div:after { > div::after {
clear: both; clear: both;
content: ""; content: "";
display: block; display: block;
@ -2799,7 +2806,7 @@
box-shadow: 0 0 0 3px var(--color-primary-alpha-30) !important; box-shadow: 0 0 0 3px var(--color-primary-alpha-30) !important;
} }
.comment:target .header:before { .comment:target .header::before {
border-right-color: var(--color-primary) !important; border-right-color: var(--color-primary) !important;
filter: drop-shadow(-3px 0 0 var(--color-primary-alpha-30)) !important; filter: drop-shadow(-3px 0 0 var(--color-primary-alpha-30)) !important;
} }
@ -2917,8 +2924,8 @@
#avatar-arrow { #avatar-arrow {
&:before, &::before,
&:after { &::after {
right: 100%; right: 100%;
top: 20px; top: 20px;
border: solid transparent; border: solid transparent;
@ -2929,13 +2936,13 @@
pointer-events: none; pointer-events: none;
} }
&:before { &::before {
border-right-color: var(--color-secondary); border-right-color: var(--color-secondary);
border-width: 9px; border-width: 9px;
margin-top: -9px; margin-top: -9px;
} }
&:after { &::after {
border-right-color: var(--color-box-header); border-right-color: var(--color-box-header);
border-width: 8px; border-width: 8px;
margin-top: -8px; margin-top: -8px;
@ -3323,7 +3330,7 @@ td.blob-excerpt {
background: none !important; background: none !important;
@media only screen and (max-width: 1200px) { @media only screen and (max-width: 1200px) {
&:after { &::after {
background: none !important; background: none !important;
} }
} }

View File

@ -96,7 +96,7 @@
padding-top: 6px; padding-top: 6px;
} }
&:after { &::after {
clear: both; clear: both;
content: ""; content: "";
display: block; display: block;

View File

@ -12,7 +12,7 @@
overflow: hidden !important; overflow: hidden !important;
} }
.is-loading:after { .is-loading::after {
content: ""; content: "";
position: absolute; position: absolute;
display: block; display: block;

View File

@ -4,9 +4,19 @@
.js { justify-content: flex-start !important; } .js { justify-content: flex-start !important; }
.je { justify-content: flex-end !important; } .je { justify-content: flex-end !important; }
.sb { justify-content: space-between !important; } .sb { justify-content: space-between !important; }
.mono { font-family: var(--fonts-monospace); font-size: .9em; /* compensate for monospace fonts being usually slighty larger */ } .fc { flex-direction: column !important; }
.f1 { flex: 1 !important; }
.rounded { border-radius: var(--border-radius) !important; } .rounded { border-radius: var(--border-radius) !important; }
.word-break { word-wrap: break-word; word-break: break-all; }
.mono {
font-family: var(--fonts-monospace) !important;
font-size: .9em !important; /* compensate for monospace fonts being usually slighty larger */
}
.word-break {
word-wrap: break-word !important;
word-break: break-all !important;
}
.m-0 { margin: 0 !important; } .m-0 { margin: 0 !important; }
.m-1 { margin: .125rem !important; } .m-1 { margin: .125rem !important; }

View File

@ -4,8 +4,8 @@ html {
} }
*, *,
*:before, *::before,
*:after { *::after {
box-sizing: inherit; box-sizing: inherit;
} }

View File

@ -1105,28 +1105,28 @@ a.ui.basic.green.label:hover {
border-color: var(--color-secondary); border-color: var(--color-secondary);
} }
.header:after { .header::after {
border-right-color: var(--color-secondary); border-right-color: var(--color-secondary);
} }
.merge-section.no-header:after { .merge-section.no-header::after {
border-right-color: var(--color-secondary); border-right-color: var(--color-secondary);
} }
.header:before { .header::before {
border-right-color: var(--color-secondary); border-right-color: var(--color-secondary);
} }
.merge-section.no-header:before { .merge-section.no-header::before {
border-right-color: #505667; border-right-color: #505667;
} }
} }
.repository.new.issue .comment.form .content:after { .repository.new.issue .comment.form .content::after {
border-right-color: #353945; border-right-color: #353945;
} }
.repository.new.issue .comment.form .content:before { .repository.new.issue .comment.form .content::before {
border-right-color: #353945; border-right-color: #353945;
} }
@ -1151,11 +1151,11 @@ a.ui.basic.green.label:hover {
border-right-color: #505667; border-right-color: #505667;
} }
.repository .comment.form .content .form:after { .repository .comment.form .content .form::after {
border-right-color: #353945; border-right-color: #353945;
} }
.repository .comment.form .content .form:before { .repository .comment.form .content .form::before {
border-right-color: var(--color-secondary); border-right-color: var(--color-secondary);
} }
@ -1354,7 +1354,7 @@ td.blob-hunk {
border-color: transparent !important; border-color: transparent !important;
@media only screen and (max-width: 1200px) { @media only screen and (max-width: 1200px) {
&:after { &::after {
background: linear-gradient(to right, transparent 0%, #2a2e3a 100%); background: linear-gradient(to right, transparent 0%, #2a2e3a 100%);
} }
} }
@ -1430,60 +1430,60 @@ td.blob-hunk {
color: #dbdbdb !important; color: #dbdbdb !important;
} }
.ui.checkbox .box:before, .ui.checkbox .box::before,
.ui.checkbox label:before { .ui.checkbox label::before {
background: #2e323e; background: #2e323e;
border: 1px solid var(--color-secondary); border: 1px solid var(--color-secondary);
} }
.ui.checkbox .box:hover:before, .ui.checkbox .box:hover::before,
.ui.checkbox label:hover:before, .ui.checkbox label:hover::before,
.ui.checkbox .box:active:before, .ui.checkbox .box:active::before,
.ui.checkbox label:active:before { .ui.checkbox label:active::before {
background: #2e323e; background: #2e323e;
border-color: #6a737d; border-color: #6a737d;
} }
.ui.checkbox input:focus ~ .box:before, .ui.checkbox input:focus ~ .box::before,
.ui.checkbox input:focus ~ label:before, .ui.checkbox input:focus ~ label::before,
.ui.checkbox input:checked:focus ~ .box:before, .ui.checkbox input:checked:focus ~ .box::before,
.ui.checkbox input:checked:focus ~ label:before { .ui.checkbox input:checked:focus ~ label::before {
background: #2e323e; background: #2e323e;
border-color: #6a737d; border-color: #6a737d;
} }
.ui.checkbox input:checked ~ .box:after, .ui.checkbox input:checked ~ .box::after,
.ui.checkbox input:checked ~ label:after { .ui.checkbox input:checked ~ label::after {
color: #dbdbdb; color: #dbdbdb;
} }
.ui.checkbox input:checked ~ .box:before, .ui.checkbox input:checked ~ .box::before,
.ui.checkbox input:checked ~ label:before { .ui.checkbox input:checked ~ label::before {
background: #2e323e; background: #2e323e;
opacity: 1; opacity: 1;
color: #dbdbdb; color: #dbdbdb;
border-color: #505667; border-color: #505667;
} }
.ui.checkbox input:checked:focus ~ .box:before, .ui.checkbox input:checked:focus ~ .box::before,
.ui.checkbox input:checked:focus ~ label:before, .ui.checkbox input:checked:focus ~ label::before,
.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ .box:before, .ui.checkbox input:not([type="radio"]):indeterminate:focus ~ .box::before,
.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label:before { .ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label::before {
background: #2e323e; background: #2e323e;
border-color: #6a737d; border-color: #6a737d;
} }
.ui.checkbox input:checked:focus ~ .box:after, .ui.checkbox input:checked:focus ~ .box::after,
.ui.checkbox input:checked:focus ~ label:after, .ui.checkbox input:checked:focus ~ label::after,
.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ .box:after, .ui.checkbox input:not([type="radio"]):indeterminate:focus ~ .box::after,
.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label:after { .ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label::after {
background: #2e323e; background: #2e323e;
color: #dbdbdb; color: #dbdbdb;
} }
.ui.checkbox input:focus ~ .box:after, .ui.checkbox input:focus ~ .box::after,
.ui.checkbox input:focus ~ label, .ui.checkbox input:focus ~ label,
.ui.checkbox input:focus ~ label:after { .ui.checkbox input:focus ~ label::after {
color: #9a9a9a; color: #9a9a9a;
} }
@ -1572,7 +1572,7 @@ td.blob-hunk {
} }
.bottom-line, .bottom-line,
.bottom-line:after { .bottom-line::after {
border-color: #4e525e !important; border-color: #4e525e !important;
} }
@ -1966,30 +1966,6 @@ a.ui.labels .label:hover {
} }
} }
.ui.loading.segment:before {
background: #353945;
}
.ui.popup {
background-color: #383c4a;
color: var(--color-secondary-dark-6);
border-color: var(--color-secondary);
}
.ui.popup:before {
box-shadow: 1px 1px 0 0 var(--color-secondary);
}
.ui.popup.top:before,
.ui.popup.bottom:before {
background-color: #383c4a;
}
.ui.bottom.left.popup:before,
.ui.bottom.right.popup:before {
box-shadow: -1px -1px 0 0 var(--color-secondary);
}
.markdown:not(code) h1 { .markdown:not(code) h1 {
border-bottom-color: #888; border-bottom-color: #888;
} }
@ -2095,7 +2071,7 @@ img[src$="/img/matrix.svg"] {
filter: invert(84%) hue-rotate(180deg); filter: invert(84%) hue-rotate(180deg);
} }
.is-loading:after { .is-loading::after {
border-color: #4a4c58 #4a4c58 #d7d7da #d7d7da; border-color: #4a4c58 #4a4c58 #d7d7da #d7d7da;
} }