• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号
登陆 注册

TypeScript themeService.ITheme类代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中vs/platform/theme/common/themeService.ITheme类的典型用法代码示例。如果您正苦于以下问题：TypeScript ITheme类的具体用法？TypeScript ITheme怎么用？TypeScript ITheme使用的例子？那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。



在下文中一共展示了ITheme类的10个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: constructor

	constructor(config: editorCommon.IConfiguration, theme: ITheme) {
		this.lineHeight = config.editor.lineHeight;
		this.pixelRatio = config.editor.pixelRatio;
		this.overviewRulerLanes = config.editor.viewInfo.overviewRulerLanes;

		this.renderBorder = config.editor.viewInfo.overviewRulerBorder;
		const borderColor = theme.getColor(editorOverviewRulerBorder);
		this.borderColor = borderColor ? borderColor.toString() : null;

		this.hideCursor = config.editor.viewInfo.hideCursorInOverviewRuler;
		const cursorColor = theme.getColor(editorCursorForeground);
		this.cursorColor = cursorColor ? cursorColor.transparent(0.7).toString() : null;

		this.themeType = theme.type;

		const minimapEnabled = config.editor.viewInfo.minimap.enabled;
		const backgroundColor = (minimapEnabled ? TokenizationRegistry.getDefaultBackground() : null);
		this.backgroundColor = (backgroundColor ? Color.Format.CSS.formatHex(backgroundColor) : null);

		const position = config.editor.layoutInfo.overviewRuler;
		this.top = position.top;
		this.right = position.right;
		this.domWidth = position.width;
		this.domHeight = position.height;
		this.canvasWidth = (this.domWidth * this.pixelRatio) | 0;
		this.canvasHeight = (this.domHeight * this.pixelRatio) | 0;

		const [x, w] = this._initLanes(1, this.canvasWidth, this.overviewRulerLanes);
		this.x = x;
		this.w = w;
	}
开发者ID:gokulakrishna9，项目名称:vscode，代码行数:31，代码来源:decorationsOverviewRuler.ts


示例2: getExtraColor

export function getExtraColor(theme: ITheme, colorId: string, defaults: ColorDefaults & { extra_dark: string }): ColorValue {
	const color = theme.getColor(colorId);
	if (color) {
		return color;
	}

	if (theme.type === 'dark') {
		const background = theme.getColor(editorBackground);
		if (background && background.getRelativeLuminance() < 0.004) {
			return defaults.extra_dark;
		}
	}

	return defaults[theme.type];
}
开发者ID:AlexxNica，项目名称:sqlopsstudio，代码行数:15，代码来源:walkThroughUtils.ts


示例3: applyStyles

	function applyStyles(theme: ITheme): void {
		const styles = Object.create(null);
		for (let key in optionsMapping) {
			styles[key] = theme.getColor(optionsMapping[key]);
		}

		widget.style(styles);
	}
开发者ID:thinhpham，项目名称:vscode，代码行数:8，代码来源:styler.ts


示例4: getColor

	protected getColor(id: string, modify?: (color: Color, theme: ITheme) => Color): string {
		let color = this.theme.getColor(id);

		if (color && modify) {
			color = modify(color, this.theme);
		}

		return color ? color.toString() : null;
	}
开发者ID:ramesius，项目名称:vscode，代码行数:9，代码来源:theme.ts


示例5: applyStyles

	function applyStyles(theme: ITheme): void {
		const styles = Object.create(null);
		for (let key in optionsMapping) {
			const value = optionsMapping[key];
			if (typeof value === 'string') {
				styles[key] = theme.getColor(value);
			} else if (typeof value === 'function') {
				styles[key] = value(theme);
			}
		}

		widget.style(styles);
	}
开发者ID:wangcheng678，项目名称:vscode，代码行数:13，代码来源:styler.ts


示例6: computeStyles

export function computeStyles(theme: ITheme, styleMap: IColorMapping): IComputedStyles {
	const styles = Object.create(null) as IComputedStyles;
	for (let key in styleMap) {
		const value = styleMap[key as string];
		if (typeof value === 'string') {
			styles[key] = theme.getColor(value);
		} else if (typeof value === 'function') {
			styles[key] = value(theme);
		}
	}

	return styles;
}
开发者ID:jumpinjackie，项目名称:sqlopsstudio，代码行数:13，代码来源:styler.ts


示例7: registerThemingParticipant

registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {

	// Foreground
	const windowForeground = theme.getColor(foreground);
	if (windowForeground) {
		collector.addRule(`.monaco-workbench { color: ${windowForeground}; }`);
	}

	// Selection
	const windowSelectionBackground = theme.getColor(selectionBackground);
	if (windowSelectionBackground) {
		collector.addRule(`.monaco-workbench ::selection { background-color: ${windowSelectionBackground}; }`);
	}

	// Input placeholder
	const placeholderForeground = theme.getColor(inputPlaceholderForeground);
	if (placeholderForeground) {
		collector.addRule(`.monaco-workbench input::-webkit-input-placeholder { color: ${placeholderForeground}; }`);
		collector.addRule(`.monaco-workbench textarea::-webkit-input-placeholder { color: ${placeholderForeground}; }`);
	}

	// List highlight
	const listHighlightForegroundColor = theme.getColor(listHighlightForeground);
	if (listHighlightForegroundColor) {
		collector.addRule(`
			.monaco-workbench .monaco-tree .monaco-tree-row .monaco-highlighted-label .highlight,
			.monaco-workbench .monaco-list .monaco-list-row .monaco-highlighted-label .highlight {
				color: ${listHighlightForegroundColor};
			}
		`);
	}

	// We need to set the workbench background color so that on Windows we get subpixel-antialiasing.
	const workbenchBackground = WORKBENCH_BACKGROUND(theme);
	collector.addRule(`.monaco-workbench { background-color: ${workbenchBackground}; }`);

	// Scrollbars
	const scrollbarShadowColor = theme.getColor(scrollbarShadow);
	if (scrollbarShadowColor) {
		collector.addRule(`
			.monaco-workbench .monaco-scrollable-element > .shadow.top {
				box-shadow: ${scrollbarShadowColor} 0 6px 6px -6px inset;
			}

			.monaco-workbench .monaco-scrollable-element > .shadow.left {
				box-shadow: ${scrollbarShadowColor} 6px 0 6px -6px inset;
			}

			.monaco-workbench .monaco-scrollable-element > .shadow.top.left {
				box-shadow: ${scrollbarShadowColor} 6px 6px 6px -6px inset;
			}
		`);
	}

	const scrollbarSliderBackgroundColor = theme.getColor(scrollbarSliderBackground);
	if (scrollbarSliderBackgroundColor) {
		collector.addRule(`
			.monaco-workbench .monaco-scrollable-element > .scrollbar > .slider {
				background: ${scrollbarSliderBackgroundColor};
			}
		`);
	}

	const scrollbarSliderHoverBackgroundColor = theme.getColor(scrollbarSliderHoverBackground);
	if (scrollbarSliderHoverBackgroundColor) {
		collector.addRule(`
			.monaco-workbench .monaco-scrollable-element > .scrollbar > .slider:hover {
				background: ${scrollbarSliderHoverBackgroundColor};
			}
		`);
	}

	const scrollbarSliderActiveBackgroundColor = theme.getColor(scrollbarSliderActiveBackground);
	if (scrollbarSliderActiveBackgroundColor) {
		collector.addRule(`
			.monaco-workbench .monaco-scrollable-element > .scrollbar > .slider.active {
				background: ${scrollbarSliderActiveBackgroundColor};
			}
		`);
	}

	// Focus outline
	const focusOutline = theme.getColor(focusBorder);
	if (focusOutline) {
		collector.addRule(`
		.monaco-workbench [tabindex="0"]:focus,
		.monaco-workbench .synthetic-focus,
		.monaco-workbench select:focus,
		.monaco-workbench .monaco-tree.focused.no-focused-item:focus:before,
		.monaco-workbench .monaco-list:not(.element-focused):focus:before,
		.monaco-workbench input[type="button"]:focus,
		.monaco-workbench input[type="text"]:focus,
		.monaco-workbench button:focus,
		.monaco-workbench textarea:focus,
		.monaco-workbench input[type="search"]:focus,
		.monaco-workbench input[type="checkbox"]:focus {
			outline-color: ${focusOutline};
		}
		`);
	}
//.........这里部分代码省略.........
开发者ID:PKRoma，项目名称:vscode，代码行数:101，代码来源:style.ts


示例8: registerThemingParticipant

registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {

	// Title Active
	const titleActive = theme.getColor(PANEL_ACTIVE_TITLE_FOREGROUND);
	const titleActiveBorder = theme.getColor(PANEL_ACTIVE_TITLE_BORDER);
	if (titleActive || titleActiveBorder) {
		collector.addRule(`
			.tabbedPanel > .title > .tabList .tab:hover .tabLabel,
			.tabbedPanel > .title > .tabList .tab .tabLabel.active {
				color: ${titleActive};
				border-bottom-color: ${titleActiveBorder};
			}

			.tabbedPanel > .title > .tabList .tab-header.active {
				outline: none;
			}
		`);
	}

	// Title Inactive
	const titleInactive = theme.getColor(PANEL_INACTIVE_TITLE_FOREGROUND);
	if (titleInactive) {
		collector.addRule(`
			.tabbedPanel > .title > .tabList .tab .tabLabel {
				color: ${titleInactive};
			}
		`);
	}

	// Title focus
	const focusBorderColor = theme.getColor(focusBorder);
	if (focusBorderColor) {
		collector.addRule(`
			.tabbedPanel > .title > .tabList .tab .tabLabel:focus {
				color: ${titleActive};
				border-bottom-color: ${focusBorderColor} !important;
				border-bottom: 1px solid;
				outline: none;
			}
		`);
	}

	// Styling with Outline color (e.g. high contrast theme)
	const outline = theme.getColor(activeContrastBorder);
	if (outline) {
		collector.addRule(`
			.tabbedPanel > .title > .tabList .tab-header.active,
			.tabbedPanel > .title > .tabList .tab-header:hover {
				outline-color: ${outline};
				outline-width: 1px;
				outline-style: solid;
				padding-bottom: 0;
				outline-offset: -5px;
			}

			.tabbedPanel > .title > .tabList .tab-header:hover:not(.active) {
				outline-style: dashed;
			}
		`);
	}
});
开发者ID:AlexxNica，项目名称:sqlopsstudio，代码行数:61，代码来源:panelStyles.ts


示例9: registerThemingParticipant

registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {

	// Title Active
	const tabActiveBackground = theme.getColor(TAB_ACTIVE_BACKGROUND);
	const tabActiveForeground = theme.getColor(TAB_ACTIVE_FOREGROUND);
	if (tabActiveBackground || tabActiveForeground) {
		collector.addRule(`
			panel.dashboard-panel > .tabbedPanel > .title .tabList .tab:hover .tabLabel,
			panel.dashboard-panel > .tabbedPanel > .title .tabList .tab .tabLabel.active {
				color: ${tabActiveForeground};
				border-bottom: 0px solid;
			}

			panel.dashboard-panel > .tabbedPanel > .title .tabList .tab-header.active {
				background-color: ${tabActiveBackground};
				outline-color: ${tabActiveBackground};
			}

			panel.dashboard-panel > .tabbedPanel.horizontal > .title .tabList .tab-header.active {
				border-bottom-color: transparent;
			}

			panel.dashboard-panel > .tabbedPanel.vertical > .title .tabList .tab-header.active {
				border-right-color: transparent;
			}
		`);
	}

	const activeTabBorderColor = theme.getColor(TAB_ACTIVE_BORDER);
	if (activeTabBorderColor) {
		collector.addRule(`
			panel.dashboard-panel > .tabbedPanel > .title .tabList .tab-header.active {
				box-shadow: ${activeTabBorderColor} 0 -1px inset;
			}
		`);
	}

	// Title Inactive
	const tabInactiveBackground = theme.getColor(TAB_INACTIVE_BACKGROUND);
	const tabInactiveForeground = theme.getColor(TAB_INACTIVE_FOREGROUND);
	if (tabInactiveBackground || tabInactiveForeground) {
		collector.addRule(`
			panel.dashboard-panel > .tabbedPanel > .title .tabList .tab .tabLabel {
				color: ${tabInactiveForeground};
			}

			panel.dashboard-panel > .tabbedPanel > .title .tabList .tab-header {
				background-color: ${tabInactiveBackground};
			}
		`);
	}

	// Panel title background
	const panelTitleBackground = theme.getColor(EDITOR_GROUP_HEADER_TABS_BACKGROUND);
	if (panelTitleBackground) {
		collector.addRule(`
			panel.dashboard-panel > .tabbedPanel > .title {
				background-color: ${panelTitleBackground};
			}
		`);
	}

	// Panel title background
	const tabBorder = theme.getColor(TAB_BORDER);
	if (tabBorder) {
		collector.addRule(`
			panel.dashboard-panel > .tabbedPanel > .title .tabList .tab-header {
				border-right-color: ${tabBorder};
				border-bottom-color: ${tabBorder};
			}
		`);
	}

	// Styling with Outline color (e.g. high contrast theme)
	const outline = theme.getColor(activeContrastBorder);
	if (outline) {
		collector.addRule(`
			panel.dashboard-panel > .tabbedPanel > .title {
				border-bottom-color: ${tabBorder};
				border-bottom-width: 1px;
				border-bottom-style: solid;
			}

			panel.dashboard-panel > .tabbedPanel.vertical > .title {
				border-right-color: ${tabBorder};
				border-right-width: 1px;
				border-right-style: solid;
			}
		`);
	}

	const divider = theme.getColor(EDITOR_GROUP_BORDER);
	if (divider) {
		collector.addRule(`
			panel.dashboard-panel > .tabbedPanel > .title .tabList .tab-header {
				border-right-width: 1px;
				border-right-style: solid;
			}
		`);
	}
//.........这里部分代码省略.........
开发者ID:burhandodhy，项目名称:azuredatastudio，代码行数:101，代码来源:dashboardPanelStyles.ts


示例10: getColor

	protected getColor(id: string): string {
		const color = this.theme.getColor(id);

		return color ? color.toString() : null;
	}
开发者ID:thinhpham，项目名称:vscode，代码行数:5，代码来源:theme.ts



注：本文中的vs/platform/theme/common/themeService.ITheme类示例由纯净天空整理自Github/MSDocs等源码及文档管理平台，相关代码片段筛选自各路编程大神贡献的开源项目，源码版权归原作者所有，传播和使用请参考对应项目的License；未经允许，请勿转载。

鲜花
握手
雷人
路过
鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
More+
上一篇：
TypeScript themeService.IThemeService类代码示例发布时间：2022-05-25
下一篇：
TypeScript themeService.ICssStyleCollector类代码示例发布时间：2022-05-25
热门推荐
More+
热门话题
More+
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服（服务时间 9:00～18:00）

在线QQ客服
地址：深圳市南山区西丽大学城创智工业园
电邮：jeky_zhao#qq.com
移动电话：139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap