diff --git a/src/webviews/apps/rebase/rebase.ts b/src/webviews/apps/rebase/rebase.ts index d1d64b5..937e987 100644 --- a/src/webviews/apps/rebase/rebase.ts +++ b/src/webviews/apps/rebase/rebase.ts @@ -243,7 +243,24 @@ class RebaseEditor extends App { } $container.innerHTML = ''; - if (state.entries.length === 0) return; + if (state.entries.length === 0) { + $container.classList.add('entries--empty'); + + const $button = document.querySelector('.button[name="start"]'); + if ($button != null) { + $button.disabled = true; + } + + const $entry = document.createElement('li'); + + const $el = document.createElement('h3'); + $el.innerText = 'No commits to rebase'; + + $entry.appendChild($el); + $container.appendChild($entry); + + return; + } let squashing = false; let squashToHere = false; diff --git a/src/webviews/apps/scss/buttons.scss b/src/webviews/apps/scss/buttons.scss index 207c165..24844a8 100644 --- a/src/webviews/apps/scss/buttons.scss +++ b/src/webviews/apps/scss/buttons.scss @@ -16,6 +16,11 @@ &:focus { outline: none; } + + &[disabled] { + cursor: default !important; + opacity: 0.25 !important; + } } .button--big { @@ -29,21 +34,21 @@ } .vscode-dark & { border: 1px solid rgba(255, 255, 255, 0.6); - color: white !important; + color: white; } transition: background-color 250ms, border-color 250ms, color 250ms; - &:hover, - &:focus { + &:not([disabled]):hover, + &:not([disabled]):focus { .vscode-light & { background-color: var(--color-button-background--darken-30); border-color: var(--color-button-background--darken-30); - color: white !important; + color: white; } .vscode-dark & { background-color: white; border-color: white; - color: black !important; + color: black; } } @@ -55,15 +60,15 @@ .button--flat-inverse { background-color: white; border: 1px solid white; - color: black !important; + color: black; font-weight: 600; transition: background-color 250ms, border-color 250ms, color 250ms; - &:hover, - &:focus { + &:not([disabled]):hover, + &:not([disabled]):focus { background: rgba(0, 0, 0, 0.2); border-color: rgba(255, 255, 255, 0.6); - color: white !important; + color: white; } .preload & { @@ -74,22 +79,22 @@ .button--flat-primary { background-color: var(--color-button-background); border: 1px solid var(--color-button-background); - color: var(--color-button-foreground) !important; + color: var(--color-button-foreground); font-weight: 600; transition: background-color 250ms, border-color 250ms, color 250ms; - &:hover, - &:focus { + &:not([disabled]):hover, + &:not([disabled]):focus { .vscode-dark & { background-color: white; border-color: white; - color: black !important; + color: black; } .vscode-light & { background-color: var(--color-button-background--darken-30); border-color: var(--color-button-background--darken-30); - color: white !important; + color: white; } } diff --git a/src/webviews/apps/scss/rebase.scss b/src/webviews/apps/scss/rebase.scss index 31f89fd..fd5589a 100644 --- a/src/webviews/apps/scss/rebase.scss +++ b/src/webviews/apps/scss/rebase.scss @@ -47,6 +47,15 @@ h4 { } } +.entries--empty { + border: none; + + h3 { + margin: 1em auto; + width: fit-content; + } +} + .shortcuts { grid-area: shortcuts; margin: 0 auto;