diff --git a/README.md b/README.md index 539317c..8c828e9 100644 --- a/README.md +++ b/README.md @@ -6,12 +6,16 @@ > Colorful Sublime Text 2/3 color scheme optimized for [babel-sublime](https://github.com/babel/babel-sublime) JavaScript syntax highlighter. -[](https://dribbble.com/shots/1921103-Oceanic-Next-Theme) +[](https://dribbble.com/shots/1921103-Oceanic-Next-Theme) ## Install Use [Package Control](https://packagecontrol.io/packages/Oceanic%20Next%20Color%20Scheme) or just manually copy `Oceanic Next.tmTheme` file into `/Packages/User` directory (path to it depends on your OS). Then select it from `Preferences` `->` `Color Scheme` `->` `User`. +## Screenshot + +[](https://raw.githubusercontent.com/voronianski/oceanic-next-theme/master/screenshot.png) + ### Other Editors _Oceanic Next_ was also ported to: @@ -80,14 +84,6 @@ base 0E: #C594C5 base 0F: #AB7967 ``` -## Screenshots - -[](https://raw.githubusercontent.com/voronianski/oceanic-next-theme/master/screenshots/extended-class.png) - -**JSX Components:** - -[](https://raw.githubusercontent.com/voronianski/oceanic-next-theme/master/screenshots/jsx-component.png) - ## Companion Sublime UI Themes - [Broceanic](https://github.com/kenwheeler/broceanic-theme) by [Ken Wheeler](https://github.com/kenwheeler) diff --git a/screenshot.png b/screenshot.png new file mode 100644 index 0000000..7584198 Binary files /dev/null and b/screenshot.png differ diff --git a/screenshots/extended-class.png b/screenshots/extended-class.png deleted file mode 100644 index d4e513a..0000000 Binary files a/screenshots/extended-class.png and /dev/null differ diff --git a/screenshots/jsx-component.png b/screenshots/jsx-component.png deleted file mode 100644 index 526e4a0..0000000 Binary files a/screenshots/jsx-component.png and /dev/null differ diff --git a/test.js b/test/all-constructs.js similarity index 63% rename from test.js rename to test/all-constructs.js index 2adafe5..36f826c 100644 --- a/test.js +++ b/test/all-constructs.js @@ -1,21 +1,26 @@ import a from 'b'; +const dep = require('dep'); const URL = 'https://example.org'; -const mod = require('mod'); let foo = 'bar'; foo = 2; foo = `simple literal with ${mod}`; - -var dodo = true; -dodo = false; -dodo = `more +foo = `more complicated literal with ${mod} `; +var bool = true; +bool = false; + +let undef = undefined; +undef = void 0; +undef = void(0); +undef = null; + const obj = { - simple: 'test', + str: 'test', simpleVar: foo, 'str': 'value', [dynamic]: true, @@ -35,54 +40,7 @@ const obj = { console.log(obj.simple, obj['another-str'], obj.fn()); -let undef = undefined; -undef = void 0; -undef = void(0); - -const n = null; - -console.log(String, Boolean, Number, Object, Array); - -class App extends React.Component { - static defaultProps = { - auto: true - }; - - static propTypes = { - auto: PropTypes.bool.isRequired, - obj: PropTypes.shape({ - foo: PropTypes.string.isRequired - }) - } - - render() { - return ( -
- -
- ); - } - - otherMethod() { - function innerFn(argument) { - // body... - } - - innerFn(); - } -} - function doSmth (a, b, c, ...more) { - if (isNaN(b)) { - return; - } - for (let i = 0; i < more.length; i++) { console.log(i); } @@ -93,7 +51,9 @@ function doSmth (a, b, c, ...more) { } const doSmthAsyncBefore = async () => { - return [].reduce(memo => memo.push(Array.isArray(memo)), []); + setTimeout(() => { + console.log('async fn') + }, 1000) ; } async function doSmthAsync(a = 1, b = '2', c = false, d = {}) { @@ -127,7 +87,6 @@ export function annotation(target) { target.annotated = true; } - function OldSchoolClass (opts = {}) { return this; } diff --git a/test/react-component.js b/test/react-component.js new file mode 100644 index 0000000..60d01dc --- /dev/null +++ b/test/react-component.js @@ -0,0 +1,35 @@ +import React from 'react'; + +// This is comment... +class MyComponent extends React.Component { + constructor() { + super(); + + this.state = { + title: 'World' + }; + } + + componentDidMount() { + console.log('MyComponent is mounted!'); + } + + clickHandler(title) { + this.setState({ title }); + } + + render() { + const { title } = this.state; + + return ( +
+

Hello, {title}!

+ +
+ ); + } +} + +export default MyComponent;