chore: update visual previews

telerik · May 15, 2023 · 0caeea7 · 0caeea7
1 parent 7b292e9
commit 0caeea7
Show file tree

Hide file tree

Showing 55 changed files with 3,697 additions and 17 deletions.
diff --git a/tests/_output/bootstrap/gantt/gantt-row-reordering.png b/tests/_output/bootstrap/gantt/gantt-row-reordering.png
diff --git a/tests/_output/bootstrap/grid/grid-column-reordering-actions.png b/tests/_output/bootstrap/grid/grid-column-reordering-actions.png
diff --git a/tests/_output/bootstrap/grid/grid-grouping-actions.png b/tests/_output/bootstrap/grid/grid-grouping-actions.png
diff --git a/tests/_output/bootstrap/grid/grid-row-reordering.png b/tests/_output/bootstrap/grid/grid-row-reordering.png
diff --git a/tests/_output/bootstrap/pivotgrid/pivotgrid-settings-panel-reordering.png b/tests/_output/bootstrap/pivotgrid/pivotgrid-settings-panel-reordering.png
diff --git a/tests/_output/bootstrap/tilelayout/tilelayout-react.png b/tests/_output/bootstrap/tilelayout/tilelayout-react.png
diff --git a/tests/_output/bootstrap/tilelayout/tilelayout-resizing.png b/tests/_output/bootstrap/tilelayout/tilelayout-resizing.png
diff --git a/tests/_output/bootstrap/treelist/treelist-row-reordering.png b/tests/_output/bootstrap/treelist/treelist-row-reordering.png
diff --git a/tests/_output/classic/gantt/gantt-row-reordering.png b/tests/_output/classic/gantt/gantt-row-reordering.png
diff --git a/tests/_output/classic/grid/grid-column-reordering-actions.png b/tests/_output/classic/grid/grid-column-reordering-actions.png
diff --git a/tests/_output/classic/grid/grid-grouping-actions.png b/tests/_output/classic/grid/grid-grouping-actions.png
diff --git a/tests/_output/classic/grid/grid-row-reordering.png b/tests/_output/classic/grid/grid-row-reordering.png
diff --git a/tests/_output/classic/pivotgrid/pivotgrid-settings-panel-reordering.png b/tests/_output/classic/pivotgrid/pivotgrid-settings-panel-reordering.png
diff --git a/tests/_output/classic/tilelayout/tilelayout-react.png b/tests/_output/classic/tilelayout/tilelayout-react.png
diff --git a/tests/_output/classic/tilelayout/tilelayout-resizing.png b/tests/_output/classic/tilelayout/tilelayout-resizing.png
diff --git a/tests/_output/classic/treelist/treelist-row-reordering.png b/tests/_output/classic/treelist/treelist-row-reordering.png
diff --git a/tests/_output/default/gantt/gantt-row-reordering.png b/tests/_output/default/gantt/gantt-row-reordering.png
diff --git a/tests/_output/default/grid/grid-column-reordering-actions.png b/tests/_output/default/grid/grid-column-reordering-actions.png
diff --git a/tests/_output/default/grid/grid-grouping-actions.png b/tests/_output/default/grid/grid-grouping-actions.png
diff --git a/tests/_output/default/grid/grid-row-reordering.png b/tests/_output/default/grid/grid-row-reordering.png
diff --git a/tests/_output/default/pivotgrid/pivotgrid-settings-panel-reordering.png b/tests/_output/default/pivotgrid/pivotgrid-settings-panel-reordering.png
diff --git a/tests/_output/default/tilelayout/tilelayout-react.png b/tests/_output/default/tilelayout/tilelayout-react.png
diff --git a/tests/_output/default/tilelayout/tilelayout-resizing.png b/tests/_output/default/tilelayout/tilelayout-resizing.png
diff --git a/tests/_output/default/treelist/treelist-row-reordering.png b/tests/_output/default/treelist/treelist-row-reordering.png
diff --git a/tests/_output/fluent/gantt/gantt-row-reordering.png b/tests/_output/fluent/gantt/gantt-row-reordering.png
diff --git a/tests/_output/fluent/grid/grid-column-reordering-actions.png b/tests/_output/fluent/grid/grid-column-reordering-actions.png
diff --git a/tests/_output/fluent/grid/grid-grouping-actions.png b/tests/_output/fluent/grid/grid-grouping-actions.png
diff --git a/tests/_output/fluent/grid/grid-row-reordering.png b/tests/_output/fluent/grid/grid-row-reordering.png
diff --git a/tests/_output/fluent/pivotgrid/pivotgrid-settings-panel-reordering.png b/tests/_output/fluent/pivotgrid/pivotgrid-settings-panel-reordering.png
diff --git a/tests/_output/fluent/tilelayout/tilelayout-react.png b/tests/_output/fluent/tilelayout/tilelayout-react.png
diff --git a/tests/_output/fluent/tilelayout/tilelayout-resizing.png b/tests/_output/fluent/tilelayout/tilelayout-resizing.png
diff --git a/tests/_output/fluent/treelist/treelist-row-reordering.png b/tests/_output/fluent/treelist/treelist-row-reordering.png
diff --git a/tests/_output/material/gantt/gantt-row-reordering.png b/tests/_output/material/gantt/gantt-row-reordering.png
diff --git a/tests/_output/material/grid/grid-column-reordering-actions.png b/tests/_output/material/grid/grid-column-reordering-actions.png
diff --git a/tests/_output/material/grid/grid-grouping-actions.png b/tests/_output/material/grid/grid-grouping-actions.png
diff --git a/tests/_output/material/grid/grid-row-reordering.png b/tests/_output/material/grid/grid-row-reordering.png
diff --git a/tests/_output/material/pivotgrid/pivotgrid-settings-panel-reordering.png b/tests/_output/material/pivotgrid/pivotgrid-settings-panel-reordering.png
diff --git a/tests/_output/material/tilelayout/tilelayout-react.png b/tests/_output/material/tilelayout/tilelayout-react.png
diff --git a/tests/_output/material/tilelayout/tilelayout-resizing.png b/tests/_output/material/tilelayout/tilelayout-resizing.png
diff --git a/tests/_output/material/treelist/treelist-row-reordering.png b/tests/_output/material/treelist/treelist-row-reordering.png
diff --git a/tests/_output/nouvelle/gantt/gantt-row-reordering.png b/tests/_output/nouvelle/gantt/gantt-row-reordering.png
diff --git a/tests/_output/nouvelle/grid/grid-column-reordering-actions.png b/tests/_output/nouvelle/grid/grid-column-reordering-actions.png
diff --git a/tests/_output/nouvelle/grid/grid-grouping-actions.png b/tests/_output/nouvelle/grid/grid-grouping-actions.png
diff --git a/tests/_output/nouvelle/grid/grid-row-reordering.png b/tests/_output/nouvelle/grid/grid-row-reordering.png
diff --git a/tests/_output/nouvelle/pivotgrid/pivotgrid-settings-panel-reordering.png b/tests/_output/nouvelle/pivotgrid/pivotgrid-settings-panel-reordering.png
diff --git a/tests/_output/nouvelle/tilelayout/tilelayout-resizing.png b/tests/_output/nouvelle/tilelayout/tilelayout-resizing.png
diff --git a/tests/_output/nouvelle/treelist/treelist-row-reordering.png b/tests/_output/nouvelle/treelist/treelist-row-reordering.png
diff --git a/tests/gantt/gantt-row-reordering.html b/tests/gantt/gantt-row-reordering.html
diff --git a/tests/grid/grid-column-reordering-actions.html b/tests/grid/grid-column-reordering-actions.html
diff --git a/tests/grid/grid-grouping-actions.html b/tests/grid/grid-grouping-actions.html
diff --git a/tests/grid/grid-row-reordering.html b/tests/grid/grid-row-reordering.html
diff --git a/tests/pivotgrid/pivotgrid-settings-panel-reordering.html b/tests/pivotgrid/pivotgrid-settings-panel-reordering.html
diff --git a/tests/tilelayout/tilelayout-react.html b/tests/tilelayout/tilelayout-react.html
@@ -11,53 +11,44 @@
     <div id="test-area">
         <div class="k-tilelayout k-grid-flow-col" style="grid-template-columns: repeat(3, minmax(0px, 1fr)); grid-auto-rows: minmax(0px, 200px); gap: 10px; padding: 10px;">
             <div style="grid-area: 3 / 2 / span 1 / span 1; outline: none; order: 0;">
-                <div class="k-tilelayout-item k-cursor-grab k-card" style="height: 100%;">
-                    <div class="k-tilelayout-item-header k-card-header">
+                <div class="k-tilelayout-item k-card" style="height: 100%;">
+                    <div class="k-tilelayout-item-header k-cursor-move k-card-header">
                         <div class="k-card-title">Tile 1</div>
                     </div>
                     <div class="k-tilelayout-item-body k-card-body">
-                        <p>Resizable tile.</p>
                         <p>Position: row: 3, col: 2, colSpan: 1, rowSpan: 1</p>
                     </div>
-                    <div class="k-resize-handle k-cursor-ew-resize" style="bottom: 0px; right: 0px; top: 0px; width: 9px;"></div>
-                    <div class="k-resize-handle k-cursor-ns-resize" style="bottom: 0px; right: 0px; top: 0px; width: 9px;"></div>
-                    <div class="k-resize-handle k-cursor-nwse-resize" style="bottom: 0px; right: 0px; height: 9px; width: 9px;"></div>
                 </div>
             </div>
             <div style="grid-area: 1 / 2 / span 1 / span 1; outline: none; order: 1;">
-                <div class="k-tilelayout-item k-cursor-grab k-card" style="height: 100%;">
-                    <div class="k-tilelayout-item-header k-card-header">
+                <div class="k-tilelayout-item k-card" style="height: 100%;">
+                    <div class="k-tilelayout-item-header k-cursor-move k-card-header">
                         <div class="k-card-title">Tile 2</div>
                     </div>
                     <div class="k-tilelayout-item-body k-card-body">
-                        <p>Non-resizable.</p>
                         <p>Position: row: 1, col: 2, colSpan: 1, rowSpan: 1</p>
                     </div>
                 </div>
             </div>
             <div style="grid-area: 1 / 3 / span 2 / span 1; outline: none; order: 2;">
-                <div class="k-tilelayout-item k-cursor-grab k-card" style="height: 100%;">
-                    <div class="k-tilelayout-item-header k-card-header">
+                <div class="k-tilelayout-item k-card" style="height: 100%;">
+                    <div class="k-tilelayout-item-header k-cursor-move k-card-header">
                         <div class="k-card-title">Tile 3</div>
                     </div>
                     <div class="k-tilelayout-item-body k-card-body">
-                        <p>Vertically resizable only tile.</p>
                         <p>Position: row: 1, col: 3, colSpan: 1, rowSpan: 2</p>
                     </div>
-                    <div class="k-resize-handle k-cursor-ns-resize" style="bottom: 0px; right: 0px; left: 0px; height: 9px;"></div>
                 </div>
             </div>
             <div style="grid-area: 3 / 1 / span 1 / span 3; outline: none; order: 3;">
-                <div class="k-tilelayout-item k-cursor-grab k-card" style="height: 100%;">
-                    <div class="k-tilelayout-item-header k-card-header">
+                <div class="k-tilelayout-item k-card" style="height: 100%;">
+                    <div class="k-tilelayout-item-header k-cursor-move k-card-header">
                         <div class="k-card-title">Tile 4</div>
                     </div>
                     <div class="k-tilelayout-item-body k-card-body">
-                        <p>Horizontally resizable only tile.</p>
                         <p>Position: row: 3, col: 1, colSpan: 3, rowSpan: 1</p>
                         <p>Goes over Tile 1</p>
                     </div>
-                    <div class="k-resize-handle k-cursor-ew-resize" style="bottom: 0px; right: 0px; left: 0px; height: 9px;"></div>
                 </div>
             </div>
         </div>

diff --git a/tests/tilelayout/tilelayout-resizing.html b/tests/tilelayout/tilelayout-resizing.html
@@ -0,0 +1,32 @@
+<!doctype html>
+<html lang="en" class="k-no-animations" style="--kendo-scrollbar-width: 15px;">
+<head>
+    <title>Tile Layout Resizing</title>
+    <meta charset="utf-8">
+    <link rel="stylesheet" data-role="kendo-theme" href="/packages/default/dist/all.css">
+    <link rel="stylesheet" href="/packages/html/assets/styles.css">
+    <script src="/packages/html/assets/scripts.js"></script>
+</head>
+<body id="app" class="k-body">
+    <div id="test-area">
+        <div id="tilelayout" class="k-widget k-tilelayout" style="grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 16px; padding: 16px;">
+            <div class="k-tilelayout-item k-resize-x k-card">
+                <div class="k-tilelayout-item-header k-card-header">Card Title</div>
+                <div class="k-tilelayout-item-body k-card-body">Horizontally resizable card</div>
+            </div>
+            <div class="k-tilelayout-item k-resize-y k-card">
+                <div class="k-tilelayout-item-header k-card-header">Card Title</div>
+                <div class="k-tilelayout-item-body k-card-body">Vertically resizable card</div>
+            </div>
+            <div class="k-tilelayout-item k-resize k-card">
+                <div class="k-tilelayout-item-header k-card-header">Card Title</div>
+                <div class="k-tilelayout-item-body k-card-body">Horizontally and Vertically resizable card</div>
+            </div>
+            <div class="k-tilelayout-item k-resize-none k-card">
+                <div class="k-tilelayout-item-header k-card-header">Card Title</div>
+                <div class="k-tilelayout-item-body k-card-body">Non-resizable card</div>
+            </div>
+        </div>
+    </div>
+</body>
+</html>
diff --git a/tests/treelist/treelist-row-reordering.html b/tests/treelist/treelist-row-reordering.html
@@ -0,0 +1,182 @@
+<!doctype html>
+<html lang="en" class="k-no-animations" style="--kendo-scrollbar-width: 15px;">
+<head>
+    <title>Treelist Row Reordering</title>
+    <meta charset="utf-8">
+    <link rel="stylesheet" data-role="kendo-theme" href="/packages/default/dist/all.css">
+    <link rel="stylesheet" href="/packages/html/assets/styles.css">
+    <script src="/packages/html/assets/scripts.js"></script>
+</head>
+<body id="app" class="k-body">
+    <div id="test-area">
+        <div id="treelist" class="k-treelist k-grid k-grid-md k-grid-no-scrollbar">
+            <div class="k-grid-header" style="padding-right: 0px;">
+                <div class="k-grid-header-wrap">
+                    <table class="k-table k-table-md k-grid-header-table">
+                        <colgroup>
+                            <col class="k-drag-col">
+                            <col style="width: 250px;">
+                            <col>
+                        </colgroup>
+                        <thead class="k-table-thead">
+                            <tr class="k-table-row">
+                                <th class="k-table-th k-header k-drag-cell"></th>
+                                <th class="k-table-th k-header">
+                                    <span class="k-cell-inner">
+                                        <span class="k-link">
+                                            <span class="k-column-title">First Name</span>
+                                        </span>
+                                    </span>
+                                </th>
+                                <th class="k-table-th k-header">
+                                    <span class="k-cell-inner">
+                                        <span class="k-link">
+                                            <span class="k-column-title">Last Name</span>
+                                        </span>
+                                    </span>
+                                </th>
+                                <th class="k-table-th k-header">
+                                    <span class="k-cell-inner">
+                                        <span class="k-link">
+                                            <span class="k-column-title">Position</span>
+                                        </span>
+                                    </span>
+                                </th>
+                            </tr>
+                        </thead>
+                    </table>
+                </div>
+            </div>
+            <div class="k-grid-content k-auto-scrollable">
+                <table class="k-table k-table-md k-grid-table">
+                    <colgroup>
+                        <col class="k-drag-col">
+                        <col style="width: 250px;">
+                        <col>
+                    </colgroup>
+                    <tbody class="k-table-tbody">
+                        <tr class="k-table-row">
+                            <td class="k-table-td k-drag-cell">
+                                <span class="k-svg-icon k-svg-i-reorder">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M480 128v64H32v-64h448zM32 224v64h448v-64H32zm448 96H32v64h448v-64z"></path>
+                                    </svg>
+                                </span>
+                            </td>
+                            <td class="k-table-td">
+                                <span class="k-svg-icon k-svg-i-caret-alt-right">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M352 256 160 384V128l192 128z"></path>
+                                    </svg>
+                                </span>Daryl
+                            </td>
+                            <td class="k-table-td">Sweeney</td>
+                            <td class="k-table-td">CEO</td>
+                        </tr>
+                        <tr class="k-table-row k-table-alt-row k-alt k-treelist-group">
+                            <td class="k-table-td k-drag-cell">
+                                <span class="k-svg-icon k-svg-i-reorder">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M480 128v64H32v-64h448zM32 224v64h448v-64H32zm448 96H32v64h448v-64z"></path>
+                                    </svg>
+                                </span>
+                            </td>
+                            <td class="k-table-td">
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>
+                                <span class="k-svg-icon k-svg-i-caret-alt-down">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M256 352 128 160h256L256 352z"></path>
+                                    </svg>
+                                </span>Guy
+                            </td>
+                            <td class="k-table-td">Wooten</td>
+                            <td class="k-table-td">Chief Technical Officer</td>
+                        </tr>
+                        <tr class="k-table-row k-treelist-group">
+                            <td class="k-table-td k-drag-cell">
+                                <span class="k-svg-icon k-svg-i-reorder">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M480 128v64H32v-64h448zM32 224v64h448v-64H32zm448 96H32v64h448v-64z"></path>
+                                    </svg>
+                                </span>
+                            </td>
+                            <td class="k-table-td">
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>
+                                <span class="k-svg-icon k-svg-i-caret-alt-down">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M256 352 128 160h256L256 352z"></path>
+                                    </svg>
+                                </span>Buffy
+                            </td>
+                            <td class="k-table-td">Weber</td>
+                            <td class="k-table-td">VP, Engineering</td>
+                        </tr>
+                        <tr class="k-table-row k-table-alt-row k-alt k-treelist-group">
+                            <td class="k-table-td k-drag-cell">
+                                <span class="k-svg-icon k-svg-i-reorder">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M480 128v64H32v-64h448zM32 224v64h448v-64H32zm448 96H32v64h448v-64z"></path>
+                                    </svg>
+                                </span>
+                            </td>
+                            <td class="k-table-td">
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>
+                                <span class="k-svg-icon k-svg-i-caret-alt-down">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M256 352 128 160h256L256 352z"></path>
+                                    </svg>
+                                </span>Hyacinth
+                            </td>
+                            <td class="k-table-td">Hood</td>
+                            <td class="k-table-td">Team Lead</td>
+                        </tr>
+                        <tr class="k-table-row">
+                            <td class="k-table-td k-drag-cell">
+                                <span class="k-svg-icon k-svg-i-reorder">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M480 128v64H32v-64h448zM32 224v64h448v-64H32zm448 96H32v64h448v-64z"></path>
+                                    </svg>
+                                </span>
+                            </td>
+                            <td class="k-table-td">
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>
+                                <span class="k-svg-icon">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"></svg>
+                                </span>Akeem
+                            </td>
+                            <td class="k-table-td">Carr</td>
+                            <td class="k-table-td">Junior Software Developer</td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+</body>
+</html>