carbon-app / carbon Goto Github PK

Just from the demo, selecting a language for code highlighting and then switching back to auto breaks the highlighting. GIF below:

Apologies if this is intended or a duplicate. Love the project!

It will be really great if there is copy to clipboard option.
Quite helpful when you have to share the image to slack - discord or any other chatting application which supports direct upload.

The site/editor should be responsive, complete with layout tweaks for use on mobile.

• Potentially helpful https://github.com/contra/react-responsive (thanks, @eclecticexistential)

Similar to all-contributors, or open-collective, but personalized for Dawn

We want a way to recognize all our awesome contributors!

If you have some text highlighted on the code snippet it preserves that highlighting when the image is generated.

Not sure if this is desired or not. I unexpectedly generated an image with the highlight when I didn't want it.

Thanks for an awesome resource!

https://twitter.com/julianwachholz/status/915247000047714306

Selected color block seems to overflow the container's border.

To start:

• Safari
• Edge

https://docs.npmjs.com/files/package.json#repository

I tried to use Carbon in Safari, but it doesn't work.

I copied and paste some code to the window, but when I press the Save Image button, nothing happen.

When I tried in Chrome, worked fine!

Hey guys 👋 great work on Carbon!

Right now, all images are saved as carbon.png by default. This means that if I were to save multiple screenshots in succession, they would all be saved under the same name, with just a number appended to the file name (on Windows as carbon (1).png) and so on.

Maybe we could make it so that the site forces a Save As dialog asking the user to name the file by themselves? Just a suggestion, but I would love to see this implemented. ❤️

As the title says, when click on Save Image button in Firefox nothing happens.

This is what code looks like on https://carbon.now.sh/ when I choose the Solarized theme:

But the background color is different from that of the light variant of the official Solarized theme:

The background looks white in Carbon, but it should be light yellow. I'm not sure, but the shade of orange used for export const might also not be in Solarized's palette.

Note that Solarized also has a dark theme with the same text colors but a dark blue background. Don't get them confused. Maybe you want to support both as "Solarized (light)" and "Solarized (dark)"?

• font family
• font weight
• font size
• line height
• letter spacing

This can be easily avoided though by making some part of an image semi- or fully transparent (e. g. the whole background or just the top left pixel). You can look at https://github.com/iamale/screentweet and Francesco149/gweet#2 for some exploration.

And thanks for a great service, by the way!

If there's enough support, we could create a CLI interface for Carbon.

https://shields.io/

react-codemirror2 is much more up to date than react-codemirror, which is still on a version of CodeMirror that's more than 1 year old.

There is an issue with how textual functions names are displayed for F#, please, take a look:

It would be great if words in function name could be colored using the same color.

when you hit "tweet image" button, nothing happens.

https://twitter.com/evgenyrodionov/status/912393242360020992

We should create simple plugins for Atom, VS code, Sublime with select text -> command palette -> create screenshot support.

(source: https://www.reddit.com/r/webdev/comments/72qz1k/carbon_create_and_share_beautiful_images_of_your/dnl14fp/)

https://github.com/STRML/react-resizable

Maybe create a .github/ folder at this point, and move CONTRIBUTING.md inside it? Also, maybe create an ISSUE_TEMPLATE.md and PULL_REQUEST.md?

But most importantly, in lieu of #79, I was thinking that maybe we can add a CONTRIBUTORS.md inside .github/ and link it in README.md instead? This way the README itself doesn't have to get cluttered unnecessarily.

See screenshots for clarification. ⬇️

Set to auto:

Change to HTML:

Now back to auto:

IMO, the editor should have gone back to the state it was in the first image. LMK if this needs more clarification.

Could be awesome be possible open a color picker for setup the background.

This also be possible setup transparent as brakcgorund.

It'd be really useful to store config in cookies for consistency.

I know many devs don't think of Windows but it would be nice to have Windows represented here rather than the assumption that the UI will be OSX.

Saving as image doesn't work.

[Error] TypeError: e.replace is not a function. (In 'e.replace(/&/g,"&")', 'e.replace' is undefined)
	t (app.js:21:977311)
	p (app.js:21:982629)
	value (app.js:21:616414)
	value
	value (app.js:21:616248)
	value
	(anonymous function) (app.js:21:1529383)
	bt (app.js:2:23963)
	vt (app.js:2:24238)
	ar (app.js:2:50646)
	pr (app.js:2:53169)
	Za (app.js:2:98526)
	(anonymous function) (app.js:2:147167)
[Error] Unhandled Promise Rejection: [object Event]
	(anonymous function)
	promiseReactionJob

suggestions > save in session storage?

Looks like the website is a bit behind the master branch. Automatic deploys could probably be done with now-travis so that every push to master is deployed to https://carbon.now.sh/.

First of all, great idea!

I'd like to share some code on Instagram, but it requires me to share only square images.

A greate feature would be the ability to set/change dimensions of the image.

Cheers!

Hey guys!

I really love the idea of the code sharing by image and how it get presented. I only found a limitation whenever I want to share my code to be copied by a reader. You guys think this is possible in a future stage?

Wished feature;
Possibility to copy the code shown on the image to an editor.

This would make sharing links to the page much easier.

For example, https://carbon.now.sh/?code=Hello%20world!&theme=blackboard would pre-fill the editor with "Hello world!" and apply the Blackboard theme. Everything else would fall back to the default settings, of course.

If this would be a welcome addition, I'll open a PR for it.

It would be nice if the site could store the user preferences like color, style, etc... You can do that using cookies...

This is something that can start out slow, but if you guys seem interested, I think, IMO, turning carbon.now.sh into a PWA would be super 👍

The most important think would be to allow caching, and hence enable the site to work offline as well. What do you guys think?

Loving this app so far 😍

Hello!

Thank you guys for this useful tool!
I would suggest to add an option to set the size of the box shadow.
(I will try to find the time to create the PR)

C# is not on the list, either it's not supported or doesn't work properly.

Right now there are not light terminal themes. Some users may want to use white (or similar) terminal background.

I am big fan of light terminal themes like sobole.

Any chance to get a tool to import a custom theme?
Or maybe include some popular light options?

It would be really great if this service could support syntax highlighting for C# programming language.

Thanks!

C or C++ code is not highlighted as I would expect.
I saw that you were using CodeMirror, so I went to see the documentation.

It should at least highlight type names, as seen on this page.
See what I got on Carbon below, with Monokai theme.

I only looked at lib/constants.js and components/Carbon.js and didn't see anything wrong, so I'm not sure what's happening. Maybe a style conflict?

Your website is broken when used on a mobile device. By broken I am referring to the issue that when your website is viewed on a screen less than 893px wide, your website does not allow horizontal scrolling to view parts of the screen that become hidden. A simple way to fix this would be to just allow horizontal scrolling. Another fix would be to use @media queries to adjust for screens smaller than 893px and then again for even smaller screens. And yet another idea would be to use percentages % or viewport width vw

https://github.com/prettier/prettier#pre-commit-hook

I just generated this image:

It'd be great if:

• I could make the font size bigger (ref #46)
• but also if I could shrink the width of the code block manually (or it adjust automatically based on longest line)