├── .gitignore
├── CNAME
├── css
├── octicons.eot
├── octicons.ttf
├── octicons.woff
├── octicons-local.ttf
├── github.min.css
├── main.css
├── github.css
├── syntax.css
├── octicons.css
├── base.css
└── octicons.svg
├── images
├── hjkl.png
├── github.png
└── twitter.png
├── _config.yml
├── _layouts
├── default.html
└── post.html
├── README.md
├── LICENCE
├── _includes
└── head.html
├── advanced.md
└── index.md
/.gitignore:
--------------------------------------------------------------------------------
1 | _site
2 |
--------------------------------------------------------------------------------
/CNAME:
--------------------------------------------------------------------------------
1 | vimsheet.com
2 |
--------------------------------------------------------------------------------
/css/octicons.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chaselambda/vimsheet/HEAD/css/octicons.eot
--------------------------------------------------------------------------------
/css/octicons.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chaselambda/vimsheet/HEAD/css/octicons.ttf
--------------------------------------------------------------------------------
/images/hjkl.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chaselambda/vimsheet/HEAD/images/hjkl.png
--------------------------------------------------------------------------------
/css/octicons.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chaselambda/vimsheet/HEAD/css/octicons.woff
--------------------------------------------------------------------------------
/images/github.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chaselambda/vimsheet/HEAD/images/github.png
--------------------------------------------------------------------------------
/images/twitter.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chaselambda/vimsheet/HEAD/images/twitter.png
--------------------------------------------------------------------------------
/css/octicons-local.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/chaselambda/vimsheet/HEAD/css/octicons-local.ttf
--------------------------------------------------------------------------------
/_config.yml:
--------------------------------------------------------------------------------
1 | name: White Paper
2 | markdown: kramdown
3 | url: http://vimsheet.com
4 | description: A Great Vim Cheat Sheet
5 |
6 | # Owner/author information
7 | owner:
8 | name: Chase Lambert
9 |
10 |
--------------------------------------------------------------------------------
/_layouts/default.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | {% include head.html %}
5 |
6 |
7 |
8 | {{ content }}
9 |
10 |
11 |
12 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | A Great Vim Cheatsheet
2 | ========
3 |
4 | This is a two page website that has `index.html` and `advanced.html`. The two are created from markdown files in `index.md` and `advanced.md`.
5 |
6 | Pull requests are welcome!
7 |
8 | Design from [white-paper](https://github.com/vinitkumar/white-paper).
9 |
10 | # Running locally
11 | - Install rubygems
12 | - `gem install bundler`
13 | - `bundle install`
14 | - `bundle exec jekyll serve`
15 |
--------------------------------------------------------------------------------
/_layouts/post.html:
--------------------------------------------------------------------------------
1 | ---
2 | layout: default
3 | ---
4 | {{ page.title }}
5 | {{ page.date | date_to_string }}
6 |
7 |
8 | {{ content }}
9 |
10 |
11 |
12 |
13 | {% if site.owner.twitter %}
14 | Tweet me @{{ site.owner.twitter }} if you like this post.
15 | {% endif %}
16 |
17 |
18 |
19 |
20 |
21 | {% if site.disqus_shortname %}
22 | {% include disqus_comments.html %}
23 | {% endif %}
--------------------------------------------------------------------------------
/LICENCE:
--------------------------------------------------------------------------------
1 | The MIT License (MIT)
2 |
3 | Copyright (c) 2014 Vinit Kumar
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/css/github.min.css:
--------------------------------------------------------------------------------
1 | .hll{background-color:#ffc}.c{color:#998;font-style:italic}.err{color:#a61717;background-color:#e3d2d2}.k{color:#000;font-weight:bold}.o{color:#000;font-weight:bold}.cm{color:#998;font-style:italic}.cp{color:#999;font-weight:bold;font-style:italic}.c1{color:#998;font-style:italic}.cs{color:#999;font-weight:bold;font-style:italic}.gd{color:#000;background-color:#fdd}.ge{color:#000;font-style:italic}.gr{color:#a00}.gh{color:#999}.gi{color:#000;background-color:#dfd}.go{color:#888}.gp{color:#555}.gs{font-weight:bold}.gu{color:#aaa}.gt{color:#a00}.kc{color:#000;font-weight:bold}.kd{color:#000;font-weight:bold}.kn{color:#000;font-weight:bold}.kp{color:#000;font-weight:bold}.kr{color:#000;font-weight:bold}.kt{color:#458;font-weight:bold}.m{color:#099}.s{color:#d01040}.na{color:#008080}.nb{color:#0086b3}.nc{color:#458;font-weight:bold}.no{color:#008080}.nd{color:#3c5d5d;font-weight:bold}.ni{color:#800080}.ne{color:#900;font-weight:bold}.nf{color:#900;font-weight:bold}.nl{color:#900;font-weight:bold}.nn{color:#555}.nt{color:#000080}.nv{color:#008080}.ow{color:#000;font-weight:bold}.w{color:#bbb}.mf{color:#099}.mh{color:#099}.mi{color:#099}.mo{color:#099}.sb{color:#d01040}.sc{color:#d01040}.sd{color:#d01040}.s2{color:#d01040}.se{color:#d01040}.sh{color:#d01040}.si{color:#d01040}.sx{color:#d01040}.sr{color:#009926}.s1{color:#d01040}.ss{color:#990073}.bp{color:#999}.vc{color:#008080}.vg{color:#008080}.vi{color:#008080}.il{color:#099}
--------------------------------------------------------------------------------
/_includes/head.html:
--------------------------------------------------------------------------------
1 |
2 | {{ site.description }}
3 |
5 |
6 |
7 |
8 |
9 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/css/main.css:
--------------------------------------------------------------------------------
1 | /*****************************************************************************/
2 | /*
3 | /* Common
4 | /*
5 | /*****************************************************************************/
6 |
7 | /* Global Reset */
8 | * {
9 | margin: 0;
10 | padding: 0;
11 | }
12 |
13 | html,
14 | body {
15 | height: 100%;
16 | }
17 |
18 | body {
19 | background-color: #FFF;
20 | font: 13.34px Helvetica, Arial, sans-serif;
21 | font-size: small;
22 | text-align: center;
23 | }
24 |
25 | h1,
26 | h2,
27 | h3,
28 | h4,
29 | h5,
30 | h6 {
31 | font-size: 100%;
32 | }
33 |
34 | h1 {
35 | margin-bottom: 1em;
36 | }
37 |
38 | p {
39 | margin: 1em 0;
40 | }
41 |
42 | a {
43 | color: #00a;
44 | }
45 |
46 | a:hover {
47 | color: #000;
48 | }
49 |
50 | a:visited {
51 | color: #a0a;
52 | }
53 |
54 | /*****************************************************************************/
55 | /*
56 | /* Home
57 | /*
58 | /*****************************************************************************/
59 | .posts {
60 | list-style-type: none;
61 | margin-bottom: 2em;
62 | }
63 |
64 | .posts li {
65 | line-height: 1.75em;
66 | }
67 |
68 | .posts span {
69 | color: #aaa;
70 | font-family: Monaco, "Courier New", monospace;
71 | font-size: 80%;
72 | }
73 |
74 | /*****************************************************************************/
75 | /*
76 | /* Site
77 | /*
78 | /*****************************************************************************/
79 |
80 | .site {
81 | font-size: 115%;
82 | text-align: justify;
83 | width: 42em;
84 | margin: 3em auto 2em;
85 | line-height: 1.5em;
86 | }
87 |
88 | .header a {
89 | font-weight: bold;
90 | text-decoration: none;
91 | }
92 |
93 | .title {
94 | display: inline-block;
95 | margin-bottom: 2em;
96 | }
97 |
98 | .title a {
99 | color: #a00;
100 | }
101 |
102 | .title a:hover {
103 | color: #000;
104 | }
105 |
106 | .header a.extra {
107 | color: #aaa;
108 | margin-left: 1em;
109 | }
110 |
111 | .header a.extra:hover {
112 | color: #000;
113 | }
114 |
115 | .meta {
116 | color: #aaa;
117 | }
118 |
119 | .footer {
120 | font-size: 80%;
121 | color: #666;
122 | border-top: 4px solid #eee;
123 | margin-top: 2em;
124 | overflow: hidden;
125 | }
126 |
127 | .footer .contact {
128 | float: left;
129 | margin-right: 3em;
130 | }
131 |
132 | .footer .contact a {
133 | color: #8085C1;
134 | }
135 |
136 | .footer .rss {
137 | margin-top: 1.1em;
138 | margin-right: -.2em;
139 | float: right;
140 | }
141 |
142 | .footer .rss img {
143 | border: 0;
144 | }
145 |
146 | /*****************************************************************************/
147 | /*
148 | /* Posts
149 | /*
150 | /*****************************************************************************/
151 |
152 | /* standard */
153 | .post pre {
154 | border: 1px solid #ddd;
155 | background-color: #eef;
156 | padding: 0 .4em;
157 | }
158 |
159 | .post ul,
160 | .post ol {
161 | margin-left: 1.35em;
162 | }
163 |
164 | .post code {
165 | border: 1px solid #ddd;
166 | background-color: #eef;
167 | padding: 0 .2em;
168 | }
169 |
170 | .post pre code {
171 | border: none;
172 | }
173 |
174 | /* terminal */
175 | .post pre.terminal {
176 | border: 1px solid #000;
177 | background-color: #333;
178 | color: #FFF;
179 | }
180 |
181 | .post pre.terminal code {
182 | background-color: #333;
183 | }
--------------------------------------------------------------------------------
/css/github.css:
--------------------------------------------------------------------------------
1 | .hll { background-color: #ffffcc }
2 | .c { color: #999988; font-style: italic } /* Comment */
3 | .err { color: #a61717; background-color: #e3d2d2 } /* Error */
4 | .k { color: #000000; font-weight: bold } /* Keyword */
5 | .o { color: #000000; font-weight: bold } /* Operator */
6 | .cm { color: #999988; font-style: italic } /* Comment.Multiline */
7 | .cp { color: #999999; font-weight: bold; font-style: italic } /* Comment.Preproc */
8 | .c1 { color: #999988; font-style: italic } /* Comment.Single */
9 | .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
10 | .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
11 | .ge { color: #000000; font-style: italic } /* Generic.Emph */
12 | .gr { color: #aa0000 } /* Generic.Error */
13 | .gh { color: #999999 } /* Generic.Heading */
14 | .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
15 | .go { color: #888888 } /* Generic.Output */
16 | .gp { color: #555555 } /* Generic.Prompt */
17 | .gs { font-weight: bold } /* Generic.Strong */
18 | .gu { color: #aaaaaa } /* Generic.Subheading */
19 | .gt { color: #aa0000 } /* Generic.Traceback */
20 | .kc { color: #000000; font-weight: bold } /* Keyword.Constant */
21 | .kd { color: #000000; font-weight: bold } /* Keyword.Declaration */
22 | .kn { color: #000000; font-weight: bold } /* Keyword.Namespace */
23 | .kp { color: #000000; font-weight: bold } /* Keyword.Pseudo */
24 | .kr { color: #000000; font-weight: bold } /* Keyword.Reserved */
25 | .kt { color: #445588; font-weight: bold } /* Keyword.Type */
26 | .m { color: #009999 } /* Literal.Number */
27 | .s { color: #d01040 } /* Literal.String */
28 | .na { color: #008080 } /* Name.Attribute */
29 | .nb { color: #0086B3 } /* Name.Builtin */
30 | .nc { color: #445588; font-weight: bold } /* Name.Class */
31 | .no { color: #008080 } /* Name.Constant */
32 | .nd { color: #3c5d5d; font-weight: bold } /* Name.Decorator */
33 | .ni { color: #800080 } /* Name.Entity */
34 | .ne { color: #990000; font-weight: bold } /* Name.Exception */
35 | .nf { color: #990000; font-weight: bold } /* Name.Function */
36 | .nl { color: #990000; font-weight: bold } /* Name.Label */
37 | .nn { color: #555555 } /* Name.Namespace */
38 | .nt { color: #000080 } /* Name.Tag */
39 | .nv { color: #008080 } /* Name.Variable */
40 | .ow { color: #000000; font-weight: bold } /* Operator.Word */
41 | .w { color: #bbbbbb } /* Text.Whitespace */
42 | .mf { color: #009999 } /* Literal.Number.Float */
43 | .mh { color: #009999 } /* Literal.Number.Hex */
44 | .mi { color: #009999 } /* Literal.Number.Integer */
45 | .mo { color: #009999 } /* Literal.Number.Oct */
46 | .sb { color: #d01040 } /* Literal.String.Backtick */
47 | .sc { color: #d01040 } /* Literal.String.Char */
48 | .sd { color: #d01040 } /* Literal.String.Doc */
49 | .s2 { color: #d01040 } /* Literal.String.Double */
50 | .se { color: #d01040 } /* Literal.String.Escape */
51 | .sh { color: #d01040 } /* Literal.String.Heredoc */
52 | .si { color: #d01040 } /* Literal.String.Interpol */
53 | .sx { color: #d01040 } /* Literal.String.Other */
54 | .sr { color: #009926 } /* Literal.String.Regex */
55 | .s1 { color: #d01040 } /* Literal.String.Single */
56 | .ss { color: #990073 } /* Literal.String.Symbol */
57 | .bp { color: #999999 } /* Name.Builtin.Pseudo */
58 | .vc { color: #008080 } /* Name.Variable.Class */
59 | .vg { color: #008080 } /* Name.Variable.Global */
60 | .vi { color: #008080 } /* Name.Variable.Instance */
61 | .il { color: #009999 } /* Literal.Number.Integer.Long */
62 |
--------------------------------------------------------------------------------
/css/syntax.css:
--------------------------------------------------------------------------------
1 | .highlight { background: #ffffff; }
2 | .highlight .c { color: #999988; font-style: italic } /* Comment */
3 | .highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
4 | .highlight .k { font-weight: bold } /* Keyword */
5 | .highlight .o { font-weight: bold } /* Operator */
6 | .highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */
7 | .highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */
8 | .highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */
9 | .highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
10 | .highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
11 | .highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
12 | .highlight .ge { font-style: italic } /* Generic.Emph */
13 | .highlight .gr { color: #aa0000 } /* Generic.Error */
14 | .highlight .gh { color: #999999 } /* Generic.Heading */
15 | .highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
16 | .highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
17 | .highlight .go { color: #888888 } /* Generic.Output */
18 | .highlight .gp { color: #555555 } /* Generic.Prompt */
19 | .highlight .gs { font-weight: bold } /* Generic.Strong */
20 | .highlight .gu { color: #aaaaaa } /* Generic.Subheading */
21 | .highlight .gt { color: #aa0000 } /* Generic.Traceback */
22 | .highlight .kc { font-weight: bold } /* Keyword.Constant */
23 | .highlight .kd { font-weight: bold } /* Keyword.Declaration */
24 | .highlight .kp { font-weight: bold } /* Keyword.Pseudo */
25 | .highlight .kr { font-weight: bold } /* Keyword.Reserved */
26 | .highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */
27 | .highlight .m { color: #009999 } /* Literal.Number */
28 | .highlight .s { color: #d14 } /* Literal.String */
29 | .highlight .na { color: #008080 } /* Name.Attribute */
30 | .highlight .nb { color: #0086B3 } /* Name.Builtin */
31 | .highlight .nc { color: #445588; font-weight: bold } /* Name.Class */
32 | .highlight .no { color: #008080 } /* Name.Constant */
33 | .highlight .ni { color: #800080 } /* Name.Entity */
34 | .highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */
35 | .highlight .nf { color: #990000; font-weight: bold } /* Name.Function */
36 | .highlight .nn { color: #555555 } /* Name.Namespace */
37 | .highlight .nt { color: #000080 } /* Name.Tag */
38 | .highlight .nv { color: #008080 } /* Name.Variable */
39 | .highlight .ow { font-weight: bold } /* Operator.Word */
40 | .highlight .w { color: #bbbbbb } /* Text.Whitespace */
41 | .highlight .mf { color: #009999 } /* Literal.Number.Float */
42 | .highlight .mh { color: #009999 } /* Literal.Number.Hex */
43 | .highlight .mi { color: #009999 } /* Literal.Number.Integer */
44 | .highlight .mo { color: #009999 } /* Literal.Number.Oct */
45 | .highlight .sb { color: #d14 } /* Literal.String.Backtick */
46 | .highlight .sc { color: #d14 } /* Literal.String.Char */
47 | .highlight .sd { color: #d14 } /* Literal.String.Doc */
48 | .highlight .s2 { color: #d14 } /* Literal.String.Double */
49 | .highlight .se { color: #d14 } /* Literal.String.Escape */
50 | .highlight .sh { color: #d14 } /* Literal.String.Heredoc */
51 | .highlight .si { color: #d14 } /* Literal.String.Interpol */
52 | .highlight .sx { color: #d14 } /* Literal.String.Other */
53 | .highlight .sr { color: #009926 } /* Literal.String.Regex */
54 | .highlight .s1 { color: #d14 } /* Literal.String.Single */
55 | .highlight .ss { color: #990073 } /* Literal.String.Symbol */
56 | .highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */
57 | .highlight .vc { color: #008080 } /* Name.Variable.Class */
58 | .highlight .vg { color: #008080 } /* Name.Variable.Global */
59 | .highlight .vi { color: #008080 } /* Name.Variable.Instance */
60 | .highlight .il { color: #009999 } /* Literal.Number.Integer.Long */
61 |
--------------------------------------------------------------------------------
/advanced.md:
--------------------------------------------------------------------------------
1 | ---
2 | layout: default
3 | title: Advanced Cheat Sheet
4 | ---
5 |
6 | # Advanced Vim Cheat Sheet
7 |
8 | ## General
9 |
10 | * automatic marks
11 | * [http://vim.wikia.com/wiki/Using\_marks](http://vim.wikia.com/wiki/Using_marks) under "special marks"
12 | * [jump list](http://vim.wikia.com/wiki/Jumping_to_previously_visited_locations)
13 | * `ctrl+o` - go backwards in the jump list
14 | * `ctrl+i` - go forwards in the jump list
15 | * [change list](http://vim.wikia.com/wiki/Jumping_to_previously_visited_locations)
16 | * `g;` - go backwards in the change list
17 | * `g,` - go forwards in the change list
18 |
19 | ## Plugins
20 | The most helpful part of plugins is that they make vim a better fully featured IDE. Concepts like global search and finding a file to open are solved with plugins. They also can bring out some missing features of vim, like automatic commenting.
21 |
22 | ### Essential Plugins
23 | * *vim-pathogen*: Either this or Vundle are good ways to manage your plugins.
24 | * *vim-sensible*: tiny set of reasonable defaults that every vim user should have. This allows you to keep your .vimrc a bit smaller.
25 | * *ag.vim*: Fantastically fast global searches.
26 | * *ctrlp.vim*: Open up any file or buffer.
27 | * *nerdcommenter*: Allows you to comment some block of code
28 |
29 | ### Awesome Plugins
30 | * indentLine: Shows you visibly your tabs or spaces, like sublime
31 | * neocomplete.vim (or YouCompleteMe): Autocomplete
32 | * nerdtree: File browser
33 | * vim-surround: Quicker way to add or delete some characters *around* something
34 | * tagbar: Similar to the "outline" feature of many IDE's
35 |
36 | ## Regex and Searching
37 | * Searching in vim is very unintuitive. There are 4 modes of searching, ranging from "very magic" to "very no magic". They determine what needs to be escaped with a `\` in your search term. If you just want "regex on" or "regex off" then always search in Very Magic or Very No Magic mode.
38 | * Check out the details by running `:h \\v`.
39 |
40 | ### Perl style regexes (Very Magic Mode)
41 |
42 | Start a search with `\v`. Everything else can act like a normal regex search, except you have to escape `/` and `\`. If you are searching backwards, you’ll also have to escape `?`.
43 |
44 | * E.g. search for a url starting with `www` and ending with `.com`: `\vwww\..*\.com`
45 |
46 | #### Differences from Perl Regex
47 | The `<` and `>` characters are special for start and end of word. Escape them to search for them literally.
48 |
49 | ### Literal Search (Very No Magic Mode)
50 | Start a search with `\V`. Now you *only have to escape* `/` and `\`. It would be nice if you didn't have to escape *anything*, but alas vim is not like this.
51 |
52 | ### Advanced: Match a subsection of your search
53 | Let's say you have this file
54 |
55 | ```
56 | www.yahoo.com
57 | blah some other stuff
58 | www.google.com
59 | www.ebay.org
60 | ```
61 | And you want to change it to
62 |
63 | ```
64 | www.chase.com
65 | blah some other stuff
66 | www.chase.com
67 | www.chase.org
68 | ```
69 | What you're doing is saying *find all domain names and change the inner part to `chase`*. You can do this by specifying the part of the search to *match*.
70 | Put `\zs` before where you want to match and `\ze` after where you want to match.
71 |
72 | So in this case: `\v` `www\.` **\zs** `.*` **\ze** `\.com`
73 |
74 | * An extension to this is looking for the start of a word without matching it. For example looking for the variable `i`. We could then use this search: `\v\W\zsi\ze\W`. Note: Use `\W` matches everything except `[a-zA-Z0-9_]`
75 | * There’s a shortcut called word boundaries, with `<` and `>`:
76 | * `\v` ([More info](http://vim.wikia.com/wiki/Search_patterns))
77 | * You can get this same behavior by pressing `*` in normal mode, while having your cursor over the word you want to search.
78 |
79 | ### Faster Search and Replace
80 | * Vim 7.4 has an [amazing "gn" command](http://vimcasts.org/episodes/operating-on-search-matches-using-gn/) that allows you to search and replace faster. `gn` means "select the next search term".
81 |
--------------------------------------------------------------------------------
/index.md:
--------------------------------------------------------------------------------
1 | ---
2 | layout: default
3 | title: A Great Vim Cheat Sheet
4 | ---
5 |
6 | # A Great Vim Cheat Sheet
7 |
14 |
15 |
16 | I’ve compiled a list of essential Vim commands that I use every day. I have then given a few instructions on how to make Vim as great as it should be, because it’s painful without configuration.
17 |
18 | ## Essentials
19 |
20 | ### Cursor movement (Normal/Visual Mode)
21 |
22 | - `h` `j` `k` `l` - Arrow keys
23 | - `w` / `b` - Next/previous word
24 | - `W` / `B` - Next/previous word (space separated)
25 | - `e` / `ge` - Next/previous end of word
26 | - `0` / `$` - Start/End of line
27 | - `^` - First non-blank character of line (same as `0w`)
28 |
29 | ### Editing text
30 |
31 | - `i` / `a` - Start insert mode at/after cursor
32 | - `I` / `A` - Start insert mode at the beginning/end of the line
33 | - `o` / `O` - Add blank line below/above current line
34 | - `Esc` or `Ctrl+[` - Exit insert mode
35 | - `d` - Delete
36 | - `dd` - Delete line
37 | - `c` - Delete, then start insert mode
38 | - `cc` - Delete line, then start insert mode
39 |
40 | ### Operators
41 |
42 | - Operators also work in Visual Mode
43 | - `d` - Deletes from the cursor to the movement location
44 | - `c` - Deletes from the cursor to the movement location, then starts insert mode
45 | - `y` - Copy from the cursor to the movement location
46 | - `>` - Indent one level
47 | - `<` - Unindent one level
48 | - You can also combine operators with motions. Ex: `d$` deletes from the cursor to the end of the line.
49 |
50 | ### Marking text (visual mode)
51 |
52 | - `v` - Start visual mode
53 | - `V` - Start linewise visual mode
54 | - `Ctrl+v` - Start visual block mode
55 | - `Esc` or `Ctrl+[` - Exit visual mode
56 |
57 | ### Clipboard
58 |
59 | - `yy` - Yank (copy) a line
60 | - `p` - Paste after cursor
61 | - `P` - Paste before cursor
62 | - `dd` - Delete (cut) a line
63 | - `x` - Delete (cut) current character
64 | - `X` - Delete (cut) previous character
65 | - `d` / `c` - By default, these copy the deleted text
66 |
67 | ### Exiting
68 |
69 | - `:w` - Write (save) the file, but don't quit
70 | - `:wq` - Write (save) and quit
71 | - `:q` - Quit (fails if anything has changed)
72 | - `:q!` - Quit and throw away changes
73 |
74 | ### Search/Replace
75 |
76 | - `/pattern` - Search for pattern
77 | - `?pattern` - Search backward for pattern
78 | - `n` - Repeat search in same direction
79 | - `N` - Repeat search in opposite direction
80 | - `:%s/old/new/g` - Replace all old with new throughout file ([gn](http://vimcasts.org/episodes/operating-on-search-matches-using-gn/) is better though)
81 | - `:%s/old/new/gc` - Replace all old with new throughout file with confirmations
82 |
83 | ### General
84 |
85 | - `u` - Undo
86 | - `Ctrl+r` - Redo
87 |
88 | ## Advanced
89 |
90 | ### Cursor movement
91 |
92 | - `Ctrl+d` - Move down half a page
93 | - `Ctrl+u` - Move up half a page
94 | - `}` - Go forward by paragraph (the next blank line)
95 | - `{` - Go backward by paragraph (the next blank line)
96 | - `gg` - Go to the top of the page
97 | - `G` - Go the bottom of the page
98 | - `: [num] [enter]` - Go to that line in the document
99 | - `ctrl+e / ctrl+y` - Scroll down/up one line
100 |
101 | ### Character search
102 |
103 | - `f [char]` - Move forward to the given char
104 | - `F [char]` - Move backward to the given char
105 | - `t [char]` - Move forward to before the given char
106 | - `T [char]` - Move backward to before the given char
107 | - `;` / `,` - Repeat search forwards/backwards
108 |
109 | ### Editing text
110 |
111 | - `J` - Join line below to the current one
112 | - `r [char]` - Replace a single character with the specified char (does not use Insert mode)
113 |
114 | ### Visual mode
115 |
116 | - `O` - Move to other corner of block
117 | - `o` - Move to other end of marked area
118 |
119 | ### File Tabs
120 |
121 | - `:e filename` - Edit a file
122 | - `:tabe` - Make a new tab
123 | - `gt` - Go to the next tab
124 | - `gT` - Go to the previous tab
125 | - `:vsp` - Vertically split windows
126 | - `ctrl+ws` - Split windows horizontally
127 | - `ctrl+wv` - Split windows vertically
128 | - `ctrl+ww` - Switch between windows
129 | - `ctrl+wq` - Quit a window
130 |
131 | ### Marks
132 |
133 | - Marks allow you to jump to designated points in your code.
134 | - `m{a-z}` - Set mark {a-z} at cursor position
135 | - A capital mark {A-Z} sets a global mark and will work between files
136 | - `'{a-z}` - Move the cursor to the start of the line where the mark was set
137 | - `''` - Go back to the previous jump location
138 |
139 | ### Text Objects
140 |
141 | - Say you have `def (arg1, arg2, arg3)`, where your cursor is somewhere in the middle of the parenthesis.
142 | - `di(` deletes everything between the parenthesis. That says "change everything inside the nearest parenthesis". Without text objects, you would need to do `T(dt)`.
143 | - [Learn more](http://blog.carbonfive.com/2011/10/17/vim-text-objects-the-definitive-guide/)
144 |
145 | ### General
146 |
147 | - `.` - Repeat last command
148 | - `Ctrl+r + 0` in insert mode inserts the last yanked text (or in command mode)
149 | - `gv` - reselect (select last selected block of text, from visual mode)
150 | - `%` - jumps between matching `()` or `{}`
151 |
152 | # Making VIM actually useful
153 |
154 | Vim is quite unpleasant out of the box. It's an arcane experience:
155 |
156 | - Autocomplete is missing
157 | - System clipboard is not used
158 | - Act of typing `:w` to save is cumbersome
159 | - Mouse doesn't work
160 | - Management of multiple files is tricky
161 | - Integration with other plugins (like compiler warnings) is challenging
162 | - Repeatedly indenting/unindenting multiple lines is challenging, though possible
163 |
164 | It does have a significant strength though: your fingers can stay on the main keyboard keys to do most editing actions. This is faster and more ergonomic. I find that the toughest part about VIM is guiding people towards getting the benefits of VIM without the drawbacks. Here are some ideas on how to go about this.
165 |
166 | ## Switch caps lock and escape
167 |
168 | - I highly recommend you switch the mapping of your caps lock and escape keys. You'll love it, promise! Switching the two keys is platform dependent.
169 |
170 | ## Visual Studio Code
171 |
172 | - VSCode is the simplest way to give you a fantastic editor that also gives you the benefits of VIM. Just install [the VIM extension](https://marketplace.visualstudio.com/items?itemName=vscodevim.vim).
173 | - I made a [few slight changes](https://gist.github.com/theicfire/dc3f7f8c9a19467643a58dff22eb00d9) which improved the experience for me.
174 |
175 | ## Configure native VIM
176 |
177 | For all the given limitations, you'll need to find a solution. You can either solve the issues one by one, or you can use a reference .vimrc settings file that fix most of the issues out-of-the-box.
178 |
179 | - [My .vimrc file](https://github.com/theicfire/dotfiles/blob/master/vim/.vimrc) could be a good starting point. Honestly, it's a bit old and not the best. I now use VSCode mainly so I haven't kept a great vimrc.
180 |
181 | ### Using the system clipboard
182 |
183 | - `"+y` copy a selection to the system clipboard
184 | - `"+p` paste from the system clipboard
185 | - If this doesn't work, it’s probably because Vim was not built with the system clipboard option. To check, run `vim --version` and see if `+clipboard` exists. If it says `-clipboard`, you will not be able to copy from outside of Vim.
186 | - For Mac users, homebrew install Vim with the clipboard option. Install homebrew and then run `brew install vim`.
187 | - then move the old Vim binary: `$ mv /usr/bin/vim /usr/bin/vimold`
188 | - restart your terminal and you should see `vim --version` now with `+clipboard`
189 |
190 | ## Sublime Text
191 |
192 | - Another option is to use Vintageous in Sublime Text (version 3). This gives you Vim mode inside Sublime. I suggest this (or a similar setup with the Atom editor) if you aren't a Vim master. Check out [Advanced Vim](advanced.html) if you are.
193 | - Vintageous is great, but I suggest you change a few settings to make it better.
194 |
195 | - Clone [this repository](https://github.com/theicfire/Vintageous) to `~/.config/sublime-text-3/Packages/Vintageous`, or similar. Then check out the "custom" branch.
196 | - Alternatively, you can get a more updated Vintageous version by cloning [the official](https://github.com/guillermooo/Vintageous) repository and then copying over [this patch](https://github.com/theicfire/Vintageous/commit/19ff6311b01e3ae259b7eb8e3944687b42ba06ff).
197 | - Change the user settings (`User/Preferences.sublime-settings`) to include:
198 | - `"caret_style": "solid"`
199 | - This will make the cursor not blink, like in Vim.
200 | - Sublime Text might freeze when you do this. It’s a bug; just restart Sublime Text after changing the file.
201 | - `ctrl+r` in Vim means "redo". But there is a handy Ctrl + R shortcut in Sublime Text that gives an "outline" of a file. I remapped it to alt+r by putting this in the User keymap
202 | - `{ "keys": ["alt+r"], "command": "show_overlay", "args": {"overlay": "goto", "text": "@"} },`
203 | - [Add the ability to toggle Vintageous on and off](https://github.com/guillermooo/Vintageous/wiki/Toggling-Vintageous)
204 | - Mac users: you will not have the ability to hold down a navigation key (like holding j to go down). To fix this, run the commands specified here: [https://gist.github.com/kconragan/2510186](https://gist.github.com/kconragan/2510186)
205 |
206 | - Now you should be able to restart sublime and have a great Vim environment! Sweet Dude.
207 |
208 | ## Other
209 |
210 | I don’t personally use these yet, but I’ve heard other people do!
211 |
212 | - `:qa` - Quit all open buffers
213 | - `:wa` - Write all open buffers
214 | - `:wqa` - Write and quit all open buffers
215 |
216 | ## Additional resources
217 |
218 | - [Advanced Vim](advanced.html)
219 | - [Practical Vim](http://www.amazon.com/Practical-Vim-Thought-Pragmatic-Programmers/dp/1934356980) is a fantastic resource on many of the useful hidden features of vim.
220 |
--------------------------------------------------------------------------------
/css/octicons.css:
--------------------------------------------------------------------------------
1 | @font-face {
2 | font-family: 'octicons';
3 | src: url('octicons.eot?#iefix') format('embedded-opentype'),
4 | url('octicons.woff') format('woff'),
5 | url('octicons.ttf') format('truetype'),
6 | url('octicons.svg#octicons') format('svg');
7 | font-weight: normal;
8 | font-style: normal;
9 | }
10 |
11 | /*
12 |
13 | .octicon is optimized for 16px.
14 | .mega-octicon is optimized for 32px but can be used larger.
15 |
16 | */
17 | .octicon {
18 | font: normal normal 16px octicons;
19 | line-height: 1;
20 | display: inline-block;
21 | text-decoration: none;
22 | -webkit-font-smoothing: antialiased;
23 | -moz-osx-font-smoothing: grayscale;
24 | }
25 | .mega-octicon {
26 | font: normal normal 24px octicons;
27 | line-height: 1;
28 | display: inline-block;
29 | text-decoration: none;
30 | -webkit-font-smoothing: antialiased;
31 | -moz-osx-font-smoothing: grayscale;
32 | }
33 |
34 | .octicon-alert:before { content: '\f02d'} /* */
35 | .octicon-alignment-align:before { content: '\f08a'} /* */
36 | .octicon-alignment-aligned-to:before { content: '\f08e'} /* */
37 | .octicon-alignment-unalign:before { content: '\f08b'} /* */
38 | .octicon-arrow-down:before { content: '\f03f'} /* */
39 | .octicon-arrow-left:before { content: '\f040'} /* */
40 | .octicon-arrow-right:before { content: '\f03e'} /* */
41 | .octicon-arrow-small-down:before { content: '\f0a0'} /* */
42 | .octicon-arrow-small-left:before { content: '\f0a1'} /* */
43 | .octicon-arrow-small-right:before { content: '\f071'} /* */
44 | .octicon-arrow-small-up:before { content: '\f09f'} /* */
45 | .octicon-arrow-up:before { content: '\f03d'} /* */
46 | .octicon-beer:before { content: '\f069'} /* */
47 | .octicon-book:before { content: '\f007'} /* */
48 | .octicon-bookmark:before { content: '\f07b'} /* */
49 | .octicon-briefcase:before { content: '\f0d3'} /* */
50 | .octicon-broadcast:before { content: '\f048'} /* */
51 | .octicon-browser:before { content: '\f0c5'} /* */
52 | .octicon-bug:before { content: '\f091'} /* */
53 | .octicon-calendar:before { content: '\f068'} /* */
54 | .octicon-check:before { content: '\f03a'} /* */
55 | .octicon-checklist:before { content: '\f076'} /* */
56 | .octicon-chevron-down:before { content: '\f0a3'} /* */
57 | .octicon-chevron-left:before { content: '\f0a4'} /* */
58 | .octicon-chevron-right:before { content: '\f078'} /* */
59 | .octicon-chevron-up:before { content: '\f0a2'} /* */
60 | .octicon-circle-slash:before { content: '\f084'} /* */
61 | .octicon-circuit-board:before { content: '\f0d6'} /* */
62 | .octicon-clippy:before { content: '\f035'} /* */
63 | .octicon-clock:before { content: '\f046'} /* */
64 | .octicon-cloud-download:before { content: '\f00b'} /* */
65 | .octicon-cloud-upload:before { content: '\f00c'} /* */
66 | .octicon-code:before { content: '\f05f'} /* */
67 | .octicon-color-mode:before { content: '\f065'} /* */
68 | .octicon-comment-add:before,
69 | .octicon-comment:before { content: '\f02b'} /* */
70 | .octicon-comment-discussion:before { content: '\f04f'} /* */
71 | .octicon-credit-card:before { content: '\f045'} /* */
72 | .octicon-dash:before { content: '\f0ca'} /* */
73 | .octicon-dashboard:before { content: '\f07d'} /* */
74 | .octicon-database:before { content: '\f096'} /* */
75 | .octicon-device-camera:before { content: '\f056'} /* */
76 | .octicon-device-camera-video:before { content: '\f057'} /* */
77 | .octicon-device-desktop:before { content: '\f27c'} /* */
78 | .octicon-device-mobile:before { content: '\f038'} /* */
79 | .octicon-diff:before { content: '\f04d'} /* */
80 | .octicon-diff-added:before { content: '\f06b'} /* */
81 | .octicon-diff-ignored:before { content: '\f099'} /* */
82 | .octicon-diff-modified:before { content: '\f06d'} /* */
83 | .octicon-diff-removed:before { content: '\f06c'} /* */
84 | .octicon-diff-renamed:before { content: '\f06e'} /* */
85 | .octicon-ellipsis:before { content: '\f09a'} /* */
86 | .octicon-eye-unwatch:before,
87 | .octicon-eye-watch:before,
88 | .octicon-eye:before { content: '\f04e'} /* */
89 | .octicon-file-binary:before { content: '\f094'} /* */
90 | .octicon-file-code:before { content: '\f010'} /* */
91 | .octicon-file-directory:before { content: '\f016'} /* */
92 | .octicon-file-media:before { content: '\f012'} /* */
93 | .octicon-file-pdf:before { content: '\f014'} /* */
94 | .octicon-file-submodule:before { content: '\f017'} /* */
95 | .octicon-file-symlink-directory:before { content: '\f0b1'} /* */
96 | .octicon-file-symlink-file:before { content: '\f0b0'} /* */
97 | .octicon-file-text:before { content: '\f011'} /* */
98 | .octicon-file-zip:before { content: '\f013'} /* */
99 | .octicon-flame:before { content: '\f0d2'} /* */
100 | .octicon-fold:before { content: '\f0cc'} /* */
101 | .octicon-gear:before { content: '\f02f'} /* */
102 | .octicon-gift:before { content: '\f042'} /* */
103 | .octicon-gist:before { content: '\f00e'} /* */
104 | .octicon-gist-secret:before { content: '\f08c'} /* */
105 | .octicon-git-branch-create:before,
106 | .octicon-git-branch-delete:before,
107 | .octicon-git-branch:before { content: '\f020'} /* */
108 | .octicon-git-commit:before { content: '\f01f'} /* */
109 | .octicon-git-compare:before { content: '\f0ac'} /* */
110 | .octicon-git-merge:before { content: '\f023'} /* */
111 | .octicon-git-pull-request-abandoned:before,
112 | .octicon-git-pull-request:before { content: '\f009'} /* */
113 | .octicon-globe:before { content: '\f0b6'} /* */
114 | .octicon-graph:before { content: '\f043'} /* */
115 | .octicon-heart:before { content: '\2665'} /* ♥ */
116 | .octicon-history:before { content: '\f07e'} /* */
117 | .octicon-home:before { content: '\f08d'} /* */
118 | .octicon-horizontal-rule:before { content: '\f070'} /* */
119 | .octicon-hourglass:before { content: '\f09e'} /* */
120 | .octicon-hubot:before { content: '\f09d'} /* */
121 | .octicon-inbox:before { content: '\f0cf'} /* */
122 | .octicon-info:before { content: '\f059'} /* */
123 | .octicon-issue-closed:before { content: '\f028'} /* */
124 | .octicon-issue-opened:before { content: '\f026'} /* */
125 | .octicon-issue-reopened:before { content: '\f027'} /* */
126 | .octicon-jersey:before { content: '\f019'} /* */
127 | .octicon-jump-down:before { content: '\f072'} /* */
128 | .octicon-jump-left:before { content: '\f0a5'} /* */
129 | .octicon-jump-right:before { content: '\f0a6'} /* */
130 | .octicon-jump-up:before { content: '\f073'} /* */
131 | .octicon-key:before { content: '\f049'} /* */
132 | .octicon-keyboard:before { content: '\f00d'} /* */
133 | .octicon-law:before { content: '\f0d8'} /* */
134 | .octicon-light-bulb:before { content: '\f000'} /* */
135 | .octicon-link:before { content: '\f05c'} /* */
136 | .octicon-link-external:before { content: '\f07f'} /* */
137 | .octicon-list-ordered:before { content: '\f062'} /* */
138 | .octicon-list-unordered:before { content: '\f061'} /* */
139 | .octicon-location:before { content: '\f060'} /* */
140 | .octicon-gist-private:before,
141 | .octicon-mirror-private:before,
142 | .octicon-git-fork-private:before,
143 | .octicon-lock:before { content: '\f06a'} /* */
144 | .octicon-logo-github:before { content: '\f092'} /* */
145 | .octicon-mail:before { content: '\f03b'} /* */
146 | .octicon-mail-read:before { content: '\f03c'} /* */
147 | .octicon-mail-reply:before { content: '\f051'} /* */
148 | .octicon-mark-github:before { content: '\f00a'} /* */
149 | .octicon-markdown:before { content: '\f0c9'} /* */
150 | .octicon-megaphone:before { content: '\f077'} /* */
151 | .octicon-mention:before { content: '\f0be'} /* */
152 | .octicon-microscope:before { content: '\f089'} /* */
153 | .octicon-milestone:before { content: '\f075'} /* */
154 | .octicon-mirror-public:before,
155 | .octicon-mirror:before { content: '\f024'} /* */
156 | .octicon-mortar-board:before { content: '\f0d7'} /* */
157 | .octicon-move-down:before { content: '\f0a8'} /* */
158 | .octicon-move-left:before { content: '\f074'} /* */
159 | .octicon-move-right:before { content: '\f0a9'} /* */
160 | .octicon-move-up:before { content: '\f0a7'} /* */
161 | .octicon-mute:before { content: '\f080'} /* */
162 | .octicon-no-newline:before { content: '\f09c'} /* */
163 | .octicon-octoface:before { content: '\f008'} /* */
164 | .octicon-organization:before { content: '\f037'} /* */
165 | .octicon-package:before { content: '\f0c4'} /* */
166 | .octicon-paintcan:before { content: '\f0d1'} /* */
167 | .octicon-pencil:before { content: '\f058'} /* */
168 | .octicon-person-add:before,
169 | .octicon-person-follow:before,
170 | .octicon-person:before { content: '\f018'} /* */
171 | .octicon-pin:before { content: '\f041'} /* */
172 | .octicon-playback-fast-forward:before { content: '\f0bd'} /* */
173 | .octicon-playback-pause:before { content: '\f0bb'} /* */
174 | .octicon-playback-play:before { content: '\f0bf'} /* */
175 | .octicon-playback-rewind:before { content: '\f0bc'} /* */
176 | .octicon-plug:before { content: '\f0d4'} /* */
177 | .octicon-repo-create:before,
178 | .octicon-gist-new:before,
179 | .octicon-file-directory-create:before,
180 | .octicon-file-add:before,
181 | .octicon-plus:before { content: '\f05d'} /* */
182 | .octicon-podium:before { content: '\f0af'} /* */
183 | .octicon-primitive-dot:before { content: '\f052'} /* */
184 | .octicon-primitive-square:before { content: '\f053'} /* */
185 | .octicon-pulse:before { content: '\f085'} /* */
186 | .octicon-puzzle:before { content: '\f0c0'} /* */
187 | .octicon-question:before { content: '\f02c'} /* */
188 | .octicon-quote:before { content: '\f063'} /* */
189 | .octicon-radio-tower:before { content: '\f030'} /* */
190 | .octicon-repo-delete:before,
191 | .octicon-repo:before { content: '\f001'} /* */
192 | .octicon-repo-clone:before { content: '\f04c'} /* */
193 | .octicon-repo-force-push:before { content: '\f04a'} /* */
194 | .octicon-gist-fork:before,
195 | .octicon-repo-forked:before { content: '\f002'} /* */
196 | .octicon-repo-pull:before { content: '\f006'} /* */
197 | .octicon-repo-push:before { content: '\f005'} /* */
198 | .octicon-rocket:before { content: '\f033'} /* */
199 | .octicon-rss:before { content: '\f034'} /* */
200 | .octicon-ruby:before { content: '\f047'} /* */
201 | .octicon-screen-full:before { content: '\f066'} /* */
202 | .octicon-screen-normal:before { content: '\f067'} /* */
203 | .octicon-search-save:before,
204 | .octicon-search:before { content: '\f02e'} /* */
205 | .octicon-server:before { content: '\f097'} /* */
206 | .octicon-settings:before { content: '\f07c'} /* */
207 | .octicon-log-in:before,
208 | .octicon-sign-in:before { content: '\f036'} /* */
209 | .octicon-log-out:before,
210 | .octicon-sign-out:before { content: '\f032'} /* */
211 | .octicon-split:before { content: '\f0c6'} /* */
212 | .octicon-squirrel:before { content: '\f0b2'} /* */
213 | .octicon-star-add:before,
214 | .octicon-star-delete:before,
215 | .octicon-star:before { content: '\f02a'} /* */
216 | .octicon-steps:before { content: '\f0c7'} /* */
217 | .octicon-stop:before { content: '\f08f'} /* */
218 | .octicon-repo-sync:before,
219 | .octicon-sync:before { content: '\f087'} /* */
220 | .octicon-tag-remove:before,
221 | .octicon-tag-add:before,
222 | .octicon-tag:before { content: '\f015'} /* */
223 | .octicon-telescope:before { content: '\f088'} /* */
224 | .octicon-terminal:before { content: '\f0c8'} /* */
225 | .octicon-three-bars:before { content: '\f05e'} /* */
226 | .octicon-tools:before { content: '\f031'} /* */
227 | .octicon-trashcan:before { content: '\f0d0'} /* */
228 | .octicon-triangle-down:before { content: '\f05b'} /* */
229 | .octicon-triangle-left:before { content: '\f044'} /* */
230 | .octicon-triangle-right:before { content: '\f05a'} /* */
231 | .octicon-triangle-up:before { content: '\f0aa'} /* */
232 | .octicon-unfold:before { content: '\f039'} /* */
233 | .octicon-unmute:before { content: '\f0ba'} /* */
234 | .octicon-versions:before { content: '\f064'} /* */
235 | .octicon-remove-close:before,
236 | .octicon-x:before { content: '\f081'} /* */
237 | .octicon-zap:before { content: '\26A1'} /* ⚡ */
238 |
--------------------------------------------------------------------------------
/css/base.css:
--------------------------------------------------------------------------------
1 | /*----------------------------------------------------------------------------
2 | Global Reset
3 | ----------------------------------------------------------------------------*/
4 |
5 | * {
6 | padding: 0;
7 | margin: 0;
8 | }
9 |
10 | h1,
11 | h2,
12 | h3,
13 | h4,
14 | h5,
15 | h6,
16 | p,
17 | pre,
18 | blockquote,
19 | label,
20 | ol,
21 | dl,
22 | fieldset,
23 | address {
24 | margin: 1em 0;
25 | }
26 |
27 | li,
28 | dd {
29 | margin-left: 5%;
30 | }
31 |
32 | fieldset {
33 | padding: .5em;
34 | }
35 |
36 | select option {
37 | padding: 0 5px;
38 | }
39 |
40 | .access {
41 | display: none;
42 | }
43 |
44 | /* For accessibility related elements */
45 | .clear {
46 | clear: both;
47 | height: 0px;
48 | font-size: 0px;
49 | line-height: 0px;
50 | overflow: hidden;
51 | }
52 |
53 | a {
54 | outline: none;
55 | }
56 |
57 | a img {
58 | border: none;
59 | }
60 |
61 | .clearfix:after {
62 | content: ".";
63 | display: block;
64 | height: 0;
65 | clear: both;
66 | visibility: hidden;
67 | }
68 |
69 | * html .clearfix {
70 | height: 1%;
71 | }
72 |
73 | .clearfix {
74 | display: inline-block;
75 | }
76 |
77 | .clearfix {
78 | display: block;
79 | }
80 |
81 | /*----------------------------------------------------------------------------
82 | Main Layout
83 | ----------------------------------------------------------------------------*/
84 |
85 | body {
86 | font-family: "Lato", Arial, sans-serif;
87 | font-size: 14px;
88 | line-height: 1.3;
89 | color: #333;
90 | text-shadow: 0 1px 0 rgba(255, 255, 255, 1.0);
91 | border-top: 4px solid #556270;
92 | border-bottom: 4px solid #556270;
93 | }
94 |
95 | strong {
96 | font-weight: bold;
97 | }
98 |
99 | a {
100 | color: #2382c8;
101 | text-decoration: none;
102 | }
103 |
104 | a:hover {
105 | text-decoration: underline;
106 | }
107 |
108 | hr {
109 | margin: 20px 0 25px 0;
110 | text-align: center;
111 | letter-spacing: 3px;
112 | font-size: 20px;
113 | color: #ddd;
114 | border: none;
115 | }
116 |
117 | hr:before {
118 | content: '\2022 \2022 \2022 \2022 \2022';
119 | }
120 |
121 | .container {
122 | margin: 0 auto;
123 | max-width: 1080px;
124 | padding: 0 20px;
125 | }
126 |
127 | .header-container {
128 | margin: 0 auto;
129 | max-width: 1080px;
130 | padding: 0 20px;
131 | }
132 |
133 | header {
134 | margin: 0 0 20px 0;
135 | text-align: right;
136 | }
137 |
138 | ul.nav {
139 | background-color: #eee;
140 | margin: 0;
141 | padding: 12px 0 10px 0;
142 | list-style-type: none;
143 | line-height: 30px;
144 | }
145 |
146 | ul.nav li {
147 | margin: 0 20px;
148 | display: inline-block;
149 | text-transform: uppercase;
150 | font-size: 18px;
151 | font-weight: 300;
152 | }
153 |
154 | @media only screen and (max-width: 520px) {
155 | ul.nav {
156 | position: relative;
157 | padding-top: 40px;
158 | }
159 |
160 | ul.nav li {
161 | margin: 0 4px;
162 | font-size: 13px;
163 | }
164 |
165 | ul.nav li.logo {
166 | position: absolute;
167 | top: 10px;
168 | left: 50%;
169 | margin-left: -14px;
170 | }
171 | }
172 |
173 | ul.nav li a {
174 | color: #000;
175 | text-decoration: none;
176 | font-weight: lighter;
177 | }
178 |
179 | ul.nav li.logo {
180 | text-transform: none;
181 | }
182 |
183 | ul.nav li.logo a {
184 | position: relative;
185 | top: -2px;
186 | display: inline-block;
187 | width: 27px;
188 | height: 27px;
189 | line-height: 26px;
190 | color: #fff;
191 | font-weight: bold;
192 | background: #556270;
193 | border-radius: 100px;
194 | box-shadow: 0 1px 0 rgba(255, 255, 255, 1.0);
195 | }
196 |
197 | /*------------------------------------------------------------------------------
198 | Home Page
199 | ------------------------------------------------------------------------------*/
200 |
201 | .listing .post {
202 | margin: 60px 0;
203 | }
204 |
205 | .listing .post:first-child {
206 | margin-top: 22px;
207 | }
208 |
209 | .listing .post p.date {
210 | font-size: 14px;
211 | color: #bbb;
212 | }
213 |
214 | .listing .post h2 {
215 | margin: 0 0 -20px 0;
216 | font-size: 30px;
217 | border: none;
218 | }
219 |
220 | .listing .post h2 a {
221 | color: #55acee;
222 | text-decoration: none;
223 | }
224 |
225 | .listing .post .post-summary {
226 | font-size: 20px;
227 | color: #777;
228 | }
229 |
230 | .listing .post.other {
231 | color: #666;
232 | /*border-left: 1px solid #ddd;*/
233 | }
234 |
235 | .listing .post.other h2 {
236 | margin: -5px 0 -15px 0;
237 | font-size: 21px;
238 | font-weight: lighter;
239 | }
240 |
241 | .listing .post.other h2 a {
242 | color: #55acee;
243 | }
244 |
245 | .listing .post.other p:last-child {
246 | margin-bottom: 0;
247 | }
248 |
249 | .listing .post.other .icon {
250 | font-family: "Lato", Arial, sans-serif;
251 | float: left;
252 | margin-top: -3px;
253 | margin-left: -35px;
254 | width: 20px;
255 | height: 20px;
256 | font-size: 20px;
257 | color: #ddd;
258 | }
259 |
260 | .listing .post.other .icon:hover {
261 | text-decoration: none;
262 | color: #bbb;
263 | }
264 |
265 | .listing blockquote {
266 | border-left-color: #ddd;
267 | }
268 |
269 | @media only screen and (max-width: 520px) {
270 | .listing .post {
271 | margin: 30px 0;
272 | }
273 |
274 | .listing .post h2 {
275 | font-size: 24px;
276 | }
277 |
278 | .listing .post .post-summary {
279 | font-size: 18px;
280 | }
281 | }
282 |
283 | /*------------------------------------------------------------------------------
284 | Post Styles
285 | ------------------------------------------------------------------------------*/
286 |
287 | p.date {
288 | color: #aaa;
289 | margin: 20px 0 0 0;
290 | }
291 |
292 | p.intro {
293 | font-family: 'Lato', sans-serif;
294 | font-size: 32px;
295 | line-height: 1.2;
296 | text-align: justify;
297 | font-weight: lighter;
298 | }
299 |
300 | @media only screen and (max-width: 520px) {
301 | p.intro {
302 | font-size: 20px;
303 | }
304 | }
305 |
306 | p.intro a {
307 | color: #55acee;
308 | }
309 |
310 | h1 {
311 | margin-left: 20px;
312 | }
313 |
314 | h1.words {
315 | color: #DB2C17;
316 | }
317 |
318 | h1.link {
319 | font-size: 32px;
320 | }
321 |
322 | h1.link .desc {
323 | font-weight: normal;
324 | color: #000;
325 | }
326 |
327 | @media only screen and (max-width: 700px) {
328 | h1 {
329 | font-size: 48px;
330 | letter-spacing: 0;
331 | }
332 | }
333 |
334 | h2 {
335 | margin: 1.0em 0 0 0;
336 | font-size: 20px;
337 | color: #000;
338 | }
339 |
340 | h3 {
341 | margin: 2.0em 0 0 0;
342 | font-size: 17px;
343 | color: #333;
344 | }
345 |
346 | h3 a,
347 | h3 a:visited,
348 | h2 a,
349 | h2 a:visited {
350 | color: #000;
351 | }
352 |
353 | h3 a:hover,
354 | h2 a:hover {
355 | color: #000;
356 | border: none;
357 | }
358 |
359 | h4 {
360 | font-size: 1em;
361 | font-weight: normal;
362 | color: #000;
363 | }
364 |
365 | .pagination {
366 | text-align: right;
367 | }
368 |
369 | .figure {
370 | margin: 19px 0 19px 0;
371 | padding: 2px;
372 | text-align: center;
373 | border: 1px solid #ddd;
374 | background: #f5f5f5;
375 | line-height: 0;
376 | }
377 |
378 | .fig-a {
379 | float: right;
380 | margin-left: 15px;
381 | }
382 |
383 | .figure small {
384 | margin: 2px 0 0 0;
385 | padding: 5px 7px;
386 | display: block;
387 | font-size: 11px;
388 | line-height: 12px;
389 | text-align: left;
390 | color: #666;
391 | background: #ddd;
392 | text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
393 | }
394 |
395 | .figure small strong {
396 | text-transform: uppercase;
397 | }
398 |
399 | .figure img {
400 | max-width: 100%;
401 | }
402 |
403 | blockquote {
404 | margin: 1.0em 0;
405 | padding: 0 0 0 15px;
406 | font-size: 16px;
407 | border-left: 2px solid #aaa;
408 | }
409 |
410 | blockquote p {
411 | margin: 12px 0;
412 | color: #999;
413 | }
414 |
415 | table {
416 | width: 100%;
417 | border-top: 1px solid #CCCCCC;
418 | border-bottom: 2px solid #CCC;
419 | color: #000;
420 | background: #fff;
421 | border-collapse: separate;
422 | font-size: 11px;
423 | }
424 |
425 | caption {
426 | padding: 10px 10px 5px 0;
427 | text-align: left;
428 | font-size: 12px;
429 | text-transform: uppercase;
430 | font-weight: bold;
431 | }
432 |
433 | th {
434 | text-align: center;
435 | padding: 5px;
436 | }
437 |
438 | td {
439 | text-align: center;
440 | padding: 3px 5px;
441 | }
442 |
443 | .odd td {
444 | background: #F0F1F2;
445 | }
446 |
447 | table.data th,
448 | table.data td {
449 | text-align: left;
450 | }
451 |
452 | p.note {
453 | color: #666;
454 | }
455 |
456 | .twitter-tweet-rendered {
457 | padding: 10px 0;
458 | }
459 |
460 | @media only screen and (max-width: 520px) {
461 | h1 {
462 | font-size: 30px;
463 | line-height: 1.0;
464 | letter-spacing: 0;
465 | }
466 |
467 | .container .twitter-tweet-rendered.tw-align-center {
468 | width: 100% !important;
469 | }
470 | }
471 |
472 | img {
473 | max-width: 100%;
474 | }
475 |
476 | p>a>img {
477 | max-width: 100%;
478 | }
479 |
480 | /*----------------------------------------------------------------------------
481 | Follow Box
482 | ----------------------------------------------------------------------------*/
483 |
484 | .keep-in-touch {
485 | text-align: right;
486 | margin: 30px 0;
487 | border-top: 1px solid #dfe4ea;
488 | }
489 |
490 | .keep-in-touch p:first-child {
491 | margin-top: 0;
492 | padding-top: 20px;
493 | border-top: 1px solid #fff;
494 | }
495 |
496 | .keep-in-touch a {
497 | color: #55acee;
498 | }
499 |
500 | .post-date {
501 | font-size: 14px;
502 | }
503 |
504 | @media only screen and (max-width: 520px) {
505 | .keep-in-touch {
506 | font-size: 14px;
507 | }
508 | }
509 |
510 | /*----------------------------------------------------------------------------
511 | Code Styles
512 | ----------------------------------------------------------------------------*/
513 |
514 | pre {
515 | margin: 16px 0;
516 | padding: 10px;
517 | color: #444;
518 | background: #fff;
519 | border-bottom: 1px solid #eee;
520 | border-radius: 4px;
521 | overflow: auto;
522 | -webkit-font-smoothing: subpixel-antialiased;
523 | }
524 |
525 | code {
526 | padding: 0px 8px;
527 | font-family: "Source Code Pro", "Courier New", Courier, sans-serif;
528 | font-size: 1.0em;
529 | color: #556270;
530 | background: #EBF6FF;
531 | border-radius: 3px;
532 | display: inline-block;
533 | margin: 2px 2px;
534 | }
535 |
536 | pre code {
537 | padding: 0;
538 | color: inherit;
539 | background: inherit;
540 | border-radius: 0;
541 | }
542 |
543 | code span.global {
544 | color: #3388DD;
545 | }
546 |
547 | code span.brackets {
548 | color: #777777;
549 | }
550 |
551 | code span.string {
552 | color: #BC6710;
553 | }
554 |
555 | code span.symbol,
556 | code span.selectors {
557 | color: #1199EE;
558 | }
559 |
560 | code span.properties {
561 | color: #BB4411;
562 | }
563 |
564 | code span.keywords {
565 | color: #44BB22;
566 | }
567 |
568 | code span.comment {
569 | color: #BCBCBC;
570 | }
571 |
572 | code span.shell {
573 | background: #f1f1f1;
574 | }
575 |
576 | code.html span.tag,
577 | code.xaml span.tag {
578 | color: #BB4411;
579 | }
580 |
581 | code.html span.attribute,
582 | code.xaml span.attribute {
583 | color: #44BB22;
584 | }
585 |
586 | code.html span.string,
587 | code.xaml span.string {
588 | color: blue;
589 | }
590 |
591 | code.html span.comment,
592 | code.xaml span.comment {
593 | color: #999999;
594 | }
595 |
596 | code.html span.doctype {
597 | color: #D7FF80;
598 | }
599 |
600 | /*----------------------------------------------------------------------------
601 | Default Pygments Styles
602 | ----------------------------------------------------------------------------*/
603 |
604 | .highlight .c {
605 | color: #999988;
606 | font-style: italic
607 | }
608 |
609 | /* Comment */
610 | .highlight .err {
611 | color: #a61717;
612 | background-color: #e3d2d2
613 | }
614 |
615 | /* Error */
616 | .highlight .k {
617 | font-weight: normal
618 | }
619 |
620 | /* Keyword */
621 | .highlight .o {
622 | font-weight: normal
623 | }
624 |
625 | /* Operator */
626 | .highlight .cm {
627 | color: #999988;
628 | font-style: italic
629 | }
630 |
631 | /* Comment.Multiline */
632 | .highlight .cp {
633 | color: #999999;
634 | font-weight: bold
635 | }
636 |
637 | /* Comment.Preproc */
638 | .highlight .c1 {
639 | color: #999988;
640 | font-style: italic
641 | }
642 |
643 | /* Comment.Single */
644 | .highlight .cs {
645 | color: #999999;
646 | font-weight: bold;
647 | font-style: italic
648 | }
649 |
650 | /* Comment.Special */
651 | .highlight .gd .x {
652 | color: #000000;
653 | background-color: #ffaaaa
654 | }
655 |
656 | /* Generic.Deleted.Specific */
657 | .highlight .ge {
658 | font-style: italic
659 | }
660 |
661 | /* Generic.Emph */
662 | .highlight .gr {
663 | color: #aa0000
664 | }
665 |
666 | /* Generic.Error */
667 | .highlight .gh {
668 | color: #999999
669 | }
670 |
671 | /* Generic.Heading */
672 | .highlight .gi {
673 | color: #000000;
674 | background-color: #ddffdd
675 | }
676 |
677 | /* Generic.Inserted */
678 | .highlight .gi .x {
679 | color: #000000;
680 | background-color: #aaffaa
681 | }
682 |
683 | /* Generic.Inserted.Specific */
684 | .highlight .go {
685 | color: #888888
686 | }
687 |
688 | /* Generic.Output */
689 | .highlight .gp {
690 | color: #555555
691 | }
692 |
693 | /* Generic.Prompt */
694 | .highlight .gs {
695 | font-weight: bold
696 | }
697 |
698 | /* Generic.Strong */
699 | .highlight .gu {
700 | color: #aaaaaa
701 | }
702 |
703 | /* Generic.Subheading */
704 | .highlight .gt {
705 | color: #aa0000
706 | }
707 |
708 | /* Generic.Traceback */
709 | .highlight .kc {
710 | font-weight: bold
711 | }
712 |
713 | /* Keyword.Constant */
714 | .highlight .kd {
715 | font-weight: bold
716 | }
717 |
718 | /* Keyword.Declaration */
719 | .highlight .kp {
720 | font-weight: bold
721 | }
722 |
723 | /* Keyword.Pseudo */
724 | .highlight .gd {
725 | color: #000000;
726 | background-color: #ffdddd
727 | }
728 |
729 | /* Generic.Deleted */
730 | .highlight .kr {
731 | font-weight: bold
732 | }
733 |
734 | /* Keyword.Reserved */
735 | .highlight .kt {
736 | color: #445588;
737 | font-weight: bold
738 | }
739 |
740 | /* Keyword.Type */
741 | .highlight .m {
742 | color: #009999
743 | }
744 |
745 | /* Literal.Number */
746 | .highlight .s {
747 | color: #d14
748 | }
749 |
750 | /* Literal.String */
751 | .highlight .na {
752 | color: #008080
753 | }
754 |
755 | /* Name.Attribute */
756 | .highlight .nb {
757 | color: #0086B3
758 | }
759 |
760 | /* Name.Builtin */
761 | .highlight .nc {
762 | color: #445588;
763 | font-weight: bold
764 | }
765 |
766 | /* Name.Class */
767 | .highlight .no {
768 | color: #008080
769 | }
770 |
771 | /* Name.Constant */
772 | .highlight .ni {
773 | color: #800080
774 | }
775 |
776 | /* Name.Entity */
777 | .highlight .ne {
778 | color: #990000;
779 | font-weight: bold
780 | }
781 |
782 | /* Name.Exception */
783 | .highlight .nf {
784 | color: #990000;
785 | font-weight: bold
786 | }
787 |
788 | /* Name.Function */
789 | .highlight .nn {
790 | color: #555555
791 | }
792 |
793 | /* Name.Namespace */
794 | .highlight .nt {
795 | color: #000080
796 | }
797 |
798 | /* Name.Tag */
799 | .highlight .nv {
800 | color: #008080
801 | }
802 |
803 | /* Name.Variable */
804 | .highlight .ow {
805 | font-weight: bold
806 | }
807 |
808 | /* Operator.Word */
809 | .highlight .w {
810 | color: #bbbbbb
811 | }
812 |
813 | /* Text.Whitespace */
814 | .highlight .mf {
815 | color: #009999
816 | }
817 |
818 | /* Literal.Number.Float */
819 | .highlight .mh {
820 | color: #009999
821 | }
822 |
823 | /* Literal.Number.Hex */
824 | .highlight .mi {
825 | color: #009999
826 | }
827 |
828 | /* Literal.Number.Integer */
829 | .highlight .mo {
830 | color: #009999
831 | }
832 |
833 | /* Literal.Number.Oct */
834 | .highlight .sb {
835 | color: #d14
836 | }
837 |
838 | /* Literal.String.Backtick */
839 | .highlight .sc {
840 | color: #d14
841 | }
842 |
843 | /* Literal.String.Char */
844 | .highlight .sd {
845 | color: #d14
846 | }
847 |
848 | /* Literal.String.Doc */
849 | .highlight .s2 {
850 | color: #d14
851 | }
852 |
853 | /* Literal.String.Double */
854 | .highlight .se {
855 | color: #d14
856 | }
857 |
858 | /* Literal.String.Escape */
859 | .highlight .sh {
860 | color: #d14
861 | }
862 |
863 | /* Literal.String.Heredoc */
864 | .highlight .si {
865 | color: #d14
866 | }
867 |
868 | /* Literal.String.Interpol */
869 | .highlight .sx {
870 | color: #d14
871 | }
872 |
873 | /* Literal.String.Other */
874 | .highlight .sr {
875 | color: #009926
876 | }
877 |
878 | /* Literal.String.Regex */
879 | .highlight .s1 {
880 | color: #d14
881 | }
882 |
883 | /* Literal.String.Single */
884 | .highlight .ss {
885 | color: #990073
886 | }
887 |
888 | /* Literal.String.Symbol */
889 | .highlight .bp {
890 | color: #999999
891 | }
892 |
893 | /* Name.Builtin.Pseudo */
894 | .highlight .vc {
895 | color: #008080
896 | }
897 |
898 | /* Name.Variable.Class */
899 | .highlight .vg {
900 | color: #008080
901 | }
902 |
903 | /* Name.Variable.Global */
904 | .highlight .vi {
905 | color: #008080
906 | }
907 |
908 | /* Name.Variable.Instance */
909 | .highlight .il {
910 | color: #009999
911 | }
912 |
913 | /* Literal.Number.Integer.Long */
914 |
915 | /* @end */
916 |
917 | /* Chase */
918 | h1 {
919 | margin-left: 0px;
920 | margin-top: 12px;
921 | margin-bottom: 4px;
922 | }
923 |
924 | h2 {
925 | font-size: 25px;
926 | border-bottom: 1px solid #eee;
927 | margin-bottom: 5px;
928 | }
929 |
930 | h3 {
931 | margin: 5px 0 0 0;
932 | }
933 |
934 | pre {
935 | margin: 0 20px;
936 | padding: 0px;
937 | border-bottom: 0px;
938 | background-color: #f9f9f9;
939 | }
940 |
941 | body {
942 | padding-bottom: 30px;
943 | border: 0px;
944 | }
945 |
946 |
947 | .social-buttons {
948 | display: flex;
949 | align-items: center;
950 | }
951 |
952 | .social-buttons img {
953 | width: 25px;
954 | height: 25px;
955 | margin-right: 10px;
956 | }
--------------------------------------------------------------------------------
/css/octicons.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
197 |
--------------------------------------------------------------------------------