diff --git a/ReadingSystems/Kindle/Kindle-iOS/Fonts.plist b/ReadingSystems/Kindle/Kindle-iOS/Fonts.plist new file mode 100644 index 0000000..95cc81c Binary files /dev/null and b/ReadingSystems/Kindle/Kindle-iOS/Fonts.plist differ diff --git a/ReadingSystems/Kindle/Kindle-iOS/Renderer-utilites.txt b/ReadingSystems/Kindle/Kindle-iOS/Renderer-utilites.txt new file mode 100644 index 0000000..8a2946a --- /dev/null +++ b/ReadingSystems/Kindle/Kindle-iOS/Renderer-utilites.txt @@ -0,0 +1,194 @@ +Renderer utilities + +RGB + ALICEBLUE: [240, 248, 255], + ANTIQUEWHITE: [250, 235, 215], + AQUA: [0, 255, 255], + AQUAMARINE: [127, 255, 212], + AZURE: [240, 255, 255], + BEIGE: [245, 245, 220], + BISQUE: [255, 228, 196], + BLACK: [0, 0, 0], + BLANCHEDALMOND: [255, 235, 205], + BLUE: [0, 0, 255], + BLUEVIOLET: [138, 43, 226], + BROWN: [165, 42, 42], + BURLYWOOD: [222, 184, 135], + CADETBLUE: [95, 158, 160], + CHARTREUSE: [127, 255, 0], + CHOCOLATE: [210, 105, 30], + CORAL: [255, 127, 80], + CORNFLOWERBLUE: [100, 149, 237], + CORNSILK: [255, 248, 220], + CRIMSON: [220, 20, 60], + CYAN: [0, 255, 255], + DARKBLUE: [0, 0, 139], + DARKCYAN: [0, 139, 139], + DARKGOLDENROD: [184, 134, 11], + DARKGRAY: [169, 169, 169], + DARKGREY: [169, 169, 169], + DARKGREEN: [0, 100, 0], + DARKKHAKI: [189, 183, 107], + DARKMAGENTA: [139, 0, 139], + DARKOLIVEGREEN: [85, 107, 47], + DARKORANGE: [255, 140, 0], + DARKORCHID: [153, 50, 204], + DARKRED: [139, 0, 0], + DARKSALMON: [233, 150, 122], + DARKSEAGREEN: [143, 188, 143], + DARKSLATEBLUE: [72, 61, 139], + DARKSLATEGRAY: [47, 79, 79], + DARKSLATEGREY: [47, 79, 79], + DARKTURQUOISE: [0, 206, 209], + DARKVIOLET: [148, 0, 211], + DEEPPINK: [255, 20, 147], + DEEPSKYBLUE: [0, 191, 255], + DIMGRAY: [105, 105, 105], + DIMGREY: [105, 105, 105], + DODGERBLUE: [30, 144, 255], + FIREBRICK: [178, 34, 34], + FLORALWHITE: [255, 250, 240], + FORESTGREEN: [34, 139, 34], + FUCHSIA: [255, 0, 255], + GAINSBORO: [220, 220, 220], + GHOSTWHITE: [248, 248, 255], + GOLD: [255, 215, 0], + GOLDENROD: [218, 165, 32], + GRAY: [128, 128, 128], + GREY: [128, 128, 128], + GREEN: [0, 128, 0], + GREENYELLOW: [173, 255, 47], + HONEYDEW: [240, 255, 240], + HOTPINK: [255, 105, 180], + INDIANRED: [205, 92, 92], + INDIGO: [75, 0, 130], + IVORY: [255, 255, 240], + KHAKI: [240, 230, 140], + LAVENDER: [230, 230, 250], + LAVENDERBLUSH: [255, 240, 245], + LAWNGREEN: [124, 252, 0], + LEMONCHIFFON: [255, 250, 205], + LIGHTBLUE: [173, 216, 230], + LIGHTCORAL: [240, 128, 128], + LIGHTCYAN: [224, 255, 255], + LIGHTGOLDENRODYELLOW: [250, 250, 210], + LIGHTGRAY: [211, 211, 211], + LIGHTGREY: [211, 211, 211], + LIGHTGREEN: [144, 238, 144], + LIGHTPINK: [255, 182, 193], + LIGHTSALMON: [255, 160, 122], + LIGHTSEAGREEN: [32, 178, 170], + LIGHTSKYBLUE: [135, 206, 250], + LIGHTSLATEGRAY: [119, 136, 153], + LIGHTSLATEGREY: [119, 136, 153], + LIGHTSTEELBLUE: [176, 196, 222], + LIGHTYELLOW: [255, 255, 224], + LIME: [0, 255, 0], + LIMEGREEN: [50, 205, 50], + LINEN: [250, 240, 230], + MAGENTA: [255, 0, 255], + MAROON: [128, 0, 0], + MEDIUMAQUAMARINE: [102, 205, 170], + MEDIUMBLUE: [0, 0, 205], + MEDIUMORCHID: [186, 85, 211], + MEDIUMPURPLE: [147, 112, 216], + MEDIUMSEAGREEN: [60, 179, 113], + MEDIUMSLATEBLUE: [123, 104, 238], + MEDIUMSPRINGGREEN: [0, 250, 154], + MEDIUMTURQUOISE: [72, 209, 204], + MEDIUMVIOLETRED: [199, 21, 133], + MIDNIGHTBLUE: [25, 25, 112], + MINTCREAM: [245, 255, 250], + MISTYROSE: [255, 228, 225], + MOCCASIN: [255, 228, 181], + NAVAJOWHITE: [255, 222, 173], + NAVY: [0, 0, 128], + OLDLACE: [253, 245, 230], + OLIVE: [128, 128, 0], + OLIVEDRAB: [107, 142, 35], + ORANGE: [255, 165, 0], + ORANGERED: [255, 69, 0], + ORCHID: [218, 112, 214], + PALEGOLDENROD: [238, 232, 170], + PALEGREEN: [152, 251, 152], + PALETURQUOISE: [175, 238, 238], + PALEVIOLETRED: [216, 112, 147], + PAPAYAWHIP: [255, 239, 213], + PEACHPUFF: [255, 218, 185], + PERU: [205, 133, 63], + PINK: [255, 192, 203], + PLUM: [221, 160, 221], + POWDERBLUE: [176, 224, 230], + PURPLE: [128, 0, 128], + RED: [255, 0, 0], + ROSYBROWN: [188, 143, 143], + ROYALBLUE: [65, 105, 225], + SADDLEBROWN: [139, 69, 19], + SALMON: [250, 128, 114], + SANDYBROWN: [244, 164, 96], + SEAGREEN: [46, 139, 87], + SEASHELL: [255, 245, 238], + SIENNA: [160, 82, 45], + SILVER: [192, 192, 192], + SKYBLUE: [135, 206, 235], + SLATEBLUE: [106, 90, 205], + SLATEGRAY: [112, 128, 144], + SLATEGREY: [112, 128, 144], + SNOW: [255, 250, 250], + SPRINGGREEN: [0, 255, 127], + STEELBLUE: [70, 130, 180], + TAN: [210, 180, 140], + TEAL: [0, 128, 128], + THISTLE: [216, 191, 216], + TOMATO: [255, 99, 71], + TURQUOISE: [64, 224, 208], + VIOLET: [238, 130, 238], + WHEAT: [245, 222, 179], + WHITE: [255, 255, 255], + WHITESMOKE: [245, 245, 245], + YELLOW: [255, 255, 0], + YELLOWGREEN: [154, 205, 50] + + + + +Font scale helper + "xx-small": 0.6, + "x-small": 0.75, + small: 0.889, + medium: 1, + large: 1.2, + "x-large": 1.5, + "xx-large": 2 + + + + +is Block (CSS reset?) + ADDRESS + ARTICLE + ASIDE + AUDIO + BLOCKQUOTE + DD + DIV + DL + FIELDSET + FIGCAPTION + FIGURE + FOOTER + FORM + H[1-6] + HEADER + HGROUP + HR + NOSCRIPT + OL + OUTPUT + P + PRE + SECTION + TABLE + TFOOT + UL + VIDEO diff --git a/ReadingSystems/Kindle/Kindle-iOS/kindle-renderer.css b/ReadingSystems/Kindle/Kindle-iOS/kindle-renderer.css new file mode 100644 index 0000000..7cddd30 --- /dev/null +++ b/ReadingSystems/Kindle/Kindle-iOS/kindle-renderer.css @@ -0,0 +1,432 @@ +/* kindle.css +May not apply since it refers to "ACX" */ + +body { + background-color:#FAFAFA; + margin:0; + padding:0; + width:100%; + font-family:Georgia-Bold; + /*This will disable select from all text/images in the ACX. We will still however get events (like click). Effectively disables selection/copy/paste of text or images*/ + -webkit-user-select: none; +} +button, input[type="button"] { + height: 17pt; + border: solid 1px black; + background: black; + -webkit-border-radius: 3.45pt; + -moz-border-radius: 3.45pt; + border-radius = 3.45pt; + text-align: center; + vertical-align: middle; + color: white; + font-family: "Helvetica"; + font-weight: "bold"; + font-size: "9pt"; +} + +/* OK so Kindle is a hardcore one. Let's explain how they are doing it. +Basically, it seems that Amazon is now using and deploying its Kindle Cloud Reader (iOS but also KFX). +It is based on jQuery and default styles + overrides are to be found in their renderer.min.js. +There are conditions everywhere and styles will be dynamically applied +based on device, device perf and specific issues, CSS Regions support, language, user settings, etc. +As a matter of fact, it takes 8000+ lines of JS to get to the stylesheets. +My understanding is that they are using that in combo of KindleGen/KFX-converter or, in the case of Kindle iOS, which +is using a bridge.min.js to convert your file from AZK to KCR, the embedded "html-css-sanitizer". + +I'll do my best to translate that to readable CSS. I might be wrong in some cases… so if anyone wants to help, I'll be +glad to open the pandora's box for him/her (beware, there's like 13 000 lines of JS to parse). +*/ + + +iframe { + /* Contents are injected in iframes, then CSS columns are used and styled dynamically depending on device size */ +} + +/* kindleReaderStylesheetDefaults = Mobi8 (KF8) only */ + +html { + font-size: 15px; +} + +table { + color: inherit; + font-size: inherit; + line-height: inherit; + font-weight: inherit; + font-variant:inherit; + font-style:inherit; + white-space: inherit; + word-wrap: inherit; +} + +/* If device nees writing mode specified on body */ +body { + -webkit-writing-mode: horizontal-tb; +} + +/* Default Font based on language */ +body { + font-family: {KindleRendererLanguageOptions.getDefaultFont}; +} + +/* Default line-height based on language */ +body { + line-height: {KindleRendererLanguageOptions.getLineHeight}; /* 1.75 for all languages except chinese (1.4) */ +} + +body { + height: {computedHeight}; +} + + +/* kindleReaderStylesheetOverrides */ + +/* If mobi7 */ +body { + font-family: Georgia, serif; + word-wrap: break-word; +} + +p { + margin-top: 0px; + margin-bottom: 0px; + text-indent:2em; +} + +.was-a-p { + margin-top: 0px; + margin-bottom: 0px; + text-indent:2em; +} + +hr { + margin-top: 15px; + margin-bottom: 15px; +} + +center,dd,div,dl,dt,li,ol,pre,table,ul,hr,h1,h2,h3,h4,h5,h6 { + margin-top: 0px; + margin-bottom: 0px; +} + +blockquote { + text-indent: 0px; + margin-top: 0px; + margin-bottom: 0px; +} + +ul { + list-style-type: disc; +} + +ol, ul, li .was-a-p { + text-indent: 0; +} + +table.amazon-table-style-0 { + border-collapse:collapse; + font-size: inherit; +} + +table.amazon-table-style-0 tr td { + border:none; + padding:1px; +} + +table.amazon-table-style-0 tr th { + border:none; + padding:1px; + text-align:justify; +} + +table.amazon-table-style-1 { + border-collapse:collapse; + font-size: inherit; +} + +table.amazon-table-style-1 tr td { + border:1px solid black; + padding:1px; +} + +table.amazon-table-style-1 tr th { + border:1px solid black; + padding:1px; + text-align:justify; +} + + +/* If mobi8 */ + +body { + word-wrap: break-word; + padding: 0px !important; +} + +.azn-FWURG { + -webkit-text-orientation: upright; +} + +.azn-NTE { + -webkit-text-emphasis: none !important; +} + +.azn-UNB { + letter-spacing: 0em !important; + display: inline-block; + text-indent: 0px !important; + -webkit-text-orientation: vertical-right !important; +} + +.azn-JPLB { + display:inline-block; + text-indent: 0px !important; +} + +.semiTransparentOverlay { + z-index: 10 !important; + opacity: 0.5; +} + +svg img { + display: none; +} + +.page-break { + display:block; + padding:1px; +} + +.pagebreak { + display:block; + padding:1px; +} + +.defaultHighlight { + background-color:#ffff9b; +} + +.noDisplay { + display:none; +} + +body { + cursor: default; + position: relative; +} + +/* If device supports CSS Regions -> KindleRendererSettings.useCSSRegions() */ + +.was-a-p { + orphans:0; + widows:0 +} + +.page-break { + break-before:column; +} + +.pagebreak { + break-before:column; +} + +.renderer-page-break { + width:0px; + height:0px; + break-before:always; +} + +/* If Fixed layout -> KindleRendererSettings.getSettings().fixedContent */ +body { + background: none !important; + background-color: transparent !important; +} +html, body { + width: auto; + height: auto; +} + + +/* Native Selection KindleRendererSettings.useNativeSelection() */ +body { + /* If selectable */ + -webkit-user-select:text; + -moz-user-select:text; + -ms-user-select:text; +} +body { + /* If not selectable */ + -webkit-user-select:none; + -moz-user-select:none; + -ms-user-select:none; +} + +.kindle-annotation-wrapper, .kindle-annotation-wrapper * { + margin: auto; + padding: 0; +} +div#content-overlays { + margin: 0px; + padding: 0px; +} + +/* Then the renderer begins Content Sanitization for: +- float +- position +- width and height (in both % or fixed values — they have an index for that) +- max-width and max-height (unsupported) +- font-size +- line-height +- background-color +- text-indent +- color +- clear +- -webkit-text-combine +- font-family +- font-style +- display + */ + + +/* kindleReaderSanitizationStylesheet +Here I'll use the syntax "element.property" as in "HTML tag which has the property declared in your CSS" */ + +el.widths { + width: auto; +} + +el.heights { + height: auto; +} + +el.display { + /* When < 95% */ + display: inline-block; +} + +el.display { + /* When > 95% */ + display: block; +} + +el.lineHeight { + line-height: {value}; +} + +el.isPositioned { + position: inherit; +} + +/* Now the renderer computes a WCAG-compliant color for text on background */ +el.hasTextColor { + color: rgb({x},{y},{z}); +} + +el.absFontValue { + /* If the font-size is declared using an absolute value */ + font-size: {value}; +} + +el.remFontValue { + /* If the font-size is declared using rem value */ + font-size: {computedValue}px; +} + +el.textIndent { + /* If negative text indent */ + text-indent: -{computedValue}px; + padding-left: {computedValue}px; +} + +el.hasClearStyle { + clear: none; +} + +el.textCombine { + -webkit-text-combine: {value}; + display: inline-block; + text-indent: 0px; + height: auto; +} + +el.langFontFamily { + font-family: {KindleRendererLanguageOptions.getDefaultFont}; +} + +el.fontStyle { + /* If italic while the language doesn't allow it */ + font-style: normal; +} + +/* Utilities +Check file Renderer-utilities.txt */ + + + +/* And now, ladies and gentlemen, to the "html-css-sanitizer-minified.js" part + +So, simply, CSS values are declared as groups in a var in the following order: +Check values.txt for a complete list of values + +- [color] (keywords) +- [cursor] +- [display] +- [list-style-type] +- [font-weight] +- [font-stretch] +- [voice-balance] (could be azimuth) +- [font-size] +- [white-space] +- [border-style] +- [vertical-align] +- [-webkit-appearance] +- [voice-rate] +- [voice-?] +- [box-sizing] +- [font-family] (type) +- [voice-volume] +- [background-repeat] +- [text-decoration] +- [voice-range] +- [position] +- [text-transform] +- [voice-family] +- [unicode-bidi] +- [bottom | top] +- [text-overflow] +- [speak-as] +- [empty-cells] +- [list-style-position] +- [font-style] +- [left | right] +- [direction] +- follow other values that may be used for several props + + +And then every CSS property is parsed to check whether the value is in their list. + +Then they check character encoding (regex to the rescue). + +Then they check selectors. +(active|after|before|first-child|first-letter|focus|hover) are OK +(link|visited) are not OK + +Then they check media-queries: + 'braille': allowed, + 'embossed': allowed, + 'handheld': allowed, + 'print': allowed, + 'projection': allowed, + 'screen': allowed, + 'speech': allowed, + 'tty': allowed, + 'tv': allowed + +Then they check all fucking HTML: tags, entities et al. + +Then, oh look, there goes your JavaScript. + +And we're done ¯\_(ツ)_/¯ +*/ + diff --git a/ReadingSystems/Kindle/Kindle-iOS/values.txt b/ReadingSystems/Kindle/Kindle-iOS/values.txt new file mode 100644 index 0000000..0ea799f --- /dev/null +++ b/ReadingSystems/Kindle/Kindle-iOS/values.txt @@ -0,0 +1,68 @@ +Values + + L = [ + ['aliceblue', 'antiquewhite', 'aqua', 'aquamarine', 'azure', 'beige', 'bisque', 'black', 'blanchedalmond', 'blue', 'blueviolet', 'brown', 'burlywood', 'cadetblue', 'chartreuse', 'chocolate', 'coral', 'cornflowerblue', 'cornsilk', 'crimson', 'cyan', 'darkblue', 'darkcyan', 'darkgoldenrod', 'darkgray', 'darkgreen', 'darkkhaki', 'darkmagenta', 'darkolivegreen', 'darkorange', 'darkorchid', 'darkred', 'darksalmon', 'darkseagreen', 'darkslateblue', 'darkslategray', 'darkturquoise', 'darkviolet', 'deeppink', 'deepskyblue', 'dimgray', 'dodgerblue', 'firebrick', 'floralwhite', 'forestgreen', 'fuchsia', 'gainsboro', 'ghostwhite', 'gold', 'goldenrod', 'gray', 'green', 'greenyellow', 'honeydew', 'hotpink', 'indianred', 'indigo', 'ivory', 'khaki', 'lavender', 'lavenderblush', 'lawngreen', 'lemonchiffon', 'lightblue', 'lightcoral', 'lightcyan', 'lightgoldenrodyellow', 'lightgreen', 'lightgrey', 'lightpink', 'lightsalmon', 'lightseagreen', 'lightskyblue', 'lightslategray', 'lightsteelblue', 'lightyellow', 'lime', 'limegreen', 'linen', 'magenta', 'maroon', 'mediumaquamarine', 'mediumblue', 'mediumorchid', 'mediumpurple', 'mediumseagreen', 'mediumslateblue', 'mediumspringgreen', 'mediumturquoise', 'mediumvioletred', 'midnightblue', 'mintcream', 'mistyrose', 'moccasin', 'navajowhite', 'navy', 'oldlace', 'olive', 'olivedrab', 'orange', 'orangered', 'orchid', 'palegoldenrod', 'palegreen', 'paleturquoise', 'palevioletred', 'papayawhip', 'peachpuff', 'peru', 'pink', 'plum', 'powderblue', 'purple', 'red', 'rosybrown', 'royalblue', 'saddlebrown', 'salmon', 'sandybrown', 'seagreen', 'seashell', 'sienna', 'silver', 'skyblue', 'slateblue', 'slategray', 'snow', 'springgreen', 'steelblue', 'tan', 'teal', 'thistle', 'tomato', 'turquoise', 'violet', 'wheat', 'white', 'whitesmoke', 'yellow', 'yellowgreen'], + ['all-scroll', 'col-resize', 'crosshair', 'default', 'e-resize', 'hand', 'help', 'move', 'n-resize', 'ne-resize', 'no-drop', 'not-allowed', 'nw-resize', 'pointer', 'progress', 'row-resize', 's-resize', 'se-resize', 'sw-resize', 'text', 'vertical-text', 'w-resize', 'wait'], + ['-moz-inline-box', '-moz-inline-stack', 'block', 'inline', 'inline-block', 'inline-table', 'list-item', 'run-in', 'table', 'table-caption', 'table-cell', 'table-column', 'table-column-group', 'table-footer-group', 'table-header-group', 'table-row', 'table-row-group'], + ['armenian', 'circle', 'decimal', 'decimal-leading-zero', 'disc', 'georgian', 'lower-alpha', 'lower-greek', 'lower-latin', 'lower-roman', 'square', 'upper-alpha', 'upper-latin', 'upper-roman'], + ['100', '200', '300', '400', '500', '600', '700', '800', '900', 'bold', 'bolder', 'lighter'], + ['condensed', 'expanded', 'extra-condensed', 'extra-expanded', 'narrower', 'semi-condensed', 'semi-expanded', 'ultra-condensed', 'ultra-expanded', 'wider'], + ['behind', 'center-left', 'center-right', 'far-left', 'far-right', 'left-side', 'leftwards', 'right-side', 'rightwards'], + ['large', 'larger', 'small', 'smaller', 'x-large', 'x-small', 'xx-large', 'xx-small'], + ['-moz-pre-wrap', '-o-pre-wrap', '-pre-wrap', 'nowrap', 'pre', 'pre-line', 'pre-wrap'], + ['dashed', 'dotted', 'double', 'groove', 'outset', 'ridge', 'solid'], + ['baseline', 'middle', 'sub', 'super', 'text-bottom', 'text-top'], + ['caption', 'icon', 'menu', 'message-box', 'small-caption', 'status-bar'], + ['fast', 'faster', 'slow', 'slower', 'x-fast', 'x-slow'], + ['above', 'below', 'higher', 'level', 'lower'], + ['border-box', 'contain', 'content-box', 'cover', 'padding-box'], + ['cursive', 'fantasy', 'monospace', 'sans-serif', 'serif'], + ['loud', 'silent', 'soft', 'x-loud', 'x-soft'], + ['no-repeat', 'repeat-x', 'repeat-y', 'round', 'space'], + ['blink', 'line-through', 'overline', 'underline'], + ['high', 'low', 'x-high', 'x-low'], + ['absolute', 'relative', 'static'], + ['capitalize', 'lowercase', 'uppercase'], + ['child', 'female', 'male'], + ['bidi-override', 'embed'], + ['bottom', 'top'], + ['clip', 'ellipsis'], + ['continuous', 'digits'], + ['hide', 'show'], + ['inside', 'outside'], + ['italic', 'oblique'], + ['left', 'right'], + ['ltr', 'rtl'], + ['no-content', 'no-display'], + ['suppress', 'unrestricted'], + ['thick', 'thin'], + [','], + ['/'], + ['always'], + ['auto'], + ['avoid'], + ['both'], + ['break-word'], + ['center'], + ['code'], + ['collapse'], + ['fixed'], + ['hidden'], + ['inherit'], + ['inset'], + ['invert'], + ['justify'], + ['local'], + ['medium'], + ['mix'], + ['none'], + ['normal'], + ['once'], + ['repeat'], + ['scroll'], + ['separate'], + ['small-caps'], + ['spell-out'], + ['transparent'], + ['visible'] + ]; \ No newline at end of file