@studiocms/md/dist/styles/md-remark-headings.css

Add Markdown Support to your StudioCMS project with ease!

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.heading-wrapper {
  --icon-size: 1.5rem;
  --icon-spacing: 0.25em;
  --anchor-color: #808080;
  --anchor-hover-color: #6e6e6e;
  align-items: center;
}
.heading-wrapper svg {
  display: inline;
  width: var(--icon-size);
  height: var(--icon-size);
}
.heading-wrapper > :first-child {
  margin-inline-end: calc(var(--icon-size) + var(--icon-spacing));
  display: inline;
}
.anchor-link {
  margin-inline-start: calc(-1 * (var(--icon-size)));
  color: var(--anchor-color);
}
.anchor-link .sr-only {
  -webkit-user-select: none;
  user-select: none;
}
.anchor-link:hover,
.anchor-link:focus {
  color: var(--anchor-hover-color);
}
@media (hover: hover) {
  .anchor-link {
    opacity: 0;
  }
}
.heading-wrapper:hover > .anchor-link,
.anchor-link:focus {
  opacity: 1;
}