Created
November 30, 2017 23:00
-
-
Save zach-is-my-name/fedaeca927134a3bd99914d404d76d3f to your computer and use it in GitHub Desktop.
Atom New Release: Vim-Mode-Plus.less, style.less
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
style.less | |
atom-text-editor .cursor { | |
opacity: 1 !important; | |
// color: white; | |
// background-color: hsl(180, 24%, 12%); | |
} | |
_____________________________ | |
vim-mode-plus.less | |
@import "syntax-variables"; | |
@import "ui-variables"; | |
// Cursor style | |
// ========================= | |
// .cursor-base () { | |
// border: none; | |
// background: none; | |
// opacity: 0.5; | |
// } | |
.underline-cursor(@bottom-width: 0) { | |
// .cursor-base(); | |
border-bottom-width: @bottom-width; | |
border-bottom-style:solid; | |
border-bottom-color: @syntax-cursor-color; | |
} | |
atom-text-editor.vim-mode-plus.visual-mode, | |
atom-text-editor.vim-mode-plus.operator-pending-mode | |
{ | |
&.is-focused, | |
&.vim-mode-plus-input-focused, | |
&.vim-mode-plus-search-input-focused { | |
.cursor { | |
// .cursor-base(); | |
background-color: #ff0080;// block-cursor | |
} | |
} | |
} | |
atom-text-editor.vim-mode-plus-input-focused.hide-cursor { | |
.cursor { opacity: 0; | |
background-color: #bc3d7d !important; | |
} | |
} | |
atom-text-editor.vim-mode-plus.normal-mode { | |
.cursor { | |
background-color: #bc3d7d !important; | |
} | |
} | |
atom-text-editor.vim-mode-plus.operator-pending-mode { | |
&.is-focused, | |
&.vim-mode-plus-search-input-focused { | |
// .cursor { .underline-cursor(); } | |
.cursors.blink-off .cursor { opacity: 1; } | |
} | |
} | |
atom-text-editor.vim-mode-plus.insert-mode.replace { | |
&.is-focused { | |
.cursor { | |
background-color: #bc3d7d | |
// .underline-cursor(0.3em); | |
// opacity: 0.8; | |
} | |
} | |
} | |
// vim-mode-plus-input-focused for surround, f, F, t, T, r etc. | |
atom-text-editor.vim-mode-plus.normal-mode, | |
atom-text-editor.vim-mode-plus.visual-mode, | |
atom-text-editor.vim-mode-plus.operator-pending-mode, { | |
&.vim-mode-plus-input-focused { | |
.cursor { .underline-cursor(); } | |
} | |
} | |
atom-text-editor.vim-mode-plus-input-char-waiting { | |
&.is-focused { .cursor { .underline-cursor(); } } | |
} | |
// Flash ranges e.g. flashing yanked range. | |
// ========================= | |
.flash-animation (@animation-name, @color) { | |
@keyframes @animation-name { | |
from { background-color: @color; } | |
to { background-color: transparent; } | |
} | |
} | |
.flash (@animation-name; @duration) { | |
animation-name: @animation-name; | |
animation-duration: @duration; | |
animation-iteration-count: 1; | |
} | |
@flash-base-color: contrast(@syntax-background-color, darken(@syntax-selection-color, 3%), lighten(@syntax-selection-color, 3%)); | |
@flash-search-color: fadeout(darken(@syntax-selection-flash-color, 10%), 20%); | |
@flash-added-color: fadeout(darken(@syntax-color-added, 10%), 50%); | |
@flash-removed-color: fadeout(@syntax-color-removed, 50%); | |
// flashOnOperate | |
.flash-animation(flash-operator, @flash-base-color); | |
.flash-animation(flash-operator-occurrence, @flash-added-color); | |
.flash-animation(flash-operator-remove-occurrence, @flash-removed-color); | |
// flashOnUndoRedo | |
.flash-animation(flash-undo-redo, @flash-base-color); | |
.flash-animation(flash-undo-redo-multiple-changes, @flash-added-color); | |
.flash-animation(flash-undo-redo-multiple-deletes, @flash-removed-color); | |
// flashOnSearch | |
.flash-animation(flash-search, @flash-search-color); | |
.flash-animation(flash-screen, @flash-base-color); | |
atom-text-editor .vim-mode-plus-flash { | |
// flashOnOperate | |
&.operator .region { .flash(flash-operator, 0.5s); } | |
&.operator-long .region { .flash(flash-operator, 0.8s); } | |
&.operator-occurrence .region { .flash(flash-operator-occurrence, 0.8s); } | |
&.operator-remove-occurrence .region { .flash(flash-operator-remove-occurrence, 0.8s); } | |
// flashOnUndoRedo | |
&.undo-redo .region { .flash(flash-undo-redo, 0.5s); } | |
&.undo-redo-multiple-changes .region { .flash(flash-undo-redo-multiple-changes, 0.5s); } | |
&.undo-redo-multiple-deletes .region { .flash(flash-undo-redo-multiple-deletes, 0.5s); } | |
// flashOnSearch | |
&.search .region { .flash(flash-search, 1.0s); z-index: 1; } | |
&.screen .region { .flash(flash-screen, 0.3s); } | |
// demo-mode pkg integration to stop flash while demo-mode's hover is active | |
&.operator-demo .region { background: @flash-base-color; } | |
&.operator-long-demo .region { background: @flash-base-color; } | |
&.operator-occurrence-demo .region { background: @flash-added-color; } | |
&.operator-remove-occurrence-demo .region { background: @flash-removed-color; } | |
&.undo-redo-demo .region { background: @flash-base-color; } | |
&.undo-redo-multiple-changes-demo .region { background: @flash-added-color; } | |
&.undo-redo-multiple-deletes-demo .region { background: @flash-removed-color; } | |
} | |
// Hover Counter | |
// ========================= | |
.vim-mode-plus-hover { | |
display: block; | |
color: @text-color-highlight; | |
background-color: #bc3d7d; | |
// border-radius: @component-border-radius; | |
box-shadow: 0 0 1px @syntax-text-color; | |
margin-top: -3.0em; | |
margin-left: -0.3em; | |
padding-left: 0.2em; | |
padding-right: 0.2em; | |
text-align: center; | |
&.first { background-color: @background-color-info; } | |
&.last { background-color: @background-color-error; } | |
} | |
atom-text-editor[mini].vim-mode-plus-input { | |
background-color: inherit; | |
font-weight: normal; | |
color: @text-color; | |
line-height: 1.28; | |
cursor: default; | |
white-space: nowrap; | |
padding-left: 10px; | |
height: 0px !important; | |
width: 0px !important; | |
overflow: hidden !important; | |
border: none !important; | |
padding: 0 !important; | |
display: block !important; | |
position: fixed !important; | |
top: -10px !important; | |
left: -10px !important; | |
} | |
// Search | |
// ========================= | |
// input | |
.vim-mode-plus-search-container { | |
display: flex; | |
> div { | |
padding: @component-padding/2 @component-padding; | |
border: none; | |
} | |
.editor-container { width: 100%; } | |
} | |
atom-text-editor[mini].vim-mode-plus-search { | |
border: none; | |
color: @text-color; | |
cursor: default; | |
&.is-focused { box-shadow: none; } | |
&::before { | |
font-size: 1.2em; | |
padding-right: 0.5em; | |
content: "/"; | |
} | |
&.backwards::before { content: "?"; } | |
} | |
@search-match-base: @syntax-result-marker-color; | |
@search-match: hsla(hue(@search-match-base), saturation(@search-match-base), lightness(@search-match-base), 0.4); | |
@search-match-first: fadeout(@syntax-color-renamed, 60%); | |
@search-match-last: fadeout(@syntax-color-removed, 60%); | |
@search-match-border-current: hsla(hue(@search-match-base), saturation(@search-match-base), lightness(@search-match-base), 1.0); | |
@search-match-border-first: syntax-color-renamed; | |
@search-match-border-last: syntax-color-removed; | |
atom-text-editor:not(.silent) { | |
.vim-mode-plus-search-match { | |
.region { background-color: @search-match; } | |
&.first .region { background-color: @search-match-first; } | |
&.last .region { background-color: @search-match-last; } | |
} | |
} | |
@keyframes flash-find-char { | |
from { border-color: @syntax-color-function; } | |
to { border-color: transparent; } | |
} | |
// highlight | |
.round-box { | |
box-sizing: border-box; | |
// border-radius: @component-border-radius; | |
} | |
atom-text-editor { | |
.vim-mode-plus-search-match { | |
.region { | |
.round-box(); | |
border: 2px solid transparent; | |
transition: border-color 0.2s; | |
} | |
&.current .region { | |
border-color: @search-match-border-current; | |
transition-duration: 0.1s; | |
} | |
&.first.current .region { | |
border-color: search-match-border-first; | |
} | |
&.last.current .region { | |
border-color: @search-match-border-last; | |
} | |
} | |
.vim-mode-plus-highlight-search .region { | |
.round-box(); | |
border: 1px solid fadeout(@syntax-text-color, 70%); | |
background-color: @syntax-selection-color; | |
} | |
.vim-mode-plus-persistent-selection .region { | |
background-color: @syntax-selection-color; | |
} | |
.vim-mode-plus-target-range .region { | |
background-color: @syntax-selection-color; | |
} | |
.vim-mode-plus-occurrence-base .region { | |
box-sizing: border-box; | |
border-bottom-width: 2px; | |
border-bottom-style: dotted; | |
z-index: 1; | |
border-color: @syntax-color-modified; | |
} | |
.vim-mode-plus-find-char { | |
.region { | |
box-sizing: border-box; | |
border-width: 0px; | |
border-bottom-width: 2px; | |
border-style: solid; | |
} | |
&.pre-confirm .region { | |
border-color: @syntax-color-modified; | |
&.current { border-bottom-width: 5px; } | |
} | |
&.post-confirm .region { | |
.flash(flash-find-char, 2.0s); | |
&.long { animation-duration: 4.0s; } | |
} | |
} | |
} | |
// Maximize Pane | |
// ========================= | |
atom-workspace.vim-mode-plus--pane-maximized { | |
atom-dock.left { display: none; } | |
atom-dock.right { display: none; } | |
atom-pane-container { | |
position: relative; | |
atom-pane-axis:not(.vim-mode-plus--active-pane-axis) { display: none; } | |
atom-pane { | |
.item-views { background: @syntax-background-color !important; } | |
display: none; | |
&.vim-mode-plus--active-pane { | |
display: flex; | |
position: absolute; | |
top: 0; | |
right: 0; | |
left: 0; | |
bottom: 0; | |
z-index: 100; | |
} | |
} | |
} | |
&.vim-mode-plus--hide-tab-bar { .tab-bar { display: none; } } | |
&.vim-mode-plus--hide-status-bar { .status-bar { display: none; } } | |
&.vim-mode-plus--pane-centered { atom-text-editor:not(.mini) { margin-left: 20%; } } | |
} | |
// SelectList Highlight matched text | |
// ========================= | |
.vim-mode-plus-select-list .list-group { | |
.character-match { | |
color: @text-color-highlight; | |
font-weight: bold; | |
} | |
} | |
.demo-mode-container { | |
.kind { | |
color: @text-color-selected; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment