Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
- [ ] Mercury
- [x] Venus
- [x] Earth
- [x] Moon
- [x] Mars
- [ ] Deimos
- [ ] Phobos
<details>
<summary>Toggle content display</summary>
- [ ] Mercury
- [x] Venus
- [x] Earth
- [x] Moon
- [x] Mars
- [ ] Deimos
- [ ] Phobos
</details>
@jeffmcneill

This comment has been minimized.

Copy link
Owner Author

@jeffmcneill jeffmcneill commented Aug 24, 2017

  • Mercury
  • Venus
  • Earth
    • Moon
  • Mars
    • Deimos
    • Phobos
@jeffmcneill

This comment has been minimized.

Copy link
Owner Author

@jeffmcneill jeffmcneill commented Aug 24, 2017

Toggle display
  • Mercury
  • Venus
  • Earth
    • Moon
  • Mars
    • Deimos
    • Phobos

Second

Toggle display
  • Mercury
  • Venus
  • Earth
    • Moon
  • Mars
    • Deimos
    • Phobos
@jeffmcneill

This comment has been minimized.

Copy link
Owner Author

@jeffmcneill jeffmcneill commented Aug 24, 2017

Github-flavored markdown (GFM) does not support footnotes.[^footnote]

[^footnote]: Footnote text.

@jeffmcneill

This comment has been minimized.

Copy link
Owner Author

@jeffmcneill jeffmcneill commented Aug 24, 2017

Awesome Section

Nothing generated

Awesome Section

Looks like the adding of names via pound doesn't work.

Fenced code blocks, does the tilde work? Fenced code blocks, does the tilde work? Fenced code blocks, does the tilde work?
Fenced code blocks, does the tilde work? Fenced code blocks, does the tilde work?
Fenced code blocks, does the tilde work?

link back to Awesome Section
And again...

Another Awesome Section

and linking to Another Awesome Section

Note that automatic anchor generation does not happen in gists though it does in github markdown files in repositories.

@jeffmcneill

This comment has been minimized.

Copy link
Owner Author

@jeffmcneill jeffmcneill commented Aug 24, 2017

How to get the same hide/show function with CSS only:

<input id="display-toggle" type=checkbox>
<label id="display-button" for="display-toggle"><span>Display Content</span></label>
<label id="hide-button" for="display-toggle"><span>Hide Content</span></label>
<div id="hidden-content">
  <br />Hidden Content</div>
label {
  background-color: #ccc;
  color: brown;
  padding: 5px;
  text-decoration: none;
  font-size: 16px;
  border: 2px solid brown;
  border-radius: 5px;
  display: block;
  width: 150px;
  text-align: center;
}

input,
label#hide-button,
#hidden-content {
  display: none;
}

input#display-toggle:checked ~ label#display-button {
  display: none;
}

input#display-toggle:checked ~ label#hide-button {
  display: block;
  background-color: #aaa;
  color: #333
}

input#display-toggle:checked ~ #hidden-content {
  display: block;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.