mirror of
https://codeberg.org/forgejo/forgejo.git
synced 2026-05-12 22:10: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>
284 lines
6 KiB
CSS
284 lines
6 KiB
CSS
.show-outdated,
|
|
.hide-outdated {
|
|
-webkit-touch-callout: none;
|
|
-webkit-user-select: none;
|
|
user-select: none;
|
|
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
padding: 0;
|
|
background: none;
|
|
font-weight: var(--font-weight-medium);
|
|
}
|
|
|
|
.ui.button.add-code-comment {
|
|
padding: 2px;
|
|
position: absolute;
|
|
margin-inline-start: -22px;
|
|
z-index: 5;
|
|
opacity: 0;
|
|
transition: transform 0.1s ease-in-out;
|
|
transform: scale(1);
|
|
box-shadow: none !important;
|
|
border: none !important;
|
|
}
|
|
|
|
.ui.button.add-code-comment:hover {
|
|
transform: scale(1.1);
|
|
}
|
|
|
|
.lines-escape .toggle-escape-button::before {
|
|
visibility: visible;
|
|
content: "⚠️";
|
|
font-family: var(--fonts-emoji);
|
|
color: var(--color-red);
|
|
}
|
|
|
|
.repository .diff-file-box .code-diff td.lines-escape {
|
|
padding-inline-start: 0 !important;
|
|
}
|
|
|
|
.diff-file-box .lines-code:hover .ui.button.add-code-comment {
|
|
opacity: 1;
|
|
}
|
|
|
|
.ui.button.add-code-comment:focus {
|
|
opacity: 1;
|
|
}
|
|
|
|
.repository .diff-file-box .code-diff .add-comment-left,
|
|
.repository .diff-file-box .code-diff .add-comment-right,
|
|
.repository .diff-file-box .code-diff .add-code-comment .add-comment-left,
|
|
.repository .diff-file-box .code-diff .add-code-comment .add-comment-right,
|
|
.repository .diff-file-box .code-diff .add-code-comment .lines-type-marker {
|
|
padding-inline: 0 !important;
|
|
}
|
|
|
|
.add-comment-left.add-comment-right .ui.attached.header {
|
|
border: 1px solid var(--color-secondary);
|
|
}
|
|
|
|
.add-comment-left.add-comment-right .ui.attached.header:not(.top) {
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
/* `.ui.label` implies `min-width: 0` breaking the layout.
|
|
(https://codeberg.org/forgejo/forgejo/pulls/8138#issuecomment-5960251)
|
|
When it becomes possible, feel free to replace with something better. */
|
|
.collapsible-comment-box .ui.label {
|
|
min-width: unset;
|
|
}
|
|
|
|
.show-outdated:hover,
|
|
.hide-outdated:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.comment-code-cloud {
|
|
padding: 0.5rem !important;
|
|
position: relative;
|
|
}
|
|
|
|
.code-diff .conversation-holder .comment-code-cloud {
|
|
max-width: 820px;
|
|
}
|
|
|
|
.add-comment .comment-code-cloud form {
|
|
margin-inline-start: 42px;
|
|
}
|
|
|
|
@media (max-width: 767.98px) {
|
|
.comment-code-cloud {
|
|
max-width: none;
|
|
}
|
|
}
|
|
|
|
.comment-code-cloud .comments .comment {
|
|
padding: 0;
|
|
}
|
|
|
|
@media (max-width: 767.98px) {
|
|
.comment-code-cloud .comments .comment .comment-header-right.actions .ui.basic.label {
|
|
display: none;
|
|
}
|
|
.comment-code-cloud .comments .comment .avatar {
|
|
width: auto;
|
|
margin: 0 0.5rem 0 0;
|
|
flex-shrink: 0;
|
|
}
|
|
.comment-code-cloud .comments .comment .avatar ~ .content {
|
|
margin-inline-start: 1em;
|
|
}
|
|
.comment-code-cloud .comments .comment img.avatar {
|
|
margin: 0 !important;
|
|
}
|
|
.comment-code-cloud .comments .comment .comment-content {
|
|
margin-inline-start: 0 !important;
|
|
}
|
|
.comment-code-cloud .comments .comment.code-comment {
|
|
padding: 0 0 0.5rem !important;
|
|
}
|
|
}
|
|
|
|
.comment-code-cloud .attached.tab {
|
|
border: 0;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.comment-code-cloud .attached.header {
|
|
padding: 1px 8px 1px 12px;
|
|
}
|
|
|
|
.comment-code-cloud .attached.header .text {
|
|
margin: 0;
|
|
}
|
|
|
|
.comment-code-cloud .right.menu.options .item {
|
|
padding: 0.85714286em 0.442857em;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.comment-code-cloud .ui.active.tab.markup {
|
|
padding: 1em;
|
|
min-height: 168px;
|
|
}
|
|
|
|
.comment-code-cloud .ui.tab.markup {
|
|
font-size: 14px;
|
|
}
|
|
|
|
.comment-code-cloud .ui.tabular.menu {
|
|
margin: 0.5em;
|
|
}
|
|
|
|
.comment-code-cloud .editor-statusbar {
|
|
display: none;
|
|
}
|
|
|
|
.comment-code-cloud .footer {
|
|
padding: 10px 0 0;
|
|
}
|
|
|
|
.comment-code-cloud .footer .markup-info {
|
|
display: inline-block;
|
|
margin: 5px 0;
|
|
font-size: 12px;
|
|
color: var(--color-text-light);
|
|
}
|
|
|
|
.comment-code-cloud .footer .ui.right.floated {
|
|
padding-top: 6px;
|
|
}
|
|
|
|
.comment-code-cloud .footer::after {
|
|
clear: both;
|
|
content: "";
|
|
display: block;
|
|
}
|
|
|
|
.diff-file-body .comment-form {
|
|
margin-inline-start: 3em;
|
|
}
|
|
|
|
.diff-file-body.binary {
|
|
padding: 5px 10px;
|
|
}
|
|
|
|
.file-comment {
|
|
color: var(--color-text);
|
|
}
|
|
|
|
.code-expander-button {
|
|
border: none;
|
|
color: var(--color-text-light);
|
|
height: 28px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 100%;
|
|
background: var(--color-expand-button);
|
|
flex: 1;
|
|
}
|
|
|
|
.code-expander-button:hover {
|
|
background: var(--color-primary);
|
|
color: var(--color-primary-contrast);
|
|
}
|
|
|
|
.review-box-panel .ui.segment {
|
|
border: none;
|
|
}
|
|
|
|
/* See the comment of createCommentEasyMDE() for the review editor */
|
|
/* EasyMDE's options can not handle minHeight & maxHeight together correctly, we have to set minHeight in JS code */
|
|
.review-box-panel .CodeMirror-scroll {
|
|
min-height: 80px;
|
|
max-height: calc(100vh - 360px);
|
|
}
|
|
|
|
.review-box-panel .combo-markdown-editor {
|
|
width: 730px; /* this width matches current EasyMDE's toolbar's width */
|
|
max-width: calc(100vw - 70px); /* leave enough space on left, and align the page content */
|
|
}
|
|
|
|
#review-box {
|
|
position: relative;
|
|
}
|
|
|
|
#review-box .review-comments-counter {
|
|
background-color: var(--color-primary-light-4);
|
|
color: var(--color-primary-contrast);
|
|
}
|
|
|
|
#review-box:hover .review-comments-counter {
|
|
background-color: var(--color-primary-light-5);
|
|
}
|
|
|
|
#review-box .review-comments-counter[data-pending-comment-number="0"] {
|
|
display: none;
|
|
}
|
|
|
|
.pull.files.diff .comment {
|
|
scroll-margin-top: 99px;
|
|
}
|
|
|
|
@media (max-width: 991.98px) {
|
|
.pull.files.diff .comment {
|
|
scroll-margin-top: 130px;
|
|
}
|
|
}
|
|
|
|
.changed-since-last-review {
|
|
border: 1px var(--color-accent) solid;
|
|
background-color: var(--color-small-accent);
|
|
border-radius: var(--border-radius);
|
|
padding: 4px 8px;
|
|
margin: -8px 0; /* just like other buttons in the diff box header */
|
|
font-size: 0.857rem; /* just like .ui.tiny.button */
|
|
}
|
|
|
|
.viewed-file-form {
|
|
display: flex;
|
|
align-items: center;
|
|
border: 1px solid transparent;
|
|
padding: 4px 8px;
|
|
margin: -8px 0; /* just like other buttons in the diff box header */
|
|
border-radius: var(--border-radius);
|
|
font-size: 0.857rem; /* just like .ui.tiny.button */
|
|
}
|
|
|
|
.viewed-file-form input {
|
|
margin-inline-end: 4px;
|
|
}
|
|
|
|
.viewed-file-checked-form {
|
|
background-color: var(--color-small-accent);
|
|
border-color: var(--color-accent);
|
|
}
|
|
|
|
#viewed-files-summary {
|
|
width: 100%;
|
|
height: 8px;
|
|
}
|