diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less deleted file mode 100644 index 27e11e714e740..0000000000000 --- a/web_src/less/_repository.less +++ /dev/null @@ -1,3604 +0,0 @@ -.repository { - .repo-header { - .ui.compact.menu { - margin-left: 1rem; - } - - .ui.header { - margin-top: 0; - } - - .fork-flag { - font-size: 12px; - margin-top: 2px; - } - - .repo-buttons .svg { - margin: 0 .42857143em 0 -.21428571em; - } - - .button { - margin-top: 2px; - margin-bottom: 2px; - } - } - - .tabs { - .navbar { - justify-content: initial; - } - } - - .navbar { - display: flex; - justify-content: space-between; - - .ui.label { - margin-left: 7px; - padding: 3px 5px; - } - } - - .owner.dropdown { - min-width: 40% !important; - } - - .unicode-escaped .escaped-code-point { - &[data-escaped]::before { - visibility: visible; - content: attr(data-escaped); - font-family: var(--fonts-monospace); - color: var(--color-red); - } - - .char { - display: none; - } - } - - .broken-code-point { - font-family: var(--fonts-monospace); - color: var(--color-blue); - } - - .unicode-escaped .ambiguous-code-point { - border: 1px var(--color-yellow) solid; - } - - .metas { - .menu { - overflow-x: auto; - max-height: 500px; - } - - .ui.list { - &.assignees .icon { - line-height: 2em; - } - - &.assignees .teamavatar { - margin-top: .125rem; - margin-left: 6.75px; - margin-right: 8.75px; - } - - .dependency { - padding: 0; - white-space: nowrap; - } - - .title { - max-width: 200px; - overflow: hidden; - text-overflow: ellipsis; - } - - @media @mediaLgAndDown { - .title { - max-width: 150px; - } - } - - @media (max-width: 1000px) { - .title { - max-width: 100px; - } - } - } - - #deadlineForm input { - width: 12.8rem; - border-radius: 4px 0 0 4px; - border-right: 0; - white-space: nowrap; - } - } - - .header-wrapper { - background-color: var(--color-navbar); - - .ui.tabs.divider { - border-bottom: 0; - } - - .ui.tabular .svg { - margin-right: 5px; - } - } - - .filter.menu { - &.labels { - .label-filter .menu .info { - display: inline-block; - padding: .5rem .25rem; - border-bottom: 1px solid var(--color-secondary); - font-size: 12px; - width: 100%; - white-space: nowrap; - text-align: center; - - code { - border: 1px solid var(--color-secondary); - border-radius: 3px; - padding: 1px 2px; - font-size: 11px; - } - } - } - - .menu { - max-height: 500px; - overflow-x: auto; - right: 0 !important; - left: auto !important; - } - } - - .select-label { - .desc { - padding-left: 23px; - } - } - - .ui.tabs { - &.container { - margin-top: 14px; - margin-bottom: 0; - - .ui.menu { - border-bottom: 0; - } - } - - &.divider { - margin-top: 0; - margin-bottom: 20px; - } - } - - #clone-panel { - #repo-clone-url { - width: 320px; - - @media @mediaMd { - width: 200px; - } - @media @mediaSm { - width: 200px; - } - } - - #repo-clone-https, - #repo-clone-ssh { - border-right: none; - } - - #more-btn { - border-left: none; - } - - button:first-of-type { - border-radius: var(--border-radius) 0 0 var(--border-radius) !important; - } - - button:last-of-type { - border-radius: 0 var(--border-radius) var(--border-radius) 0 !important; - } - - .dropdown .menu { - right: 0 !important; - left: auto !important; - } - } - - &.file.list { - .repo-description { - display: flex; - justify-content: space-between; - align-items: center; - } - - #repo-desc { - font-size: 1.2em; - } - - .choose.reference { - .header .icon { - font-size: 1.4em; - } - } - - .repo-path { - - .section, - .divider { - display: inline; - } - } - - #repo-files-table { - table-layout: fixed; - - thead { - th { - padding-top: 8px; - padding-bottom: 5px; - font-weight: normal; - } - - .ui.avatar { - margin-bottom: 5px; - } - } - - tbody { - .svg { - margin-left: 3px; - margin-right: 5px; - - &.octicon-reply { - margin-right: 10px; - } - - &.octicon-file-directory-fill, - &.octicon-file-submodule { - color: var(--color-primary); - } - - &.octicon-file, - &.octicon-file-symlink-file { - color: var(--color-secondary-dark-7); - } - } - } - - td { - padding-top: 0; - padding-bottom: 0; - overflow: initial; - - &.name { - @media @mediaXl { - max-width: 150px; - } - @media @mediaLg { - max-width: 200px; - } - @media @mediaMd { - max-width: 300px; - } - width: 33%; - - max-width: calc(100vw - 140px); - } - - &.message { - color: var(--color-text-light-1); - - @media @mediaXl { - max-width: 400px; - } - @media @mediaLg { - max-width: 350px; - } - @media @mediaMd { - max-width: 250px; - } - width: 66%; - } - - &.age { - width: 120px; - color: var(--color-text-light-1); - } - - .truncate { - display: inline-block; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - width: 100%; - padding-top: 8px; - padding-bottom: 8px; - } - - a { - padding-top: 8px; - padding-bottom: 8px; - } - - .at { - margin-left: 3px; - margin-right: 3px; - } - - > * { - vertical-align: middle; - } - } - - td.message .isSigned { - cursor: default; - } - - tr:last-of-type { - td:first-child { - border-bottom-left-radius: var(--border-radius); - } - - td:last-child { - border-bottom-right-radius: var(--border-radius); - } - } - - tr:hover { - background-color: var(--color-hover); - } - - tr.has-parent a { - display: inline-block; - padding-top: 8px; - padding-bottom: 8px; - width: calc(100% - 1.25rem); - } - } - - .non-diff-file-content { - .header { - .icon { - font-size: 1em; - } - - .small.icon { - font-size: .75em; - } - - .tiny.icon { - font-size: .5em; - } - - .file-actions { - .btn-octicon { - line-height: 1; - padding: 10px 8px; - vertical-align: middle; - color: var(--color-text); - } - - .btn-octicon:hover { - color: var(--color-primary); - } - - .btn-octicon-danger:hover { - color: var(--color-red); - } - - .btn-octicon.disabled { - color: inherit; - opacity: var(--opacity-disabled); - cursor: default; - } - } - } - - .view-raw { - padding: 5px; - - > * { - max-width: 100%; - border: 1px solid var(--color-secondary); - } - - img { - margin: 1rem 0; - border-radius: 0; - object-fit: contain; - } - - img[src$='.svg' i] { - max-height: 600px !important; - max-width: 600px !important; - } - } - - .plain-text { - padding: 1em 2em; - - pre { - word-break: break-word; - white-space: pre-wrap; - } - } - - .csv { - overflow-x: auto; - padding: 0 !important; - } - - pre { - overflow: auto; - } - - .asciicast { - padding: 5px !important; - } - } - - .sidebar { - padding-left: 0; - - .svg { - width: 16px; - } - } - } - - &.file.editor { - .treepath { - width: 100%; - - input { - vertical-align: middle; - box-shadow: rgba(0, 0, 0, .0745098) 0 1px 2px inset; - width: inherit; - padding: 7px 8px; - margin-right: 5px; - } - } - - .tabular.menu { - .svg { - margin-right: 5px; - } - } - - .commit-form-wrapper { - padding-left: 64px; - - .commit-avatar { - float: left; - margin-left: -64px; - width: 3em; - height: auto; - } - - .commit-form { - position: relative; - 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-body); - } - - .quick-pull-choice { - .branch-name { - display: inline-block; - padding: 2px 4px; - font: 12px var(--fonts-monospace); - color: var(--color-text); - background: var(--color-secondary); - border-radius: 3px; - margin: 0 2px; - } - - .new-branch-name-input { - position: relative; - margin-left: 25px; - - input { - width: 240px !important; - padding-left: 26px !important; - } - } - - .octicon-git-branch { - position: absolute; - top: 9px; - left: 10px; - color: var(--color-grey); - } - } - } - } - } - - &.options { - #interval { - width: 100px !important; - min-width: 100px; - } - - .danger { - .item { - padding: 20px 15px; - } - - .ui.divider { - margin: 0; - } - } - } - - @comment-avatar-width: 3em; - - .comment textarea { - max-height: none !important; - } - - &.new.issue { - .comment.form { - .comment { - .avatar { - width: @comment-avatar-width; - } - } - - .content { - margin-left: 4em; - #avatar-arrow(); - - &::after { - border-right-color: var(--color-box-body); - } - - .markup { - font-size: 14px; - } - } - - .metas { - min-width: 220px; - - .filter.menu { - max-height: 500px; - overflow-x: auto; - } - } - - } - } - - &.view.issue { - .instruct-toggle { - display: inline-block; - } - - .title { - padding-bottom: 0 !important; - - .issue-title { - margin-bottom: .5rem; - - &.edit-active { - display: flex; - align-items: center; - - h1 { - display: flex; - width: 100%; - } - - @media @mediaSm { - flex-direction: column; - - h1 { - margin-right: 0; - margin-bottom: 1rem; - padding-right: 0; - - .ui.input input { - width: calc(100% - 2rem); - } - } - - .edit-buttons { - padding-bottom: 1rem; - width: 100%; - - .button { - width: 100%; - margin-right: .5rem; - - &:last-child { - margin-right: 0; - } - } - } - } - } - - h1 { - font-weight: 300; - font-size: 2.3rem; - margin: 0; - padding-right: .5rem; - - .ui.input { - font-size: .5em; - width: 100%; - - input { - font-size: 1.5em; - padding: 6px 1rem; - } - } - } - - .edit-button { - float: right; - padding-left: 1rem; - } - - .edit-buttons { - display: flex; - } - - .index { - color: var(--color-text-light-2); - } - - .label { - margin-right: 10px; - } - - .edit-zone { - margin-top: 10px; - } - } - } - - .pull-desc { - code { - color: var(--color-primary); - } - a[data-clipboard-text] { - cursor: pointer; - svg { - vertical-align: middle; - position: relative; - top: -2px; - right: 1px; - } - } - } - - .pull { - &.tabular.menu { - margin-bottom: 1rem; - - .svg { - margin-right: 5px; - } - } - - .merge.box { - .avatar { - margin-left: 10px; - margin-top: 10px; - } - - .branch-update.grid { - .row { - padding-bottom: 1rem; - - .icon { - margin-top: 1.1rem; - } - } - } - } - - .review-item { - display: flex; - justify-content: space-between; - align-items: center; - - .review-item-left, - .review-item-right { - display: flex; - align-items: center; - } - - .text { - margin: .3em 0 .5em .5em; - } - - .type-icon { - align-self: flex-start; - margin-right: 1em; - - i { - line-height: 1.8em; - } - } - - .divider { - margin: .5rem 0; - } - - .review-content { - padding: 1em 0 1em 3.8em; - } - } - } - - .comment-list { - &:not(.prevent-before-timeline)::before { - display: block; - content: ""; - position: absolute; - margin-top: 12px; - margin-bottom: 14px; - top: 0; - bottom: 0; - left: 96px; - width: 2px; - background-color: var(--color-timeline); - z-index: -1; - } - - .timeline { - position: relative; - display: block; - margin-left: 40px; - padding-left: 16px; - - &::before { //ciara - display: block; - content: ""; - position: absolute; - margin-top: 12px; - margin-bottom: 14px; - top: 0; - bottom: 0; - left: 30px; - width: 2px; - background-color: var(--color-timeline); - z-index: -1; - } - } - - .timeline-item, - .timeline-item-group { - padding: 12px 0; - } - - .timeline-item-group { - .timeline-item { - padding-top: 8px; - padding-bottom: 8px; - } - } - - .timeline-item { - margin-left: 16px; - position: relative; - - .timeline-avatar { - position: absolute; - left: -68px; - - img { - width: 40px !important; - height: 40px !important; - } - } - - /* Don't show the mobile oriented avatar ".inline-timeline-avatar" on desktop. Desktop uses the avatar with class ".timeline-avatar" */ - .inline-timeline-avatar { - display: none; - } - - img.avatar, - .avatar img { - width: 20px; - height: 20px; - vertical-align: middle; - } - - &:first-child:not(.commit) { - padding-top: 0 !important; - } - - &:last-child:not(.commit) { - padding-bottom: 0 !important; - } - - .badge.badge-commit { - border-color: transparent; - background: radial-gradient(var(--color-body) 40%, transparent 40%) no-repeat; - } - - .badge { - width: 34px; - height: 34px; - background-color: var(--color-timeline); - border-radius: 50%; - display: flex; - float: left; - margin-left: -33px; - margin-right: 8px; - color: var(--color-text); - align-items: center; - justify-content: center; - - .svg { - width: 22px; - height: 22px; - padding: 3px; - - &.octicon-comment { - margin-top: 2px; - } - } - } - - &.comment > .content { - margin-left: -16px; - } - - &.event > .text { - line-height: 32px; - vertical-align: middle; - } - - &.commits-list { - padding-left: 15px; - padding-top: 0; - - .singular-commit { - line-height: 34px; /* this must be same as .badge height, to avoid overflow */ - clear: both; // reset the "float right shabox", in the future, use flexbox instead - - > img.avatar, - > .avatar img { - position: relative; - top: -2px; - } - - .shabox { - .sha.label { - margin: 0; - border: 1px solid var(--color-light-border); - - &.isSigned.isWarning { - border: 1px solid var(--color-red-badge); - background: var(--color-red-badge-bg); - - .shortsha { - display: inline-block; - padding-top: 1px; - } - - &:hover { - background: var(--color-red-badge-hover-bg) !important; - } - } - - &.isSigned.isVerified { - border: 1px solid var(--color-green-badge); - background: var(--color-green-badge-bg); - - .shortsha { - display: inline-block; - padding-top: 1px; - } - - &:hover { - background: var(--color-green-badge-hover-bg) !important; - } - } - - &.isSigned.isVerifiedUntrusted { - border: 1px solid var(--color-yellow-badge); - background: var(--color-yellow-badge-bg); - - .shortsha { - display: inline-block; - padding-top: 1px; - } - - &:hover { - background: var(--color-yellow-badge-hover-bg) !important; - } - } - - &.isSigned.isVerifiedUnmatched { - border: 1px solid var(--color-orange-badge); - background: var(--color-orange-badge-bg); - - .shortsha { - display: inline-block; - padding-top: 1px; - } - - &:hover { - background: var(--color-orange-badge-hover-bg) !important; - } - } - } - } - } - } - - &.event > .commit-status-link { - float: right; - margin-right: 8px; - margin-top: 4px; - } - - .comment-form-reply .footer { - padding-bottom: 1em; - } - - @media @mediaSm { - .ui.segments { - margin-left: -2rem; - } - } - } - - .ui.comments { - max-width: 100%; - - .avatar { - margin-right: .5rem; - } - } - - .comment { - > .content { - > div:first-child { - border-top-left-radius: 4px; - border-top-right-radius: 4px; - } - - > div:last-child { - border-bottom-left-radius: 4px; - border-bottom-right-radius: 4px; - } - } - - .comment-container { - border: 1px solid var(--color-secondary); - border-radius: var(--border-radius); - } - - .content { - @media @mediaSm { - .form .button { - width: 100%; - margin: 0; - - &:not(:last-child) { - margin-bottom: 1rem; - } - } - } - } - - .merge-section { - background-color: var(--color-box-body); - - .item-section { - display: flex; - align-items: center; - justify-content: space-between; - padding: 0; - margin-top: -.25rem; - margin-bottom: -.25rem; - } - - @media @mediaSm { - .item-section { - align-items: flex-start; - flex-direction: column; - } - } - - .divider { - margin-left: -1rem; - margin-right: -1rem; - } - - &.no-header { - #avatar-arrow(); - - &::after { - border-right-color: var(--color-box-body); - } - } - } - - .markup { - font-size: 14px; - } - - .no-content { - color: var(--color-text-light-2); - font-style: italic; - } - - .ui.form { - .field { - &:first-child { - clear: none; - } - - &.footer { - overflow: hidden; - } - - .tab.markup { - min-height: 5rem; - } - } - - textarea { - height: 200px; - font-family: var(--fonts-monospace); - } - } - - .edit.buttons { - margin-top: 10px; - } - } - - .code-comment { - border: 1px solid transparent; - padding: .25rem .5rem; - margin: 0; - - .content { - border: none !important; - } - - .comment-header { - background: transparent; - border-bottom: 0 !important; - padding: 0 !important; - - &::after, - &::before { - display: none; - } - } - - .comment-content { - margin-left: 36px; - } - } - - .code-comment, - .comment { - img.avatar { - width: 28px; - height: 28px; - } - } - - .comment-code-cloud { - .segment.reactions { - margin-top: 16px !important; - margin-bottom: -8px !important; - border-top: none !important; - - .ui.label { - border: 1px solid; - padding: 6px 10px !important; - margin: 0 2px; - border-radius: var(--border-radius); - border-color: var(--color-secondary-dark-1) !important; - } - - .ui.label.basic.primary { - background-color: var(--color-reaction-active-bg) !important; - border-color: var(--color-primary-alpha-80) !important; - } - } - - button.comment-form-reply { - margin: 0; - } - } - - .event { - padding-left: 15px; - - .detail { - margin-top: 4px; - margin-left: 14px; - - .svg { - margin-right: 2px; - } - } - - .segments { - box-shadow: none; - } - } - - @media @mediaSm { - padding: 1rem 0 !important; // Important is required here to override existing fomantic styles. - } - } - - .ui.depending { - .item.is-closed { - .title { - text-decoration: line-through; - } - } - } - } - - .comment.form { - .ui.comments { - margin-top: -12px; - max-width: 100%; - } - - .content { - .field:first-child { - clear: none; - } - - .form { - #avatar-arrow(); - - &::after { - border-right-color: var(--color-box-body); - } - } - - textarea { - height: 200px; - font-family: var(--fonts-monospace); - } - - .CodeMirror-scroll { - max-height: 85vh; - } - } - } - - .milestone.list { - list-style: none; - padding-top: 15px; - - > .item { - padding-top: 10px; - padding-bottom: 10px; - border-bottom: 1px dashed var(--color-secondary); - - progress { - width: 200px; - height: 16px; - } - - .meta { - color: var(--color-text-light-2); - padding-top: 5px; - - .issue-stats .svg { - padding-left: 5px; - } - - .overdue { - color: var(--color-red); - } - } - - .operate { - margin-top: -15px; - - > a { - font-size: 15px; - padding-top: 5px; - padding-right: 10px; - color: var(--color-text-light-2); - - &:hover { - color: var(--color-text); - } - } - } - - .content { - padding-top: 10px; - } - } - } - - &.new.milestone { - textarea { - height: 200px; - } - } - - &.compare.pull { - .show-form-container { - text-align: left; - } - - .choose.branch { - .svg { - margin-right: 10px; - } - } - - .comment.form { - .content { - #avatar-arrow(); - - &::after { - border-right-color: var(--color-box-body); - } - } - } - - .pullrequest-form { - margin-bottom: 1.5rem; - } - - .markup { - font-size: 14px; - } - - .title { - .issue-title { - margin-bottom: .5rem; - .index { - color: var(--color-text-light-2); - } - } - } - } - - .filter.dropdown .menu { - margin-top: 1px !important; - } - - &.branches { - .commit-divergence { - .bar-group { - position: relative; - float: left; - padding-bottom: 6px; - width: 50%; - max-width: 90px; - - &:last-child { - border-left: 1px solid var(--color-secondary-dark-2); - } - } - - .count { - margin: 0 3px; - - &.count-ahead { - text-align: left; - } - - &.count-behind { - text-align: right; - } - } - - .bar { - height: 4px; - position: absolute; - background-color: var(--color-secondary-dark-2); - - &.bar-behind { - right: 0; - } - - &.bar-ahead { - left: 0; - } - } - } - } - - &.commits { - .header { - .search { - input { - font-weight: normal; - padding: 5px 10px; - } - } - } - } - - #commits-table { - thead { - th:first-of-type { - padding-left: 15px; - } - - .sha { - &td { - text-align: center; - } - - width: 200px; - } - } - - td.sha .sha.label { - margin: 0; - } - - td.message { - text-overflow: unset; - } - - &.ui.basic.striped.table tbody tr:nth-child(2n) { - background-color: rgba(0, 0, 0, .02) !important; - } - } - - #commits-table td.sha .sha.label, - #repo-files-table .sha.label, - #rev-list .sha.label, - .timeline-item.commits-list .singular-commit .sha.label { - border: 1px solid var(--color-light-border); - - .ui.signature.avatar { - height: 16px; - margin-bottom: 0; - width: 16px; - } - - .detail.icon { - background: var(--color-light); - margin: -6px -10px -4px 0; - padding: 5px 4px 5px 6px; - border-left: 1px solid var(--color-light-border); - border-top: 0; - border-right: 0; - border-bottom: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0; - - img { - margin-right: 0; - } - - .svg { - margin: 0 .25em 0 0; - } - - > div { - display: flex; - align-items: center; - } - } - - &.isSigned.isWarning { - border: 1px solid var(--color-red-badge); - background: var(--color-red-badge-bg); - - .shortsha { - display: inline-block; - padding-top: 1px; - } - - .detail.icon { - border-left: 1px solid var(--color-red-badge); - color: var(--color-red-badge); - } - - &:hover { - background: var(--color-red-badge-hover-bg) !important; - } - } - - &.isSigned.isVerified { - border: 1px solid var(--color-green-badge); - background: var(--color-green-badge-bg); - - .shortsha { - display: inline-block; - padding-top: 1px; - } - - .detail.icon { - border-left: 1px solid var(--color-green-badge); - color: var(--color-green-badge); - } - - &:hover { - background: var(--color-green-badge-hover-bg) !important; - } - } - - &.isSigned.isVerifiedUntrusted { - border: 1px solid var(--color-yellow-badge); - background: var(--color-yellow-badge-bg); - - .shortsha { - display: inline-block; - padding-top: 1px; - } - - .detail.icon { - border-left: 1px solid var(--color-yellow-badge); - color: var(--color-yellow-badge); - } - - &:hover { - background: var(--color-yellow-badge-hover-bg) !important; - } - } - - &.isSigned.isVerifiedUnmatched { - border: 1px solid var(--color-orange-badge); - background: var(--color-orange-badge-bg); - - .shortsha { - display: inline-block; - padding-top: 1px; - } - - .detail.icon { - border-left: 1px solid var(--color-orange-badge); - color: var(--color-orange-badge); - } - - &:hover { - background: var(--color-orange-badge-hover-bg) !important; - } - } - } - - .data-table { - width: 100%; - - tr { - border-top: 0; - } - - td, - th { - padding: 5px !important; - overflow: hidden; - font-size: 12px; - text-align: left; - white-space: nowrap; - border: 1px solid var(--color-secondary); - } - - td { - white-space: pre-line; - } - - th { - font-weight: 600; - background: var(--color-box-header); - border-top: 0; - } - - td.added, - th.added, - tr.added { - background-color: var(--color-diff-added-row-bg) !important; - } - - td.removed, - th.removed, - tr.removed { - background-color: var(--color-diff-removed-row-bg) !important; - } - - td.moved, - th.moved, - tr.moved { - background-color: var(--color-diff-moved-row-bg) !important; - } - - tbody.section { - border-top: 2px solid var(--color-secondary); - } - - .line-num { - &:extend(.unselectable); - width: 1%; - min-width: 50px; - font-family: monospace; - line-height: 20px; - color: var(--color-secondary-dark-2); - white-space: nowrap; - vertical-align: top; - cursor: pointer; - text-align: right; - background: var(--color-body); - border: 0; - } - } - - .diff-detail-box { - padding: 7px 0; - background: var(--color-body); - line-height: 30px; - - @media @mediaMdAndDown { - flex-direction: column; - align-items: flex-start; - } - - @media (max-width: 480px) { - flex-wrap: wrap; - } - - &.sticky { - position: sticky; - top: 0; - z-index: 8; - border-bottom: 1px solid var(--color-secondary); - padding-left: 2px; - padding-right: 2px; - margin-left: -1px; - margin-right: -1px; - } - - > div::after { - clear: both; - content: ""; - display: block; - } - - .diff-detail-stats strong { - margin-left: .25rem; - margin-right: .25rem; - } - - // Because the translations contain the we need to style with nth-of-type - - .diff-detail-stats strong:nth-of-type(1) { - color: var(--color-yellow); - } - - .diff-detail-stats strong:nth-of-type(2) { - color: var(--color-green); - } - - .diff-detail-stats strong:nth-of-type(3) { - color: var(--color-red); - } - - .diff-detail-stats { - @media (max-width: 480px) { - font-size: 0; - line-height: 1.6rem; - - strong { - font-size: 1rem; - } - } - } - - .diff-detail-actions > * { - margin-right: 0; - } - - .diff-detail-actions > * + * { - margin-left: .25rem; - } - - .diff-detail-actions { - @media (max-width: 480px) { - padding-top: .25rem; - - .ui.button:not(.btn-submit) { - padding-left: .5rem; - padding-right: .5rem; - display: flex; - flex-wrap: wrap; - justify-content: center; - text-align: center; - } - } - } - - span.status { - display: inline-block; - width: 12px; - height: 12px; - margin-right: 8px; - vertical-align: middle; - - &.modify { - background-color: var(--color-yellow); - } - - &.add { - background-color: var(--color-green); - } - - &.del { - background-color: var(--color-red); - } - - &.rename { - background-color: var(--color-teal); - } - } - .button { - padding: 8px 12px; - } - } - - .diff-box .header:not(.resolved-placeholder) { - display: flex; - align-items: center; - - .file { - min-width: 0; - .file-link { - max-width: fit-content; - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 2; - overflow: hidden; - } - } - - .button { - padding: 8px 12px; - flex: 0 0 auto; - margin-top: -8px; - margin-bottom: -8px; - margin-right: 0; - } - } - - .diff-box .resolved-placeholder { - display: flex; - align-items: center; - - .button { - padding: 8px 12px; - } - } - - .diff-file-box { - .header { - background-color: var(--color-box-header); - } - - .file-body.file-code { - background: var(--color-code-bg); - - .lines-num { - &:extend(.unselectable); - text-align: right; - color: var(--color-text-light); - width: 1%; - min-width: 50px; - - span.fold { - display: block; - text-align: center; - } - } - } - - .code-diff { - font-size: 12px; - - td { - padding: 0 0 0 10px !important; - border-top: 0; - } - - .lines-num { - padding: 0 5px !important; - } - - .tag-code .lines-num, - .tag-code td { - padding: 0 !important; - } - - tbody { - tr { - td.halfwidth { - // halfwidth is used in split view - and in that case, 1% of each - width: 49%; - } - - td.center { - text-align: center; - } - - [data-line-num]::before { - content: attr(data-line-num); - text-align: right; - } - - .lines-type-marker { - &:extend(.unselectable); - width: 10px; - min-width: 10px; - } - - [data-type-marker]::before { - content: attr(data-type-marker); - text-align: right; - display: inline-block; - } - } - } - } - - .code-diff-split { - .tag-code .lines-code code.code-inner { - padding-left: 10px !important; - } - - table, - tbody { - width: 100%; - } - } - - &.file-content { - img { - max-width: 100%; - padding: 0; - border-radius: 0; - } - - img.emoji { - padding: 0; - } - - clear: right; - } - - .ui.bottom.attached.table.segment { - padding-top: 5px; - padding-bottom: 5px; - } - } - - .diff-stats { - clear: both; - margin-bottom: 5px; - max-height: 400px; - overflow: auto; - padding-left: 0; - - li { - list-style: none; - padding-bottom: 4px; - margin-bottom: 4px; - padding-left: 6px; - } - - li + li { - border-top: 1px solid var(--color-secondary); - } - } - - .repo-search-result { - padding-top: 10px; - padding-bottom: 10px; - - .lines-num a { - color: inherit; - } - } - - &.quickstart { - .guide { - .item { - padding: 1em; - - small { - font-weight: normal; - } - } - - .clone.button:first-child { - border-radius: var(--border-radius) 0 0 var(--border-radius); - } - - .ui.action.small.input { - width: 100%; - } - - #repo-clone-url { - border-radius: 0; - padding: 5px 10px; - font-size: 1.2em; - line-height: 1.4; - } - } - } - - &.release { - #release-list { - border-top: 1px solid var(--color-secondary); - margin-top: 20px; - padding-top: 15px; - padding-left: 0; - - .release-list-title { - font-size: 2rem; - font-weight: normal; - margin-top: -4px; - margin-bottom: 0; - } - - > li { - list-style: none; - - .meta, - .detail { - padding-top: 30px; - padding-bottom: 40px; - } - - .meta { - text-align: right; - position: relative; - - .label { - margin-right: 0; - } - - .commit { - display: block; - margin-top: 10px; - } - - .choose { - margin-top: 15px; - - .button { - margin-right: 0; - } - } - } - - .detail { - border-left: 2px solid var(--color-secondary); - - .author { - img { - margin-bottom: 3px; - } - } - - .download { - > a { - .svg { - margin-left: 5px; - margin-right: 5px; - } - } - - .list { - padding-left: 0; - - li { - list-style: none; - display: block; - padding: 8px; - border: 1px solid var(--color-secondary); - background: var(--color-light); - - a > .text.right { - margin-right: 5px; - } - } - - li + li { - border-top: 0; - } - - li:first-of-type { - border-radius: var(--border-radius) 0 0 var(--border-radius); - } - - li:last-of-type { - border-radius: 0 var(--border-radius) var(--border-radius) 0; - } - } - } - - .dot { - width: 10px; - height: 10px; - background-color: var(--color-secondary-dark-3); - z-index: 9; - position: absolute; - display: block; - left: -6px; - top: 40px; - border-radius: 100%; - border: 2.5px solid var(--color-body); - } - } - } - } - - #tags-table { - .tag { - padding: 8px 12px; - } - - .release-tag-name { - font-size: 18px; - font-weight: normal; - } - } - } - - &.new.release { - .target { - min-width: 500px; - - #tag-name { - margin-top: -4px; - } - - .at { - margin-left: -5px; - margin-right: 5px; - } - - .selection.dropdown { - padding-top: 10px; - padding-bottom: 10px; - } - } - - .prerelease.field { - margin-bottom: 0; - } - - .field { - - button, - input { - @media (max-width: 438px) { - width: 100%; - } - } - - button { - @media @mediaSm { - margin-bottom: 1em; - } - } - - .wrap_remove { - height: 38px; - } - - .attachment_edit { - width: 450px !important; - } - } - } - - &.forks { - .list { - margin-top: 0; - - .item { - padding-top: 10px; - padding-bottom: 10px; - border-bottom: 1px solid var(--color-secondary); - - .ui.avatar { - float: left; - margin-right: 5px; - } - - .link { - padding-top: 5px; - } - } - } - } - - &.packages { - .empty { - padding-top: 70px; - padding-bottom: 100px; - - .svg { - height: 48px; - } - } - - .file-size { - white-space: nowrap; - } - } - - &.wiki { - &.start { - .ui.segment { - padding-top: 70px; - padding-bottom: 100px; - - .svg { - height: 48px; - } - } - } - - &.new { - .ui.attached.tabular.menu.previewtabs { - margin-bottom: 15px; - } - } - - &.view { - > .markup { - padding: 15px 30px; - - h1, - h2, - h3, - h4, - h5, - h6 { - &:first-of-type { - margin-top: 0; - } - } - } - } - - .form .CodeMirror-scroll { - max-height: 85vh; - } - - @media @mediaSm { - .dividing.header .stackable.grid .button { - margin-top: 2px; - margin-bottom: 2px; - } - } - - @media @mediaSm { - #clone-panel #repo-clone-url { - width: 160px; - } - } - } - - &.settings { - &.collaboration { - .collaborator.list { - padding: 0; - - > .item { - margin: 0; - line-height: 2em; - - &:not(:last-child) { - border-bottom: 1px solid var(--color-secondary); - } - } - } - - #repo-collab-form { - #search-user-box { - .results { - left: 7px; - } - } - - .ui.button { - margin-left: 5px; - margin-top: -3px; - } - } - - #repo-collab-team-form { - #search-team-box { - .results { - left: 7px; - } - } - - .ui.button { - margin-left: 5px; - margin-top: -3px; - } - } - } - - &.branches { - .protected-branches { - .selection.dropdown { - width: 300px; - } - - .item { - border: 1px solid var(--color-secondary); - padding: 10px 15px; - - &:not(:last-child) { - border-bottom: 0; - } - } - } - - .branch-protection { - .help { - margin-left: 26px; - padding-top: 0; - } - - .fields { - margin-left: 20px; - display: block; - } - - .whitelist { - margin-left: 26px; - - .dropdown img { - display: inline-block; - } - } - } - } - - &.webhook { - .events { - .column { - padding-bottom: 0; - } - - .help { - font-size: 13px; - margin-left: 26px; - padding-top: 0; - } - } - } - } - - .ui.attached.isSigned.isWarning { - border-left: 1px solid var(--color-error-border); - border-right: 1px solid var(--color-error-border); - - &.top, - &.message { - border-top: 1px solid var(--color-error-border); - } - - &.message { - box-shadow: none; - background-color: var(--color-error-bg); - color: var(--color-error-text); - - .ui.text { - color: var(--color-error-text); - } - } - - &:last-child, - &.bottom { - border-bottom: 1px solid var(--color-error-border); - } - } - - .ui.attached.isSigned.isVerified { - border-left: 1px solid var(--color-success-border); - border-right: 1px solid var(--color-success-border); - - &.top, - &.message { - border-top: 1px solid var(--color-success-border); - } - - &.message { - box-shadow: none; - background-color: var(--color-success-bg); - color: var(--color-success-text); - - .pull-right { - color: var(--color-text); - } - - .ui.text { - color: var(--color-success-text); - } - } - - &:last-child, - &.bottom { - border-bottom: 1px solid var(--color-success-border); - } - } - - .ui.attached.isSigned.isVerifiedUntrusted, - .ui.attached.isSigned.isVerifiedUnmatched { - border-left: 1px solid var(--color-warning-border); - border-right: 1px solid var(--color-warning-border); - - &.top, - &.message { - border-top: 1px solid var(--color-warning-border); - } - - &.message { - box-shadow: none; - background-color: var(--color-warning-bg); - color: var(--color-warning-text); - - .ui.text { - color: var(--color-warning-text); - } - } - - &:last-child, - &.bottom { - border-bottom: 1px solid var(--color-warning-border); - } - } - - .ui.segment.sub-menu { - padding: 7px; - line-height: 0; - - .list { - width: 100%; - display: flex; - align-items: center; - - .item { - width: 100%; - color: var(--color-text); - - &:first-of-type { - border-radius: var(--border-radius) 0 0 var(--border-radius); - padding-left: .25rem; - } - - &:last-of-type { - border-radius: 0 var(--border-radius) var(--border-radius) 0; - padding-right: .25rem; - } - - a { - color: var(--color-text); - - &:hover { - color: var(--color-primary-light-2); - } - } - - &.active { - background: var(--color-secondary); - } - } - } - } - - .segment.reactions, - .select-reaction { - &.dropdown .menu { - right: 0 !important; - left: auto !important; - min-width: 15em; - - > .header { - margin: .75rem 0 .5rem; - } - - > .item { - float: left; - padding: .25rem !important; - margin: .25rem; - font-size: 1.5em; - width: 39px; - left: 13px; - border-radius: 6px; - display: flex; - justify-content: center; - align-items: center; - - img.emoji { - margin-right: 0; - } - } - - > .item:hover { - background: var(--color-primary); - } - } - } - - .segment.reactions { - padding: 0; - display: flex; - border: none !important; - border-top: 1px solid var(--color-secondary) !important; - width: 100% !important; - max-width: 100% !important; - margin: 0 !important; - - .ui.label { - max-height: 40px; - padding: 10px 18px !important; - display: flex !important; - align-items: center; - border: 0; - border-right: 1px solid; - border-radius: 0; - margin: 0; - font-size: 14px; - font-weight: normal; - border-color: var(--color-secondary) !important; - background: var(--color-reaction-bg); - - &.disabled { - cursor: default; - opacity: 1; - } - } - - .ui.label.basic { - color: var(--color-primary) !important; - } - - .ui.label.basic.primary { - background-color: var(--color-reaction-active-bg) !important; - border-color: var(--color-secondary) !important; - } - - .reaction-count { - margin-left: .5rem; - } - - .select-reaction { - display: flex; - align-items: center; - padding: 0 14px; - - &:not(.active) a { - display: none; - } - } - - &:hover .select-reaction a { - display: block; - } - } - - .ui.fluid.action.input { - .ui.search.action.input { - flex: auto; - } - } - - .repository-summary { - box-shadow: none !important; - - .segment.language-stats-details, - .segment.repository-summary { - border-top: none; - background: none; - } - - .segment.language-stats-details .item { - white-space: nowrap; - } - - .segment.language-stats { - &:extend(.unselectable); - padding: 0; - height: 11px; - display: flex; - white-space: nowrap; - width: 100%; - border-radius: 0; - - @media @mediaSm { - display: none; - } - - .bar { - white-space: nowrap; - border: 0; - padding: 0; - margin: 0; - height: 100%; - } - } - } - - .repository-menu { - padding: 0 !important; - } - - .repository-menu .item { - padding-top: 9px !important; - padding-bottom: 9px !important; - } -} - -// End of .repository - -#cite-repo-modal { - #citation-panel { - width: 500px; - - @media @mediaSm { - width: 100%; - } - - input { - border-radius: 0; - padding: 5px 10px; - width: 50%; - line-height: 1.4; - } - - .citation.button { - font-size: 13px; - padding: 7.5px 5px; - } - - #citation-copy-content { - border-radius: 0; - padding: 5px 10px; - font-size: 1.2em; - line-height: 1.4; - } - - #citation-copy-apa, - #citation-copy-bibtex { - border-right: none; - } - - #goto-citation-btn { - border-left: none; - } - - >:first-child { - border-radius: var(--border-radius) 0 0 var(--border-radius) !important; - } - - >:last-child { - border-radius: 0 var(--border-radius) var(--border-radius) 0 !important; - } - - .icon.button { - padding: 0 10px; - } - } -} - -&.user-cards { - .list { - padding: 0; - display: flex; - flex-wrap: wrap; - - .item { - list-style: none; - width: 32%; - margin: 10px 10px 10px 0; - padding-bottom: 14px; - float: left; - - .avatar { - width: 48px; - height: 48px; - float: left; - display: block; - margin-right: 10px; - } - - .name { - margin-top: 0; - margin-bottom: 0; - font-weight: normal; - } - - .meta { - margin-top: 5px; - } - } - } -} - -#search-repo-box, -#search-user-box { - .results { - .result { - img { - float: left; - margin-right: 8px; - width: 2em; - height: 2em; - } - - .content { - margin: 6px 0; - } - } - } -} - -#search-team-box { - .results { - .result { - .content { - margin: 6px 0; - } - } - } -} - -#issue-actions { - margin-top: -1rem !important; // counteract padding from Semantic -} - -.ui.menu .item > img:not(.ui) { - width: auto; -} - -.page.buttons { - padding-top: 15px; -} - -.commit-header-row { - min-height: 50px !important; - padding-top: 0 !important; - padding-bottom: 0 !important; -} - -.settings { - .content { - > .header, - .segment { - box-shadow: 0 1px 2px 0 var(--color-box-header); - } - } - - &.webhooks .list > .item:not(:first-child), - &.githooks .list > .item:not(:first-child), - &.runners .list > .item:not(:first-child) { - padding: .25rem 1rem; - margin: 12px -1rem -1rem; - } - - .list { - > .item { - &:not(:first-child) { - border-top: 1px solid var(--color-secondary); - padding: 1rem; - margin: 16px -1rem -1rem; - } - - > .svg { - display: table-cell; - } - - > .svg + .content { - display: table-cell; - padding: 0 0 0 .5em; - vertical-align: top; - } - - .info { - margin-top: 10px; - - .tab.segment { - border: 0; - padding: 10px 0 0; - } - } - } - - &.key { - .meta { - padding-top: 5px; - color: var(--color-text-light-2); - } - } - - &.email { - > .item:not(:first-child) { - min-height: 60px; - } - } - - &.collaborator { - > .item { - padding: 0; - } - } - } -} - -.ui.vertical.menu { - .header.item { - font-size: 1.1em; - background: var(--color-box-header); - } -} - -.comment:target .comment-container { - border-color: var(--color-primary) !important; - box-shadow: 0 0 0 3px var(--color-primary-alpha-30) !important; -} - -.comment:target .header::before { - border-right-color: var(--color-primary) !important; - filter: drop-shadow(-3px 0 0 var(--color-primary-alpha-30)) !important; -} - -.code-comment:target { - border-color: var(--color-primary) !important; - border-radius: var(--border-radius) !important; - box-shadow: 0 0 0 3px var(--color-primary-alpha-30) !important; -} - -.code-comment:target .content { - box-shadow: none !important; -} - -.comment-header { - #avatar-arrow(); - border: none !important; - background: var(--color-box-header); - border-bottom: 1px solid var(--color-secondary) !important; - font-weight: normal !important; - padding: .5rem 1rem; - margin: 0 !important; - position: relative; - color: var(--color-text-light-2); - min-height: 41px; - background-color: var(--color-box-header); - display: flex; - justify-content: space-between; - align-items: center; - - &.arrow-top::before, - &.arrow-top::after { - transform: rotate(90deg); - } - - &.arrow-top::before { - top: -9px; - left: 6px; - } - - &.arrow-top::after { - top: -8px; - left: 7px; - } - - a { - color: var(--color-text); - } - - a:hover { - color: var(--color-primary); - } -} - -.comment-header .actions a { - margin-right: 0 !important; - padding: .5rem !important; -} - -.comment-header-left > * + *, -.comment-header-right > * + * { - margin-left: .25rem; -} - -.comment-body { - background: var(--color-box-body); - border: none !important; - width: 100% !important; - max-width: 100% !important; - margin: 0 !important; -} - -.edit-label.modal, -.new-label.modal { - .form { - .column { - padding-right: 0; - } - - .buttons { - margin-left: auto; - padding-top: 15px; - } - - .color.picker.column { - display: flex; - .minicolors { - flex: 1; - } - } - - .minicolors-swatch.minicolors-sprite { - top: 10px; - left: 10px; - width: 15px; - height: 15px; - } - } -} - -#avatar-arrow { - &::before, - &::after { - right: 100%; - top: 20px; - border: solid transparent; - content: " "; - height: 0; - width: 0; - position: absolute; - pointer-events: none; - } - - &::before { - border-right-color: var(--color-secondary); - border-width: 9px; - margin-top: -9px; - } - - &::after { - border-right-color: var(--color-box-header); - border-width: 8px; - margin-top: -8px; - } -} - -#transfer-repo-modal, -#delete-repo-modal, -#delete-wiki-modal, -#convert-fork-repo-modal, -#convert-mirror-repo-modal, -#fork-repo-modal { - .ui.message { - width: 100% !important; - } -} - -// generate .tab-size-{i} from 1 to 16 -.generate-tab-size(16); - -.generate-tab-size(@n, @i: 1) when (@i =< @n) { - .tab-size-@{i} { - tab-size: @i !important; - -moz-tab-size: @i !important; - } - - .generate-tab-size(@n, (@i + 1)); -} - -.stats-table { - display: table; - width: 100%; - - .table-cell { - display: table-cell; - - &.tiny { - height: .5em; - } - } -} - -.labels-list .label { - margin: 2px 0; - display: inline-flex !important; - line-height: 1.3em; // there is a `font-size: 1.25em` for inside emoji, so here the line-height needs to be larger slightly -} - -// Scoped labels with different colors on left and right -.scope-parent { - background: none !important; - padding: 0 !important; -} - -.ui.label.scope-left { - border-bottom-right-radius: 0; - border-top-right-radius: 0; - margin-right: 0; -} - -.ui.label.scope-right { - border-bottom-left-radius: 0; - border-top-left-radius: 0; - margin-left: 0; -} - -.repo-button-row { - margin-bottom: 10px; -} - -.repo-button-row > * { - margin-top: 8px; -} - -.wiki .repo-button-row { - margin-bottom: 0; -} - -.wiki .repo-button-row > * { - margin-top: 0; -} - -.repo-button-row .button { - padding: 6px 10px !important; - height: 30px; -} - -.repo-button-row input { - height: 30px; -} - -tbody.commit-list { - vertical-align: baseline; -} - -.message-wrapper, -.author-wrapper { - overflow: hidden; - text-overflow: ellipsis; - max-width: calc(100% - 50px); - display: inline-block; - vertical-align: middle; -} - -.author-wrapper { - max-width: 180px; -} - -// in the commit list, messages can wrap so we can use inline -.commit-list .message-wrapper { - display: inline; -} - -// but in the repo-files-table we cannot -#repo-files-table .commit-list .message-wrapper { - display: inline-block; -} - -@media @mediaSm { - tr.commit-list { - width: 100%; - } - - th .message-wrapper { - display: block; - max-width: calc(100vw - 70px); - } - - .author-wrapper { - max-width: 80px; - } -} - -@media @mediaMd { - tr.commit-list { - width: 723px; - } - - th .message-wrapper { - max-width: 120px; - } -} - -@media @mediaLg { - tr.commit-list { - width: 933px; - } - - th .message-wrapper { - max-width: 350px; - } -} - -@media @mediaXl { - tr.commit-list { - width: 1127px; - } - - th .message-wrapper { - max-width: 525px; - } -} - -.commit-list .commit-status-link { - display: inline-block; - vertical-align: middle; -} - -.commit-body { - white-space: pre-wrap; - line-height: initial; -} - -.repository:not(.diff) { - .commit-body { // commit history list - margin: 0; - } - - .timeline-item .commit-body { // PR-comment - margin-left: 40px; - } -} - -.git-notes.top { - text-align: left; -} - -.comment-diff-data { - background: var(--color-code-bg); - max-height: calc(100vh - 10.5rem); - overflow-y: auto; -} - -.comment-diff-data pre { - line-height: 18px; - white-space: pre-wrap; - word-break: break-all; - overflow-wrap: break-word; -} - -.content-history-detail-dialog .header .avatar { - position: relative; - top: -2px; -} - -#topic_edit { - margin-top: 5px; -} - -#repo-topics { - margin-top: 5px; - display: flex; - align-items: center; - flex-wrap: wrap; -} - -.repo-topic { - font-weight: normal !important; - cursor: pointer; - margin: 2px !important; -} - -#new-dependency-drop-list { - &.ui.selection.dropdown { - min-width: 0; - width: 100%; - border-radius: 4px 0 0 4px; - border-right: 0; - white-space: nowrap; - } - - .text { - width: 100%; - overflow: hidden; - } -} - -#manage_topic { - font-size: 12px; -} - -.label + #manage_topic { - margin-left: 5px; -} - -.ui.small.label.topic { - margin-bottom: 4px; -} - -.repo-header { - display: flex; - align-items: center; - justify-content: space-between; - flex-wrap: wrap; - word-break: break-word; - - @media @mediaSm { - + .container { - margin-top: 7px; - } - } -} - -.repo-buttons { - align-items: center; - display: flex; - flex-direction: row; - flex-wrap: wrap; - word-break: keep-all; - - @media @mediaSm { - margin-top: 1em; - } -} - -.repo-buttons .ui.labeled.button > .label:hover { - color: var(--color-primary-light-2); - background: var(--color-light); -} - -.label-mimic-enabled() { - color: var(--color-text-dark); - background: var(--color-light-mimic-enabled) !important; - - &:hover { - color: var(--color-primary-dark-1); - } -} - -.repo-buttons button[disabled] ~ .label { - opacity: var(--opacity-disabled); - .label-mimic-enabled(); -} - -.repo-buttons .ui.labeled.button { - cursor: initial; - - > .label { - border-left: 0 !important; - margin: 0 !important; - } - - &.disabled { - pointer-events: inherit !important; - - > .label { - .label-mimic-enabled(); - } - - > .button { - pointer-events: none !important; - } - } - @media @mediaSm { - .svg { - display: none; - } - } -} - -.tag-code { - height: 28px; -} - -.tag-code, -.tag-code td, -.tag-code .blob-excerpt { - background-color: var(--color-box-body-highlight); - vertical-align: middle; -} - -.resolved-placeholder { - font-weight: normal !important; - border: 1px solid var(--color-secondary) !important; - border-radius: var(--border-radius) !important; - margin: 4px !important; -} - -.resolved-placeholder + .comment-code-cloud { - padding-top: 0 !important; -} - -td.blob-excerpt { - background-color: var(--color-secondary-alpha-30); -} - -.issue-keyword { - border-bottom: 1px dotted var(--color-text-light-3) !important; -} - -.issue-keyword:hover { - border-bottom: none !important; -} - -.file-header { - align-items: center; - display: flex; - justify-content: space-between; - overflow-x: auto; - padding: 6px 12px !important; - font-size: 13px !important; -} - -.file-info { - display: flex; - align-items: center; -} - -.file-info-entry { - display: flex; - align-items: center; - width: max-content; -} - -.file-info-entry + .file-info-entry { - border-left: 1px solid currentcolor; - margin-left: 8px; - padding-left: 8px; -} - -#diff-container { - display: flex; -} -#diff-file-boxes { - flex: 1; - max-width: 100%; -} - -#diff-file-tree { - width: 20%; - max-width: 380px; - line-height: inherit; - position: sticky; - padding-top: 0; - top: 47px; - max-height: calc(100vh - 50px); - height: 100%; - overflow-y: auto; -} - -@media @mediaMdAndDown { - #diff-file-tree { - display: none !important; - } - - .diff-toggle-file-tree-button { - display: none !important; - } -} - -.ui.message.unicode-escape-prompt { - margin-bottom: 0; - border-radius: 0; - display: flex; - flex-direction: column; -} - -.wiki-content-sidebar .ui.message.unicode-escape-prompt, -.wiki-content-footer .ui.message.unicode-escape-prompt { - p { - display: none; - } -} - -.wiki-content-toc { - > ul > li { - margin-bottom: 4px; - } - - ul { - margin: 0; - list-style: none; - padding-left: 1em; - } -} - -/* fomantic's last-child selector does not work with hidden last child */ -.ui.buttons .unescape-button { - border-top-right-radius: .28571429rem; - border-bottom-right-radius: .28571429rem; -} - -.webhook-info { - padding: 7px 12px; - margin: 10px 0; - background-color: var(--color-markup-code-block); - border: 1px solid var(--color-secondary); - border-radius: 3px; - font-size: 13px; - line-height: 1.5; - overflow: auto; -} - -.title_wip_desc { - margin-top: 1em; -} - -.sidebar-item-link { - align-items: center; - word-break: break-all; -} - -.diff-file-box[data-folded="true"] .diff-file-body { - display: none; -} - -.diff-file-box[data-folded="true"] .diff-file-header { - border-radius: var(--border-radius) !important; -} - -.diff-file-header-actions > * + * { - margin-left: .5rem !important; -} - -.ui.attached.header.diff-file-header { - &.sticky-2nd-row { - position: sticky; - top: 77px; - z-index: 7; - - @media (max-width: 480px) { - position: static; - } - } - - .diff-file-header-actions { - flex-shrink: 0; - } - - .diff-file-name { - flex: auto; - min-width: 100px; - } -} - -.diff-file-body { - overflow-x: scroll; -} - -.diff-stats-bar { - display: inline-block; - background-color: var(--color-red); - height: 12px; - width: 40px; - - .diff-stats-add-bar { - background-color: var(--color-green); - height: 100%; - } -} - -/* prevent page shaking on language bar click */ -.repository-summary-language-stats { - height: 48px; - overflow: hidden; - - @media @mediaSm { - height: auto; - } -} - -.ui.form .right .ui.button { - margin-left: .25em; - margin-right: 0; -} - -.removed-code { - background: var(--color-diff-removed-word-bg); -} - -.added-code { - background: var(--color-diff-added-word-bg); -} - -.code-diff-unified .del-code, -.code-diff-unified .del-code td, -.code-diff-split .del-code .lines-num-old, -.code-diff-split .del-code .lines-escape-old, -.code-diff-split .del-code .lines-type-marker-old, -.code-diff-split .del-code .lines-code-old { - background: var(--color-diff-removed-row-bg); - border-color: var(--color-diff-removed-row-border); -} - -.code-diff-unified .add-code, -.code-diff-unified .add-code td, -.code-diff-split .add-code .lines-num-new, -.code-diff-split .add-code .lines-type-marker-new, -.code-diff-split .add-code .lines-escape-new, -.code-diff-split .add-code .lines-code-new, -.code-diff-split .del-code .add-code.lines-num-new, -.code-diff-split .del-code .add-code.lines-type-marker-new, -.code-diff-split .del-code .add-code.lines-escape-new, -.code-diff-split .del-code .add-code.lines-code-new { - background: var(--color-diff-added-row-bg); - border-color: var(--color-diff-added-row-border); -} - -.code-diff-split .del-code .lines-num-new, -.code-diff-split .del-code .lines-type-marker-new, -.code-diff-split .del-code .lines-code-new, -.code-diff-split .del-code .lines-escape-new, -.code-diff-split .add-code .lines-num-old, -.code-diff-split .add-code .lines-escape-old, -.code-diff-split .add-code .lines-type-marker-old, -.code-diff-split .add-code .lines-code-old { - background: var(--color-diff-inactive); -} - -.code-diff-split tbody tr td:nth-child(5), -.code-diff-split tbody tr td.add-comment-right { - border-left: 1px solid var(--color-secondary); -} - -.repository .ui.menu.new-menu { - background: none !important; - - @media @mediaLgAndDown { - &::after { - background: none !important; - } - } -} - -.repository.migrate .card { - transition: all .1s ease-in-out; - box-shadow: none !important; - border: 1px solid var(--color-secondary); - color: var(--color-text); -} - -.repository.migrate .card:hover { - transform: scale(105%); - box-shadow: 0 .5rem 1rem var(--color-shadow) !important; -} - -@media @mediaSm { - .repository.file.list { - #repo-files-table { - .entry, - .commit-list { - align-items: center; - display: flex !important; - padding-top: 4px; - padding-bottom: 4px; - - td.age, - th.age { - margin-left: auto; - } - - td.message, - span.commit-summary { - display: none !important; - } - } - } - } - .issue-list-headers.ui[class].grid { - > div:nth-child(1) { - order: 1; - width: 50%; - } - - > div:nth-child(2) { - order: 3; - width: 100%; - } - - > div.column:not(.row):nth-child(3) { - order: 2; - width: 50%; - } - } - - .repository.view.issue .comment-list { - .timeline, - .timeline-item { - margin-left: 0; - } - - .timeline { - &::before { - left: 14px; - } - - .inline-timeline-avatar { - display: flex; - margin-bottom: auto; - - img.avatar { - height: 24px; - width: 24px; - } - } - - .comment-header { - &::before, - &::after { - content: unset; - } - - padding-left: 4px; - } - - /* Don't show the general avatar, we show the inline avatar on mobile. - * And don't show the role labels, there's no place for that. */ - .timeline-avatar, - .comment-header-right .role-label { - display: none; - } - } - } - .commit-header-row { - .ui.horizontal.list { - width: 100%; - overflow-x: auto; - margin-top: 2px; - - .item { - align-items: center; - display: flex; - } - } - - .author { - padding: 3px 0; - } - } - - .commit-header h3 { - flex-basis: auto !important; - margin-bottom: .5rem !important; - } - - .commits-table { - flex-direction: column; - - .commits-table-left { - align-items: initial !important; - margin-bottom: 6px; - } - - .commits-table-right form { - display: flex; - flex-wrap: wrap; - - > div:nth-child(1) { - order: 1; - } - - > div:nth-child(2) { - order: 3; - margin-left: .5rem; - margin-top: .5rem; - } - - > button:nth-child(3) { - order: 2; - margin-left: .25rem; - } - } - } - - .commit-table { - overflow-x: auto; - - td.sha, - th.sha { - display: none !important; - } - - .commit-list { - span.message-wrapper { - max-width: none; - } - - tr td:last-child { - display: block; - width: max-content; - } - - td.author { - display: block; - width: calc(100% + .5rem); - } - - .copy-commit-sha { - display: none !important; - } - } - } - - .comment-header { - flex-wrap: wrap; - - .comment-header-left { - flex-wrap: wrap; - } - - .comment-header-right { - margin-left: auto; - } - } -} - -.branch-dropdown-button { - max-width: 340px; - vertical-align: bottom !important; - - @media @mediaMd { - max-width: 185px; - } - @media @mediaSm { - max-width: 165px; - } -} - -.pr-status { - padding: 0 !important; // To clear fomantic's padding on .ui.segment elements - display: flex; - align-items: center; - - .commit-status { - margin: 1em; - flex-shrink: 0; - } - - .status-context { - display: flex; - justify-content: space-between; - width: 100%; - - > span { - padding: 1em 0; - } - } - - .status-details { - display: flex; - padding-right: .5em; - align-items: center; - justify-content: flex-end; - - @media @mediaSm { - flex-direction: column; - align-items: flex-end; - justify-content: center; - } - - > span { - padding-right: .5em; // To match the alignment with the "required" label - } - } -}