mirror of
https://github.com/pulsar-edit/pulsar.git
synced 2024-11-09 05:10:31 +03:00
Clean up shadow-DOM-specific text editor style sheet
This commit is contained in:
Nathan Sobo
Ben Ogle
parent
99b08826dd
commit
263ff21cc1
@ -2,26 +2,154 @@
|
||||
@import "octicon-utf-codes";
|
||||
@import "octicon-mixins";
|
||||
|
||||
.editor-contents {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.editor.shadow, .editor.shadow .editor-contents {
|
||||
.editor, .editor-contents {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.editor-contents {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
cursor: text;
|
||||
display: -webkit-flex;
|
||||
-webkit-user-select: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.gutter {
|
||||
overflow: hidden;
|
||||
text-align: right;
|
||||
cursor: default;
|
||||
min-width: 1em;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.line-numbers {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.line-number {
|
||||
white-space: nowrap;
|
||||
padding-left: .5em;
|
||||
opacity: 0.6;
|
||||
|
||||
&.cursor-line {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.icon-right {
|
||||
.octicon(chevron-down, 0.8em);
|
||||
display: inline-block;
|
||||
visibility: hidden;
|
||||
opacity: .6;
|
||||
padding: 0 .4em;
|
||||
|
||||
&:before {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.gutter:hover {
|
||||
.line-number.foldable .icon-right {
|
||||
visibility: visible;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.gutter, .gutter:hover {
|
||||
.line-number.folded .icon-right {
|
||||
.octicon(chevron-right, 0.8em);
|
||||
|
||||
visibility: visible;
|
||||
|
||||
&:before {
|
||||
position: relative;
|
||||
left: -.1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-view {
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
|
||||
overflow: hidden;
|
||||
-webkit-flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.underlayer {
|
||||
position: absolute;
|
||||
z-index: -2;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: -2;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
background: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.highlight .region {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.lines {
|
||||
min-width: 100%;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.line {
|
||||
white-space: pre;
|
||||
|
||||
&.cursor-line .fold-marker:after {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.fold-marker {
|
||||
cursor: default;
|
||||
|
||||
&:after {
|
||||
.icon(0.8em, inline);
|
||||
|
||||
content: @ellipsis;
|
||||
padding-left: 0.2em;
|
||||
}
|
||||
}
|
||||
|
||||
.placeholder-text {
|
||||
position: absolute;
|
||||
color: @text-color-subtle;
|
||||
}
|
||||
|
||||
.invisible-character {
|
||||
font-weight: normal !important;
|
||||
font-style: normal !important;
|
||||
}
|
||||
|
||||
.indent-guide {
|
||||
box-shadow: inset 1px 0;
|
||||
}
|
||||
|
||||
.hidden-input {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.cursor {
|
||||
@ -33,7 +161,7 @@
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.is-focused .cursor {
|
||||
&.is-focused .cursor {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@ -77,176 +205,3 @@
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.scroll-view {
|
||||
overflow: hidden;
|
||||
z-index: 0;
|
||||
-webkit-flex: 1;
|
||||
min-width: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.gutter {
|
||||
.line-number {
|
||||
white-space: nowrap;
|
||||
padding-left: .5em;
|
||||
|
||||
.icon-right {
|
||||
padding: 0 .4em;
|
||||
&:before {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeholder-text {
|
||||
position: absolute;
|
||||
color: @text-color-subtle;
|
||||
}
|
||||
|
||||
.editor {
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.editor, .editor-contents {
|
||||
overflow: hidden;
|
||||
cursor: text;
|
||||
display: -webkit-flex;
|
||||
-webkit-user-select: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.gutter .line-number.cursor-line {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.gutter {
|
||||
overflow: hidden;
|
||||
text-align: right;
|
||||
cursor: default;
|
||||
min-width: 1em;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.gutter .line-number {
|
||||
padding-left: .5em;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.gutter .line-numbers {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.gutter .line-number.folded.cursor-line {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.gutter .line-number .icon-right {
|
||||
.octicon(chevron-down, 0.8em);
|
||||
display: inline-block;
|
||||
visibility: hidden;
|
||||
padding-left: .1em;
|
||||
padding-right: .5em;
|
||||
opacity: .6;
|
||||
}
|
||||
|
||||
.gutter:hover .line-number.foldable .icon-right {
|
||||
visibility: visible;
|
||||
|
||||
&:before {
|
||||
content: @chevron-down;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.gutter, .gutter:hover {
|
||||
.line-number.folded .icon-right {
|
||||
.octicon(chevron-right, 0.8em);
|
||||
visibility: visible;
|
||||
|
||||
&:before { // chevron-right renders too far right compared to chevron-down
|
||||
position: relative;
|
||||
left: -.1em;
|
||||
content: @chevron-right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fold-marker {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.fold-marker:after {
|
||||
.icon(0.8em, inline);
|
||||
content: @ellipsis;
|
||||
padding-left: 0.2em;
|
||||
}
|
||||
|
||||
.line.cursor-line .fold-marker:after {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.editor.is-blurred .line.cursor-line {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.invisible-character {
|
||||
font-weight: normal !important;
|
||||
font-style: normal !important;
|
||||
}
|
||||
|
||||
.indent-guide {
|
||||
display: inline-block;
|
||||
box-shadow: inset 1px 0;
|
||||
}
|
||||
|
||||
.editor.soft-wrap .scroll-view {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.underlayer {
|
||||
z-index: 0;
|
||||
position: absolute;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.lines {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.overlayer {
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.line {
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
.line span {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.hidden-input {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.highlight .region,
|
||||
.selection .region {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user