kevinsawicki / monokai Goto Github PK

View Code? Open in Web Editor NEW

241.0 15.0 133.0 44 KB

Monokai Atom Syntax theme

Less 100.00%

monokai's Introduction

Monokai theme

A monokai syntax theme for Atom.

Originally converted from the TextMate theme using the TextMate bundle converter.

monokai's People

Stargazers

Watchers

Forkers

james2doyle brianpattison smithdalec veader burntime maxsvargal nibushibu tsujp jonfer jbondeson mkpointner jccr vinceyuan ezos86 spacerockzero jph425 brucevang beatrichartz fbrundu manlycode citronevanescent chehab dallmanr ricardofbarros nathansobo sadovnychyi dlwilson88 sebastianrosik mcandre kumarrishav caktux shivg junquera radubogdan ilicmarko modulexcite clickclack2015 thmssl rosencrantz nickineurotic jwuwork terrierscript cerberusd smussell ricardomatias muiro danielnieto jjkr grumbull antoniohoyen scruffydan burodepeper dionmunk marboga maloneqq yxlao magic-coder dragonxlwang dannydb subkong nicolespicymayoo bjornhanson laneallen tiagodalloca leileijiang rbndickson ksxgithub mattroylloyd xianjiaodahe91 madastro zezic jtuulos quantumgolem srmcconomy gazpachu artis101 carolinafs usagi-f planar85 oothkoo 7cordovac ppete2 johfermq thegifter prodigic tarfandpor etiennefilliat 18631089857 msorre2 curtainwang mahdi-alavi sheridan-tech pantera savsanta kouros1950 sarunasdjacenko fpvmulticopter jdillworth gordenbrown51 alexmalmis

monokai's Issues

Deprecated selector in `monokai/index.less`

In monokai/index.less:

Starting from Atom v1.13.0, the contents of atom-text-editor elements are no longer encapsulated within a shadow DOM boundary. This means you should stop using :host and ::shadow pseudo-selectors, and prepend all your syntax selectors with syntax--. To prevent breakage with existing style sheets, Atom will automatically upgrade the following selectors:

atom-text-editor, :host => atom-text-editor,atom-text-editor
atom-text-editor .invisible-character, :host .invisible-character => atom-text-editor .invisible-character,atom-text-editor .invisible-character
atom-text-editor .indent-guide, :host .indent-guide => atom-text-editor .indent-guide,atom-text-editor .indent-guide
atom-text-editor .wrap-guide, :host .wrap-guide => atom-text-editor .wrap-guide,atom-text-editor .wrap-guide
atom-text-editor .gutter, :host .gutter => atom-text-editor .gutter,atom-text-editor .gutter
atom-text-editor .line-number.cursor-line-no-selection, :host .line-number.cursor-line-no-selection => atom-text-editor .line-number.cursor-line-no-selection,atom-text-editor .line-number.cursor-line-no-selection
atom-text-editor .invisible, :host .invisible => atom-text-editor .invisible,atom-text-editor .invisible
atom-text-editor .cursor, :host .cursor => atom-text-editor .cursor,atom-text-editor .cursor
atom-text-editor .selection .region, :host .selection .region => atom-text-editor .selection .region,atom-text-editor .selection .region
atom-text-editor .search-results .marker .region, :host .search-results .marker .region => atom-text-editor .search-results .syntax--marker .region,atom-text-editor .search-results .syntax--marker .region
atom-text-editor .search-results .marker.current-result .region, :host .search-results .marker.current-result .region => atom-text-editor .search-results .syntax--marker.current-result .region,atom-text-editor .search-results .syntax--marker.current-result .region
atom-text-editor .gfm .markup.heading, :host .gfm .markup.heading => atom-text-editor .syntax--gfm .syntax--markup.syntax--heading,atom-text-editor .syntax--gfm .syntax--markup.syntax--heading
atom-text-editor .gfm .markup.underline, :host .gfm .markup.underline => atom-text-editor .syntax--gfm .syntax--markup.syntax--underline,atom-text-editor .syntax--gfm .syntax--markup.syntax--underline
atom-text-editor .gfm .bold, :host .gfm .bold => atom-text-editor .syntax--gfm .syntax--bold,atom-text-editor .syntax--gfm .syntax--bold
atom-text-editor .gfm .italic, :host .gfm .italic => atom-text-editor .syntax--gfm .syntax--italic,atom-text-editor .syntax--gfm .syntax--italic
atom-text-editor .gfm .raw, :host .gfm .raw => atom-text-editor .syntax--gfm .syntax--raw,atom-text-editor .syntax--gfm .syntax--raw
atom-text-editor .gfm .variable.list, :host .gfm .variable.list => atom-text-editor .syntax--gfm .syntax--variable.syntax--list,atom-text-editor .syntax--gfm .syntax--variable.syntax--list
atom-text-editor .gfm .link, :host .gfm .link => atom-text-editor .syntax--gfm .syntax--link,atom-text-editor .syntax--gfm .syntax--link
atom-text-editor .gfm .link .entity, :host .gfm .link .entity => atom-text-editor .syntax--gfm .syntax--link .syntax--entity,atom-text-editor .syntax--gfm .syntax--link .syntax--entity
.comment => .syntax--comment
.constant.character, .constant.language, .constant.numeric, .constant.other => .syntax--constant.syntax--character, .syntax--constant.syntax--language, .syntax--constant.syntax--numeric, .syntax--constant.syntax--other
.entity.name.class => .syntax--entity.syntax--name.syntax--class
.entity.name.function => .syntax--entity.syntax--name.syntax--function
.entity.name.instance => .syntax--entity.syntax--name.syntax--instance
.entity.name.tag => .syntax--entity.syntax--name.syntax--tag
.entity.other.attribute-name => .syntax--entity.syntax--other.syntax--attribute-name
.entity.other.inherited-class => .syntax--entity.syntax--other.syntax--inherited-class
.invalid => .syntax--invalid
.invalid.deprecated => .syntax--invalid.syntax--deprecated
.keyword => .syntax--keyword
.meta.tag => .syntax--meta.syntax--tag
.storage => .syntax--storage
.storage.type => .syntax--storage.syntax--type
.string => .syntax--string
.support.constant, .support.function => .syntax--support.syntax--constant, .syntax--support.syntax--function
.support.class, .support.type => .syntax--support.syntax--class, .syntax--support.syntax--type
.variable.parameter => .syntax--variable.syntax--parameter
.variable.language.python, .variable.language.js => .syntax--variable.syntax--language.syntax--python, .syntax--variable.syntax--language.syntax--js
.class.jade => .syntax--class.syntax--jade

Automatic translation of selectors will be removed in a few release cycles to minimize startup time. Please, make sure to upgrade the above selectors as soon as possible.

Package.getStylesheetsPath is deprecated.

Store package style sheets in the styles/ directory instead of stylesheets/ in the unitjs package

ThemePackage.getStylesheetsPath (/Applications/Atom.app/Contents/Resources/app/src/package.js:442:9)
PackageWatcher.watch (/Applications/Atom.app/Contents/Resources/app/node_modules/dev-live-reload/lib/package-watcher.js:44:35)

Cursor is really hard to see when used with the Vim plugin

When using the Vim plugin in command mode, the cursor is invisible, only the text highlight may be seen. This makes it a lot harder to tell where the cursor is, especially because it means that the cursor is invisible when it's over whitespace.

Package.getStylesheetsPath is deprecated.

Store package style sheets in the styles/ directory instead of stylesheets/ in the color-picker package

ThemePackage.getStylesheetsPath (/Applications/Atom.app/Contents/Resources/app/src/package.js:436:9)
PackageWatcher.watch (/Applications/Atom.app/Contents/Resources/app/node_modules/dev-live-reload/lib/package-watcher.js:44:35)

<htmltag> should be all of the same color?

I fixed with this

.punctuation.definition.tag.html {
  color: #F92672;
}

so the a <tag> is all of the same color (fuchsia)

Emoji break syntax highlighting in certain situations

code executes without any problems...

Add some ways to see which brackets is selected

With the Atom Dark Theme, you can see by placing your cursor near a bracket, the next closing bracket.

I would enjoy to see this with this monokai theme.

Javascript `this`

Your monokai theme is not highlighting this keyword in Javascript.

Some SASS markdown is not being highlighted

Hi there,

I've noticed that not all SASS markdown is well interpreted by this theme, is there anyway to make the following syntax correctly highlighted?

@extend, @for, @each and some other builtin functions should be highlighted in red as the @import function.
the prefixed rules are not being highlighted as a proper rule, as they should.

Thanks in advance, great job btw ;)

Red-tinged UI when using One Dark as UI theme

I like the combination of the One Dark UI theme together with the Monokai syntax theme but for some reason the complete UI (fonts, background color, ...) looks very red-tinged when using this combination. The Web Inspector tells me also that e.g. the font color is set to #eacdcd. When using the Atom Dark UI theme the font color is white with blue background highlighting. Would it be possible to have the same color scheme also for the One Dark UI theme? That would be awesome.

how to show a line

hello guys please tell me how can i show this line ..?

Failed to activate the monokai theme

[Enter steps to reproduce below:]

Atom Version: 1.0.6
System: Mac OS X 10.10.4
Thrown From: monokai package, v0.17.0

Stack Trace

Failed to activate the monokai theme

At variable @green is undefined in /Users/nitewriter/.atom/packages/monokai/index.less:51:15

LessError: variable @green is undefined
  at /Users/nitewriter/.atom/packages/monokai/index.less:51:15

Commands

Config

{
  "core": {
    "themes": [
      "atom-dark-ui",
      "monokai"
    ]
  }
}

Installed Packages

# User
git-log, v0.4.1
linter, v1.3.4
pretty-json, v0.4.1
vim-mode, v0.57.0

# Dev
No dev packages

Deprecated selectors

According to Atom 0.174, the latest version 0.10 of the monikai theme uses some outdated selectors:

monokai
index.less
Use the atom-text-editor tag instead of the editor-colors class.
Use the atom-text-editor tag instead of the editor class.

Use the `atom-text-editor` tag instead of the `editor-colors` class.

In index.less: Use the atom-text-editor tag instead of the editor-colors class.

Coloring symbols

How can I change the color for html tags like < and >?

[Accessibility + UX] Highlighting results

[This is a repost of https://github.com/atom/find-and-replace/issues/177 - it turned out to be a Monokai issue]

When I look for something, the selection of the found fragment disappears very quickly, and sometimes it's not long enough for me to spot the occurrence. I'd like the highlight to stay there when the find tool is focused. Maybe you could even gray out everything else to make the found phrase really stand out.

It would be also nice if the plugin highlighted all found phrases in document at once.

Screenshot: I searched for "jshint". After 1 second, there is no highlight at all (and there are 2 occurences in the current line!)

highlighting matching bracket broken with Atom 0.166.0

Looks like highlighting the matching bracket stopped working after updating to atom 0.166. Tested with a standard theme and it worked well so issue is most likely the theme (see comments on this issue for another person experiencing the same on another custom theme: atom/bracket-matcher#98)

Target the selector `:host, atom-text-editor` instead of `.editor` for shadow DOM support.

In index.less: Target the selector :host, atom-text-editor instead of .editor for shadow DOM support.

Inconsistent bold in Java

I'm getting inconsistent (within a file) bold text on everything coloured pink when I edit Java, see screenshot:

This goes away when I close and reopen the file, or even just minimise and restore Atom. It comes back soon after - I haven't worked out what causes it to come back. After minimising:

I'm using Atom 1.6.0, Monokai 0.18.0, Windows 10, UI theme is One Dark. I'm currently using Atom with an empty styles.less to see if the issue persists.

Green Colors disappear in js ES2015

Hi guys,

compared to sublime's way of highlighting the code using monokai, the code in atom seems to have lost some colors. I attached 2 screenshots (1 of sublime and 1 of atom using this theme).

Is there any way to make this look more like in sublime?

atom

sublime

Atom "invisibles" quite hard

Hey, could you also 'color' the invisibles? They're now quite hard (toned down a bit would be nice).

Define syntax-variables.less

See https://github.com/atom/template-syntax/blob/master/stylesheets/syntax-variables.less

Styles for variables (at least in JS)

I was wondering why keywords like this weren't being highlighted in my JS files, turns out there are no styles included here for that. Any chance we could add that? (it would be helpful at least for JS)

I've added this to my ~/.atom/styles.less in the meantime. (I'm more than willing to PR)

.variable.js {
    color: #fd971f;
}

I've chosen the orange color from the monokai palette. (but I'm fine with whatever makes those variables stand out!)

span.entity.other.attribute-name.html not being applied correctly

In HTML this class is not applied to parameters that are in the angular dash name format.

This is being labeled correctly:

<input type="checkbox">

This is not being labeled correctly:

<input ng-model="">

Monokai version: 0.18.0

No response when open extremely long code after compressing

After using gulp-cssnano compress the bootstrap code, I opend the files but got no response.

When change to the default theme, everything works. I guess the reason might be spending much time rendering the code colorful.

Can anyone fix it?

Antialiased fonts

Hi, why not use anti-aliased fonts, like this:

https://discuss.atom.io/t/atom-font-weight-anti-alias/4212/2

In my index.less I added the above line inside the .editor (index.less file):

-webkit-font-smoothing: subpixel-antialiased;

Also, in my Ubuntu, the default font for Sublime is this:

'fontSize': 17
'fontFamily': 'DejaVu Sans Mono'

I don't know if on different SO's Sublime has this same schema, but if have, maybe will be interesting to have this same set.

Wrong look in windows 8

This how it looks:

Edit: everything's fine after reinstalling

Reggie with string literals (',",`) and hash (#) is colored incorrectly

Preview:

Removing that yields:

Regexs with a few different characters is breaking syntax highlighting for the remainder of the file. Some of the identified characters so far are:

` ' " # %

(js) Style Node `global` like `window`

I thing it would be better if the NodeJs global was styled the same as window in JavaScriot

Currently:

Hash styling bug

I started the descusion here. In the example bellow the if:, unless:, presente: should be colored differently (now with the same color).

class Product < ActiveRecord::Base
  belongs_to :project

  enum status: { enabled: 1, disabled: 2 }

  validates :project, :type, presence: true
  with_options if: :something?, unless: :something? do |step|
    step.validates :name, :description, presence: true
  end
end

Can we add this?

White background color for files after update to version 0.13.0

After last update the background color changed to white for all files.

support markdown syntax

if can support markdown syntax ,it will be great

ThemePackage.getStylesheetsPath is deprecated.

Store package style sheets in the styles/ directory instead of stylesheets/ in the monokai package

ThemePackage.getStylesheetsPath (/Applications/Atom.app/Contents/Resources/app/src/package.js:436:9)
ThemePackage.getStylesheetPaths (/Applications/Atom.app/Contents/Resources/app/src/package.js:447:32)

pink golang brackets

Hello,

I just upgraded to 0.17.0 and all my brackets ([, ]) when coding in Go (and only in Go) turned pink. Most likely this is an issue not with the Monokai theme, but rather has to do with me upgrading the go-plus package. But I thought you might want to know nonetheless.

Adding

.bracket {
  color: @syntax-text-color;
}

to the index.less file solve the problem at least for Go and so far as I can tell hasn't impacted on other syntaxes.

thanks

Deprecated selector in `monokai\index.less`

In monokai\index.less:

atom-text-editor, :host => atom-text-editor,atom-text-editor
atom-text-editor .invisible-character, :host .invisible-character => atom-text-editor .invisible-character,atom-text-editor .invisible-character
atom-text-editor .indent-guide, :host .indent-guide => atom-text-editor .indent-guide,atom-text-editor .indent-guide
atom-text-editor .wrap-guide, :host .wrap-guide => atom-text-editor .wrap-guide,atom-text-editor .wrap-guide
atom-text-editor .gutter, :host .gutter => atom-text-editor .gutter,atom-text-editor .gutter
atom-text-editor .line-number.cursor-line-no-selection, :host .line-number.cursor-line-no-selection => atom-text-editor .line-number.cursor-line-no-selection,atom-text-editor .line-number.cursor-line-no-selection
atom-text-editor .invisible, :host .invisible => atom-text-editor .invisible,atom-text-editor .invisible
atom-text-editor .cursor, :host .cursor => atom-text-editor .cursor,atom-text-editor .cursor
atom-text-editor .selection .region, :host .selection .region => atom-text-editor .selection .region,atom-text-editor .selection .region
atom-text-editor .search-results .marker .region, :host .search-results .marker .region => atom-text-editor .search-results .syntax--marker .region,atom-text-editor .search-results .syntax--marker .region
atom-text-editor .search-results .marker.current-result .region, :host .search-results .marker.current-result .region => atom-text-editor .search-results .syntax--marker.current-result .region,atom-text-editor .search-results .syntax--marker.current-result .region
atom-text-editor .gfm .markup.heading, :host .gfm .markup.heading => atom-text-editor .syntax--gfm .syntax--markup.syntax--heading,atom-text-editor .syntax--gfm .syntax--markup.syntax--heading
atom-text-editor .gfm .markup.underline, :host .gfm .markup.underline => atom-text-editor .syntax--gfm .syntax--markup.syntax--underline,atom-text-editor .syntax--gfm .syntax--markup.syntax--underline
atom-text-editor .gfm .bold, :host .gfm .bold => atom-text-editor .syntax--gfm .syntax--bold,atom-text-editor .syntax--gfm .syntax--bold
atom-text-editor .gfm .italic, :host .gfm .italic => atom-text-editor .syntax--gfm .syntax--italic,atom-text-editor .syntax--gfm .syntax--italic
atom-text-editor .gfm .raw, :host .gfm .raw => atom-text-editor .syntax--gfm .syntax--raw,atom-text-editor .syntax--gfm .syntax--raw
atom-text-editor .gfm .variable.list, :host .gfm .variable.list => atom-text-editor .syntax--gfm .syntax--variable.syntax--list,atom-text-editor .syntax--gfm .syntax--variable.syntax--list
atom-text-editor .gfm .link, :host .gfm .link => atom-text-editor .syntax--gfm .syntax--link,atom-text-editor .syntax--gfm .syntax--link
atom-text-editor .gfm .link .entity, :host .gfm .link .entity => atom-text-editor .syntax--gfm .syntax--link .syntax--entity,atom-text-editor .syntax--gfm .syntax--link .syntax--entity
.comment => .syntax--comment
.constant.character, .constant.language, .constant.numeric, .constant.other => .syntax--constant.syntax--character, .syntax--constant.syntax--language, .syntax--constant.syntax--numeric, .syntax--constant.syntax--other
.entity.name.class => .syntax--entity.syntax--name.syntax--class
.entity.name.function => .syntax--entity.syntax--name.syntax--function
.entity.name.instance => .syntax--entity.syntax--name.syntax--instance
.entity.name.tag => .syntax--entity.syntax--name.syntax--tag
.entity.other.attribute-name => .syntax--entity.syntax--other.syntax--attribute-name
.entity.other.inherited-class => .syntax--entity.syntax--other.syntax--inherited-class
.invalid => .syntax--invalid
.invalid.deprecated => .syntax--invalid.syntax--deprecated
.keyword => .syntax--keyword
.meta.tag => .syntax--meta.syntax--tag
.storage => .syntax--storage
.storage.type => .syntax--storage.syntax--type
.string => .syntax--string
.support.constant, .support.function => .syntax--support.syntax--constant, .syntax--support.syntax--function
.support.class, .support.type => .syntax--support.syntax--class, .syntax--support.syntax--type
.variable.parameter => .syntax--variable.syntax--parameter
.variable.language.python, .variable.language.js => .syntax--variable.syntax--language.syntax--python, .syntax--variable.syntax--language.syntax--js
.class.jade => .syntax--class.syntax--jade

Automatic translation of selectors will be removed in a few release cycles to minimize startup time. Please, make sure to upgrade the above selectors as soon as possible.

Inconsistent line heights

See the following two screenshots, taken under Atom Dark and Monokai with identical plugins. Notice how the text is misaligned with the cursor and gutter line number in the Monokai screenshot.

highlighting variables in ES6 template literals

I don't know for sure if variables in template literals should be the same color as strings or not, but it's hard to notice them this way.

regex breaking rest of script colouring.

This Regex breaks the rest of the page highlighting in javascript.

/^([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])\x22)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])\x22))\x40([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])\x5d)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])\x5d))$/

markdown-preview selector

.markdown-preview is supported by Atom to theme the built-in markdown preview.

Markdown preview is not currently themed by monokai

Syntax highlighting flickers for a second when any file is opened

When I open a file in Atom, the colors flicker several times in the first second after opening.

Example files:

Using Atom 0.186.0 on OS X 10.10.2.

Remove Italic

Hello,
I've been trying to google this, but I wasn't able to find out what the actual css/less class triggers the italic on function and parameters for Monokai Theme.

I want to disable all italic, is there anyway i can do that?

Thanks

Use the `atom-text-editor` tag instead of the `editor` class.

In index.less: Use the atom-text-editor tag instead of the editor class.

Does not work with CoffeeScript Preview package

This theme does not highlight the preview pane in CoffeeScript Preview like the Atom Dark syntax theme does. This is because the .editor block encompasses the entire stylesheet, whereas preview panes are not .editor panes.

I commented out lines 8 and 187, and it seems to be working without issue. Although, it would probably be best to model after the Atom Dark theme, where everything starting with line 105 is not within the .editor block.

Target the selector `:host, atom-text-editor` instead of `.editor-colors` for shadow DOM support.

In index.less: Target the selector :host, atom-text-editor instead of .editor-colors for shadow DOM support.

.= has the same color as a string

.= has the same color together as a string instead of the same color as a period that concatenates a string solo and an equals sign solo