| OLD | NEW |
| (Empty) |
| 1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> | |
| 2 <html><head> | |
| 3 <title>Prettify Themes Gallery</title> | |
| 4 <style type="text/css"> | |
| 5 iframe { width: 100%; border-style: none; margin: 0; padding: 0 } | |
| 6 </style> | |
| 7 <script> | |
| 8 var allThemes = [ | |
| 9 { name: 'default' }, | |
| 10 { name: 'desert', | |
| 11 authorHtml: '<a href="http://code.google.com/u/@VhJeSlJYBhVMWgF7/">' | |
| 12 + 'techto…@<\/a>' }, | |
| 13 { name: 'sunburst', authorHtml: 'David Leibovic' }, | |
| 14 { name: 'sons-of-obsidian', | |
| 15 authorHtml: '<a href="http://CodeTunnel.com/blog/post/71' | |
| 16 + '/google-code-prettify-obsidian-theme">Alex Ford<\/a>' }, | |
| 17 { name: 'doxy', authorHtml: 'Robert Sperberg' }, | |
| 18 ]; | |
| 19 | |
| 20 // Called by the demo.html frames loaded per theme to | |
| 21 // size the iframes properly and to allow them to tile | |
| 22 // the page nicely. | |
| 23 function adjustChildIframeSize(themeName, width, height) { | |
| 24 if (typeof console != 'undefined') { | |
| 25 try { | |
| 26 console.log('adjusting ' + themeName + ' to ' + width + 'x' + height); | |
| 27 } catch (ex) { | |
| 28 // Don't bother logging log failure. | |
| 29 } | |
| 30 } | |
| 31 | |
| 32 var container = document.getElementById(themeName).parentNode; | |
| 33 container.style.width = (+width + 16) + 'px'; | |
| 34 container.style.display = 'inline-block'; | |
| 35 var iframe = container.getElementsByTagName('iframe')[0]; | |
| 36 iframe.style.height = (+height + 16) + 'px'; | |
| 37 } | |
| 38 </script> | |
| 39 </head> | |
| 40 | |
| 41 <body> | |
| 42 <noscript>This page requires JavaScript</noscript> | |
| 43 | |
| 44 <h1>Gallery of themes for | |
| 45 <a href="http://code.google.com/p/google-code-prettify/">code prettify</a></h1> | |
| 46 <p> | |
| 47 Click on a theme name for a link to the file in revision control. | |
| 48 Print preview this page to see how the themes work on the printed page. | |
| 49 </p> | |
| 50 <script>(function () { | |
| 51 // Produce an iframe per theme. | |
| 52 // We pass the threme name to the iframe via its URI query, and | |
| 53 // it loads prettify and the theme CSS, and calls back to this page | |
| 54 // to resize the iframe. | |
| 55 for (var i = 0, n = allThemes.length; i < n; ++i) { | |
| 56 var theme = allThemes[i]; | |
| 57 if (!theme) { continue; } | |
| 58 var iframe = document.createElement('iframe'); | |
| 59 iframe.name = theme.name; | |
| 60 iframe.src = 'demo.html?' + encodeURIComponent(theme.name); | |
| 61 var header = document.createElement('h2'); | |
| 62 header.id = theme.name; | |
| 63 var linkToThemeSrc = document.createElement('a'); | |
| 64 linkToThemeSrc.href = ( | |
| 65 'http://code.google.com/p/google-code-prettify/source/browse/trunk/' + | |
| 66 (theme.name === 'default' | |
| 67 ? 'src/prettify.css' | |
| 68 : 'styles/' + encodeURIComponent(theme.name) + '.css')); | |
| 69 linkToThemeSrc.appendChild(document.createTextNode( | |
| 70 theme.name.replace(/\b[a-z]/g, // Capitalize first letter of each word | |
| 71 function (letter) { return letter.toUpperCase(); }))); | |
| 72 header.appendChild(linkToThemeSrc); | |
| 73 | |
| 74 var attribution; | |
| 75 if (theme.authorHtml) { | |
| 76 attribution = document.createElement('span'); | |
| 77 attribution.className = 'attribution'; | |
| 78 attribution.innerHTML = 'by ' + theme.authorHtml; | |
| 79 } | |
| 80 | |
| 81 var div = document.createElement('div'); | |
| 82 div.appendChild(header); | |
| 83 if (attribution) { div.appendChild(attribution); } | |
| 84 div.appendChild(iframe); | |
| 85 document.body.appendChild(div); | |
| 86 } | |
| 87 })()</script> | |
| 88 | |
| 89 </body></html> | |
| OLD | NEW |