| OLD | NEW |
| 1 <div id="pageData-showTOC" class="pageData">true</div> | 1 <h1 class="page_title">Themes</h1><p> |
| 2 | |
| 3 <p> | |
| 4 A <em>theme</em> is a special kind of extension | 2 A <em>theme</em> is a special kind of extension |
| 5 that changes the way the browser looks. | 3 that changes the way the browser looks. |
| 6 Themes are <a href="packaging.html">packaged</a> like regular extensions, | 4 Themes are <a href="packaging.html">packaged</a> like regular extensions, |
| 7 but they don't contain JavaScript or HTML code. | 5 but they don't contain JavaScript or HTML code. |
| 8 </p> | 6 </p> |
| 9 | 7 |
| 10 <p> | 8 <p> |
| 11 You can find and try a bunch of themes at the | 9 You can find and try a bunch of themes at the |
| 12 <a href="https://chrome.google.com/webstore/category/themes">Chrome Web Store</a
>. | 10 <a href="https://chrome.google.com/webstore/category/themes">Chrome Web Store</a
>. |
| 13 </p> | 11 </p> |
| 14 | 12 |
| 15 <img src="../images/themes-1.gif" | 13 <img src="{{static}}/images/themes-1.gif" |
| 16 width="100" height="80" alt="grassy theme" /> | 14 width="100" height="80" alt="grassy theme" /> |
| 17 | 15 |
| 18 <img src="../images/themes-2.gif" | 16 <img src="{{static}}/images/themes-2.gif" |
| 19 width="100" height="80" alt="dark theme" /> | 17 width="100" height="80" alt="dark theme" /> |
| 20 | 18 |
| 21 <img src="../images/themes-3.gif" | 19 <img src="{{static}}/images/themes-3.gif" |
| 22 width="100" height="80" alt="foggy theme" /> | 20 width="100" height="80" alt="foggy theme" /> |
| 23 | 21 |
| 24 <h2 id="manifest"> Manifest </h2> | 22 <h2 id="manifest"> Manifest </h2> |
| 25 <p> | 23 <p> |
| 26 Here is an example | 24 Here is an example |
| 27 <a href="manifest.html"><code>manifest.json</code></a> | 25 <a href="manifest.html"><code>manifest.json</code></a> |
| 28 file for a theme: | 26 file for a theme: |
| 29 </p> | 27 </p> |
| 30 | 28 |
| 31 <!-- [PENDING: This page should eventually be (or point to) something that's ver
y friendly to artists. You should only have to look at one page to create a the
me. --> | 29 |
| 32 | 30 |
| 33 <pre> | 31 <pre> |
| 34 { | 32 { |
| 35 "version": "2.6", | 33 "version": "2.6", |
| 36 "name": "camo theme", | 34 "name": "camo theme", |
| 37 <b> "theme": { | 35 <b> "theme": { |
| 38 "<a href="#images">images</a>" : { | 36 "<a href="#images">images</a>" : { |
| 39 "theme_frame" : "images/theme_frame_camo.png", | 37 "theme_frame" : "images/theme_frame_camo.png", |
| 40 "theme_frame_overlay" : "images/theme_frame_stripe.png
", | 38 "theme_frame_overlay" : "images/theme_frame_stripe.png
", |
| 41 "theme_toolbar" : "images/theme_toolbar_camo.png", | 39 "theme_toolbar" : "images/theme_toolbar_camo.png", |
| (...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 86 | 84 |
| 87 <h3 id="properties">properties</h3> | 85 <h3 id="properties">properties</h3> |
| 88 | 86 |
| 89 <p> | 87 <p> |
| 90 This field lets you specify | 88 This field lets you specify |
| 91 properties such as background alignment, | 89 properties such as background alignment, |
| 92 background repeat, | 90 background repeat, |
| 93 and an alternate logo. | 91 and an alternate logo. |
| 94 To see the properties and the values they can have, see | 92 To see the properties and the values they can have, see |
| 95 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/browser/themes/t
heme_service.cc"><code>theme_service.cc</code></a>. | 93 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/browser/themes/t
heme_service.cc"><code>theme_service.cc</code></a>. |
| 96 <!-- [PENDING: We should flesh this out.] --> | 94 |
| 97 </p> | 95 </p> |
| 98 | 96 |
| 99 <h3 id="tints">tints</h3> | 97 <h3 id="tints">tints</h3> |
| 100 | 98 |
| 101 <p> | 99 <p> |
| 102 You can specify tints to be applied to parts of the UI | 100 You can specify tints to be applied to parts of the UI |
| 103 such as buttons, the frame, and the background tab. | 101 such as buttons, the frame, and the background tab. |
| 104 Google Chrome supports tints, not images, | 102 Google Chrome supports tints, not images, |
| 105 because images don't work across platforms | 103 because images don't work across platforms |
| 106 and are brittle in the case of adding new buttons. | 104 and are brittle in the case of adding new buttons. |
| (...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 139 | 137 |
| 140 | 138 |
| 141 <h2 id="moredoc"> Additional documentation </h2> | 139 <h2 id="moredoc"> Additional documentation </h2> |
| 142 | 140 |
| 143 <p> | 141 <p> |
| 144 Community-written documentation to help you write themes is here: | 142 Community-written documentation to help you write themes is here: |
| 145 </p> | 143 </p> |
| 146 | 144 |
| 147 <blockquote> | 145 <blockquote> |
| 148 <a href="http://code.google.com/p/chromium/wiki/ThemeCreationGuide">http://code.
google.com/p/chromium/wiki/ThemeCreationGuide</a> | 146 <a href="http://code.google.com/p/chromium/wiki/ThemeCreationGuide">http://code.
google.com/p/chromium/wiki/ThemeCreationGuide</a> |
| 149 </blockquote> | 147 </blockquote> |
| OLD | NEW |