mirror of
https://github.com/go-gitea/gitea.git
synced 2025-04-27 03:21:37 +00:00
Fix button alignments and remove unnecessary styles (#34206)
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
Kerwin Bryant
GitHub
parent
a4f22a3e80
commit
bde014e46d
@ -9,16 +9,16 @@
|
||||
<a class="silenced" href="#">silenced</a>
|
||||
</div>
|
||||
<h1>Button</h1>
|
||||
<div>
|
||||
Style:
|
||||
<label><input type="checkbox" name="button-style-compact" value="compact">compact</label>
|
||||
<label><input type="radio" name="button-style-size" value="">(normal)</label>
|
||||
<label><input type="radio" name="button-style-size" value="tiny">tiny</label>
|
||||
<label><input type="radio" name="button-style-size" value="mini">mini</label>
|
||||
".ui.button" styles:
|
||||
<div class="flex-text-block tw-gap-4">
|
||||
<label class="gt-checkbox"><input type="radio" name="button-style-size" value="">(normal)</label>
|
||||
<label class="gt-checkbox"><input type="radio" name="button-style-size" value="small">small</label>
|
||||
<label class="gt-checkbox"><input type="radio" name="button-style-size" value="tiny">tiny</label>
|
||||
<label class="gt-checkbox"><input type="radio" name="button-style-size" value="mini">mini</label>
|
||||
</div>
|
||||
<div>
|
||||
State:
|
||||
<label><input type="checkbox" name="button-state-disabled" value="disabled">disabled</label>
|
||||
<div class="flex-text-block tw-gap-4">
|
||||
<label class="gt-checkbox"><input type="checkbox" name="button-style-compact" value="compact">compact</label>
|
||||
<label class="gt-checkbox"><input type="checkbox" name="button-state-disabled" value="disabled">disabled</label>
|
||||
</div>
|
||||
<div id="devtest-button-samples">
|
||||
<ul class="button-sample-groups">
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<button class="ui primary button js-btn-clone-panel">
|
||||
<button class="ui compact primary button js-btn-clone-panel">
|
||||
{{svg "octicon-code" 16}}
|
||||
<span>{{ctx.Locale.Tr "repo.code"}}</span>
|
||||
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
|
||||
|
||||
@ -37,7 +37,7 @@
|
||||
{{if .PageIsPullFiles}}
|
||||
<div id="diff-commit-select" data-issuelink="{{$.Issue.Link}}" data-queryparams="?style={{if $.IsSplitStyle}}split{{else}}unified{{end}}&whitespace={{$.WhitespaceBehavior}}&show-outdated={{$.ShowOutdatedComments}}" data-filter_changes_by_commit="{{ctx.Locale.Tr "repo.pulls.filter_changes_by_commit"}}">
|
||||
{{/* the following will be replaced by vue component, but this avoids any loading artifacts till the vue component is initialized */}}
|
||||
<div class="ui jump dropdown basic button custom">
|
||||
<div class="ui jump dropdown tiny basic button custom">
|
||||
{{svg "octicon-git-commit"}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -36,21 +36,21 @@
|
||||
{{end}}
|
||||
<div id="code-comments-{{$comment.ID}}" class="field comment-code-cloud {{if $resolved}}tw-hidden{{end}}">
|
||||
<div class="comment-list">
|
||||
<ui class="ui comments">
|
||||
<div class="ui comments">
|
||||
{{template "repo/diff/comments" dict "root" $ "comments" .comments}}
|
||||
</ui>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tw-flex tw-justify-end tw-items-center tw-gap-2 tw-mt-2 tw-flex-wrap">
|
||||
<div class="flex-text-block tw-mt-2 tw-flex-wrap tw-justify-end">
|
||||
<div class="ui buttons">
|
||||
<button class="ui icon tiny basic button previous-conversation">
|
||||
{{svg "octicon-arrow-up" 12 "icon"}} {{ctx.Locale.Tr "repo.issues.previous"}}
|
||||
{{svg "octicon-arrow-up" 12}} {{ctx.Locale.Tr "repo.issues.previous"}}
|
||||
</button>
|
||||
<button class="ui icon tiny basic button next-conversation">
|
||||
{{svg "octicon-arrow-down" 12 "icon"}} {{ctx.Locale.Tr "repo.issues.next"}}
|
||||
{{svg "octicon-arrow-down" 12}} {{ctx.Locale.Tr "repo.issues.next"}}
|
||||
</button>
|
||||
</div>
|
||||
{{if and $.CanMarkConversation $hasReview (not $isReviewPending)}}
|
||||
<button class="ui icon tiny basic button resolve-conversation tw-mr-0" data-origin="diff" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{$comment.ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation">
|
||||
<button class="ui icon tiny basic button resolve-conversation" data-origin="diff" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{$comment.ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation">
|
||||
{{if $resolved}}
|
||||
{{ctx.Locale.Tr "repo.issues.review.un_resolve_conversation"}}
|
||||
{{else}}
|
||||
@ -59,8 +59,8 @@
|
||||
</button>
|
||||
{{end}}
|
||||
{{if and $.SignedUserID (not $.Repository.IsArchived)}}
|
||||
<button class="comment-form-reply ui primary tiny labeled icon button tw-mr-0">
|
||||
{{svg "octicon-reply" 16 "reply icon tw-mr-1"}}{{ctx.Locale.Tr "repo.diff.comment.reply"}}
|
||||
<button class="comment-form-reply ui primary icon tiny button">
|
||||
{{svg "octicon-reply" 12}}{{ctx.Locale.Tr "repo.diff.comment.reply"}}
|
||||
</button>
|
||||
{{end}}
|
||||
</div>
|
||||
|
||||
@ -45,8 +45,8 @@
|
||||
{{end}}
|
||||
</div>
|
||||
</div>
|
||||
<button id="flow-color-monochrome" class="ui labelled icon button{{if eq .Mode "monochrome"}} active{{end}}" title="{{ctx.Locale.Tr "repo.commit_graph.monochrome"}}">{{svg "material-invert-colors" 16 "tw-mr-1"}}{{ctx.Locale.Tr "repo.commit_graph.monochrome"}}</button>
|
||||
<button id="flow-color-colored" class="ui labelled icon button{{if ne .Mode "monochrome"}} active{{end}}" title="{{ctx.Locale.Tr "repo.commit_graph.color"}}">{{svg "material-palette" 16 "tw-mr-1"}}{{ctx.Locale.Tr "repo.commit_graph.color"}}</button>
|
||||
<button id="flow-color-monochrome" class="ui icon button{{if eq .Mode "monochrome"}} active{{end}}" title="{{ctx.Locale.Tr "repo.commit_graph.monochrome"}}">{{svg "material-invert-colors" 16 "tw-mr-1"}}{{ctx.Locale.Tr "repo.commit_graph.monochrome"}}</button>
|
||||
<button id="flow-color-colored" class="ui icon button{{if ne .Mode "monochrome"}} active{{end}}" title="{{ctx.Locale.Tr "repo.commit_graph.color"}}">{{svg "material-palette" 16 "tw-mr-1"}}{{ctx.Locale.Tr "repo.commit_graph.color"}}</button>
|
||||
</div>
|
||||
</h2>
|
||||
<div class="ui dividing"></div>
|
||||
|
||||
@ -17,18 +17,18 @@
|
||||
{{if eq $refGroup "pull"}}
|
||||
{{if or (not $.HidePRRefs) (SliceUtils.Contains $.SelectedBranches .Name)}}
|
||||
<!-- it's intended to use issues not pulls, if it's a pull you will get redirected -->
|
||||
<a class="ui labelled basic tiny button" href="{{$.RepoLink}}/{{if $.Repository.UnitEnabled ctx ctx.Consts.RepoUnitTypePullRequests}}pulls{{else}}issues{{end}}/{{.ShortName|PathEscape}}">
|
||||
<a class="ui basic tiny button" href="{{$.RepoLink}}/{{if $.Repository.UnitEnabled ctx ctx.Consts.RepoUnitTypePullRequests}}pulls{{else}}issues{{end}}/{{.ShortName|PathEscape}}">
|
||||
{{svg "octicon-git-pull-request"}} #{{.ShortName}}
|
||||
</a>
|
||||
{{end}}
|
||||
{{else if eq $refGroup "tags"}}
|
||||
{{- template "repo/tag/name" dict "RepoLink" $.Repository.Link "TagName" .ShortName -}}
|
||||
{{else if eq $refGroup "remotes"}}
|
||||
<a class="ui labelled basic tiny button" href="{{$.RepoLink}}/src/commit/{{$commit.Rev|PathEscape}}">
|
||||
<a class="ui basic tiny button" href="{{$.RepoLink}}/src/commit/{{$commit.Rev|PathEscape}}">
|
||||
{{svg "octicon-cross-reference"}} {{.ShortName}}
|
||||
</a>
|
||||
{{else if eq $refGroup "heads"}}
|
||||
<a class="ui labelled basic tiny button" href="{{$.RepoLink}}/src/branch/{{.ShortName|PathEscape}}">
|
||||
<a class="ui basic tiny button" href="{{$.RepoLink}}/src/branch/{{.ShortName|PathEscape}}">
|
||||
{{svg "octicon-git-branch"}} {{.ShortName}}
|
||||
</a>
|
||||
{{else}}
|
||||
|
||||
@ -38,20 +38,20 @@
|
||||
</div>
|
||||
</div>
|
||||
{{if not (or .IsBeingCreated .IsBroken)}}
|
||||
<div class="repo-buttons">
|
||||
<div class="flex-text-block tw-flex-wrap">
|
||||
{{if $.RepoTransfer}}
|
||||
<form method="post" action="{{$.RepoLink}}/action/accept_transfer?redirect_to={{$.RepoLink}}">
|
||||
{{$.CsrfTokenHtml}}
|
||||
<div data-tooltip-content="{{if $.CanUserAcceptOrRejectTransfer}}{{ctx.Locale.Tr "repo.transfer.accept_desc" $.RepoTransfer.Recipient.DisplayName}}{{else}}{{ctx.Locale.Tr "repo.transfer.no_permission_to_accept"}}{{end}}">
|
||||
<button type="submit" class="ui basic button {{if $.CanUserAcceptOrRejectTransfer}}primary {{end}} ok small"{{if not $.CanUserAcceptOrRejectTransfer}} disabled{{end}}>
|
||||
<div class="flex-text-inline" data-tooltip-content="{{if $.CanUserAcceptOrRejectTransfer}}{{ctx.Locale.Tr "repo.transfer.accept_desc" $.RepoTransfer.Recipient.DisplayName}}{{else}}{{ctx.Locale.Tr "repo.transfer.no_permission_to_accept"}}{{end}}">
|
||||
<button type="submit" class="ui compact small basic button {{if $.CanUserAcceptOrRejectTransfer}}primary {{end}} ok small"{{if not $.CanUserAcceptOrRejectTransfer}} disabled{{end}}>
|
||||
{{ctx.Locale.Tr "repo.transfer.accept"}}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<form method="post" action="{{$.RepoLink}}/action/reject_transfer?redirect_to={{$.RepoLink}}">
|
||||
{{$.CsrfTokenHtml}}
|
||||
<div data-tooltip-content="{{if $.CanUserAcceptOrRejectTransfer}}{{ctx.Locale.Tr "repo.transfer.reject_desc" $.RepoTransfer.Recipient.DisplayName}}{{else}}{{ctx.Locale.Tr "repo.transfer.no_permission_to_reject"}}{{end}}">
|
||||
<button type="submit" class="ui basic button {{if $.CanUserAcceptOrRejectTransfer}}red {{end}}ok small"{{if not $.CanUserAcceptOrRejectTransfer}} disabled{{end}}>
|
||||
<div class="flex-text-inline" data-tooltip-content="{{if $.CanUserAcceptOrRejectTransfer}}{{ctx.Locale.Tr "repo.transfer.reject_desc" $.RepoTransfer.Recipient.DisplayName}}{{else}}{{ctx.Locale.Tr "repo.transfer.no_permission_to_reject"}}{{end}}">
|
||||
<button type="submit" class="ui compact small basic button {{if $.CanUserAcceptOrRejectTransfer}}red {{end}}ok small"{{if not $.CanUserAcceptOrRejectTransfer}} disabled{{end}}>
|
||||
{{ctx.Locale.Tr "repo.transfer.reject"}}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@ -109,7 +109,7 @@
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
<div class="code-comment-buttons tw-flex tw-items-center tw-flex-wrap tw-mt-2 tw-mb-1 tw-mx-2">
|
||||
<div class="flex-text-block tw-flex-wrap tw-my-2">
|
||||
<div class="tw-flex-1">
|
||||
{{if $resolved}}
|
||||
<div class="ui grey text">
|
||||
@ -118,7 +118,7 @@
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
<div class="code-comment-buttons-buttons">
|
||||
<div class="flex-text-block">
|
||||
{{if and $.CanMarkConversation $hasReview (not $isReviewPending)}}
|
||||
<button class="ui tiny basic button resolve-conversation" data-origin="timeline" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{$comment.ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation">
|
||||
{{if $resolved}}
|
||||
@ -129,8 +129,8 @@
|
||||
</button>
|
||||
{{end}}
|
||||
{{if and $.SignedUserID (not $.Repository.IsArchived)}}
|
||||
<button class="comment-form-reply ui primary tiny labeled icon button tw-ml-1 tw-mr-0">
|
||||
{{svg "octicon-reply" 16 "reply icon tw-mr-1"}}{{ctx.Locale.Tr "repo.diff.comment.reply"}}
|
||||
<button class="comment-form-reply ui primary icon tiny button">
|
||||
{{svg "octicon-reply" 12}}{{ctx.Locale.Tr "repo.diff.comment.reply"}}
|
||||
</button>
|
||||
{{end}}
|
||||
</div>
|
||||
|
||||
@ -100,7 +100,7 @@
|
||||
</div>
|
||||
<span class="help">{{ctx.Locale.Tr "repo.release.prerelease_helper"}}</span>
|
||||
<div class="divider tw-mt-0"></div>
|
||||
<div class="tw-flex tw-justify-end">
|
||||
<div class="flex-text-block tw-justify-end">
|
||||
{{if .PageIsEditRelease}}
|
||||
<a class="ui small button" href="{{.RepoLink}}/releases">
|
||||
{{ctx.Locale.Tr "repo.release.cancel"}}
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
{{$canReadCode := $.Permission.CanRead ctx.Consts.RepoUnitTypeCode}}
|
||||
|
||||
{{if $canReadReleases}}
|
||||
<div class="tw-flex">
|
||||
<div class="flex-text-block">
|
||||
<div class="tw-flex-1 tw-flex tw-items-center">
|
||||
<h2 class="ui compact small menu small-menu-items">
|
||||
<a class="{{if and .PageIsReleaseList (not .PageIsSingleTag)}}active {{end}}item" href="{{.RepoLink}}/releases">{{ctx.Locale.PrettyNumber .NumReleases}} {{ctx.Locale.TrN .NumReleases "repo.release" "repo.releases"}}</a>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<form hx-boost="true" hx-target="this" method="post" action="{{$.RepoLink}}/action/{{if $.IsStaringRepo}}unstar{{else}}star{{end}}">
|
||||
<form class="flex-text-inline" hx-boost="true" hx-target="this" method="post" action="{{$.RepoLink}}/action/{{if $.IsStaringRepo}}unstar{{else}}star{{end}}">
|
||||
<div class="ui labeled button" {{if not $.IsSigned}}data-tooltip-content="{{ctx.Locale.Tr "repo.star_guest_user"}}"{{end}}>
|
||||
{{$buttonText := ctx.Locale.Tr "repo.star"}}
|
||||
{{if $.IsStaringRepo}}{{$buttonText = ctx.Locale.Tr "repo.unstar"}}{{end}}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<form hx-boost="true" hx-target="this" method="post" action="{{$.RepoLink}}/action/{{if $.IsWatchingRepo}}unwatch{{else}}watch{{end}}">
|
||||
<form class="flex-text-inline" hx-boost="true" hx-target="this" method="post" action="{{$.RepoLink}}/action/{{if $.IsWatchingRepo}}unwatch{{else}}watch{{end}}">
|
||||
<div class="ui labeled button" {{if not $.IsSigned}}data-tooltip-content="{{ctx.Locale.Tr "repo.watch_guest_user"}}"{{end}}>
|
||||
{{$buttonText := ctx.Locale.Tr "repo.watch"}}
|
||||
{{if $.IsWatchingRepo}}{{$buttonText = ctx.Locale.Tr "repo.unwatch"}}{{end}}
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
<div class="header">
|
||||
Registration Token
|
||||
</div>
|
||||
<div class="ui input">
|
||||
<div class="ui action input">
|
||||
<input type="text" value="{{.RegistrationToken}}" readonly>
|
||||
<button class="ui basic label button" aria-label="{{ctx.Locale.Tr "copy"}}" data-clipboard-text="{{.RegistrationToken}}">
|
||||
{{svg "octicon-copy" 14}}
|
||||
|
||||
@ -1037,12 +1037,13 @@ table th[data-sortt-desc] .svg {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.ellipsis-button {
|
||||
padding: 0 5px 8px !important;
|
||||
display: inline-block !important;
|
||||
font-weight: var(--font-weight-semibold) !important;
|
||||
line-height: 6px !important;
|
||||
vertical-align: middle !important;
|
||||
.ui.button.ellipsis-button {
|
||||
padding: 0 5px 8px;
|
||||
display: inline-block;
|
||||
font-weight: var(--font-weight-semibold);
|
||||
line-height: 8px;
|
||||
vertical-align: middle;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.precolors {
|
||||
|
||||
@ -116,6 +116,7 @@
|
||||
max-width: 200px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
#git-graph-container #graph-raw-list {
|
||||
|
||||
@ -1,20 +1,15 @@
|
||||
/* based on Fomantic UI checkbox module, with just the parts extracted that we use. If you find any
|
||||
unused rules here after refactoring, please remove them. */
|
||||
|
||||
.ui.button {
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
min-height: 1em;
|
||||
display: inline-flex;
|
||||
outline: none;
|
||||
vertical-align: baseline;
|
||||
font-family: var(--fonts-regular);
|
||||
margin: 0 0.25em 0 0;
|
||||
padding: 0.78571429em 1.5em;
|
||||
font-weight: var(--font-weight-normal);
|
||||
font-size: 1rem;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
line-height: 1;
|
||||
border-radius: 0.28571429rem;
|
||||
border-radius: var(--border-radius);
|
||||
user-select: none;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
justify-content: center;
|
||||
@ -58,12 +53,13 @@
|
||||
pointer-events: none !important;
|
||||
}
|
||||
|
||||
/* there is no "ui labeled icon button" support" because it is not used */
|
||||
.ui.labeled.button:not(.icon) {
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
background: none;
|
||||
padding: 0 !important;
|
||||
padding: 0;
|
||||
border: none;
|
||||
min-height: unset;
|
||||
}
|
||||
.ui.labeled.button > .button {
|
||||
margin: 0;
|
||||
@ -102,47 +98,60 @@
|
||||
margin: 0 -0.21428571em 0 0.42857143em;
|
||||
}
|
||||
|
||||
/* reference sizes (not exactly at the moment): normal: padding-x=21, height=38 ; compact: padding-x=15, height=32 */
|
||||
.ui.button { /* stylelint-disable-line no-duplicate-selectors */
|
||||
min-height: 38px;
|
||||
padding: 0.57em /* around 8px */ 1.43em /* around 20px */;
|
||||
}
|
||||
.ui.compact.buttons .button,
|
||||
.ui.compact.button {
|
||||
padding: 0.58928571em 1.125em;
|
||||
padding: 0.42em /* around 8px */ 1.07em /* around 15px */;
|
||||
min-height: 32px;
|
||||
}
|
||||
.ui.compact.icon.buttons .button,
|
||||
.ui.compact.icon.button {
|
||||
padding: 0.58928571em;
|
||||
}
|
||||
.ui.compact.labeled.icon.button {
|
||||
padding: 0.58928571em 3.69642857em;
|
||||
}
|
||||
.ui.compact.labeled.icon.button > .icon {
|
||||
padding: 0.58928571em 0;
|
||||
padding: 0.57em /* around 8px */;
|
||||
}
|
||||
|
||||
.ui.buttons .button,
|
||||
.ui.button {
|
||||
font-size: 1rem;
|
||||
}
|
||||
/* reference size: mini: padding-x=16, height=30 ; compact: padding-x=12, height=26 */
|
||||
.ui.mini.buttons .dropdown,
|
||||
.ui.mini.buttons .dropdown .menu > .item,
|
||||
.ui.mini.buttons .button,
|
||||
.ui.ui.ui.ui.mini.button {
|
||||
font-size: 0.78571429rem;
|
||||
font-size: 11px;
|
||||
min-height: 30px;
|
||||
}
|
||||
.ui.ui.ui.ui.mini.button.compact {
|
||||
min-height: 26px;
|
||||
}
|
||||
|
||||
/* reference size: tiny: padding-x=18, height=32 ; compact: padding-x=13, height=28 */
|
||||
.ui.tiny.buttons .dropdown,
|
||||
.ui.tiny.buttons .dropdown .menu > .item,
|
||||
.ui.tiny.buttons .button,
|
||||
.ui.ui.ui.ui.tiny.button {
|
||||
font-size: 0.85714286rem;
|
||||
font-size: 12px;
|
||||
min-height: 32px;
|
||||
}
|
||||
.ui.ui.ui.ui.tiny.button.compact {
|
||||
min-height: 28px;
|
||||
}
|
||||
|
||||
/* reference size: small: padding-x=19, height=34 ; compact: padding-x=14, height=30 */
|
||||
.ui.small.buttons .dropdown,
|
||||
.ui.small.buttons .dropdown .menu > .item,
|
||||
.ui.small.buttons .button,
|
||||
.ui.ui.ui.ui.small.button {
|
||||
font-size: 0.92857143rem;
|
||||
font-size: 13px;
|
||||
min-height: 34px;
|
||||
}
|
||||
.ui.ui.ui.ui.small.button.compact {
|
||||
min-height: 30px;
|
||||
}
|
||||
|
||||
.ui.icon.buttons .button,
|
||||
.ui.icon.button:not(.compact) {
|
||||
padding: 0.78571429em;
|
||||
padding: 0.57em;
|
||||
}
|
||||
.ui.icon.buttons .button > .icon,
|
||||
.ui.icon.button > .icon {
|
||||
@ -152,12 +161,12 @@
|
||||
|
||||
.ui.basic.buttons .button,
|
||||
.ui.basic.button {
|
||||
border-radius: 0.28571429rem;
|
||||
border-radius: var(--border-radius);
|
||||
background: none;
|
||||
}
|
||||
.ui.basic.buttons {
|
||||
border: 1px solid var(--color-secondary);
|
||||
border-radius: 0.28571429rem;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
.ui.basic.buttons .button {
|
||||
border-radius: 0;
|
||||
@ -188,29 +197,6 @@
|
||||
background: var(--color-active);
|
||||
}
|
||||
|
||||
.ui.labeled.icon.button {
|
||||
position: relative;
|
||||
padding-left: 4.07142857em !important;
|
||||
padding-right: 1.5em !important;
|
||||
}
|
||||
|
||||
.ui.labeled.icon.button > .icon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
line-height: 1;
|
||||
border-radius: 0;
|
||||
border-top-left-radius: inherit;
|
||||
border-bottom-left-radius: inherit;
|
||||
text-align: center;
|
||||
animation: none;
|
||||
padding: 0.78571429em 0;
|
||||
margin: 0;
|
||||
width: 2.57142857em;
|
||||
background: var(--color-hover);
|
||||
}
|
||||
|
||||
.ui.button.toggle.active {
|
||||
background-color: var(--color-green);
|
||||
color: var(--color-white);
|
||||
@ -379,12 +365,12 @@ It needs some tricks to tweak the left/right borders with active state */
|
||||
.ui.buttons .button:first-child {
|
||||
border-left: none;
|
||||
margin-left: 0;
|
||||
border-top-left-radius: 0.28571429rem;
|
||||
border-bottom-left-radius: 0.28571429rem;
|
||||
border-top-left-radius: var(--border-radius);
|
||||
border-bottom-left-radius: var(--border-radius);
|
||||
}
|
||||
.ui.buttons .button:last-child {
|
||||
border-top-right-radius: 0.28571429rem;
|
||||
border-bottom-right-radius: 0.28571429rem;
|
||||
border-top-right-radius: var(--border-radius);
|
||||
border-bottom-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.ui.buttons .button:hover {
|
||||
@ -414,10 +400,3 @@ It needs some tricks to tweak the left/right borders with active state */
|
||||
.ui.buttons .button.active + .button {
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
/* apply the vertical padding of .compact to non-compact buttons when they contain a svg as they
|
||||
would otherwise appear too large. Seen on "RSS Feed" button on repo releases tab. */
|
||||
.ui.small.button:not(.compact):has(.svg) {
|
||||
padding-top: 0.58928571em;
|
||||
padding-bottom: 0.58928571em;
|
||||
}
|
||||
|
||||
@ -1629,21 +1629,17 @@ td .commit-summary {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.repo-button-row-left {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.repo-button-row .button {
|
||||
padding: 6px 10px !important;
|
||||
height: 30px;
|
||||
.repo-button-row .ui.button {
|
||||
flex-shrink: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.repo-button-row .button.dropdown:not(.icon) {
|
||||
padding-right: 22px !important; /* normal buttons have !important paddings, so we need to override it for dropdown (Add File) icons */
|
||||
min-height: 30px;
|
||||
}
|
||||
|
||||
tbody.commit-list {
|
||||
@ -2221,10 +2217,11 @@ tbody.commit-list {
|
||||
max-width: min(400px, 90vw);
|
||||
}
|
||||
|
||||
.branch-selector-dropdown .branch-dropdown-button {
|
||||
.branch-selector-dropdown .ui.button.branch-dropdown-button {
|
||||
margin: 0;
|
||||
max-width: 340px;
|
||||
line-height: var(--line-height-default);
|
||||
padding: 0 0.5em 0 0.75em;
|
||||
}
|
||||
|
||||
/* FIXME: These media selectors are not ideal (just keep them from old code).
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
/* only used by "repo/empty.tmpl" */
|
||||
.clone-buttons-combo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-items: stretch;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
@ -11,7 +11,6 @@
|
||||
|
||||
.ui.action.input.clone-buttons-combo input {
|
||||
border-radius: 0; /* override fomantic border-radius for ".ui.input > input" */
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
/* used by the clone-panel popup */
|
||||
|
||||
@ -27,47 +27,3 @@
|
||||
.repo-header .flex-item-trailing {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.repo-buttons {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
word-break: keep-all;
|
||||
gap: 0.25em;
|
||||
}
|
||||
|
||||
.repo-buttons button[disabled] ~ .label {
|
||||
opacity: var(--opacity-disabled);
|
||||
color: var(--color-text-dark);
|
||||
background: var(--color-light-mimic-enabled) !important;
|
||||
}
|
||||
|
||||
.repo-buttons button[disabled] ~ .label:hover {
|
||||
color: var(--color-primary-dark-1);
|
||||
}
|
||||
|
||||
.repo-buttons .ui.labeled.button.disabled {
|
||||
pointer-events: inherit !important;
|
||||
}
|
||||
|
||||
.repo-buttons .ui.labeled.button.disabled > .label {
|
||||
color: var(--color-text-dark);
|
||||
background: var(--color-light-mimic-enabled) !important;
|
||||
}
|
||||
|
||||
.repo-buttons .ui.labeled.button.disabled > .label:hover {
|
||||
color: var(--color-primary-dark-1);
|
||||
}
|
||||
|
||||
.repo-buttons .ui.labeled.button.disabled > .button {
|
||||
pointer-events: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 767.98px) {
|
||||
.repo-buttons .ui.button,
|
||||
.repo-buttons .ui.label {
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
.list-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-items: stretch;
|
||||
flex-wrap: wrap;
|
||||
gap: .5rem;
|
||||
}
|
||||
@ -8,9 +8,8 @@
|
||||
.list-header-search {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
align-items: stretch;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
min-width: 200px; /* to enable flexbox wrapping on mobile */
|
||||
}
|
||||
|
||||
|
||||
@ -212,7 +212,7 @@ export default defineComponent({
|
||||
<div class="ui scrolling dropdown custom diff-commit-selector">
|
||||
<button
|
||||
ref="expandBtn"
|
||||
class="ui basic button"
|
||||
class="ui tiny basic button"
|
||||
@click.stop="toggleMenu()"
|
||||
:data-tooltip-content="locale.filter_changes_by_commit"
|
||||
aria-haspopup="true"
|
||||
|
||||
@ -217,13 +217,13 @@ export default defineComponent({
|
||||
</script>
|
||||
<template>
|
||||
<div class="ui dropdown custom branch-selector-dropdown ellipsis-text-items">
|
||||
<div tabindex="0" class="ui button branch-dropdown-button" @click="menuVisible = !menuVisible">
|
||||
<div tabindex="0" class="ui compact button branch-dropdown-button" @click="menuVisible = !menuVisible">
|
||||
<span class="flex-text-block gt-ellipsis">
|
||||
<template v-if="dropdownFixedText">{{ dropdownFixedText }}</template>
|
||||
<template v-else>
|
||||
<svg-icon v-if="currentRefType === 'tag'" name="octicon-tag"/>
|
||||
<svg-icon v-else name="octicon-git-branch"/>
|
||||
<strong ref="dropdownRefName" class="tw-ml-2 tw-inline-block gt-ellipsis">{{ currentRefShortName }}</strong>
|
||||
<strong ref="dropdownRefName" class="tw-inline-block gt-ellipsis">{{ currentRefShortName }}</strong>
|
||||
</template>
|
||||
</span>
|
||||
<svg-icon name="octicon-triangle-down" :size="14" class="dropdown icon"/>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user