How can I add "fork me on gitlab" ribbon css?

larrycai commented 5 years ago

I want to add "Fork me on Gitlab" ribbon in the remark.js https://alvarolopezborr.gitlab.io/gitlab-fork-ribbon-css/

How can it be done?

Rgs, Larry

noahp commented 5 years ago

For me, adding the .css like to my index.html like this (after copying into a local directory):

<!DOCTYPE html>
<html>
<head>
  <title>Title</title>
  <meta charset="utf-8">
  <style>
    /* file saved to local directory */
    @import url("gh-fork-ribbon.css");
    /* alternatively fetch from cdnjs */
    @import url("https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.3/gh-fork-ribbon.min.css");
...

And inserting this element on a slide:

<a class="gitlab-fork-ribbon" href="http://url.to-your.repo" title="Fork me on GitHub">Fork me on GitHub</a>

Worked!

(I used the css file from https://simonwhitaker.github.io/github-fork-ribbon-css)

peterj commented 4 years ago

It might be useful to add this to a wiki page. @abelards what do you think of creating a Misc category in the wiki where we can add things like these there?

abelards commented 4 years ago

@peterj good idea, it's done: https://github.com/gnab/remark/wiki/HTML-CSS-JS-samples

gnab / remark

How can I add "fork me on gitlab" ribbon css? #558