mirror of
https://github.com/atom/atom.git
synced 2026-01-23 05:48:10 -05:00
The renderedLines div can now only contain actual lines, nothing else. Thes divs are designed to match the lines div in dimensions and make it easy to put things in front of or behind the text.
149 lines
2.2 KiB
CSS
149 lines
2.2 KiB
CSS
.editor {
|
|
height: 100%;
|
|
overflow: hidden;
|
|
cursor: default;
|
|
-webkit-user-select: none;
|
|
-webkit-box-flex: 1;
|
|
position: relative;
|
|
z-index: 0;
|
|
}
|
|
|
|
.editor.mini {
|
|
height: auto;
|
|
}
|
|
|
|
.editor .gutter {
|
|
position: absolute;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
color: rgba(255, 255, 255, .3);
|
|
text-align: right;
|
|
}
|
|
|
|
.editor .gutter .line-numbers {
|
|
position: relative;
|
|
}
|
|
|
|
.editor .gutter .line-number {
|
|
padding-left: 0.4em;
|
|
padding-right: 0.8em;
|
|
}
|
|
|
|
.editor.focused .line-number.cursor-line {
|
|
color: rgba(255, 255, 255, .6);
|
|
}
|
|
|
|
.editor.focused .cursor-line {
|
|
background-color: rgba(255, 255, 255, .12);
|
|
}
|
|
|
|
.editor.mini .gutter {
|
|
display: none;
|
|
}
|
|
|
|
.editor .gutter.drop-shadow {
|
|
-webkit-box-shadow: -2px 0px 10px 2px #222;
|
|
}
|
|
|
|
.editor .vertical-scrollbar {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
width: 15px;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.editor .scroll-view {
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
overflow-x: auto;
|
|
overflow-y: hidden;
|
|
-webkit-box-flex: 1;
|
|
}
|
|
|
|
.editor.mini .scroll-view {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.editor.soft-wrap .scroll-view {
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.editor .underlayer, .editor .overlayer {
|
|
pointer-events: none;
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.editor .underlayer {
|
|
z-index: 0;
|
|
}
|
|
|
|
.editor .lines {
|
|
position: relative;
|
|
display: table;
|
|
height: 100%;
|
|
width: 100%;
|
|
/*overflow: hidden; i'm worried this is causing rendering problems */
|
|
padding-right: 2em;
|
|
z-index: 1;
|
|
}
|
|
|
|
.editor .overlayer {
|
|
z-index: 2;
|
|
}
|
|
|
|
|
|
.editor .line span {
|
|
vertical-align: top;
|
|
}
|
|
|
|
@-webkit-keyframes blink {
|
|
0% { opacity: 1; }
|
|
60% { opacity: 1; }
|
|
61% { opacity: 0; }
|
|
100% { opacity: 0; }
|
|
}
|
|
|
|
.editor .cursor {
|
|
position: absolute;
|
|
border-left: 2px solid;
|
|
}
|
|
|
|
.editor.focused .cursor.idle {
|
|
-webkit-animation: blink 0.8s;
|
|
-webkit-animation-iteration-count: infinite;
|
|
}
|
|
|
|
.editor .hidden-input {
|
|
position: absolute;
|
|
z-index: -1;
|
|
top: 0;
|
|
left: 0;
|
|
opacity: 0;
|
|
}
|
|
|
|
.editor .selection {
|
|
position: absolute;
|
|
background: rgba(255, 255, 255, .15);
|
|
pointer-events: none;
|
|
z-index: -1;
|
|
}
|
|
|
|
.editor .fold {
|
|
background-color: #444;
|
|
}
|
|
|
|
.editor .fold.selected {
|
|
background-color: #244;
|
|
}
|
|
|
|
.editor .invisible {
|
|
opacity: 0.2;
|
|
}
|