├── .gitignore ├── LICENSE.md ├── Readme.md ├── assets ├── logo.png └── normal.jpg ├── index.less ├── package.json └── styles ├── base.less ├── colors.less ├── open-color.less └── syntax-variables.less /.gitignore: -------------------------------------------------------------------------------- 1 | test.* 2 | .DS_Store 3 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2016 TJ Holowaychuk 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 | -------------------------------------------------------------------------------- /Readme.md: -------------------------------------------------------------------------------- 1 | ![Apex Atom monochrome UI](assets/logo.png) 2 | 3 | ### Installation 4 | 5 | ``` 6 | $ apm install apex-syntax 7 | ``` 8 | 9 | ### Screenshot 10 | 11 | ![](assets/normal.jpg) 12 | 13 | ## Links 14 | 15 | - [Apex UI](https://github.com/apex/apex-ui) 16 | 17 | ## Badges 18 | 19 | [![](http://apex.sh/images/badge.svg)](https://apex.sh/ping/) 20 | ![](https://img.shields.io/badge/license-MIT-blue.svg) 21 | 22 | --- 23 | 24 | > [tjholowaychuk.com](http://tjholowaychuk.com)  ·  25 | > GitHub [@tj](https://github.com/tj)  ·  26 | > Twitter [@tjholowaychuk](https://twitter.com/tjholowaychuk) 27 | -------------------------------------------------------------------------------- /assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/apex/apex-syntax/36be3178de2e70ef73c8aca28b343e4c09ec3bff/assets/logo.png -------------------------------------------------------------------------------- /assets/normal.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/apex/apex-syntax/36be3178de2e70ef73c8aca28b343e4c09ec3bff/assets/normal.jpg -------------------------------------------------------------------------------- /index.less: -------------------------------------------------------------------------------- 1 | @import "./styles/base.less"; 2 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "apex-syntax", 3 | "theme": "syntax", 4 | "version": "0.2.0", 5 | "description": "Apex monochrome theme syntax inspired by iA Writer", 6 | "keywords": [ 7 | "apex", 8 | "monochrome", 9 | "syntax", 10 | "ia", 11 | "writer", 12 | "light" 13 | ], 14 | "repository": "https://github.com/apex/apex-syntax", 15 | "license": "MIT", 16 | "engines": { 17 | "atom": ">=1.0.0 <2.0.0" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /styles/base.less: -------------------------------------------------------------------------------- 1 | @import "syntax-variables"; 2 | 3 | atom-text-editor, atom-text-editor { 4 | background-color: @syntax-background-color; 5 | color: @syntax-text-color; 6 | 7 | .wrap-guide { 8 | background-color: @syntax-wrap-guide-color; 9 | } 10 | 11 | .indent-guide { 12 | color: @syntax-indent-guide-color; 13 | } 14 | 15 | .invisible-character { 16 | color: @syntax-invisible-character-color; 17 | } 18 | 19 | .lines { 20 | .cursor-line { 21 | background-color: @syntax-gutter-background-color; 22 | } 23 | .syntax--inside-js.syntax--css.syntax--styled .syntax--property-name { 24 | font-weight: bold; 25 | } 26 | } 27 | 28 | .gutter { 29 | background-color: @syntax-gutter-background-color; 30 | color: @syntax-gutter-text-color; 31 | 32 | .line-number { 33 | &.cursor-line { 34 | background-color: @syntax-gutter-background-color-selected; 35 | color: @syntax-gutter-text-color-selected; 36 | } 37 | 38 | &.cursor-line-no-selection { 39 | color: @syntax-gutter-text-color-selected; 40 | } 41 | } 42 | } 43 | 44 | .gutter .line-number.folded, 45 | .gutter .line-number:after, 46 | .fold-marker:after { 47 | color: @syntax-text-color; 48 | } 49 | 50 | .invisible { 51 | color: @syntax-text-color; 52 | } 53 | 54 | .cursor { 55 | color: @syntax-cursor-color; 56 | border-left: 2px solid; 57 | } 58 | 59 | .selection .region { 60 | background-color: @syntax-selection-color; 61 | } 62 | } 63 | 64 | atom-text-editor .search-results .syntax--marker .region, 65 | atom-text-editor .search-results .syntax--marker .region { 66 | // background-color: transparent; 67 | border: 1px solid @syntax-result-marker-color; 68 | } 69 | 70 | atom-text-editor .search-results .syntax--marker.current-result .region, 71 | atom-text-editor .search-results .syntax--marker.current-result .region { 72 | border: 1px solid @syntax-result-marker-color-selected; 73 | } 74 | 75 | // Primitives 76 | 77 | .syntax--string { 78 | color: @syntax-text-color-light; 79 | } 80 | 81 | // Comments 82 | 83 | .syntax--comment { 84 | color: @syntax-comment-color; 85 | background-color: @syntax-comment-background-color; 86 | } 87 | 88 | // Punctuation 89 | 90 | .syntax--punctuation { 91 | &.syntax--definition { 92 | &.syntax--comment { 93 | color: @syntax-comment-delim-color; 94 | } 95 | 96 | &.syntax--bold { 97 | color: @syntax-text-color; 98 | font-weight: bold; 99 | } 100 | 101 | &.syntax--italic { 102 | color: @syntax-text-color; 103 | font-style: italic; 104 | } 105 | } 106 | 107 | &.syntax--section.syntax--embedded { 108 | color: @syntax-text-color; 109 | } 110 | 111 | } 112 | 113 | // CSS 114 | 115 | .syntax--source.syntax--css { 116 | .syntax--selector { 117 | color: @syntax-text-color-dark; 118 | font-weight: bold; 119 | } 120 | 121 | .syntax--property-value { 122 | color: @syntax-text-color-light; 123 | } 124 | } 125 | 126 | // Markdown 127 | 128 | .syntax--source.syntax--gfm { 129 | .syntax--heading.syntax--marker { 130 | font-weight: normal; 131 | } 132 | 133 | .syntax--heading { 134 | color: @syntax-text-color-dark; 135 | font-weight: bold; 136 | } 137 | } 138 | 139 | // Misc 140 | 141 | .syntax--todo, 142 | .syntax--fixme, 143 | .xxx { 144 | color: @syntax-text-color-dark; 145 | margin-right: 3px; 146 | } 147 | 148 | // Bracket matcher 149 | 150 | .bracket-matcher { 151 | border-bottom: none; 152 | position: absolute; 153 | background-color: rgba(0, 0, 0, 0.0); 154 | } 155 | 156 | atom-text-editor.editor .bracket-matcher .region { 157 | border-bottom: none; 158 | background-color: @bracket-match-color; 159 | border-bottom: 1px solid darken(@bracket-match-color, 50%); 160 | } 161 | 162 | // Tab coloring 163 | 164 | .tab-bar .syntax--tab[data-type="TextEditor"]::after { 165 | background-color: fade(@white, 15%); 166 | } 167 | -------------------------------------------------------------------------------- /styles/colors.less: -------------------------------------------------------------------------------- 1 | // These colors are specific to the theme. Do not use in a package! 2 | 3 | @import "open-color"; 4 | 5 | @very-light-gray: #c5c8c6; 6 | @light-gray: #969896; 7 | @gray: #373b41; 8 | @dark-gray: #282a2e; 9 | @very-dark-gray: #1d1f21; 10 | 11 | @color-zero: @oc-gray-0; // Background 12 | @color-one: @oc-gray-9; // Main Text 13 | @color-two: @oc-gray-5; // Second Layer Text 14 | @color-three: @oc-gray-3; // Comments 15 | @color-four: @oc-gray-9; // Strings 16 | @color-five: @oc-gray-9; // Errors 17 | @color-six: @oc-gray-9; // HTML Tags 18 | @color-seven: @oc-blue-2; // Selected Region Color 19 | @color-eight: @subblack; // CSS Variables 20 | @color-nine: @oc-gray-9; // C# Numbers, CSS Options 21 | @color-ten: @oc-gray-9; // C# Function names 22 | @color-eleven: @oc-gray-9; // C# Class Names 23 | @color-twelve: @subblack; // CSS IDs 24 | @color-thirteen: @oc-blue-1; // match background 25 | 26 | @lunar: #ECEFF4; // 27 | @graphite: rgba(93, 110, 129, 0.9); // 28 | @xgraphite: rgba(93, 110, 129, 1.0); // 29 | @module: #2D61A1; 30 | @orbit: #20354F; 31 | @alphagray: rgb(175, 175, 175); 32 | 33 | @red: #FF6D87; // 34 | @orange: #FF8970; // 35 | @yellow: #FFA924; // 36 | @green: #32F7C6; 37 | @cyan: #14C4D4; // 38 | @blue: #04A7D8; // 39 | @purple: #A79AFF; // 40 | @subblack: fade(@oc-gray-9, 60%); 41 | @subblack-2: fade(@oc-gray-9, 40%); 42 | @subblack-3: fade(@oc-gray-9, 20%); 43 | @white: #FFFFFF; 44 | @black: #000000; 45 | -------------------------------------------------------------------------------- /styles/open-color.less: -------------------------------------------------------------------------------- 1 | // 2 | // 3 | // 𝗖 𝗢 𝗟 𝗢 𝗥 4 | // v 1.4.0 5 | // 6 | // ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 7 | 8 | 9 | // General 10 | // ─────────────────────────────────── 11 | 12 | @oc-white: #ffffff; 13 | @oc-black: #000000; 14 | 15 | 16 | // Gray 17 | // ─────────────────────────────────── 18 | 19 | @oc-gray-list: #f8f9fa, #f1f3f5, #e9ecef, #dee2e6, #ced4da, #adb5bd, #868e96, #495057, #343a40, #212529; 20 | 21 | @oc-gray-0: extract(@oc-gray-list, 1); 22 | @oc-gray-1: extract(@oc-gray-list, 2); 23 | @oc-gray-2: extract(@oc-gray-list, 3); 24 | @oc-gray-3: extract(@oc-gray-list, 4); 25 | @oc-gray-4: extract(@oc-gray-list, 5); 26 | @oc-gray-5: extract(@oc-gray-list, 6); 27 | @oc-gray-6: extract(@oc-gray-list, 7); 28 | @oc-gray-7: extract(@oc-gray-list, 8); 29 | @oc-gray-8: extract(@oc-gray-list, 9); 30 | @oc-gray-9: extract(@oc-gray-list, 10); 31 | 32 | 33 | // Red 34 | // ─────────────────────────────────── 35 | 36 | @oc-red-list: #fff5f5, #ffe3e3, #ffc9c9, #ffa8a8, #ff8787, #ff6b6b, #fa5252, #f03e3e, #e03131, #c92a2a; 37 | 38 | @oc-red-0: extract(@oc-red-list, 1); 39 | @oc-red-1: extract(@oc-red-list, 2); 40 | @oc-red-2: extract(@oc-red-list, 3); 41 | @oc-red-3: extract(@oc-red-list, 4); 42 | @oc-red-4: extract(@oc-red-list, 5); 43 | @oc-red-5: extract(@oc-red-list, 6); 44 | @oc-red-6: extract(@oc-red-list, 7); 45 | @oc-red-7: extract(@oc-red-list, 8); 46 | @oc-red-8: extract(@oc-red-list, 9); 47 | @oc-red-9: extract(@oc-red-list, 10); 48 | 49 | 50 | // Pink 51 | // ─────────────────────────────────── 52 | 53 | @oc-pink-list: #fff0f6, #ffdeeb, #fcc2d7, #faa2c1, #f783ac, #f06595, #e64980, #d6336c, #c2255c, #a61e4d; 54 | 55 | @oc-pink-0: extract(@oc-pink-list, 1); 56 | @oc-pink-1: extract(@oc-pink-list, 2); 57 | @oc-pink-2: extract(@oc-pink-list, 3); 58 | @oc-pink-3: extract(@oc-pink-list, 4); 59 | @oc-pink-4: extract(@oc-pink-list, 5); 60 | @oc-pink-5: extract(@oc-pink-list, 6); 61 | @oc-pink-6: extract(@oc-pink-list, 7); 62 | @oc-pink-7: extract(@oc-pink-list, 8); 63 | @oc-pink-8: extract(@oc-pink-list, 9); 64 | @oc-pink-9: extract(@oc-pink-list, 10); 65 | 66 | 67 | // Grape 68 | // ─────────────────────────────────── 69 | 70 | @oc-grape-list: #f8f0fc, #f3d9fa, #eebefa, #e599f7, #da77f2, #cc5de8, #be4bdb, #ae3ec9, #9c36b5, #862e9c; 71 | 72 | @oc-grape-0: extract(@oc-grape-list, 1); 73 | @oc-grape-1: extract(@oc-grape-list, 2); 74 | @oc-grape-2: extract(@oc-grape-list, 3); 75 | @oc-grape-3: extract(@oc-grape-list, 4); 76 | @oc-grape-4: extract(@oc-grape-list, 5); 77 | @oc-grape-5: extract(@oc-grape-list, 6); 78 | @oc-grape-6: extract(@oc-grape-list, 7); 79 | @oc-grape-7: extract(@oc-grape-list, 8); 80 | @oc-grape-8: extract(@oc-grape-list, 9); 81 | @oc-grape-9: extract(@oc-grape-list, 10); 82 | 83 | 84 | // Violet 85 | // ─────────────────────────────────── 86 | 87 | @oc-violet-list: #f3f0ff, #e5dbff, #d0bfff, #b197fc, #9775fa, #845ef7, #7950f2, #7048e8, #6741d9, #5f3dc4; 88 | 89 | @oc-violet-0: extract(@oc-violet-list, 1); 90 | @oc-violet-1: extract(@oc-violet-list, 2); 91 | @oc-violet-2: extract(@oc-violet-list, 3); 92 | @oc-violet-3: extract(@oc-violet-list, 4); 93 | @oc-violet-4: extract(@oc-violet-list, 5); 94 | @oc-violet-5: extract(@oc-violet-list, 6); 95 | @oc-violet-6: extract(@oc-violet-list, 7); 96 | @oc-violet-7: extract(@oc-violet-list, 8); 97 | @oc-violet-8: extract(@oc-violet-list, 9); 98 | @oc-violet-9: extract(@oc-violet-list, 10); 99 | 100 | 101 | // Indigo 102 | // ─────────────────────────────────── 103 | 104 | @oc-indigo-list: #edf2ff, #dbe4ff, #bac8ff, #91a7ff, #748ffc, #5c7cfa, #4c6ef5, #4263eb, #3b5bdb, #364fc7; 105 | 106 | @oc-indigo-0: extract(@oc-indigo-list, 1); 107 | @oc-indigo-1: extract(@oc-indigo-list, 2); 108 | @oc-indigo-2: extract(@oc-indigo-list, 3); 109 | @oc-indigo-3: extract(@oc-indigo-list, 4); 110 | @oc-indigo-4: extract(@oc-indigo-list, 5); 111 | @oc-indigo-5: extract(@oc-indigo-list, 6); 112 | @oc-indigo-6: extract(@oc-indigo-list, 7); 113 | @oc-indigo-7: extract(@oc-indigo-list, 8); 114 | @oc-indigo-8: extract(@oc-indigo-list, 9); 115 | @oc-indigo-9: extract(@oc-indigo-list, 10); 116 | 117 | 118 | // Blue 119 | // ─────────────────────────────────── 120 | 121 | @oc-blue-list: #e8f7ff, #ccedff, #a3daff, #72c3fc, #4dadf7, #329af0, #228ae6, #1c7cd6, #1b6ec2, #1862ab; 122 | 123 | @oc-blue-0: extract(@oc-blue-list, 1); 124 | @oc-blue-1: extract(@oc-blue-list, 2); 125 | @oc-blue-2: extract(@oc-blue-list, 3); 126 | @oc-blue-3: extract(@oc-blue-list, 4); 127 | @oc-blue-4: extract(@oc-blue-list, 5); 128 | @oc-blue-5: extract(@oc-blue-list, 6); 129 | @oc-blue-6: extract(@oc-blue-list, 7); 130 | @oc-blue-7: extract(@oc-blue-list, 8); 131 | @oc-blue-8: extract(@oc-blue-list, 9); 132 | @oc-blue-9: extract(@oc-blue-list, 10); 133 | 134 | 135 | // Cyan 136 | // ─────────────────────────────────── 137 | 138 | @oc-cyan-list: #e3fafc, #c5f6fa, #99e9f2, #66d9e8, #3bc9db, #22b8cf, #15aabf, #1098ad, #0c8599, #0b7285; 139 | 140 | @oc-cyan-0: extract(@oc-cyan-list, 1); 141 | @oc-cyan-1: extract(@oc-cyan-list, 2); 142 | @oc-cyan-2: extract(@oc-cyan-list, 3); 143 | @oc-cyan-3: extract(@oc-cyan-list, 4); 144 | @oc-cyan-4: extract(@oc-cyan-list, 5); 145 | @oc-cyan-5: extract(@oc-cyan-list, 6); 146 | @oc-cyan-6: extract(@oc-cyan-list, 7); 147 | @oc-cyan-7: extract(@oc-cyan-list, 8); 148 | @oc-cyan-8: extract(@oc-cyan-list, 9); 149 | @oc-cyan-9: extract(@oc-cyan-list, 10); 150 | 151 | 152 | // Teal 153 | // ─────────────────────────────────── 154 | 155 | @oc-teal-list: #e6fcf5, #c3fae8, #96f2d7, #63e6be, #38d9a9, #20c997, #12b886, #0ca678, #099268, #087f5b; 156 | 157 | @oc-teal-0: extract(@oc-teal-list, 1); 158 | @oc-teal-1: extract(@oc-teal-list, 2); 159 | @oc-teal-2: extract(@oc-teal-list, 3); 160 | @oc-teal-3: extract(@oc-teal-list, 4); 161 | @oc-teal-4: extract(@oc-teal-list, 5); 162 | @oc-teal-5: extract(@oc-teal-list, 6); 163 | @oc-teal-6: extract(@oc-teal-list, 7); 164 | @oc-teal-7: extract(@oc-teal-list, 8); 165 | @oc-teal-8: extract(@oc-teal-list, 9); 166 | @oc-teal-9: extract(@oc-teal-list, 10); 167 | 168 | 169 | // Green 170 | // ─────────────────────────────────── 171 | 172 | @oc-green-list: #ebfbee, #d3f9d8, #b2f2bb, #8ce99a, #69db7c, #51cf66, #40c057, #37b24d, #2f9e44, #2b8a3e; 173 | 174 | @oc-green-0: extract(@oc-green-list, 1); 175 | @oc-green-1: extract(@oc-green-list, 2); 176 | @oc-green-2: extract(@oc-green-list, 3); 177 | @oc-green-3: extract(@oc-green-list, 4); 178 | @oc-green-4: extract(@oc-green-list, 5); 179 | @oc-green-5: extract(@oc-green-list, 6); 180 | @oc-green-6: extract(@oc-green-list, 7); 181 | @oc-green-7: extract(@oc-green-list, 8); 182 | @oc-green-8: extract(@oc-green-list, 9); 183 | @oc-green-9: extract(@oc-green-list, 10); 184 | 185 | 186 | // Lime 187 | // ─────────────────────────────────── 188 | 189 | @oc-lime-list: #f4fce3, #e9fac8, #d8f5a2, #c0eb75, #a9e34b, #94d82d, #82c91e, #74b816, #66a80f, #5c940d; 190 | 191 | @oc-lime-0: extract(@oc-lime-list, 1); 192 | @oc-lime-1: extract(@oc-lime-list, 2); 193 | @oc-lime-2: extract(@oc-lime-list, 3); 194 | @oc-lime-3: extract(@oc-lime-list, 4); 195 | @oc-lime-4: extract(@oc-lime-list, 5); 196 | @oc-lime-5: extract(@oc-lime-list, 6); 197 | @oc-lime-6: extract(@oc-lime-list, 7); 198 | @oc-lime-7: extract(@oc-lime-list, 8); 199 | @oc-lime-8: extract(@oc-lime-list, 9); 200 | @oc-lime-9: extract(@oc-lime-list, 10); 201 | 202 | 203 | // Yellow 204 | // ─────────────────────────────────── 205 | 206 | @oc-yellow-list: #fff9db, #fff3bf, #ffec99, #ffe066, #ffd43b, #fcc419, #fab005, #f59f00, #f08c00, #e67700; 207 | 208 | @oc-yellow-0: extract(@oc-yellow-list, 1); 209 | @oc-yellow-1: extract(@oc-yellow-list, 2); 210 | @oc-yellow-2: extract(@oc-yellow-list, 3); 211 | @oc-yellow-3: extract(@oc-yellow-list, 4); 212 | @oc-yellow-4: extract(@oc-yellow-list, 5); 213 | @oc-yellow-5: extract(@oc-yellow-list, 6); 214 | @oc-yellow-6: extract(@oc-yellow-list, 7); 215 | @oc-yellow-7: extract(@oc-yellow-list, 8); 216 | @oc-yellow-8: extract(@oc-yellow-list, 9); 217 | @oc-yellow-9: extract(@oc-yellow-list, 10); 218 | 219 | 220 | // Orange 221 | // ─────────────────────────────────── 222 | 223 | @oc-orange-list: #fff4e6, #ffe8cc, #ffd8a8, #ffc078, #ffa94d, #ff922b, #fd7e14, #f76707, #e8590c, #d9480f; 224 | 225 | @oc-orange-0: extract(@oc-orange-list, 1); 226 | @oc-orange-1: extract(@oc-orange-list, 2); 227 | @oc-orange-2: extract(@oc-orange-list, 3); 228 | @oc-orange-3: extract(@oc-orange-list, 4); 229 | @oc-orange-4: extract(@oc-orange-list, 5); 230 | @oc-orange-5: extract(@oc-orange-list, 6); 231 | @oc-orange-6: extract(@oc-orange-list, 7); 232 | @oc-orange-7: extract(@oc-orange-list, 8); 233 | @oc-orange-8: extract(@oc-orange-list, 9); 234 | @oc-orange-9: extract(@oc-orange-list, 10); 235 | -------------------------------------------------------------------------------- /styles/syntax-variables.less: -------------------------------------------------------------------------------- 1 | 2 | @import "colors"; 3 | @import "open-color"; 4 | 5 | // Custom colors 6 | @blue: #00BAFF; 7 | 8 | // General colors 9 | @syntax-text-color: @oc-gray-7; 10 | @syntax-text-color-light: @oc-gray-6; 11 | @syntax-text-color-dark: #202123; 12 | @syntax-cursor-color: @blue; 13 | @syntax-selection-color: @oc-gray-1; 14 | @syntax-background-color: #fff; 15 | 16 | // Guide colors 17 | @syntax-wrap-guide-color: transparent; 18 | @syntax-indent-guide-color: @oc-gray-5; 19 | @syntax-invisible-character-color: @oc-gray-5; 20 | 21 | // For find and replace markers 22 | @syntax-result-marker-color: @oc-blue-5; 23 | @syntax-result-marker-color-selected: @oc-blue-9; 24 | 25 | // Gutter colors 26 | @syntax-gutter-text-color: @oc-gray-5; 27 | @syntax-gutter-text-color-selected: @oc-gray-9; 28 | @syntax-gutter-background-color: @syntax-background-color; 29 | @syntax-gutter-background-color-selected: @syntax-background-color; 30 | 31 | // For git diff info. i.e. in the gutter 32 | @syntax-color-renamed: @oc-teal-6; 33 | @syntax-color-added: @oc-blue-6; 34 | @syntax-color-modified: @oc-blue-6; 35 | @syntax-color-removed: @oc-pink-6; 36 | 37 | // Comments 38 | @syntax-comment-color: @oc-gray-5; 39 | @syntax-comment-delim-color: @oc-gray-5; 40 | @syntax-comment-background-color: transparent; 41 | 42 | // Bracket matching 43 | @bracket-match-color: @oc-blue-0; 44 | --------------------------------------------------------------------------------