addons/isl/src/CommitTreeList.cssblame
View source
b69ab311/**
b69ab312 * Copyright (c) Meta Platforms, Inc. and affiliates.
b69ab313 *
b69ab314 * This source code is licensed under the MIT license found in the
b69ab315 * LICENSE file in the root directory of this source tree.
b69ab316 */
b69ab317
b69ab318.branch-indicator {
b69ab319 stroke: var(--foreground);
b69ab3110 position: absolute;
b69ab3111 bottom: -20px;
b69ab3112 left: -30px;
b69ab3113 margin-bottom: -5px;
b69ab3114 z-index: 2;
b69ab3115}
b69ab3116.commit-group {
b69ab3117 margin-bottom: 30px;
b69ab3118 margin-bottom: 20px;
b69ab3119 margin-left: 20px;
b69ab3120 margin-top: 10px;
b69ab3121 position: relative;
b69ab3122 display: flex;
b69ab3123 flex-direction: column;
b69ab3124 gap: calc(var(--halfpad) / 2);
b69ab3125}
b69ab3126.commit-tree-root {
b69ab3127 margin-top: calc(2px + var(--halfpad));
b69ab3128}
b69ab3129.commit-tree-stack-actions {
b69ab3130 display: flex;
b69ab3131 flex-direction: row;
b69ab3132 gap: var(--pad);
b69ab3133 align-items: center;
b69ab3134 margin-top: var(--halfpad);
b69ab3135 margin-bottom: calc(2 * var(--pad));
b69ab3136 margin-left: var(--halfpad);
b69ab3137}
b69ab3138
b69ab3139.commit-group.with-vertical-line:before {
b69ab3140 /* branch vertical line - used by split range selector */
b69ab3141 content: ' ';
b69ab3142 border-left: 2px solid var(--foreground);
b69ab3143 position: absolute;
b69ab3144 bottom: 5px;
b69ab3145 top: 20px;
b69ab3146 left: -10px;
b69ab3147 z-index: 1;
b69ab3148}
b69ab3149.commit {
b69ab3150 position: relative;
b69ab3151}
b69ab3152
b69ab3153/* used by the split branch selection */
b69ab3154.commit-avatar {
b69ab3155 position: absolute;
b69ab3156 border: 1px solid var(--foreground);
b69ab3157 margin-bottom: 0px;
b69ab3158 z-index: 3;
b69ab3159 background-color: var(--foreground, hsla(0, 0%, 0%, 0.1));
b69ab3160 display: inline-block;
b69ab3161 vertical-align: top;
b69ab3162 overflow: hidden;
b69ab3163 left: -22px;
b69ab3164 top: auto;
b69ab3165 bottom: auto;
b69ab3166 border-radius: 50%;
b69ab3167 height: 16px;
b69ab3168 width: 16px;
b69ab3169 box-sizing: border-box;
b69ab3170 transition:
b69ab3171 transform 0.2s,
b69ab3172 box-shadow 0.3s;
b69ab3173}
b69ab3174
b69ab3175/* Avatar may render below the top of the border,
b69ab3176 * cover up the border that peeks out the top with background color,
b69ab3177 * but only on the top commit of a stack
b69ab3178 */
b69ab3179.commit.topmost .commit-details:before {
b69ab3180 left: -15px;
b69ab3181 top: 0;
b69ab3182 content: '';
b69ab3183 width: 2px;
b69ab3184 height: calc(50%);
b69ab3185 background-color: var(--background);
b69ab3186 position: absolute;
b69ab3187}
b69ab3188.commit.topmost.head-commit .commit-details:before {
b69ab3189 background-color: var(--button-primary-hover-background);
b69ab3190}
b69ab3191
b69ab3192.commit.highlighted .commit-avatar {
b69ab3193 box-shadow: 0px 0px 4px 2px var(--focus-border);
b69ab3194 transform: scale(1.2);
b69ab3195}
b69ab3196
b69ab3197.head-commit .commit-avatar {
b69ab3198 border-color: var(--button-primary-hover-background);
b69ab3199}
b69ab31100
b69ab31101.commit.obsolete .commit-title {
b69ab31102 opacity: 0.5;
b69ab31103}
b69ab31104
b69ab31105.commit.irrelevant .commit-title {
b69ab31106 opacity: 0.5;
b69ab31107}
b69ab31108
b69ab31109.commit-rows {
b69ab31110 display: flex;
b69ab31111 flex-direction: row;
b69ab31112 gap: calc(var(--halfpad) / 2) var(--halfpad);
b69ab31113 padding: calc(var(--halfpad) / 2);
b69ab31114 padding-left: 0;
b69ab31115 margin-left: var(--halfpad);
b69ab31116 position: relative;
b69ab31117 align-items: center;
b69ab31118 z-index: 1;
b69ab31119}
b69ab31120
b69ab31121.commit-row-selected {
b69ab31122 background-color: var(--selected-commit-background);
ab83ad3123 outline: none;
ab83ad3124}
ab83ad3125.render-dag .commit-row-selected {
ab83ad3126 margin-left: calc(-1 * var(--pad));
ab83ad3127 padding-left: calc(2 * var(--pad));
b69ab31128}
b69ab31129
b69ab31130.commit-row-actioning {
b69ab31131 outline: 1px solid var(--focus-border);
b69ab31132 outline-offset: -1px;
b69ab31133}
b69ab31134
b69ab31135.commit-tree-root {
b69ab31136 min-width: 450px;
b69ab31137}
b69ab31138
b69ab31139.commit-tree-narrow .commit-rows {
b69ab31140 flex-direction: column;
b69ab31141 align-items: initial;
b69ab31142}
b69ab31143
b69ab31144.commit-tree-narrow .commit-group {
b69ab31145 gap: 0;
b69ab31146}
b69ab31147
b69ab31148.commit-details {
b69ab31149 cursor: pointer;
b69ab31150 display: flex;
b69ab31151 align-items: center;
b69ab31152 gap: var(--halfpad) var(--pad);
b69ab31153 position: relative;
b69ab31154 box-sizing: border-box;
b69ab31155 user-select: none;
b69ab31156 /* Increase Draggable Commit size to overlap with avatar, without changing where the commit renders */
b69ab31157 margin-left: -30px;
b69ab31158 padding-left: 30px;
b69ab31159 /* Increase drag target for commit on the right so you can drag nearly anywhere on the row to preview the rebase */
b69ab31160 margin-right: -400px;
b69ab31161 padding-right: 400px;
b69ab31162 /* Put drag target behind buttons, so expanded ranges don't interfere with clicking buttons */
b69ab31163 z-index: -1;
b69ab31164}
b69ab31165
b69ab31166.commit-title {
b69ab31167 min-width: 180px;
b69ab31168}
b69ab31169
b69ab31170.commit-details:focus-visible {
b69ab31171 outline: var(--focus-border) 1px auto;
b69ab31172 outline-offset: var(--halfpad);
b69ab31173}
b69ab31174
b69ab31175.commit-wide-drag-target {
b69ab31176 position: absolute;
b69ab31177 left: 0;
b69ab31178 top: 0;
b69ab31179 width: 500px; /* Arbitrary minimum size we want to be able to drag through, so we can't "miss" small commits */
b69ab31180 height: 100%;
b69ab31181 z-index: -100;
b69ab31182}
b69ab31183
b69ab31184.commit-details > .tooltip-creator {
b69ab31185 display: flex;
b69ab31186 align-items: center;
b69ab31187}
b69ab31188
b69ab31189.commit-second-row {
b69ab31190 display: flex;
b69ab31191 gap: var(--pad);
b69ab31192 align-items: center;
b69ab31193 flex-shrink: 0;
b69ab31194}
b69ab31195
b69ab31196.commit-date {
b69ab31197 font-size: 90%;
b69ab31198 opacity: 0.8;
b69ab31199 margin: 0 2px;
b69ab31200}
b69ab31201.commit-title .commit-date {
b69ab31202 margin-left: var(--pad);
b69ab31203}
b69ab31204
5ffddc6205
b69ab31206.commit .unsaved-message-indicator {
b69ab31207 color: var(--button-primary-background);
b69ab31208 display: flex;
b69ab31209}
b69ab31210
b69ab31211.commit vscode-tag::part(control) {
b69ab31212 text-transform: unset;
b69ab31213}
b69ab31214
b69ab31215.commit-preview-rebase-root,
b69ab31216.commit-preview-rebase-descendant {
b69ab31217 color: var(--scm-added-foreground);
b69ab31218}
b69ab31219.commit-preview-rebase-old {
b69ab31220 opacity: 0.5;
b69ab31221}
b69ab31222
b69ab31223.commit-preview-hidden-root > .commit-title,
b69ab31224.commit-preview-hidden-descendant > .commit-title {
b69ab31225 opacity: 0.5;
b69ab31226 text-decoration: line-through;
b69ab31227}
b69ab31228
b69ab31229.commit-inline-operation-progress {
b69ab31230 display: flex;
b69ab31231 flex-direction: row;
b69ab31232 align-items: center;
b69ab31233 font-size: 80%;
b69ab31234 gap: 10px;
b69ab31235 opacity: 0.9;
b69ab31236 margin-right: var(--halfpad);
b69ab31237}
b69ab31238
b69ab31239@media (prefers-reduced-motion: no-preference) {
b69ab31240 @keyframes delayFadeIn {
b69ab31241 0% {
b69ab31242 opacity: 0;
b69ab31243 }
b69ab31244 90% {
b69ab31245 opacity: 0;
b69ab31246 }
b69ab31247 100% {
b69ab31248 opacity: 1;
b69ab31249 }
b69ab31250 }
b69ab31251
b69ab31252 .commit-inline-operation-progress {
b69ab31253 animation: delayFadeIn 1s ease-in-out;
b69ab31254 }
b69ab31255}
b69ab31256
b69ab31257.goto-button,
b69ab31258.open-commit-info-button {
b69ab31259 opacity: 0;
b69ab31260 transition: opacity 0.1s;
b69ab31261}
b69ab31262
b69ab31263.commit:hover .goto-button,
b69ab31264.commit:hover .open-commit-info-button {
b69ab31265 opacity: 1;
b69ab31266}
b69ab31267
b69ab31268.goto-button:focus-within,
b69ab31269.open-commit-info-button:focus-within {
b69ab31270 opacity: 1;
b69ab31271}
b69ab31272
b69ab31273.stable-commit-metadata {
b69ab31274 display: flex;
b69ab31275}
b69ab31276
b69ab31277.stable-commit-metadata vscode-tag::part(control) {
b69ab31278 background-color: var(--list-hover-background);
b69ab31279 color: var(--list-hover-foreground);
b69ab31280 text-overflow: ellipsis;
b69ab31281 max-width: 150px;
b69ab31282 white-space: nowrap;
b69ab31283 overflow: hidden;
b69ab31284}
b69ab31285
b69ab31286.tooltip span.commit-title {
b69ab31287 border-radius: 4px;
b69ab31288 padding: 1px 4px;
b69ab31289 font-size: 90%;
b69ab31290 background-color: var(--hover-darken);
b69ab31291}
b69ab31292
b69ab31293.fetch-additional-commits-row {
b69ab31294 display: flex;
b69ab31295 align-items: center;
b69ab31296 margin: var(--halfpad);
b69ab31297 position: relative;
b69ab31298 min-height: var(--vscode-icon-button-height);
b69ab31299}