theming - initial "send a smile" work
This commit is contained in:
parent
bf53bb089c
commit
72e7b8eabb
2 changed files with 27 additions and 42 deletions
|
@ -17,6 +17,9 @@ import * as dom from 'vs/base/browser/dom';
|
|||
import { ICommandService } from 'vs/platform/commands/common/commands';
|
||||
import * as errors from 'vs/base/common/errors';
|
||||
import { IIntegrityService } from 'vs/platform/integrity/common/integrity';
|
||||
import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector } from "vs/platform/theme/common/themeService";
|
||||
import { attachStylerCallback } from "vs/platform/theme/common/styler";
|
||||
import { editorWidgetBackground, widgetShadow, inputBorder, inputForeground, inputBackground, inputActiveOptionBorder, editorBackground } from "vs/platform/theme/common/colorRegistry";
|
||||
|
||||
export interface IFeedback {
|
||||
feedback: string;
|
||||
|
@ -67,7 +70,8 @@ export class FeedbackDropdown extends Dropdown {
|
|||
options: IFeedbackDropdownOptions,
|
||||
@ITelemetryService protected telemetryService: ITelemetryService,
|
||||
@ICommandService private commandService: ICommandService,
|
||||
@IIntegrityService protected integrityService: IIntegrityService
|
||||
@IIntegrityService protected integrityService: IIntegrityService,
|
||||
@IThemeService private themeService: IThemeService
|
||||
) {
|
||||
super(container, {
|
||||
contextViewProvider: options.contextViewProvider,
|
||||
|
@ -200,6 +204,17 @@ export class FeedbackDropdown extends Dropdown {
|
|||
this.onSubmit();
|
||||
});
|
||||
|
||||
this.toDispose.push(attachStylerCallback(this.themeService, { widgetShadow, editorWidgetBackground, inputBackground, inputForeground, inputBorder, editorBackground }, colors => {
|
||||
$form.style('background-color', colors.editorWidgetBackground);
|
||||
$form.style('box-shadow', colors.widgetShadow ? `0 2px 8px ${colors.widgetShadow}` : null);
|
||||
|
||||
this.feedbackDescriptionInput.style.backgroundColor = colors.inputBackground;
|
||||
this.feedbackDescriptionInput.style.color = colors.inputForeground;
|
||||
this.feedbackDescriptionInput.style.border = `1px solid ${colors.inputBorder || 'transparent'}`;
|
||||
|
||||
$contactUs.style('background-color', colors.editorBackground);
|
||||
}));
|
||||
|
||||
return {
|
||||
dispose: () => {
|
||||
this.feedbackForm = null;
|
||||
|
@ -329,3 +344,12 @@ export class FeedbackDropdown extends Dropdown {
|
|||
this.aliasEnabled = false;
|
||||
}
|
||||
}
|
||||
|
||||
registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {
|
||||
|
||||
// Sentiment Buttons
|
||||
const inputActiveOptionBorderColor = theme.getColor(inputActiveOptionBorder);
|
||||
if (inputActiveOptionBorderColor) {
|
||||
collector.addRule(`.monaco-shell .feedback-form .sentiment.checked { border: 1px solid ${inputActiveOptionBorderColor}; }`);
|
||||
}
|
||||
});
|
|
@ -36,17 +36,9 @@
|
|||
|
||||
.monaco-shell .feedback-form .content .contactus {
|
||||
padding: 10px;
|
||||
border: solid 1px #B4BABF;
|
||||
background-color: #EBF2F9;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.monaco-shell.vs-dark .feedback-form .content .contactus {
|
||||
border: solid 1px #44444C;
|
||||
background-color: #333337;
|
||||
}
|
||||
|
||||
|
||||
.monaco-shell .feedback-form .content .channels {
|
||||
margin-top: 5px;
|
||||
font-size: 0.9em;
|
||||
|
@ -148,10 +140,6 @@
|
|||
background-color: #eaeaea;
|
||||
}
|
||||
|
||||
.monaco-shell .feedback-form .sentiment.checked {
|
||||
border: 1px solid #39F;
|
||||
}
|
||||
|
||||
/* Statusbar */
|
||||
.monaco-shell .statusbar-item > .dropdown.send-feedback {
|
||||
display: inline-block;
|
||||
|
@ -163,11 +151,6 @@
|
|||
}
|
||||
|
||||
/* Theming */
|
||||
.monaco-shell.vs .feedback-form {
|
||||
color: black;
|
||||
background: #F6F6F6;
|
||||
}
|
||||
|
||||
.monaco-shell .feedback-form h2 {
|
||||
color: #007ACC;
|
||||
}
|
||||
|
@ -224,11 +207,6 @@
|
|||
background-color: #E51400;
|
||||
}
|
||||
|
||||
.monaco-shell.vs-dark .feedback-form {
|
||||
background: #252526;
|
||||
box-shadow: 0 2px 8px #000;
|
||||
}
|
||||
|
||||
.monaco-shell.vs-dark .feedback-form h2 {
|
||||
color: #75BEFF;
|
||||
}
|
||||
|
@ -239,18 +217,11 @@
|
|||
}
|
||||
|
||||
.monaco-shell.vs-dark .feedback-form .sentiment:hover {
|
||||
background-color: #1e1e1e;
|
||||
}
|
||||
|
||||
.monaco-shell.vs-dark .feedback-form .sentiment.checked {
|
||||
border-color: #75BEFF;
|
||||
background-color: rgba(30,30,30,0.8);
|
||||
}
|
||||
|
||||
.monaco-shell.vs-dark .feedback-form .feedback-alias, .monaco-shell.vs-dark .feedback-form .feedback-description {
|
||||
font-family: inherit;
|
||||
border: 1px solid transparent;
|
||||
background-color: #333337;
|
||||
color: #D4D4D4;
|
||||
}
|
||||
|
||||
.monaco-shell.vs-dark .feedback-form .cancel,
|
||||
|
@ -259,7 +230,7 @@
|
|||
}
|
||||
|
||||
.monaco-shell.vs-dark .feedback-form .cancel:hover {
|
||||
background-color: #1e1e1e;
|
||||
background-color: rgba(30,30,30,0.8);
|
||||
}
|
||||
|
||||
.monaco-shell .feedback-form .sentiment.smile {
|
||||
|
@ -312,9 +283,6 @@
|
|||
|
||||
.monaco-shell.hc-black .feedback-form .feedback-alias, .monaco-shell.hc-black .feedback-form .feedback-description {
|
||||
font-family: inherit;
|
||||
border: 1px solid #6FC3DF;
|
||||
background-color: #000;
|
||||
color: #D4D4D4;
|
||||
}
|
||||
|
||||
.monaco-shell.hc-black .feedback-form .content .contactus {
|
||||
|
@ -343,13 +311,6 @@
|
|||
background-color: #0C141F;
|
||||
}
|
||||
|
||||
.monaco-shell.hc-black .feedback-form .sentiment {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.monaco-shell.hc-black .feedback-form .sentiment.checked {
|
||||
border: 1px solid #f38518;
|
||||
}
|
||||
|
||||
.monaco-shell .feedback-form .infotip {
|
||||
background: none;
|
||||
|
|
Loading…
Reference in a new issue