Skip to content

Instantly share code, notes, and snippets.

@YuriyGuts
Last active October 31, 2020 18:28
Show Gist options
  • Save YuriyGuts/2d84a34efac32069aab1 to your computer and use it in GitHub Desktop.
Save YuriyGuts/2d84a34efac32069aab1 to your computer and use it in GitHub Desktop.
A bookmarklet for applying a custom style to Kindle Cloud Reader (applies a sepia theme with a higher contrast similar to iBooks on iPad; increases the size of fonts that are too small). Use a tool like http://ted.mielczarek.org/code/mozilla/bookmarklet.html to convert it to a one-liner and use it as a bookmarklet.
function applyCustomStyle() {
var config = {
backgroundColor: "rgb(246, 239, 220)",
foregroundColor: "rgb(64, 41, 25)",
highlightColor: "rgb(255, 245, 173)",
codeFontSize: "12px"
};
var masterFrameContents = $("#KindleReaderIFrame").contents();
var pageFrameContents = masterFrameContents.find("iframe").contents();
var removeFooter = function() {
masterFrameContents.find("#kindleReader_immersiveFooter").remove();
};
var enlargeSmallCodeFonts = function() {
pageFrameContents.find("code span, tt span")
.each(function() {
this.style.setProperty("font-size", config.codeFontSize, "important");
});
};
var themeElement = function(elem) {
elem.style.setProperty("background-color", config.backgroundColor, "important");
elem.style.setProperty("color", config.foregroundColor, "important");
};
var themeHighlight = function(elem) {
elem.style.setProperty("background-color", config.highlightColor, "important");
};
var applyCustomColorScheme = function() {
pageFrameContents.find(".amzUserPref")
.each(function() { themeElement(this) });
masterFrameContents.find("#kindleReader_book_container, #kindleReader_center, #kindleReader_content div, .kindleReader_pageTurnArea")
.each(function() { themeElement(this) });
masterFrameContents.find("iframe").each(function() {
$(this).contents().find(".amazon-highlight").each(function() {
themeHighlight(this);
});
});
};
removeFooter();
enlargeSmallCodeFonts();
applyCustomColorScheme();
};
applyCustomStyle();
@YuriyGuts
Copy link
Author

YuriyGuts commented Jan 17, 2017

Night mode:

    var config = {
        backgroundColor: "rgb(57, 59, 61)",
        foregroundColor: "rgb(203, 207, 208)",
        highlightColor: "rgb(53, 91, 135)",
        codeFontSize: "12px"
    };

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