mirror of
				https://github.com/go-gitea/gitea
				synced 2025-10-28 01:48:25 +00:00 
			
		
		
		
	* Support unicode emojis and remove emojify.js This PR replaces all use of emojify.js and adds unicode emoji support to various areas of gitea. This works in a few ways: First it adds emoji parsing support into gitea itself. This allows us to * Render emojis from valid alias (😄) * Detect unicode emojis and let us put them in their own class with proper aria-labels and styling * Easily allow for custom "emoji" * Support all emoji rendering and features without javascript * Uses plain unicode and lets the system render in appropriate emoji font * Doesn't leave us relying on external sources for updates/fixes/features That same list of emoji is also used to create a json file which replaces the part of emojify.js that populates the emoji search tribute. This file is about 35KB with GZIP turned on and I've set it to load after the page renders to not hinder page load time (and this removes loading emojify.js also) For custom "emoji" it uses a pretty simple scheme of just looking for /emojis/img/name.png where name is something a user has put in the "allowed reactions" setting we already have. The gitea reaction that was previously hard coded into a forked copy of emojify.js is included and works as a custom reaction under this method. The emoji data sourced here is from https://github.com/github/gemoji which is the gem library Github uses for their emoji rendering (and a data source for other sites). So we should be able to easily render any emoji and :alias: that Github can, removing any errors from migrated content. They also update it as well, so we can sync when there are new unicode emoji lists released. I've included a slimmed down and slightly modified forked copy of https://github.com/knq/emoji to make up our own emoji module. The code is pretty straight forward and again allows us to have a lot of flexibility in what happens. I had seen a few comments about performance in some of the other threads if we render this ourselves, but there doesn't seem to be any issue here. In a test it can parse, convert, and render 1,000 emojis inside of a large markdown table in about 100ms on my laptop (which is many more emojis than will ever be in any normal issue). This also prevents any flickering and other weirdness from using javascript to render some things while using go for others. Not included here are image fall back URLS. I don't really think they are necessary for anything new being written in 2020. However, managing the emoji ourselves would allow us to add these as a feature later on if it seems necessary. Fixes: https://github.com/go-gitea/gitea/issues/9182 Fixes: https://github.com/go-gitea/gitea/issues/8974 Fixes: https://github.com/go-gitea/gitea/issues/8953 Fixes: https://github.com/go-gitea/gitea/issues/6628 Fixes: https://github.com/go-gitea/gitea/issues/5130 * add new shared function emojiHTML * don't increase emoji size in issue title * Update templates/repo/issue/view_content/add_reaction.tmpl Co-Authored-By: 6543 <6543@obermui.de> * Support for emoji rendering in various templates * Render code and review comments as they should be * Better way to handle mail subjects * insert unicode from tribute selection * Add template helper for plain text when needed * Use existing replace function I forgot about * Don't include emoji greater than Unicode Version 12 Only include emoji and aliases in JSON * Update build/generate-emoji.go * Tweak regex slightly to really match everything including random invisible characters. Run tests for every emoji we have * final updates * code review * code review * hard code gitea custom emoji to match previous behavior * Update .eslintrc Co-Authored-By: silverwind <me@silverwind.io> * disable preempt Co-authored-by: silverwind <me@silverwind.io> Co-authored-by: 6543 <6543@obermui.de> Co-authored-by: Lauris BH <lauris@nix.lv> Co-authored-by: guillep2k <18600385+guillep2k@users.noreply.github.com>
		
			
				
	
	
		
			2868 lines
		
	
	
		
			63 KiB
		
	
	
	
		
			Plaintext
		
	
	
	
	
	
			
		
		
	
	
			2868 lines
		
	
	
		
			63 KiB
		
	
	
	
		
			Plaintext
		
	
	
	
	
	
| .repository {
 | |
| 
 | |
|     padding-top: 15px;
 | |
| 
 | |
|     .repo-header {
 | |
|         .ui.compact.menu {
 | |
|             margin-left: 1rem;
 | |
|         }
 | |
| 
 | |
|         .ui.header {
 | |
|             margin-top: 0;
 | |
|         }
 | |
| 
 | |
|         .ui.huge.breadcrumb {
 | |
|             font-weight: 400;
 | |
|             font-size: 1.5rem;
 | |
| 
 | |
|             svg {
 | |
|                 position: relative;
 | |
|                 top: 5px;
 | |
|             }
 | |
| 
 | |
|             svg.octicon-lock {
 | |
|                 margin-left: 5px;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .fork-flag {
 | |
|             margin-left: 36px;
 | |
|             margin-top: 3px;
 | |
|             display: block;
 | |
|             font-size: 12px;
 | |
|             white-space: nowrap;
 | |
|         }
 | |
| 
 | |
|         .svg.octicon-repo-forked {
 | |
|             margin-top: -1px;
 | |
|         }
 | |
| 
 | |
|         .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;
 | |
|     }
 | |
| 
 | |
|     #file-buttons {
 | |
|         /* The reason for the !important is that Semantic itself has
 | |
|         margin-left: 0 !important on right items on mobile, which is mostly
 | |
|         to make sure elements which on menus would otherwise be on the right
 | |
|         align correctly with other elements when stacked.
 | |
|         Unfortunately, this brings some weird alignment on this particular
 | |
|         element, so we need to override it. */
 | |
|         margin-left: auto !important;
 | |
|         font-weight: normal;
 | |
| 
 | |
|         .ui.button {
 | |
|             padding: 8px 10px;
 | |
|             font-weight: normal;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .metas {
 | |
|         .menu {
 | |
|             overflow-x: auto;
 | |
|             max-height: 300px;
 | |
|         }
 | |
| 
 | |
|         .ui.list {
 | |
|             .hide {
 | |
|                 display: none !important;
 | |
|             }
 | |
| 
 | |
|             .item {
 | |
|                 padding: 0;
 | |
|             }
 | |
| 
 | |
|             .label.color {
 | |
|                 padding: 0 8px;
 | |
|                 margin-right: 5px;
 | |
|             }
 | |
| 
 | |
|             a {
 | |
|                 margin: 2px 0;
 | |
| 
 | |
|                 .text {
 | |
|                     color: #444444;
 | |
| 
 | |
|                     &:hover {
 | |
|                         color: #000000;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         #deadlineForm input {
 | |
|             width: 12.8rem;
 | |
|             border-radius: 4px 0 0 4px;
 | |
|             border-right: 0;
 | |
|             white-space: nowrap;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .header-wrapper {
 | |
|         background-color: #fafafa;
 | |
|         margin-top: -15px;
 | |
|         padding-top: 15px;
 | |
| 
 | |
|         .ui.tabs.divider {
 | |
|             border-bottom: 0;
 | |
|         }
 | |
| 
 | |
|         .ui.tabular .svg {
 | |
|             margin-right: 5px;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .filter.menu {
 | |
|         .label.color {
 | |
|             border-radius: 3px;
 | |
|             margin-left: 15px;
 | |
|             padding: 0 8px;
 | |
|         }
 | |
| 
 | |
|         .svg {
 | |
|             float: left;
 | |
|             margin: 0 -7px 0 -5px;
 | |
|             width: 16px;
 | |
|         }
 | |
| 
 | |
|         &.labels .svg {
 | |
|             margin: -2px -7px 0 -5px;
 | |
|         }
 | |
| 
 | |
|         &.labels {
 | |
|             .label-filter .menu .info {
 | |
|                 display: inline-block;
 | |
|                 padding: .5rem .25rem;
 | |
|                 border-bottom: 1px solid #cccccc;
 | |
|                 font-size: 12px;
 | |
|                 width: 100%;
 | |
|                 white-space: nowrap;
 | |
|                 text-align: center;
 | |
| 
 | |
|                 code {
 | |
|                     border: 1px solid #cccccc;
 | |
|                     border-radius: 3px;
 | |
|                     padding: 1px 2px;
 | |
|                     font-size: 11px;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .text {
 | |
|             margin-left: .9em;
 | |
|         }
 | |
| 
 | |
|         .menu {
 | |
|             max-height: 300px;
 | |
|             overflow-x: auto;
 | |
|             right: 0 !important;
 | |
|             left: auto !important;
 | |
|         }
 | |
| 
 | |
|         .dropdown.item {
 | |
|             margin: 1px;
 | |
|             padding-right: 0;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .select-label {
 | |
|         .desc {
 | |
|             padding-left: 16px;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .ui.tabs {
 | |
|         &.container {
 | |
|             margin-top: 14px;
 | |
|             margin-bottom: 0;
 | |
| 
 | |
|             .ui.menu {
 | |
|                 border-bottom: 0;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &.divider {
 | |
|             margin-top: 0;
 | |
|             margin-bottom: 20px;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     #clone-panel {
 | |
|         width: 350px;
 | |
| 
 | |
|         @media only screen and (max-width: 768px) {
 | |
|             width: 100%;
 | |
|         }
 | |
| 
 | |
|         input {
 | |
|             border-radius: 0;
 | |
|             padding: 5px 10px;
 | |
|             width: 50%;
 | |
|         }
 | |
| 
 | |
|         .clone.button {
 | |
|             font-size: 13px;
 | |
|             padding: 0 5px;
 | |
| 
 | |
|             &:first-child {
 | |
|                 border-radius: .28571429rem 0 0 .28571429rem;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .icon.button {
 | |
|             padding: 0 10px;
 | |
|         }
 | |
| 
 | |
|         .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;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         #file-buttons {
 | |
|             font-weight: normal;
 | |
| 
 | |
|             .ui.button {
 | |
|                 padding: 8px 10px;
 | |
|                 font-weight: normal;
 | |
|             }
 | |
| 
 | |
|             .ui.tiny.blue.buttons {
 | |
|                 @media only screen and (max-width: 768px) {
 | |
|                     width: 100%;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         #repo-files-table {
 | |
|             thead {
 | |
|                 th {
 | |
|                     padding-top: 8px;
 | |
|                     padding-bottom: 5px;
 | |
|                     font-weight: normal;
 | |
|                 }
 | |
| 
 | |
|                 .ui.avatar {
 | |
|                     margin-bottom: 5px;
 | |
|                 }
 | |
| 
 | |
|                 .commit-summary a {
 | |
|                     text-decoration: underline;
 | |
|                     text-decoration-style: dashed;
 | |
| 
 | |
|                     &:hover {
 | |
|                         text-decoration-style: solid;
 | |
|                     }
 | |
| 
 | |
|                     &.default-link {
 | |
|                         text-decoration: none;
 | |
| 
 | |
|                         &:hover {
 | |
|                             text-decoration: underline;
 | |
|                             text-decoration-style: solid;
 | |
|                         }
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             tbody {
 | |
|                 .svg {
 | |
|                     margin-left: 3px;
 | |
|                     margin-right: 5px;
 | |
|                     color: #777777;
 | |
| 
 | |
|                     &.octicon-mail-reply {
 | |
|                         margin-right: 10px;
 | |
|                     }
 | |
| 
 | |
|                     &.octicon-file-directory,
 | |
|                     &.octicon-file-submodule,
 | |
|                     &.octicon-file-symlink-directory {
 | |
|                         color: #1e70bf;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             td {
 | |
|                 padding-top: 8px;
 | |
|                 padding-bottom: 8px;
 | |
|                 overflow: initial;
 | |
| 
 | |
|                 &.name {
 | |
|                     max-width: 150px;
 | |
|                 }
 | |
| 
 | |
|                 &.message {
 | |
|                     max-width: 400px;
 | |
|                 }
 | |
| 
 | |
|                 &.age {
 | |
|                     width: 120px;
 | |
|                 }
 | |
| 
 | |
|                 .truncate {
 | |
|                     display: inline-block;
 | |
|                     max-width: 100%;
 | |
|                     overflow: hidden;
 | |
|                     text-overflow: ellipsis;
 | |
|                     vertical-align: top;
 | |
|                     white-space: nowrap;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             td.message .isSigned {
 | |
|                 cursor: default;
 | |
|             }
 | |
| 
 | |
|             tr:hover {
 | |
|                 background-color: #ffffee;
 | |
|             }
 | |
| 
 | |
|             .jumpable-path {
 | |
|                 color: #888888;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .non-diff-file-content {
 | |
|             .header {
 | |
|                 .icon {
 | |
|                     font-size: 1em;
 | |
|                 }
 | |
| 
 | |
|                 .small.icon {
 | |
|                     font-size: .75em;
 | |
|                 }
 | |
| 
 | |
|                 .tiny.icon {
 | |
|                     font-size: .5em;
 | |
|                 }
 | |
| 
 | |
|                 .file-actions {
 | |
|                     margin-bottom: -5px;
 | |
| 
 | |
|                     .btn-octicon {
 | |
|                         display: inline-block;
 | |
|                         padding: 5px;
 | |
|                         margin-left: 5px;
 | |
|                         line-height: 1;
 | |
|                         color: #767676;
 | |
|                         vertical-align: middle;
 | |
|                         background: transparent;
 | |
|                         border: 0;
 | |
|                         outline: none;
 | |
|                     }
 | |
| 
 | |
|                     .btn-octicon:hover {
 | |
|                         color: #4078c0;
 | |
|                     }
 | |
| 
 | |
|                     .btn-octicon-danger:hover {
 | |
|                         color: #bd2c00;
 | |
|                     }
 | |
| 
 | |
|                     .btn-octicon.disabled {
 | |
|                         color: #bbbbbb;
 | |
|                         cursor: default;
 | |
|                     }
 | |
| 
 | |
|                     #delete-file-form {
 | |
|                         display: inline-block;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .view-raw {
 | |
|                 padding: 5px;
 | |
| 
 | |
|                 * {
 | |
|                     max-width: 100%;
 | |
|                 }
 | |
| 
 | |
|                 img {
 | |
|                     padding: 5px 5px 0 5px;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .plain-text {
 | |
|                 padding: 1em 2em 1em 2em;
 | |
| 
 | |
|                 pre {
 | |
|                     word-break: break-word;
 | |
|                     white-space: pre-wrap;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .csv {
 | |
|                 overflow-x: auto;
 | |
|                 padding: 0 !important;
 | |
|             }
 | |
| 
 | |
|             pre {
 | |
|                 overflow: auto;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .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 #dddddd;
 | |
|                 border-radius: 3px;
 | |
|                 #avatar-arrow;
 | |
| 
 | |
|                 &:after {
 | |
|                     border-right-color: #ffffff;
 | |
|                 }
 | |
| 
 | |
|                 .quick-pull-choice {
 | |
|                     .branch-name {
 | |
|                         display: inline-block;
 | |
|                         padding: 3px 6px;
 | |
|                         font: 12px @monospaced-fonts, monospace;
 | |
|                         color: rgba(0, 0, 0, .65);
 | |
|                         background-color: rgba(209, 227, 237, .45);
 | |
|                         border-radius: 3px;
 | |
|                     }
 | |
| 
 | |
|                     .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: #b0c4ce;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     &.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: #ffffff;
 | |
|                 }
 | |
| 
 | |
|                 .markdown {
 | |
|                     font-size: 14px;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .metas {
 | |
|                 min-width: 220px;
 | |
| 
 | |
|                 .filter.menu {
 | |
|                     max-height: 300px;
 | |
|                     overflow-x: auto;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     &.view.issue {
 | |
|         .title {
 | |
|             padding-bottom: 0 !important;
 | |
| 
 | |
|             h1 {
 | |
|                 font-weight: 300;
 | |
|                 font-size: 2.3rem;
 | |
|                 margin-bottom: 5px;
 | |
| 
 | |
|                 .ui.input {
 | |
|                     font-size: .5em;
 | |
|                     vertical-align: top;
 | |
|                     width: 50%;
 | |
|                     min-width: 600px;
 | |
| 
 | |
|                     input {
 | |
|                         font-size: 1.5em;
 | |
|                         padding: 6px 10px;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .index {
 | |
|                 font-weight: 300;
 | |
|                 color: #aaaaaa;
 | |
|                 letter-spacing: -1px;
 | |
|             }
 | |
| 
 | |
|             .label {
 | |
|                 margin-right: 10px;
 | |
|             }
 | |
| 
 | |
|             .edit-zone {
 | |
|                 margin-top: 10px;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .pull-desc {
 | |
|             code {
 | |
|                 color: #0166e6;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .pull {
 | |
|             &.tabular.menu {
 | |
|                 margin-bottom: 10px;
 | |
| 
 | |
|                 .svg {
 | |
|                     margin-right: 5px;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             &.tab.segment {
 | |
|                 border: 0;
 | |
|                 padding: 10px 0 0;
 | |
|                 box-shadow: none;
 | |
|                 background-color: inherit;
 | |
|             }
 | |
| 
 | |
|             .merge.box {
 | |
|                 .avatar {
 | |
|                     margin-left: 10px;
 | |
|                     margin-top: 10px;
 | |
|                 }
 | |
|                 .icon-octicon {
 | |
|                     padding-left: 2px;
 | |
|                 }
 | |
|                 .branch-update.grid {
 | |
|                     .row {
 | |
|                         padding-bottom: 0;
 | |
|                         .icon {
 | |
|                             margin-top: 1.1rem;
 | |
|                         }
 | |
|                         .ui.button {
 | |
|                             margin-bottom: 1rem;
 | |
|                         }
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .review-item {
 | |
| 
 | |
|                 .avatar,
 | |
|                 .type-icon {
 | |
|                     float: none;
 | |
|                     display: inline-block;
 | |
|                     text-align: center;
 | |
|                     vertical-align: middle;
 | |
| 
 | |
|                     .svg {
 | |
|                         width: 23px;
 | |
|                         height: 23px;
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 .text {
 | |
|                     margin: .3em 0 .5em .5em;
 | |
|                 }
 | |
| 
 | |
|                 .type-icon {
 | |
|                     float: right;
 | |
|                     margin-right: 1em;
 | |
|                 }
 | |
| 
 | |
|                 .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: #f3f3f3;
 | |
|                 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: #f3f3f3;
 | |
|                     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: -72px;
 | |
|                     img {
 | |
|                         width: 40px;
 | |
|                         height: 40px;
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 &:first-child {
 | |
|                     padding-top: 0 !important;
 | |
|                 }
 | |
| 
 | |
|                 &:last-child {
 | |
|                     padding-bottom: 0 !important;
 | |
|                 }
 | |
| 
 | |
|                 .badge {
 | |
|                     width: 32px;
 | |
|                     height: 32px;
 | |
|                     background-color: #fff;
 | |
|                     border: 2px solid #eee;
 | |
|                     border-radius: 50%;
 | |
|                     display: flex;
 | |
|                     float: left;
 | |
|                     margin-left: -32px;
 | |
|                     margin-top: -1px;
 | |
|                     margin-right: 8px;
 | |
|                     color: #444;
 | |
| 
 | |
|                     .svg {
 | |
|                         width: 28px;
 | |
|                         height: 28px;
 | |
|                         text-align: center;
 | |
|                         line-height: 28px;
 | |
|                         padding: 4px;
 | |
| 
 | |
|                         &.octicon-circle-slash {
 | |
|                             color: #bd2c00;
 | |
|                         }
 | |
| 
 | |
|                         &.octicon-primitive-dot {
 | |
|                             color: #6cc644;
 | |
|                         }
 | |
| 
 | |
|                         &.octicon-comment {
 | |
|                             margin-top: 2px;
 | |
|                         }
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 &.comment > .content {
 | |
|                     margin-left: -16px;
 | |
|                 }
 | |
| 
 | |
|                 &.event > .text {
 | |
|                     line-height: 30px;
 | |
|                 }
 | |
| 
 | |
|                 .author {
 | |
|                     font-weight: 700;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .comment {
 | |
| 
 | |
|                 .tag {
 | |
|                     color: #767676;
 | |
|                     margin-top: 3px;
 | |
|                     padding: 2px 5px;
 | |
|                     font-size: 12px;
 | |
|                     border: 1px solid rgba(0, 0, 0, .1);
 | |
|                     border-radius: 3px;
 | |
|                     &.review {
 | |
|                         margin-left: 5px;
 | |
|                         &.pending {
 | |
|                             color: black;
 | |
|                             background-color: #fffbb2;
 | |
|                         }
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 .actions {
 | |
|                     .item {
 | |
|                         float: left;
 | |
| 
 | |
|                         &.context {
 | |
|                             float: none;
 | |
|                         }
 | |
| 
 | |
|                         &.tag {
 | |
|                             margin-right: 5px;
 | |
|                         }
 | |
| 
 | |
|                         &.action {
 | |
|                             margin-top: 6px;
 | |
|                             margin-left: 10px;
 | |
|                         }
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 .content {
 | |
|                     > .header {
 | |
|                         #avatar-arrow;
 | |
|                         font-weight: normal;
 | |
|                         padding: auto 15px;
 | |
|                         position: relative;
 | |
|                         color: #767676;
 | |
|                         background-color: #f7f7f7;
 | |
|                         border-top-left-radius: 3px;
 | |
|                         border-top-right-radius: 3px;
 | |
| 
 | |
|                         .text {
 | |
|                             max-width: 78%;
 | |
|                             padding-top: 10px;
 | |
|                             padding-bottom: 10px;
 | |
|                         }
 | |
| 
 | |
|                         &.arrow-top::before,
 | |
|                         &.arrow-top::after {
 | |
|                             transform: rotate(90deg);
 | |
|                         }
 | |
| 
 | |
|                         &.arrow-top::before {
 | |
|                             top: -9px;
 | |
|                             left: 6px;
 | |
|                         }
 | |
| 
 | |
|                         &.arrow-top::after {
 | |
|                             top: -8px;
 | |
|                             left: 7px;
 | |
|                         }
 | |
| 
 | |
|                         .actions a {
 | |
|                             color: rgba(0, 0, 0, .4);
 | |
| 
 | |
|                             &:hover {
 | |
|                                 color: rgba(0, 0, 0, .8);
 | |
|                             }
 | |
|                         }
 | |
|                     }
 | |
| 
 | |
|                     > .merge-section {
 | |
|                         border-top: 1px solid #d4d4d5;
 | |
|                         background-color: #f7f7f7;
 | |
|                     }
 | |
| 
 | |
|                     .markdown {
 | |
|                         font-size: 14px;
 | |
|                     }
 | |
| 
 | |
|                     .no-content {
 | |
|                         color: #767676;
 | |
|                         font-style: italic;
 | |
|                     }
 | |
| 
 | |
|                     > .bottom.segment {
 | |
|                         background: #f3f4f5;
 | |
| 
 | |
|                         .ui.images::after {
 | |
|                             clear: both;
 | |
|                             content: ' ';
 | |
|                             display: block;
 | |
|                         }
 | |
| 
 | |
|                         a {
 | |
|                             display: block;
 | |
|                             float: left;
 | |
|                             margin: 5px;
 | |
|                             padding: 5px;
 | |
|                             height: 150px;
 | |
|                             border: solid 1px #eeeeee;
 | |
|                             border-radius: 3px;
 | |
|                             max-width: 150px;
 | |
|                             background-color: #ffffff;
 | |
| 
 | |
|                             &:before {
 | |
|                                 content: ' ';
 | |
|                                 display: inline-block;
 | |
|                                 height: 100%;
 | |
|                                 vertical-align: middle;
 | |
|                             }
 | |
|                         }
 | |
| 
 | |
|                         .ui.image {
 | |
|                             max-height: 100%;
 | |
|                             width: auto;
 | |
|                             margin: 0;
 | |
|                             vertical-align: middle;
 | |
|                         }
 | |
| 
 | |
|                         span.ui.image {
 | |
|                             font-size: 128px;
 | |
|                             color: #000000;
 | |
|                         }
 | |
| 
 | |
|                         span.ui.image:hover {
 | |
|                             color: #000000;
 | |
|                         }
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 &:target > .content {
 | |
|                     box-shadow: 0 0 10px #8c8c8c;
 | |
|                 }
 | |
| 
 | |
|                 &:target > .content > .code-comment-content {
 | |
|                     padding: 4px;
 | |
|                 }
 | |
| 
 | |
|                 &:target > .content > .code-comment-content > .text {
 | |
|                     margin-bottom: 0;
 | |
|                 }
 | |
| 
 | |
|                 .ui.form {
 | |
|                     .field:first-child {
 | |
|                         clear: none;
 | |
|                     }
 | |
| 
 | |
|                     .tab.segment {
 | |
|                         border: 0;
 | |
|                         padding: 10px 0 0;
 | |
|                     }
 | |
| 
 | |
|                     textarea {
 | |
|                         height: 200px;
 | |
|                         font-family: @monospaced-fonts, monospace;
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 .edit.buttons {
 | |
|                     margin-top: 10px;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .event {
 | |
|                 padding-left: 15px;
 | |
| 
 | |
|                 & > .svg:not(.issue-symbol) {
 | |
|                     text-shadow: -2px 0 #fff, 0 2px #fff, 2px 0 #fff, 0 -2px #fff;
 | |
|                 }
 | |
| 
 | |
|                 & > .svg.issue-symbol {
 | |
|                     font-size: 20px;
 | |
|                     margin-left: -35px;
 | |
|                     margin-right: -1px;
 | |
|                     margin-top: 0 !important;
 | |
|                     height: 28px;
 | |
|                     width: 28px;
 | |
|                     border-radius: 50%;
 | |
|                     text-align: center;
 | |
|                     line-height: 28px;
 | |
|                     background: #eee;
 | |
| 
 | |
|                     &::before {
 | |
|                         width: 15px;
 | |
|                         display: inline-block;
 | |
|                     }
 | |
| 
 | |
|                     &.octicon-key::before {
 | |
|                         width: 18px;
 | |
|                     }
 | |
| 
 | |
|                     &.octicon-circle-slash::before {
 | |
|                         width: 17px;
 | |
|                     }
 | |
| 
 | |
|                     &.octicon-comment {
 | |
|                         font-size: 21px;
 | |
|                         line-height: 33px;
 | |
| 
 | |
|                         &::before {
 | |
|                             width: 20px;
 | |
|                         }
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 .detail {
 | |
|                     font-size: .9rem;
 | |
|                     margin-top: 5px;
 | |
|                     margin-left: 35px;
 | |
| 
 | |
|                     .svg {
 | |
|                         &.octicon-git-commit {
 | |
|                             margin-top: 2px;
 | |
|                         }
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 .segments {
 | |
|                     box-shadow: none;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .ui.participants {
 | |
|             img {
 | |
|                 margin-top: 5px;
 | |
|                 margin-right: 5px;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .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: #ffffff;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .tab.segment {
 | |
|                 border: 0;
 | |
|                 padding: 10px 0 0;
 | |
|             }
 | |
| 
 | |
|             textarea {
 | |
|                 height: 200px;
 | |
|                 font-family: @monospaced-fonts, monospace;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .labelspage {
 | |
|         list-style: none;
 | |
|         padding-top: 0;
 | |
| 
 | |
|         .item {
 | |
|             margin-top: 0;
 | |
|             margin-right: -14px;
 | |
|             margin-left: -14px;
 | |
|             padding: 10px;
 | |
|             border-bottom: 1px solid #e1e4e8;
 | |
|             border-top: none;
 | |
| 
 | |
|             a {
 | |
|                 font-size: 15px;
 | |
|                 padding-top: 5px;
 | |
|                 padding-right: 10px;
 | |
|                 color: #666666;
 | |
| 
 | |
|                 &:hover {
 | |
|                     color: #000000;
 | |
|                 }
 | |
| 
 | |
|                 &.open-issues {
 | |
|                     margin-right: 30px;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .ui.label {
 | |
|                 font-size: 1em;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .item:last-child {
 | |
|             border-bottom: none;
 | |
|             padding-bottom: 0;
 | |
|         }
 | |
| 
 | |
|         .orglabel {
 | |
|             opacity: .7;
 | |
|         }
 | |
| 
 | |
|     }
 | |
| 
 | |
|     .milestone.list {
 | |
|         list-style: none;
 | |
|         padding-top: 15px;
 | |
| 
 | |
|         > .item {
 | |
|             padding-top: 10px;
 | |
|             padding-bottom: 10px;
 | |
|             border-bottom: 1px dashed #aaaaaa;
 | |
| 
 | |
|             > a {
 | |
|                 padding-top: 5px;
 | |
|                 padding-right: 10px;
 | |
|                 color: #000000;
 | |
| 
 | |
|                 &:hover {
 | |
|                     color: #4078c0;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .ui.progress {
 | |
|                 width: 40%;
 | |
|                 padding: 0;
 | |
|                 border: 0;
 | |
|                 margin: 0;
 | |
| 
 | |
|                 .bar {
 | |
|                     height: 20px;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .meta {
 | |
|                 color: #999999;
 | |
|                 padding-top: 5px;
 | |
| 
 | |
|                 .issue-stats .svg {
 | |
|                     padding-left: 5px;
 | |
|                 }
 | |
| 
 | |
|                 .overdue {
 | |
|                     color: red;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .operate {
 | |
|                 margin-top: -15px;
 | |
| 
 | |
|                 > a {
 | |
|                     font-size: 15px;
 | |
|                     padding-top: 5px;
 | |
|                     padding-right: 10px;
 | |
|                     color: #666666;
 | |
| 
 | |
|                     &:hover {
 | |
|                         color: #000000;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .content {
 | |
|                 padding-top: 10px;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     &.new.milestone {
 | |
|         textarea {
 | |
|             height: 200px;
 | |
|         }
 | |
| 
 | |
|         #deadline {
 | |
|             width: 150px;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     &.compare.pull {
 | |
|         .show-form-container {
 | |
|             text-align: left;
 | |
|         }
 | |
| 
 | |
|         .choose.branch {
 | |
|             .svg {
 | |
|                 margin-right: 10px;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .comment.form {
 | |
|             .content {
 | |
|                 #avatar-arrow;
 | |
| 
 | |
|                 &:after {
 | |
|                     border-right-color: #ffffff;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .filter.dropdown .menu {
 | |
|         margin-top: 1px !important;
 | |
|     }
 | |
| 
 | |
|     &.branches {
 | |
|         .commit-divergence {
 | |
|             .bar-group {
 | |
|                 position: relative;
 | |
|                 float: left;
 | |
|                 padding-bottom: 6px;
 | |
|                 width: 90px;
 | |
| 
 | |
|                 &:last-child {
 | |
|                     border-left: 1px solid #b4b4b4;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .count {
 | |
|                 margin: 0 3px;
 | |
| 
 | |
|                 &.count-ahead {
 | |
|                     text-align: left;
 | |
|                 }
 | |
| 
 | |
|                 &.count-behind {
 | |
|                     text-align: right;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .bar {
 | |
|                 height: 4px;
 | |
|                 position: absolute;
 | |
|                 background-color: #d4d4d5;
 | |
| 
 | |
|                 &.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: 175px;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         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 {
 | |
|         border: 1px solid #bbbbbb;
 | |
| 
 | |
|         .ui.signature.avatar {
 | |
|             height: 16px;
 | |
|             margin-bottom: 0;
 | |
|             width: auto;
 | |
|         }
 | |
| 
 | |
|         .detail.icon {
 | |
|             background: #fafafa;
 | |
|             margin: -6px -10px -4px 0;
 | |
|             padding: 5px 4px 5px 6px;
 | |
|             border-left: 1px solid #bbbbbb;
 | |
|             border-top: 0;
 | |
|             border-right: 0;
 | |
|             border-bottom: 0;
 | |
|             border-top-left-radius: 0;
 | |
|             border-bottom-left-radius: 0;
 | |
| 
 | |
|             img {
 | |
|                 margin-right: 0;
 | |
|             }
 | |
| 
 | |
|             > div {
 | |
|                 display: inline-flex;
 | |
|                 align-items: center;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &.isSigned.isWarning {
 | |
|             border: 1px solid #db2828;
 | |
|             background: fade(#db2828, 10%);
 | |
| 
 | |
|             .shortsha {
 | |
|                 display: inline-block;
 | |
|                 padding-top: 1px;
 | |
|             }
 | |
| 
 | |
|             .detail.icon {
 | |
|                 border-left: 1px solid #db2828;
 | |
|                 color: #db2828;
 | |
|             }
 | |
| 
 | |
|             &:hover {
 | |
|                 background: fade(#db2828, 30%) !important;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &.isSigned.isVerified {
 | |
|             border: 1px solid #21ba45;
 | |
|             background: fade(#21ba45, 10%);
 | |
| 
 | |
|             .shortsha {
 | |
|                 display: inline-block;
 | |
|                 padding-top: 1px;
 | |
|             }
 | |
| 
 | |
|             .detail.icon {
 | |
|                 border-left: 1px solid #21ba45;
 | |
|                 color: #21ba45;
 | |
|             }
 | |
| 
 | |
|             &:hover {
 | |
|                 background: fade(#21ba45, 30%) !important;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &.isSigned.isVerifiedUntrusted {
 | |
|             border: 1px solid #fbbd08;
 | |
|             background: fade(#fbbd08, 10%);
 | |
| 
 | |
|             .shortsha {
 | |
|                 display: inline-block;
 | |
|                 padding-top: 1px;
 | |
|             }
 | |
| 
 | |
|             .detail.icon {
 | |
|                 border-left: 1px solid #fbbd08;
 | |
|                 color: #fbbd08;
 | |
|             }
 | |
| 
 | |
|             &:hover {
 | |
|                 background: fade(#fbbd08, 30%) !important;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &.isSigned.isVerifiedUnmatched {
 | |
|             border: 1px solid #f2711c;
 | |
|             background: fade(#f2711c, 10%);
 | |
| 
 | |
|             .shortsha {
 | |
|                 display: inline-block;
 | |
|                 padding-top: 1px;
 | |
|             }
 | |
| 
 | |
|             .detail.icon {
 | |
|                 border-left: 1px solid #f2711c;
 | |
|                 color: #f2711c;
 | |
|             }
 | |
| 
 | |
|             &:hover {
 | |
|                 background: fade(#f2711c, 30%) !important;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .diff-detail-box {
 | |
|         padding: 7px 0;
 | |
|         background: #ffffff;
 | |
|         line-height: 30px;
 | |
| 
 | |
|         > div:after {
 | |
|             clear: both;
 | |
|             content: "";
 | |
|             display: block;
 | |
|         }
 | |
| 
 | |
|         span.status {
 | |
|             display: inline-block;
 | |
|             width: 12px;
 | |
|             height: 12px;
 | |
|             margin-right: 8px;
 | |
|             vertical-align: middle;
 | |
| 
 | |
|             &.modify {
 | |
|                 background-color: #f0db88;
 | |
|             }
 | |
| 
 | |
|             &.add {
 | |
|                 background-color: #b4e2b4;
 | |
|             }
 | |
| 
 | |
|             &.del {
 | |
|                 background-color: #e9aeae;
 | |
|             }
 | |
| 
 | |
|             &.rename {
 | |
|                 background-color: #dad8ff;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .detail-files {
 | |
|             background: #ffffff;
 | |
|             margin: 0;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .diff-box .header {
 | |
|         display: flex;
 | |
|         align-items: center;
 | |
| 
 | |
|         .count {
 | |
|             margin-right: 12px;
 | |
|             font-size: 13px;
 | |
|             flex: 0 0 auto;
 | |
| 
 | |
|             .bar {
 | |
|                 background-color: #bd2c00;
 | |
|                 height: 12px;
 | |
|                 width: 40px;
 | |
|                 display: inline-block;
 | |
|                 margin: 2px 4px 0 4px;
 | |
|                 vertical-align: text-top;
 | |
| 
 | |
|                 .add {
 | |
|                     background-color: #55a532;
 | |
|                     height: 12px;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .file {
 | |
|             flex: 1;
 | |
|             color: #888888;
 | |
|             word-break: break-all;
 | |
|         }
 | |
| 
 | |
|         .button {
 | |
|             margin: -5px 0 -5px 12px;
 | |
|             padding: 8px 10px;
 | |
|             flex: 0 0 auto;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .diff-file-box {
 | |
|         .header {
 | |
|             background-color: #f7f7f7;
 | |
|         }
 | |
| 
 | |
|         .file-body.file-code {
 | |
|             .lines-num {
 | |
|                 text-align: right;
 | |
|                 color: #a6a6a6;
 | |
|                 background: #fafafa;
 | |
|                 width: 1%;
 | |
|                 min-width: 50px;
 | |
|                 user-select: none;
 | |
|                 vertical-align: top;
 | |
| 
 | |
|                 span.fold {
 | |
|                     display: block;
 | |
|                     text-align: center;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .lines-num-old {
 | |
|                 border-right: 1px solid #dddddd;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .code-diff {
 | |
|             font-size: 12px;
 | |
| 
 | |
|             td {
 | |
|                 padding: 0 0 0 10px !important;
 | |
|                 border-top: 0;
 | |
|             }
 | |
| 
 | |
|             .lines-num {
 | |
|                 border-color: #d4d4d5;
 | |
|                 border-right-width: 1px;
 | |
|                 border-right-style: solid;
 | |
|                 padding: 0 5px !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;
 | |
|                     }
 | |
| 
 | |
|                     .removed-code {
 | |
|                         background-color: #ff9999;
 | |
|                     }
 | |
| 
 | |
|                     .added-code {
 | |
|                         background-color: #99ff99;
 | |
|                     }
 | |
| 
 | |
|                     [data-line-num]::before {
 | |
|                         content: attr(data-line-num);
 | |
|                         text-align: right;
 | |
|                     }
 | |
| 
 | |
|                     .lines-type-marker {
 | |
|                         width: 10px;
 | |
|                         min-width: 10px;
 | |
|                         user-select: none;
 | |
|                     }
 | |
| 
 | |
|                     [data-type-marker]::before {
 | |
|                         content: attr(data-type-marker);
 | |
|                         text-align: right;
 | |
|                         display: inline-block;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .code-diff-unified tbody tr {
 | |
|             &.del-code td {
 | |
|                 background-color: #ffe0e0 !important;
 | |
|                 border-color: #f1c0c0 !important;
 | |
|             }
 | |
| 
 | |
|             &.add-code td {
 | |
|                 background-color: #d6fcd6 !important;
 | |
|                 border-color: #c1e9c1 !important;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .code-diff-split {
 | |
| 
 | |
|             table,
 | |
|             tbody {
 | |
|                 width: 100%;
 | |
|             }
 | |
| 
 | |
|             tbody tr {
 | |
| 
 | |
|                 // light gray for empty lines before / after commit
 | |
|                 &.add-code td:nth-child(1),
 | |
|                 &.add-code td:nth-child(2),
 | |
|                 &.add-code td:nth-child(3),
 | |
|                 &.del-code td:nth-child(4),
 | |
|                 &.del-code td:nth-child(5),
 | |
|                 &.del-code td:nth-child(6) {
 | |
|                     background-color: #fafafa;
 | |
|                 }
 | |
| 
 | |
|                 &.del-code td:nth-child(1),
 | |
|                 &.del-code td:nth-child(2),
 | |
|                 &.del-code td:nth-child(3),
 | |
|                 td.del-code {
 | |
|                     background-color: #ffe0e0 !important;
 | |
|                     border-color: #f1c0c0 !important;
 | |
|                 }
 | |
| 
 | |
|                 &.add-code td:nth-child(4),
 | |
|                 &.add-code td:nth-child(5),
 | |
|                 &.add-code td:nth-child(6),
 | |
|                 td.add-code {
 | |
|                     background-color: #d6fcd6 !important;
 | |
|                     border-color: #c1e9c1 !important;
 | |
|                 }
 | |
| 
 | |
|                 td:nth-child(4) {
 | |
|                     border-left-width: 1px;
 | |
|                     border-left-style: solid;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &.file-content {
 | |
|             img {
 | |
|                 max-width: 100%;
 | |
|                 padding: 5px 5px 0 5px;
 | |
|             }
 | |
|             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;
 | |
|             border-bottom: 1px dashed #dddddd;
 | |
|             padding-left: 6px;
 | |
|         }
 | |
| 
 | |
|         .diff-counter {
 | |
|             margin-right: 15px;
 | |
| 
 | |
|             .del {
 | |
|                 color: red;
 | |
|             }
 | |
|             .add {
 | |
|                 color: green;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .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: .28571429rem 0 0 .28571429rem;
 | |
|             }
 | |
| 
 | |
|             .ui.action.small.input {
 | |
|                 width: 100%;
 | |
|             }
 | |
| 
 | |
|             #repo-clone-url {
 | |
|                 border-radius: 0;
 | |
|                 padding: 5px 10px;
 | |
|                 font-size: 1.2em;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     &.release {
 | |
|         #release-list {
 | |
|             border-top: 1px solid #dddddd;
 | |
|             margin-top: 20px;
 | |
|             padding-top: 15px;
 | |
| 
 | |
|             > li {
 | |
|                 list-style: none;
 | |
| 
 | |
|                 .meta,
 | |
|                 .detail {
 | |
|                     padding-top: 30px;
 | |
|                     padding-bottom: 40px;
 | |
|                 }
 | |
| 
 | |
|                 .meta {
 | |
|                     text-align: right;
 | |
|                     position: relative;
 | |
| 
 | |
|                     .tag:not(.icon) {
 | |
|                         display: block;
 | |
|                         margin-top: 15px;
 | |
|                     }
 | |
| 
 | |
|                     .commit {
 | |
|                         display: block;
 | |
|                         margin-top: 10px;
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 .detail {
 | |
|                     border-left: 1px solid #dddddd;
 | |
| 
 | |
|                     .author {
 | |
|                         img {
 | |
|                             margin-bottom: -3px;
 | |
|                         }
 | |
|                     }
 | |
| 
 | |
|                     .download {
 | |
|                         margin-top: 20px;
 | |
| 
 | |
|                         > a {
 | |
|                             .svg {
 | |
|                                 margin-left: 5px;
 | |
|                                 margin-right: 5px;
 | |
|                             }
 | |
|                         }
 | |
| 
 | |
|                         .list {
 | |
|                             padding-left: 0;
 | |
|                             border-top: 1px solid #eeeeee;
 | |
| 
 | |
|                             li {
 | |
|                                 list-style: none;
 | |
|                                 display: block;
 | |
|                                 padding-top: 8px;
 | |
|                                 padding-bottom: 8px;
 | |
|                                 border-bottom: 1px solid #eeeeee;
 | |
| 
 | |
|                                 a > .text.right {
 | |
|                                     margin-right: 5px;
 | |
|                                 }
 | |
|                             }
 | |
|                         }
 | |
|                     }
 | |
| 
 | |
|                     .dot {
 | |
|                         width: 9px;
 | |
|                         height: 9px;
 | |
|                         background-color: #cccccc;
 | |
|                         z-index: 999;
 | |
|                         position: absolute;
 | |
|                         display: block;
 | |
|                         left: -5px;
 | |
|                         top: 40px;
 | |
|                         border-radius: 6px;
 | |
|                         border: 1px solid #ffffff;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     &.new.release {
 | |
|         .target {
 | |
|             min-width: 500px;
 | |
| 
 | |
|             #tag-name {
 | |
|                 margin-top: -4px;
 | |
|             }
 | |
| 
 | |
|             .at {
 | |
|                 margin-left: -5px;
 | |
|                 margin-right: 5px;
 | |
|             }
 | |
| 
 | |
|             .dropdown.icon {
 | |
|                 margin: 0;
 | |
|                 padding-top: 3px;
 | |
|             }
 | |
| 
 | |
|             .selection.dropdown {
 | |
|                 padding-top: 10px;
 | |
|                 padding-bottom: 10px;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .prerelease.field {
 | |
|             margin-bottom: 0;
 | |
|         }
 | |
| 
 | |
|         .field {
 | |
| 
 | |
|             button,
 | |
|             input {
 | |
|                 @media only screen and (max-width: 438px) {
 | |
|                     width: 100%;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             button {
 | |
|                 @media only screen and (max-width: 768px) {
 | |
|                     margin-bottom: 1em;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     &.forks {
 | |
|         .list {
 | |
|             margin-top: 0;
 | |
| 
 | |
|             .item {
 | |
|                 padding-top: 10px;
 | |
|                 padding-bottom: 10px;
 | |
|                 border-bottom: 1px solid #dddddd;
 | |
| 
 | |
|                 .ui.avatar {
 | |
|                     float: left;
 | |
|                     margin-right: 5px;
 | |
|                 }
 | |
| 
 | |
|                 .link {
 | |
|                     padding-top: 5px;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     &.wiki {
 | |
|         &.start {
 | |
|             .ui.segment {
 | |
|                 padding-top: 70px;
 | |
|                 padding-bottom: 100px;
 | |
| 
 | |
|                 .svg {
 | |
|                     height: 48px;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &.new {
 | |
|             .CodeMirror {
 | |
|                 .CodeMirror-code {
 | |
|                     font-family: @monospaced-fonts, monospace;
 | |
| 
 | |
|                     .cm-comment {
 | |
|                         background: inherit;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .editor-preview {
 | |
|                 background-color: white;
 | |
|             }
 | |
| 
 | |
|             .ui.attached.tabular.menu.previewtabs {
 | |
|                 margin-bottom: 15px;
 | |
| 
 | |
|                 & + .field .editor-toolbar:not(.fullscreen) a.fa-eye {
 | |
|                     display: none;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &.view {
 | |
|             .choose.page {
 | |
|                 margin-top: -5px;
 | |
|             }
 | |
| 
 | |
|             .ui.sub.header {
 | |
|                 text-transform: none;
 | |
|             }
 | |
| 
 | |
|             > .markdown {
 | |
|                 padding: 15px 30px;
 | |
| 
 | |
|                 h1,
 | |
|                 h2,
 | |
|                 h3,
 | |
|                 h4,
 | |
|                 h5,
 | |
|                 h6 {
 | |
|                     &:first-of-type {
 | |
|                         margin-top: 0;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         @media only screen and (max-width: 767px) {
 | |
|             .dividing.header .stackable.grid .button {
 | |
|                 margin-top: 2px;
 | |
|                 margin-bottom: 2px;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     &.settings {
 | |
|         &.collaboration {
 | |
|             .collaborator.list {
 | |
|                 padding: 0;
 | |
| 
 | |
|                 > .item {
 | |
|                     margin: 0;
 | |
|                     line-height: 2em;
 | |
| 
 | |
|                     &:not(:last-child) {
 | |
|                         border-bottom: 1px solid #dddddd;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             #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 #eaeaea;
 | |
|                     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 #c29393;
 | |
|         border-right: 1px solid #c29393;
 | |
| 
 | |
|         &.top,
 | |
|         &.message {
 | |
|             border-top: 1px solid #c29393;
 | |
|         }
 | |
| 
 | |
|         &.message {
 | |
|             box-shadow: none;
 | |
|             background-color: #fff5f5;
 | |
|             color: #d95c5c;
 | |
| 
 | |
|             .ui.text {
 | |
|                 color: #d64444;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &:last-child,
 | |
|         &.bottom {
 | |
|             border-bottom: 1px solid #c29393;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .ui.attached.isSigned:not(.isWarning) .pull-right {
 | |
|         padding-top: 5px;
 | |
|     }
 | |
| 
 | |
|     .ui.attached.isSigned.isVerified {
 | |
|         border-left: 1px solid #a3c293;
 | |
|         border-right: 1px solid #a3c293;
 | |
| 
 | |
|         &.top,
 | |
|         &.message {
 | |
|             border-top: 1px solid #a3c293;
 | |
|         }
 | |
| 
 | |
|         &.message {
 | |
|             box-shadow: none;
 | |
|             background-color: #fcfff5;
 | |
|             color: #6cc644;
 | |
| 
 | |
|             .pull-right {
 | |
|                 color: #000;
 | |
|             }
 | |
| 
 | |
|             .ui.text {
 | |
|                 color: #21ba45;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &:last-child,
 | |
|         &.bottom {
 | |
|             border-bottom: 1px solid #a3c293;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .ui.attached.isSigned.isVerifiedUntrusted {
 | |
|         border-left: 1px solid #c2c193;
 | |
|         border-right: 1px solid #c2c193;
 | |
| 
 | |
|         &.top,
 | |
|         &.message {
 | |
|             border-top: 1px solid #c2c193;
 | |
|         }
 | |
| 
 | |
|         &.message {
 | |
|             box-shadow: none;
 | |
|             background-color: #fffff5;
 | |
|             color: #fbbd08;
 | |
| 
 | |
|             .ui.text {
 | |
|                 color: #d2ab00;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &:last-child,
 | |
|         &.bottom {
 | |
|             border-bottom: 1px solid #c2c193;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .ui.attached.isSigned.isVerifiedUnmatched {
 | |
|         border-left: 1px solid #c2a893;
 | |
|         border-right: 1px solid #c2a893;
 | |
| 
 | |
|         &.top,
 | |
|         &.message {
 | |
|             border-top: 1px solid #c2a893;
 | |
|         }
 | |
| 
 | |
|         &.message {
 | |
|             box-shadow: none;
 | |
|             background-color: #fffaf5;
 | |
|             color: #f2711c;
 | |
| 
 | |
|             .ui.text {
 | |
|                 color: #ee5f00;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &:last-child,
 | |
|         &.bottom {
 | |
|             border-bottom: 1px solid #c2a893;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .ui.segment.sub-menu {
 | |
|         padding: 7px;
 | |
|         line-height: 0;
 | |
| 
 | |
|         .list {
 | |
|             width: 100%;
 | |
|             display: flex;
 | |
| 
 | |
|             .item {
 | |
|                 width: 100%;
 | |
|                 border-radius: 3px;
 | |
| 
 | |
|                 a {
 | |
|                     color: black;
 | |
| 
 | |
|                     &:hover {
 | |
|                         color: #666666;
 | |
|                     }
 | |
|                 }
 | |
| 
 | |
|                 span.ui {
 | |
|                     color: black;
 | |
|                 }
 | |
| 
 | |
|                 &.active {
 | |
|                     background: rgba(0, 0, 0, .05);
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .segment.reactions,
 | |
|     .select-reaction {
 | |
|         &.dropdown .menu {
 | |
|             right: 0 !important;
 | |
|             left: auto !important;
 | |
|             min-width: 15em;
 | |
| 
 | |
|             > .header {
 | |
|                 margin: .75rem 0 .5rem;
 | |
|             }
 | |
| 
 | |
|             > .item {
 | |
|                 float: left;
 | |
|                 padding: .5rem .5rem !important;
 | |
|                 font-size: 1.5em;
 | |
| 
 | |
|                 img.emoji {
 | |
|                     margin-right: 0;
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .segment.reactions {
 | |
|         padding: 0;
 | |
|         display: flex;
 | |
| 
 | |
|         .ui.label {
 | |
|             max-height: 40px;
 | |
|             padding: 9px 15px 7px;
 | |
|             border: 0;
 | |
|             border-right: 1px solid;
 | |
|             border-radius: 0;
 | |
|             margin: 0;
 | |
|             font-size: 14px;
 | |
|             font-weight: 100;
 | |
|             border-color: inherit !important;
 | |
| 
 | |
|             &.disabled {
 | |
|                 cursor: default;
 | |
|                 opacity: .5;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .ui.label.basic.blue {
 | |
|             background-color: #f1f8ff !important;
 | |
|             border-color: inherit !important;
 | |
|         }
 | |
| 
 | |
|         .reaction-count {
 | |
|             margin-left: 4px;
 | |
|         }
 | |
| 
 | |
|         .select-reaction {
 | |
|             float: left;
 | |
|             padding: .4em;
 | |
|             line-height: 21px;
 | |
| 
 | |
|             &:not(.active) a {
 | |
|                 display: none;
 | |
|             }
 | |
|             > svg {
 | |
|                 vertical-align: middle;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &:hover .select-reaction a {
 | |
|             display: block;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .ui.fluid.action.input {
 | |
|         .ui.search.action.input {
 | |
|             flex: auto;
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .repository-summary {
 | |
|         .segment.language-stats-details,
 | |
|         .segment.repository-summary {
 | |
|             border-top: none;
 | |
|             background: none;
 | |
|         }
 | |
| 
 | |
|         .segment.language-stats-details .item {
 | |
|             white-space: nowrap;
 | |
|         }
 | |
| 
 | |
|         .segment.language-stats {
 | |
|             padding: 0;
 | |
|             height: 11px;
 | |
|             display: flex;
 | |
|             white-space: nowrap;
 | |
|             width: 100%;
 | |
|             border-radius: 0;
 | |
|             user-select: none;
 | |
| 
 | |
|             .bar {
 | |
|                 white-space: nowrap;
 | |
|                 border: 0;
 | |
|                 padding: 0;
 | |
|                 margin: 0;
 | |
|                 height: 100%;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| }
 | |
| 
 | |
| // End of .repository
 | |
| 
 | |
| &.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 {
 | |
|             .image {
 | |
|                 float: left;
 | |
|                 margin-right: 8px;
 | |
|                 width: 2em;
 | |
|                 height: 2em;
 | |
|             }
 | |
| 
 | |
|             .content {
 | |
|                 margin: 6px 0;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| }
 | |
| 
 | |
| #search-team-box {
 | |
|     .results {
 | |
|         .result {
 | |
|             .content {
 | |
|                 margin: 6px 0;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| }
 | |
| 
 | |
| #issue-filters.hide {
 | |
|     display: none;
 | |
| }
 | |
| 
 | |
| #issue-actions {
 | |
|     margin-top: -1rem !important; // counteract padding from Semantic
 | |
| }
 | |
| 
 | |
| #issue-actions.hide {
 | |
|     display: none;
 | |
| }
 | |
| 
 | |
| .ui.checkbox.issue-checkbox {
 | |
|     vertical-align: middle;
 | |
| }
 | |
| 
 | |
| .ui.menu .item > img:not(.ui) {
 | |
|     width: auto;
 | |
| }
 | |
| 
 | |
| .issue.list {
 | |
|     list-style: none;
 | |
| 
 | |
|     > .item {
 | |
|         padding-top: 15px;
 | |
|         padding-bottom: 10px;
 | |
|         border-bottom: 1px dashed #aaaaaa;
 | |
| 
 | |
|         .title {
 | |
|             color: #444444;
 | |
|             font-size: 15px;
 | |
|             font-weight: bold;
 | |
|             margin: 0 6px;
 | |
| 
 | |
|             &:hover {
 | |
|                 color: #000000;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .comment {
 | |
|             padding-right: 10px;
 | |
|             color: #666666;
 | |
|         }
 | |
| 
 | |
|         .desc {
 | |
|             padding-top: 5px;
 | |
|             color: #999999;
 | |
| 
 | |
|             .checklist {
 | |
|                 padding-left: 5px;
 | |
| 
 | |
|                 .progress-bar {
 | |
|                     margin-left: 2px;
 | |
|                     width: 80px;
 | |
|                     height: 6px;
 | |
|                     display: inline-block;
 | |
|                     background-color: #eeeeee;
 | |
|                     overflow: hidden;
 | |
|                     border-radius: 3px;
 | |
|                     vertical-align: 2px !important;
 | |
| 
 | |
|                     .progress {
 | |
|                         background-color: #cccccc;
 | |
|                         display: block;
 | |
|                         height: 100%;
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .conflicting {
 | |
|                 padding-left: 5px;
 | |
|             }
 | |
| 
 | |
|             .due-date {
 | |
|                 padding-left: 5px;
 | |
|             }
 | |
| 
 | |
|             a.milestone {
 | |
|                 margin-left: 5px;
 | |
|                 color: #999999 !important;
 | |
| 
 | |
|                 &:hover {
 | |
|                     color: #000000 !important;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             a.ref {
 | |
|                 margin-left: 8px;
 | |
|                 color: #999999 !important;
 | |
| 
 | |
|                 &:hover {
 | |
|                     color: #000000 !important;
 | |
|                 }
 | |
| 
 | |
|                 span {
 | |
|                     margin-right: -4px;
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             .assignee {
 | |
|                 margin-top: -5px;
 | |
|                 margin-right: 5px;
 | |
|             }
 | |
| 
 | |
|             .overdue {
 | |
|                 color: red;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| }
 | |
| 
 | |
| .page.buttons {
 | |
|     padding-top: 15px;
 | |
| }
 | |
| 
 | |
| .ui.form {
 | |
|     .dropzone {
 | |
|         width: 100%;
 | |
|         margin-bottom: 10px;
 | |
|         border: 2px dashed #0087f5;
 | |
|         box-shadow: none !important;
 | |
| 
 | |
|         .dz-error-message {
 | |
|             top: 140px;
 | |
|         }
 | |
|     }
 | |
| }
 | |
| 
 | |
| .settings {
 | |
|     .content {
 | |
|         margin-top: 2px;
 | |
| 
 | |
|         > .header,
 | |
|         .segment {
 | |
|             box-shadow: 0 1px 2px 0 rgba(34, 36, 38, .15);
 | |
|         }
 | |
|     }
 | |
| 
 | |
|     .list {
 | |
|         > .item {
 | |
|             .green:not(.ui.button) {
 | |
|                 color: #21ba45;
 | |
|             }
 | |
| 
 | |
|             &:not(:first-child) {
 | |
|                 border-top: 1px solid #eaeaea;
 | |
|                 padding: 1rem;
 | |
|                 margin: 15px -1rem -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: #666666;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &.email {
 | |
|             > .item:not(:first-child) {
 | |
|                 min-height: 60px;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         &.collaborator {
 | |
|             > .item {
 | |
|                 padding: 0;
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| }
 | |
| 
 | |
| .ui.vertical.menu {
 | |
|     .header.item {
 | |
|         font-size: 1.1em;
 | |
|         background: #f0f0f0;
 | |
|     }
 | |
| }
 | |
| 
 | |
| .edit-label.modal,
 | |
| .new-label.segment {
 | |
|     .form {
 | |
|         .column {
 | |
|             padding-right: 0;
 | |
|         }
 | |
| 
 | |
|         .buttons {
 | |
|             margin-left: auto;
 | |
|             padding-top: 15px;
 | |
|         }
 | |
| 
 | |
|         .color.picker.column {
 | |
|             width: auto;
 | |
| 
 | |
|             .color-picker {
 | |
|                 height: 35px;
 | |
|                 width: auto;
 | |
|                 padding-left: 30px;
 | |
|             }
 | |
|         }
 | |
| 
 | |
|         .minicolors-swatch.minicolors-sprite {
 | |
|             top: 10px;
 | |
|             left: 10px;
 | |
|             width: 15px;
 | |
|             height: 15px;
 | |
|         }
 | |
| 
 | |
|         .precolors {
 | |
|             padding-left: 0;
 | |
|             padding-right: 0;
 | |
|             margin: 3px 10px auto 10px;
 | |
|             width: 120px;
 | |
| 
 | |
|             .color {
 | |
|                 float: left;
 | |
|                 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: #d3d3d4;
 | |
|         border-width: 9px;
 | |
|         margin-top: -9px;
 | |
|     }
 | |
| 
 | |
|     &:after {
 | |
|         border-right-color: #f7f7f7;
 | |
|         border-width: 8px;
 | |
|         margin-top: -8px;
 | |
|     }
 | |
| }
 | |
| 
 | |
| #transfer-repo-modal,
 | |
| #delete-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;
 | |
|     }
 | |
| 
 | |
|     .generate-tab-size(@n, (@i + 1));
 | |
| }
 | |
| 
 | |
| .stats-table {
 | |
|     display: table;
 | |
|     width: 100%;
 | |
| 
 | |
|     .table-cell {
 | |
|         display: table-cell;
 | |
| 
 | |
|         &.tiny {
 | |
|             height: .5em;
 | |
|         }
 | |
|     }
 | |
| }
 | |
| 
 | |
| tbody.commit-list {
 | |
|     vertical-align: baseline;
 | |
| }
 | |
| 
 | |
| .message-wrapper {
 | |
|     overflow: hidden;
 | |
|     text-overflow: ellipsis;
 | |
|     max-width: calc(100% - 50px);
 | |
|     display: inline-block;
 | |
|     vertical-align: middle;
 | |
| }
 | |
| 
 | |
| @media only screen and (max-width: 767.98px) {
 | |
|     tr.commit-list {
 | |
|         width: 100%;
 | |
|     }
 | |
|     th .message-wrapper {
 | |
|         display: block;
 | |
|         max-width: calc(100vw - 70px);
 | |
|     }
 | |
| }
 | |
| 
 | |
| @media only screen and (min-width: 768px) and (max-width: 991.98px) {
 | |
|     tr.commit-list {
 | |
|         width: 723px;
 | |
|     }
 | |
|     th .message-wrapper {
 | |
|         max-width: 280px;
 | |
|     }
 | |
| }
 | |
| 
 | |
| @media only screen and (min-width: 992px) and (max-width: 1199.98px) {
 | |
|     tr.commit-list {
 | |
|         width: 933px;
 | |
|     }
 | |
|     th .message-wrapper {
 | |
|         max-width: 490px;
 | |
|     }
 | |
| }
 | |
| 
 | |
| @media only screen and (min-width: 1200px) {
 | |
|     tr.commit-list {
 | |
|         width: 1127px;
 | |
|     }
 | |
|     th .message-wrapper {
 | |
|         max-width: 680px;
 | |
|     }
 | |
| }
 | |
| 
 | |
| .commit-list .commit-summary a {
 | |
|     text-decoration: underline;
 | |
|     text-decoration-style: dashed;
 | |
| 
 | |
|     &:hover {
 | |
|         text-decoration-style: solid;
 | |
|     }
 | |
| 
 | |
|     &.default-link {
 | |
|         text-decoration: none;
 | |
| 
 | |
|         &:hover {
 | |
|             text-decoration: underline;
 | |
|             text-decoration-style: solid;
 | |
|         }
 | |
|     }
 | |
| }
 | |
| 
 | |
| .commit-list .commit-status-link {
 | |
|     display: inline-block;
 | |
|     vertical-align: middle;
 | |
| }
 | |
| 
 | |
| .commit-body {
 | |
|     white-space: pre-wrap;
 | |
| }
 | |
| 
 | |
| .git-notes {
 | |
|     &.top {
 | |
|         text-align: left;
 | |
|     }
 | |
| 
 | |
|     .commit-body {
 | |
|         margin: 0;
 | |
|     }
 | |
| }
 | |
| 
 | |
| @media only screen and (max-width: 767px) {
 | |
|     .ui.stackable.menu {
 | |
|         &.mobile--margin-between-items > .item {
 | |
|             margin-top: 5px;
 | |
|             margin-bottom: 5px;
 | |
|         }
 | |
| 
 | |
|         &.mobile--no-negative-margins {
 | |
|             margin-left: 0;
 | |
|             margin-right: 0;
 | |
|         }
 | |
|     }
 | |
| }
 | |
| 
 | |
| #topic_edit {
 | |
|     margin-top: 5px;
 | |
| }
 | |
| 
 | |
| #repo-topics {
 | |
|     margin-top: 5px;
 | |
| }
 | |
| 
 | |
| .repo-topic {
 | |
|     cursor: pointer;
 | |
| }
 | |
| 
 | |
| #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;
 | |
| }
 | |
| 
 | |
| .repo-header .repo-buttons {
 | |
|     display: flex;
 | |
|     align-items: center;
 | |
| }
 | |
| 
 | |
| .repo-buttons .disabled-repo-button .label {
 | |
|     opacity: .5;
 | |
| }
 | |
| 
 | |
| .repo-buttons .disabled-repo-button a.button {
 | |
|     opacity: .5;
 | |
|     cursor: not-allowed;
 | |
| }
 | |
| 
 | |
| .repo-buttons .disabled-repo-button a.button:hover {
 | |
|     background: none !important;
 | |
|     color: rgba(0, 0, 0, .6) !important;
 | |
|     box-shadow: 0 0 0 1px rgba(34, 36, 38, .15) inset !important;
 | |
| }
 | |
| 
 | |
| .repo-buttons .ui.labeled.button > .label {
 | |
|     border-left: 0 !important;
 | |
|     margin: 0 !important;
 | |
| }
 | |
| 
 | |
| .tag-code,
 | |
| .tag-code td {
 | |
|     background-color: #f0f0f0 !important;
 | |
|     border-color: #d3cfcf !important;
 | |
|     padding-top: 8px;
 | |
|     padding-bottom: 8px;
 | |
| }
 | |
| 
 | |
| td.blob-excerpt {
 | |
|     background-color: #fafafa;
 | |
| }
 | |
| 
 | |
| .issue-keyword {
 | |
|     border-bottom: 1px dotted #959da5;
 | |
|     display: inline-block;
 | |
| }
 | |
| 
 | |
| .file-header {
 | |
|     display: flex;
 | |
|     justify-content: space-between;
 | |
|     align-items: center;
 | |
|     padding: 8px 12px !important;
 | |
| }
 | |
| 
 | |
| .file-info {
 | |
|     display: flex;
 | |
|     align-items: center;
 | |
| }
 | |
| 
 | |
| .file-info-entry + .file-info-entry {
 | |
|     border-left: 1px solid currentColor;
 | |
|     margin-left: 8px;
 | |
|     padding-left: 8px;
 | |
| }
 | |
| 
 | |
| .title_wip_desc {
 | |
|     margin-top: 1em;
 | |
| }
 | |
| 
 | |
| .diff-file-box[data-folded="true"] .diff-file-body {
 | |
|     display: none;
 | |
| }
 | |
| 
 | |
| .diff-file-box[data-folded="true"] .diff-file-header {
 | |
|     border-radius: .28571429rem !important;
 | |
| }
 | |
| 
 | |
| /* prevent page shaking on language bar click */
 | |
| .repository.file .repository-summary {
 | |
|     height: 48px;
 | |
|     overflow: hidden;
 | |
| }
 |