Index: chrome/common/extensions/docs/templates/intros/app_window.html |
diff --git a/chrome/common/extensions/docs/templates/intros/app_window.html b/chrome/common/extensions/docs/templates/intros/app_window.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..e422510be9f7bf29749fc794a23c570a1d615baa |
--- /dev/null |
+++ b/chrome/common/extensions/docs/templates/intros/app_window.html |
@@ -0,0 +1,31 @@ |
+<h2 id="draggable">A note on draggable window areas</h2><p> |
+ |
+<p> |
+Windows can be moved by dragging on the default title bar, |
+but frameless windows do not have that affordance. |
+The CSS property <code>-webkit-app-region</code> can be given the values |
+<code>drag</code> and <code>no-drag</code> to allow content of a window |
+to create draggable areas. Care must be taken when setting a high level |
+DOM node to drag, any child that is intractable/clickable must be set to |
+no-drag. E.g. |
+<p> |
+ |
+<pre data-filename="window.html"> |
+<div class='title-area'> |
+ A draggable area. <div class='title-button'>clickable button</div> |
+</div> |
+</pre> |
+ |
+<pre data-filename="style.css"> |
+.title-area { |
+ -webkit-app-region: drag; |
+} |
+.title-button { |
+ -webkit-app-region: no-drag; |
+} |
+</pre> |
+ |
+<p> |
+See the <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/samples/frameless-window">Frameless Window Sample</a> as an example. |
+</p> |
+ |