/*
 * Resize-Griffe von Fenstern nach aussen verlegen
 *
 * Ext legt die (unsichtbaren) Resize-Griffe 10px breit und mit z-index 100
 * INNERHALB des Fensterrands ab. Bei Fenstern ohne sichtbaren Rahmen (z.B.
 * xplain.ux.attribute.Window) liegt der rechte Griff damit genau ueber dem
 * vertikalen Scrollbar (der untere teilweise ueber dem horizontalen) - der
 * Scrollbar laesst sich mit der Maus nicht greifen, man erwischt stattdessen
 * den Resize-Griff.
 *
 * Loesung: die Griffe 8px ausserhalb des Fensters platzieren. Damit sie dort
 * nicht abgeschnitten werden, muss das Fenster overflow: visible haben (der
 * Inhalt ist ohnehin auf die Fenstergroesse gelayoutet).
 *
 * Eigenes Stylesheet, weil Main.scss erst nach einem Sencha-Build wirkt.
 * No SASS / theme rebuild required.
 */
.x-window.x-window-resizable {
    overflow: visible;
}

.x-window-resizable > .x-resizable-handle-east  { right: -8px;  width: 8px; }
.x-window-resizable > .x-resizable-handle-west  { left: -8px;   width: 8px; }
.x-window-resizable > .x-resizable-handle-south { bottom: -8px; height: 8px; }
.x-window-resizable > .x-resizable-handle-north { top: -8px;    height: 8px; }

.x-window-resizable > .x-resizable-handle-northeast { right: -8px; top: -8px; }
.x-window-resizable > .x-resizable-handle-northwest { left: -8px;  top: -8px; }
.x-window-resizable > .x-resizable-handle-southeast { right: -8px; bottom: -8px; }
.x-window-resizable > .x-resizable-handle-southwest { left: -8px;  bottom: -8px; }