Eric Amodio пре 2 година
родитељ
комит
1fa651d1bc
1 измењених фајлова са 276 додато и 269 уклоњено
  1. +276
    -269
      src/webviews/apps/commitDetails/commitDetails.scss

+ 276
- 269
src/webviews/apps/commitDetails/commitDetails.scss Прегледај датотеку

@ -3,9 +3,9 @@
// @import '../shared/icons';
:root {
--gitlens-gutter-width: 20px;
--gitlens-scrollbar-gutter-width: 10px;
--gitlens-view-background-color: #fafafa;
--gitlens-gutter-width: 20px;
--gitlens-scrollbar-gutter-width: 10px;
--gitlens-view-background-color: #fafafa;
}
// generic resets
@ -17,11 +17,11 @@ html {
}
* {
&,
&::before,
&::after {
box-sizing: inherit;
}
&,
&::before,
&::after {
box-sizing: inherit;
}
}
body {
@ -43,299 +43,306 @@ ul {
}
.button {
--button-foreground: var(--vscode-button-foreground);
--button-background: var(--vscode-button-background);
--button-hover-background: var(--vscode-button-hoverBackground);
--button-foreground: var(--vscode-button-foreground);
--button-background: var(--vscode-button-background);
--button-hover-background: var(--vscode-button-hoverBackground);
display: inline-block;
border: none;
padding: 0.4rem;
font-size: inherit;
line-height: inherit;
text-align: center;
line-height: inherit;
text-align: center;
text-decoration: none;
user-select: none;
background: var(--button-background);
color: var(--button-foreground);
color: var(--button-foreground);
cursor: pointer;
&:hover {
background: var(--button-hover-background);
}
&:hover {
background: var(--button-hover-background);
}
&:focus {
outline: 1px solid var(--vscode-focusBorder);
outline-offset: 0.2rem;
}
&:focus {
outline: 1px solid var(--vscode-focusBorder);
outline-offset: 0.2rem;
}
&--full {
width: 100%;
}
&--full {
width: 100%;
}
}
// webview-specific styles
.change-list {
list-style: none;
&__item {
// & + & {
// margin-top: 0.25rem;
// }
}
&__link {
width: 100%;
color: inherit;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
&__type {}
&__filename {}
&__path {}
&__actions {
flex: none;
}
&__action {}
list-style: none;
&__item {
// & + & {
// margin-top: 0.25rem;
// }
}
&__link {
width: 100%;
color: inherit;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
&__type {
}
&__filename {
}
&__path {
}
&__actions {
flex: none;
}
&__action {
}
}
.pull-request,
.issue {
display: grid;
gap: 0.25rem 0.5rem;
justify-content: start;
&__icon {
grid-column: 1;
grid-row: 1 / 3;
color: var(--vscode-gitlens-mergedPullRequestIconColor);
}
&__title {
grid-column: 2;
grid-row: 1;
margin: 0;
font-size: 1.5rem;
}
&__date {
grid-column: 2;
grid-row: 2;
margin: 0;
font-size: 1.2rem;
}
display: grid;
gap: 0.25rem 0.5rem;
justify-content: start;
&__icon {
grid-column: 1;
grid-row: 1 / 3;
color: var(--vscode-gitlens-mergedPullRequestIconColor);
}
&__title {
grid-column: 2;
grid-row: 1;
margin: 0;
font-size: 1.5rem;
}
&__date {
grid-column: 2;
grid-row: 2;
margin: 0;
font-size: 1.2rem;
}
}
.commit-author {
display: grid;
gap: 0.25rem 0.5rem;
justify-content: start;
&__avatar {
grid-column: 1;
grid-row: 1 / 3;
}
&__name {
grid-column: 2;
grid-row: 1;
font-size: 1.5rem;
}
&__date {
grid-column: 2;
grid-row: 2;
font-size: 1.2rem;
}
display: grid;
gap: 0.25rem 0.5rem;
justify-content: start;
&__avatar {
grid-column: 1;
grid-row: 1 / 3;
}
&__name {
grid-column: 2;
grid-row: 1;
font-size: 1.5rem;
}
&__date {
grid-column: 2;
grid-row: 2;
font-size: 1.2rem;
}
}
.commit-details {
&__commit {
padding: { // 1.5rem
left: var( --gitlens-gutter-width);
right: var( --gitlens-scrollbar-gutter-width);
}
// background-color: var(--color-background--lighten-05);
margin-bottom: 1.75rem;
display: flex;
flex-direction: column;
gap: 1.5rem;
}
&__top {
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: space-between;
gap: 0.5rem;
}
&__message {
font-size: 1.5rem;
border: 1px solid var(--color-background--lighten-15);
padding: 0.5rem;
}
&__message-text {
flex: 1;
margin: 0;
display: block;
@supports (-webkit-line-clamp: 6) {
display: -webkit-box;
-webkit-line-clamp: 6;
-webkit-box-orient: vertical;
overflow: hidden;
}
}
&__commit-action {
display: inline-flex;
justify-content: center;
align-items: center;
width: 20px;
height: 20px;
border-radius: 0.25em;
color: inherit;
padding: 2px;
vertical-align: text-bottom;
text-decoration: none;
> * {
pointer-events: none;
}
&:hover {
&__commit {
padding: {
// 1.5rem
left: var(--gitlens-gutter-width);
right: var(--gitlens-scrollbar-gutter-width);
}
// background-color: var(--color-background--lighten-05);
margin-bottom: 1.75rem;
display: flex;
flex-direction: column;
gap: 1.5rem;
}
&__top {
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: space-between;
gap: 0.5rem;
}
&__message {
font-size: 1.5rem;
border: 1px solid var(--color-background--lighten-15);
padding: 0.5rem;
}
&__message-text {
flex: 1;
margin: 0;
display: block;
@supports (-webkit-line-clamp: 6) {
display: -webkit-box;
-webkit-line-clamp: 6;
-webkit-box-orient: vertical;
overflow: hidden;
}
}
&__commit-action {
display: inline-flex;
justify-content: center;
align-items: center;
width: 20px;
height: 20px;
border-radius: 0.25em;
color: inherit;
padding: 2px;
vertical-align: text-bottom;
text-decoration: none;
> * {
pointer-events: none;
}
&:hover {
color: var(--vscode-foreground);
background-color: var(--color-background--lighten-15);
}
}
&__authors {
flex-basis: 100%;
}
&__author {
& + & {
margin-top: 0.5rem;
}
}
&__rich {
padding: 0.5rem var( --gitlens-scrollbar-gutter-width) 1rem var( --gitlens-gutter-width);
> :last-child {
margin-top: 0.5rem;
}
}
&__pull-request {}
&__issue {
> :not(:first-child) {
margin-top: 0.5rem;
}
}
&__stats {
margin-left: 0.5rem;
}
// &__files {
// border-top: 1px solid var(--color-background--lighten-075);
// padding: {
// top: 1.75rem;
// }
// }
&__file {
padding: {
left: var( --gitlens-gutter-width);
right: var( --gitlens-scrollbar-gutter-width);
top: 1px;
bottom: 1px;
}
}
&__item-skeleton {
padding: {
left: var( --gitlens-gutter-width);
right: var( --gitlens-scrollbar-gutter-width);
top: 1px;
bottom: 1px;
}
}
}
&__authors {
flex-basis: 100%;
}
&__author {
& + & {
margin-top: 0.5rem;
}
}
&__rich {
padding: 0.5rem var(--gitlens-scrollbar-gutter-width) 1rem var(--gitlens-gutter-width);
> :last-child {
margin-top: 0.5rem;
}
}
&__pull-request {
}
&__issue {
> :not(:first-child) {
margin-top: 0.5rem;
}
}
&__stats {
margin-left: 0.5rem;
}
// &__files {
// border-top: 1px solid var(--color-background--lighten-075);
// padding: {
// top: 1.75rem;
// }
// }
&__file {
padding: {
left: var(--gitlens-gutter-width);
right: var(--gitlens-scrollbar-gutter-width);
top: 1px;
bottom: 1px;
}
}
&__item-skeleton {
padding: {
left: var(--gitlens-gutter-width);
right: var(--gitlens-scrollbar-gutter-width);
top: 1px;
bottom: 1px;
}
}
}
.commit-detail-panel {
$block: &;
max-height: 100vh;
overflow: auto;
scrollbar-gutter: stable;
[aria-hidden="true"] {
display: none;
}
&__none {
padding: {
left: var( --gitlens-gutter-width);
right: var( --gitlens-scrollbar-gutter-width);
}
}
&__header {
margin: {
top: 1rem;
bottom: 1.5rem;
}
}
&__title {
font-size: 2.4rem;
// FIXME: specificity hack
&-icon {
// color: var(--vscode-banner-iconForeground);
font-size: inherit !important;
}
}
&__nav {
border: 1px solid var(--color-button-secondary-background);
padding: 0.5rem;
margin: {
top: 1rem;
bottom: 1.5rem;
}
}
&__commit-count {
margin: {
top: 0;
bottom: 0.5rem;
}
}
&__commits {}
&__commit {
& + & {
margin-top: 0.5rem;
}
}
&__commit-button {
appearance: none;
text-decoration: none;
border: none;
color: var(--color-button-foreground);
background-color: var(--color-button-secondary-background);
padding: 0.5rem;
display: flex;
align-items: center;
width: 100%;
gap: 0.5rem;
> :last-child {
margin-left: auto;
}
&[aria-current="true"] {
background-color: var(--color-button-background);
}
}
&__main {
padding: {
top: 1rem;
bottom: 1rem;
}
}
$block: &;
max-height: 100vh;
overflow: auto;
scrollbar-gutter: stable;
[aria-hidden='true'] {
display: none;
}
&__none {
padding: {
left: var(--gitlens-gutter-width);
right: var(--gitlens-scrollbar-gutter-width);
}
}
&__header {
margin: {
top: 1rem;
bottom: 1.5rem;
}
}
&__title {
font-size: 2.4rem;
// FIXME: specificity hack
&-icon {
// color: var(--vscode-banner-iconForeground);
font-size: inherit !important;
}
}
&__nav {
border: 1px solid var(--color-button-secondary-background);
padding: 0.5rem;
margin: {
top: 1rem;
bottom: 1.5rem;
}
}
&__commit-count {
margin: {
top: 0;
bottom: 0.5rem;
}
}
&__commits {
}
&__commit {
& + & {
margin-top: 0.5rem;
}
}
&__commit-button {
appearance: none;
text-decoration: none;
border: none;
color: var(--color-button-foreground);
background-color: var(--color-button-secondary-background);
padding: 0.5rem;
display: flex;
align-items: center;
width: 100%;
gap: 0.5rem;
> :last-child {
margin-left: auto;
}
&[aria-current='true'] {
background-color: var(--color-button-background);
}
}
&__main {
padding: {
top: 1rem;
bottom: 1rem;
}
}
}
@import '../shared/codicons';

||||||
x
 
000:0
Loading…
Откажи
Сачувај