dcasella / monokai-plusplus Goto Github PK
View Code? Open in Web Editor NEWA modern Monokai theme for Sublime Text 3 and Visual Studio Code
License: MIT License
A modern Monokai theme for Sublime Text 3 and Visual Studio Code
License: MIT License
Hi again—looks like I'm going to have to ditch JS Next as my syntax highlighter, as it's unmaintained, and for some reason won't work inside Vue component script tags. The way it labels scopes seems to work very nicely with Monokai++, but the built-in JavaScript syntax in ST3 doesn't work as well. For example, take this snippet using the built-in highlighter:
export default {
thing: 0,
otherThing: null,
finalThing: undefined
}
import store from 'vuex'
const loadTab = (to, from, next) => {
console.group('Event')
console.log('starting:', store.state.loadingEvent)
console.log('to.name:', to.name)
console.log('from:', from)
console.log('next:', next)
console.log('store.getters.isAdmin():', store.getters.isAdmin())
console.groupEnd()
if (store.getters.isAdmin({ eventId: to.params.eventId }) && to.name === 'Event') {
const lastTab = store.getters.lastTab(to.params.event) || 'dashboard'
console.log(lastTab)
}
}
loadTab()
Using the latest theme file from github (I just copied it as a local theme):
Things I notice and can't stop noticing :) (I've included the scopes where I can):
source.js meta.export.js meta.object-literal.js meta.object-literal.key.js
)source.js meta.function.declaration.js entity.name.function.js variable.other.readwrite.js
){
& }
) in parameter for isAdmin()
are green but should be white (source.js meta.function.js meta.block.js meta.conditional.js meta.group.js meta.function-call.method.js meta.group.js meta.object-literal.js punctuation.section.block.begin.js
and ... punctuation.section.block.end.js
)eventId:
object key is green, should be yellow (source.js meta.function.js meta.block.js meta.conditional.js meta.group.js meta.function-call.method.js meta.group.js meta.object-literal.js meta.object-literal.key.js
)Really hoping you're able to fix these, and then I can get rid of my weird alternative JS highlighters and just stick with the plain one, which does work inside Vue SFCs.
Hello, I've noticed the color scheme changed a lot after the update to 2.0.0
The previous version colored looked much better, and now it's coloring many things in orange. see here
I added the version inside the pictures.
Sidebar colors changed, props in js files changed, many things, you can see the picture below.
I like your theme, and hope you have willingness for offering the version to JetBrain IDE.
It seems highlight selected words its not working in this theme.
I've just switch syntax to JS Custom, as all my old JS syntaxes were quite out of date. I was using Monokai SL, but it didn't have function call coloring for some reason, so I also switched to Monokai++.
I've noticed some rather odd examples—are these as expected? I'm also unsure whether this is a theme or syntax issue. Let me know if the JS Custom scopes are important—I can add those too.
Example 1 (why is rtdbOptions
highlighted in the second line?):
Example 2 (all parentheses and braces are green after .then
):
Again, I'm unsure if this is a syntax issue or a theme issue, but here's the block of code showing the problem. Highlighting from the permission
variable inside the second promise handler starts to go wrong, and never really recovers:
The scope data for the first (correct) permission
is:
Scope: text.html.vue
source.js.embedded.html
source.js
meta.export.js
meta.object-literal.js
meta.object-literal.js
meta.function.js
meta.block.js
meta.conditional.js
meta.block.js
meta.for.js
meta.block.js
meta.switch.js
meta.block.js
meta.block.js
meta.conditional.js
meta.block.js
meta.function-call.method.js
meta.group.js
meta.function.declaration.js
variable.parameter.function.js
Fg Name: Member variables
Fg Scope: variable.language, variable.other.member, variable.parameter, variable.other.readwrite.member, entity.other.attribute-name
Bg Name: background
Bg Scope: background
Syntax File: Packages/Vue Syntax Highlight/Vue Component.sublime-syntax
tmTheme File: Packages/User/Monokai++.tmTheme
and for the second (incorrect) one it's:
Scope: text.html.vue
source.js.embedded.html
source.js
meta.export.js
meta.object-literal.js
meta.object-literal.js
meta.function.js
meta.block.js
meta.conditional.js
meta.block.js
meta.for.js
meta.block.js
meta.switch.js
meta.block.js
meta.block.js
meta.conditional.js
meta.block.js
meta.conditional.js
meta.block.js
meta.function-call.method.js
meta.group.js
meta.function.declaration.js
variable.parameter.function.js
Fg Name: Normal
Fg Scope: keyword.operator.dereference.java, meta.preprocessor.haskell, punctuation.separator.java, variable.parameter.java, variable.parameter.js, meta.group.js, meta.group.go, punctuation.section.class.begin.python, support.variable.dom.js, constant.character.brace, constant.character.end, constant.character.paren, constant.character.quote, support.class.js, punctuation.section.group.begin.js, punctuation.section.group.end.js, meta.template.expression, meta.group.braces, source.groovy.embedded.source, punctuation.section.class.end.groovy
Bg Name: background
Bg Scope: background
Syntax File: Packages/Vue Syntax Highlight/Vue Component.sublime-syntax
tmTheme File: Packages/User/Monokai++.tmTheme
Can you tell what's going wrong here?
None of the console
function calls get highlighted with JS Next (the default JS syntax does get this case right):
The scope is source.js meta.group.braces.curly support.function.console.js
—could you include that one too?
I had wondered if this should include meta.function-call.method.js
, which the default JS syntax does, but the TM docs say (with my italics):
Function names, including the full path, and all parameters should receive the following scope. The name of the function or method should be
variable.function
, unless the function is scoped withsupport.function
.
meta.function-call
So that suggested to me that support.function...
should be enough?
Just switched to Monokai++ and really like it for most programming jobs. But, I've lost highlighting on diff files. The syntax higlighter is there, and I can see it's setting the scopes. But I guess there are no definitions in the theme. Any chance to add those?
Hi, this is a very nice Monokai! I use it in VS code.
I have a question. How to change the color of mark occurrences highlight (when we put a cursor on a variable name for example, all occurrences of that name will be highlighted)?
It seems to be a bright red, I want to change it to a softer color. I tried to open Monokai++.tmTheme but I couldn't find any tag related to occurrences.
I tried to override in the user-setting using
"workbench.colorCustomizations": { "editor.selectionHighlightBackground": "#804343", "editor.selectionBackground": "#804343" }
but still doesn't work. Could you please help? Thank you so much in advance.
When I use Monokai++ with Volar(Official vue extension), I don't get component s highlist and it just look same color of the HTML tag
When I use vetur(the previous vue extension) it is showing correctly
And also if I use Volar with any other color theme it's working great
But I didn't find any other Color theme that looks good, I think Monokai++ has the best colors
I don't know if I should open an issue here or in Volar extension repo.
Thanks for your help!
Hi guys, this theme was the reason why I wasn't moving from VSC to VS Community, so I've ported this theme for C#...
there are of course some colors that still need to be tweaked.. but the main thing is there, the only requirement is that you install the Viasfora Extension.
You can download my settings on:
https://mega.nz/file/9R0hXQYJ#si5eqgc2zxNDNTSWeiyNbQ9g_xwm2g23SZQ9pjc4XiU
be careful though, that file contains my full config which I've make it to look and feel like VScode.. it will probably override not only the colors.
As for me, I don't stand VS community since it feels too bulky for my needs and I'll come back to vscode, I just wanted to share this config before leaving :)
I've been wishing I could switch to this for a while but without Vue lang support I just can't. Any chance we could get that?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.