mirror of
https://codeberg.org/forgejo/forgejo.git
synced 2026-05-13 14:30:25 +00:00
Related issue: https://codeberg.org/forgejo/forgejo/issues/8581 This should be a nice first step towards RTL support. Future PRs can look at updating the tailwind classes, changing some of the icons (arrow left might need to become arrow right in some cases for example, and updating the template files) Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/12491 Reviewed-by: 0ko <0ko@noreply.codeberg.org>
104 lines
2.6 KiB
CSS
104 lines
2.6 KiB
CSS
.sha.label {
|
|
display: inline-flex;
|
|
flex-shrink: 0;
|
|
gap: 0;
|
|
align-items: center;
|
|
margin: 0 6px; /* needs to go but looked into case-by-case */
|
|
padding: 0;
|
|
min-width: 0; /* from .ui.label, may be bad actually */
|
|
background: var(--color-label-bg);
|
|
color: var(--color-label-text);
|
|
border: 1px solid var(--color-light-border);
|
|
border-radius: var(--border-radius);
|
|
white-space: nowrap;
|
|
font-family: var(--fonts-monospace);
|
|
font-size: 13px;
|
|
font-weight: var(--font-weight-normal);
|
|
line-height: 1;
|
|
}
|
|
|
|
.primary.sha.label {
|
|
border: none;
|
|
background: var(--color-primary);
|
|
color: var(--color-primary-contrast);
|
|
}
|
|
|
|
.sha.label .shortsha {
|
|
padding: 0.33rem 0.5rem;
|
|
}
|
|
|
|
.sha.label .signature {
|
|
color: var(--color-text);
|
|
background: var(--color-light);
|
|
padding: 0.25rem 0.33rem;
|
|
border-inline-start: 1px solid var(--color-light-border);
|
|
border-start-end-radius: inherit;
|
|
border-end-end-radius: inherit;
|
|
}
|
|
|
|
.sha.label .signature-author {
|
|
display: flex;
|
|
gap: 0.25rem;
|
|
}
|
|
|
|
.sha.label .signature-author .avatar {
|
|
height: 16px;
|
|
width: 16px;
|
|
margin: 0 !important; /* In some areas selectors with .avatar are too broad */
|
|
}
|
|
|
|
.sha.label.isSigned.isWarning {
|
|
border: 1px solid var(--color-red-badge);
|
|
background: var(--color-red-badge-bg);
|
|
}
|
|
|
|
.sha.label.isSigned.isWarning .signature {
|
|
border-inline-start: 1px solid var(--color-red-badge);
|
|
color: var(--color-red-badge);
|
|
}
|
|
|
|
.sha.label.isSigned.isWarning:hover {
|
|
background: var(--color-red-badge-hover-bg);
|
|
}
|
|
|
|
.sha.label.isSigned.isVerified {
|
|
border: 1px solid var(--color-green-badge);
|
|
background: var(--color-green-badge-bg);
|
|
}
|
|
|
|
.sha.label.isSigned.isVerified .signature {
|
|
border-inline-start: 1px solid var(--color-green-badge);
|
|
color: var(--color-green-badge);
|
|
}
|
|
|
|
.sha.label.isSigned.isVerified:hover {
|
|
background: var(--color-green-badge-hover-bg);
|
|
}
|
|
|
|
.sha.label.isSigned.isVerifiedUntrusted {
|
|
border: 1px solid var(--color-yellow-badge);
|
|
background: var(--color-yellow-badge-bg);
|
|
}
|
|
|
|
.sha.label.isSigned.isVerifiedUntrusted .signature {
|
|
border-inline-start: 1px solid var(--color-yellow-badge);
|
|
color: var(--color-yellow-badge);
|
|
}
|
|
|
|
.sha.label.isSigned.isVerifiedUntrusted:hover {
|
|
background: var(--color-yellow-badge-hover-bg);
|
|
}
|
|
|
|
.sha.label.isSigned.isVerifiedUnmatched {
|
|
border: 1px solid var(--color-orange-badge);
|
|
background: var(--color-orange-badge-bg);
|
|
}
|
|
|
|
.sha.label.isSigned.isVerifiedUnmatched .signature {
|
|
border-inline-start: 1px solid var(--color-orange-badge);
|
|
color: var(--color-orange-badge);
|
|
}
|
|
|
|
.sha.label.isSigned.isVerifiedUnmatched:hover {
|
|
background: var(--color-orange-badge-hover-bg);
|
|
}
|