Split editor stylesheet into light and shadow DOM versions

This prevents the need for a :host pseudo-class in the editor CSS which
breaks linting. It also fits selectors targeting the host element in a
more intuitive spot in the cascade.
This commit is contained in:
Nathan Sobo 2014-10-16 15:19:23 -06:00
parent c4cfac5615
commit 7202908780
4 changed files with 15 additions and 13 deletions

View File

@ -249,7 +249,7 @@ class ThemeManager
if nativeStylesheetPath = fs.resolveOnLoadPath(process.platform, ['css', 'less'])
@requireStylesheet(nativeStylesheetPath)
textEditorStylesPath = path.join(@resourcePath, 'static', 'editor.less')
textEditorStylesPath = path.join(@resourcePath, 'static', 'text-editor-shadow.less')
atom.styles.addStyleSheet(@loadLessStylesheet(textEditorStylesPath), sourcePath: textEditorStylesPath, context: 'atom-text-editor')
stylesheetElementForId: (id) ->

View File

@ -22,6 +22,7 @@
@import "popover-list";
@import "messages";
@import "markdown";
@import "text-editor-light";
@import "select-list";
@import "syntax";
@import "utilities";

View File

@ -0,0 +1,13 @@
@import "ui-variables";
atom-text-editor {
display: block;
font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier;
line-height: 1.3;
}
atom-text-editor.mini {
font-size: @input-font-size;
line-height: @component-line-height;
max-height: @component-line-height + 2; // +2 for borders
}

View File

@ -2,12 +2,6 @@
@import "octicon-utf-codes";
@import "octicon-mixins";
:host {
display: block;
font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier;
line-height: 1.3;
}
.editor, .editor-contents {
height: 100%;
width: 100%;
@ -92,12 +86,6 @@
color: @text-color-subtle;
}
:host(.mini) {
font-size: @input-font-size;
line-height: @component-line-height;
max-height: @component-line-height + 2; // +2 for borders
}
.editor {
z-index: 0;
}