New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Themed Markdown Preview #298

Merged
merged 9 commits into from Sep 23, 2015

Conversation

Projects
None yet
8 participants
@simurai
Member

simurai commented Sep 1, 2015

This PR makes the Markdown Preview adapt to a syntax theme's color scheme.

Reasoning

  • The old "default" and the "Use GitHub.com styles" are currently the same if a theme doesn't override it. This could make it a bit confusing why there is a toggle in the settings.
  • The preview is less jarring when used with a dark theme
  • Some UI/Syntax themes currently override markdown-preview, like the One themes do, but would be nice if not all themes need to override it themselves.

screen shot 2015-09-02 at 7 56 57 pm
screen shot 2015-09-02 at 7 58 34 pm
screen shot 2015-09-02 at 8 01 14 pm

Closes #296 + #6

@simurai

This comment has been minimized.

Show comment
Hide comment
@simurai

simurai Sep 2, 2015

Member

Ok, I think this is ready.

It's still possible to enable "Use GitHub.com styles" in the settings:

screen shot 2015-09-02 at 8 13 36 pm

Member

simurai commented Sep 2, 2015

Ok, I think this is ready.

It's still possible to enable "Use GitHub.com styles" in the settings:

screen shot 2015-09-02 at 8 13 36 pm

@thomasjo

This comment has been minimized.

Show comment
Hide comment
@thomasjo

thomasjo Sep 2, 2015

Member

Nice! This looks good to me 💖

Member

thomasjo commented Sep 2, 2015

Nice! This looks good to me 💖

simurai added a commit that referenced this pull request Sep 23, 2015

@simurai simurai merged commit fe6e79c into master Sep 23, 2015

1 check passed

continuous-integration/travis-ci/pr The Travis CI build passed
Details

@simurai simurai deleted the sm-themed-preview branch Sep 23, 2015

@simurai simurai referenced this pull request Sep 30, 2015

Closed

Add "Use GitHub.com Style" functionality #244

3 of 6 tasks complete
@BHSPitMonkey

This comment has been minimized.

Show comment
Hide comment
@BHSPitMonkey

BHSPitMonkey Oct 30, 2015

In the GitHub.com style, code blocks still use your theme's color scheme (this can be seen in the most recent screenshot in this comment thread and in the Atom 1.1 release announcement).

BHSPitMonkey commented Oct 30, 2015

In the GitHub.com style, code blocks still use your theme's color scheme (this can be seen in the most recent screenshot in this comment thread and in the Atom 1.1 release announcement).

@mnquintana

This comment has been minimized.

Show comment
Hide comment
@mnquintana

mnquintana Oct 30, 2015

Member

@BHSPitMonkey That's being tracked in #244

Member

mnquintana commented Oct 30, 2015

@BHSPitMonkey That's being tracked in #244

@BHSPitMonkey

This comment has been minimized.

Show comment
Hide comment
@BHSPitMonkey

BHSPitMonkey Oct 30, 2015

Thanks.
On Oct 29, 2015 6:35 PM, "Machisté N. Quintana" notifications@github.com
wrote:

@BHSPitMonkey https://github.com/BHSPitMonkey That's being tracked in
#244 #244


Reply to this email directly or view it on GitHub
#298 (comment)
.

BHSPitMonkey commented Oct 30, 2015

Thanks.
On Oct 29, 2015 6:35 PM, "Machisté N. Quintana" notifications@github.com
wrote:

@BHSPitMonkey https://github.com/BHSPitMonkey That's being tracked in
#244 #244


Reply to this email directly or view it on GitHub
#298 (comment)
.

@intemperie

This comment has been minimized.

Show comment
Hide comment
@intemperie

intemperie Oct 30, 2015

Loving it, dude. Thanks for sharing this!

intemperie commented Oct 30, 2015

Loving it, dude. Thanks for sharing this!

@Galadirith Galadirith referenced this pull request Nov 1, 2015

Closed

Roadmap to 3.0.0 #89

15 of 24 tasks complete
@chimit

This comment has been minimized.

Show comment
Hide comment
@chimit

chimit Nov 18, 2015

Is it possible to add autoscrolling?

chimit commented Nov 18, 2015

Is it possible to add autoscrolling?

@simurai

This comment has been minimized.

Show comment
Hide comment
@simurai

simurai Nov 18, 2015

Member

@chimit Do you mean sync the scrolling? Would be this issue: #24

Member

simurai commented Nov 18, 2015

@chimit Do you mean sync the scrolling? Would be this issue: #24

@chimit

This comment has been minimized.

Show comment
Hide comment
@chimit

chimit commented Nov 18, 2015

@simurai yes, sure!

@Majasi

This comment has been minimized.

Show comment
Hide comment
@Majasi

Majasi Nov 18, 2015

I'd like to get zebra tables back. Can you tell me, what was the css/less code that created the zebra tables?

Majasi commented Nov 18, 2015

I'd like to get zebra tables back. Can you tell me, what was the css/less code that created the zebra tables?

@simurai

This comment has been minimized.

Show comment
Hide comment
@simurai

simurai Nov 19, 2015

Member

@Majasi Try adding the following to your styles.less:

.markdown-preview tr:nth-child(2n) {
  background-color: hsla(0,0%,50%,.1);
}
Member

simurai commented Nov 19, 2015

@Majasi Try adding the following to your styles.less:

.markdown-preview tr:nth-child(2n) {
  background-color: hsla(0,0%,50%,.1);
}
@Majasi

This comment has been minimized.

Show comment
Hide comment
@Majasi

Majasi Nov 19, 2015

Great, thank you.

Majasi commented Nov 19, 2015

Great, thank you.

@stefek99

This comment has been minimized.

Show comment
Hide comment
@stefek99

stefek99 Mar 8, 2017

.markdown-preview.markdown-preview

Does it do anything?

(requires same class to be present twice)

Weird... Does not make much sense to me :)

stefek99 commented on README.md in ebec8f8 Mar 8, 2017

.markdown-preview.markdown-preview

Does it do anything?

(requires same class to be present twice)

Weird... Does not make much sense to me :)

This comment has been minimized.

Show comment
Hide comment
@simurai

simurai Mar 8, 2017

Member

Using the class twice is to win specificity over .markdown-preview[data-use-github-style].

You could also use !important; instead, e.g. .markdown-preview { background-color: #444 !important; }

Member

simurai replied Mar 8, 2017

Using the class twice is to win specificity over .markdown-preview[data-use-github-style].

You could also use !important; instead, e.g. .markdown-preview { background-color: #444 !important; }

This comment has been minimized.

Show comment
Hide comment
@stefek99

stefek99 Mar 8, 2017

WOW! Magic...

Didn't realise that's the case.

I seriously thought it's some copy&paste error.

Explanation: http://stackoverflow.com/questions/11572081/css-class-repetition-to-increase-specificity

stefek99 replied Mar 8, 2017

WOW! Magic...

Didn't realise that's the case.

I seriously thought it's some copy&paste error.

Explanation: http://stackoverflow.com/questions/11572081/css-class-repetition-to-increase-specificity

This comment has been minimized.

Show comment
Hide comment
@simurai

simurai Mar 8, 2017

Member

Yeah, it's handy if you don't want to rely on any other class like a parent or so.

Member

simurai replied Mar 8, 2017

Yeah, it's handy if you don't want to rely on any other class like a parent or so.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment