gist-it icon indicating copy to clipboard operation
gist-it copied to clipboard

I'd like to apply theme

Open botamochi6277 opened this issue 5 years ago • 3 comments

I would like to apply theme to embed codes like gist theme. Can I do this?

https://codersblock.com/blog/customizing-github-gists/

botamochi6277 avatar Apr 16 '19 05:04 botamochi6277

Issue is with these injected stylesheets ... would be great to have an option to disable these:

<link rel="stylesheet" href="http://gist-it.appspot.com/assets/embed.css">
<link rel="stylesheet" href="http://gist-it.appspot.com/assets/prettify/prettify.css">

Workaround

JS to Remove Default Stylesheets:

(function () {
    var links = document.querySelectorAll("link[href='http://gist-it.appspot.com/assets/embed.css'], link[href='http://gist-it.appspot.com/assets/prettify/prettify.css']");
    links.forEach(function (link, index) {
        console.log(index, link);
        link.parentNode.removeChild(link);
    }); 
}()); 

Grab a Theme:

https://github.com/jmblog/color-themes-for-google-code-prettify

Additional CSS:

.gist-it-gist .gist-file .gist-meta,
.gister-gist .gist-file .gist-meta {
    overflow: hidden;
    padding: 0.5em;
}

.gist-it-gist .gist-file .gist-data,
.gister-gist .gist-file .gist-data {
    overflow: auto;
    word-wrap: normal;
}

.gist-it-gist .gist-file .gist-data pre,
.gister-gist .gist-file .gist-data pre {
    margin: 0 !important;
    padding: 0.5em;
}

wcDogg avatar Apr 18 '19 21:04 wcDogg

Second @wcDogg suggestions. I'm using the listed JS and CSS changes.

fontora avatar Aug 20 '20 14:08 fontora

I wouldn't normally post this, but since the last commit to this repo was 2013 I figure it's OK. I've created a similar solution, but with no server-side dependency and first class support for changing themes. https://kag0.github.io/sauce Many thanks to this repo for the inspiration.

nrktkt avatar Feb 10 '21 01:02 nrktkt