|
9 | 9 | height: 4px; |
10 | 10 | border-radius: 2px; |
11 | 11 | background-color: transparent; |
| 12 | + /* GPU optimizations */ |
| 13 | + will-change: background-color, transform; |
| 14 | + transform: translate3d(0, 0, 0); |
| 15 | + backface-visibility: hidden; |
12 | 16 | transition-property: background-color; |
13 | 17 | transition-timing-function: ease-in-out; |
14 | 18 | transition-duration: 1s; |
|
629 | 633 | .dv-drop-target-container .dv-drop-target-anchor { |
630 | 634 | position: relative; |
631 | 635 | border: var(--dv-drag-over-border); |
632 | | - transition: opacity var(--dv-transition-duration) ease-in, top var(--dv-transition-duration) ease-out, left var(--dv-transition-duration) ease-out, width var(--dv-transition-duration) ease-out, height var(--dv-transition-duration) ease-out; |
633 | 636 | background-color: var(--dv-drag-over-background-color); |
634 | 637 | opacity: 1; |
| 638 | + /* GPU optimizations */ |
| 639 | + will-change: transform, opacity; |
| 640 | + transform: translate3d(0, 0, 0); |
| 641 | + backface-visibility: hidden; |
| 642 | + contain: layout paint; |
| 643 | + transition: opacity var(--dv-transition-duration) ease-in, transform var(--dv-transition-duration) ease-out; |
635 | 644 | } |
636 | 645 | .dv-dockview { |
637 | 646 | position: relative; |
638 | 647 | background-color: var(--dv-group-view-background-color); |
| 648 | + contain: layout; |
639 | 649 | } |
640 | 650 | .dv-dockview .dv-watermark-container { |
641 | 651 | position: absolute; |
|
723 | 733 | z-index: calc(var(--dv-overlay-z-index) - 2); |
724 | 734 | border: 1px solid var(--dv-tab-divider-color); |
725 | 735 | box-shadow: var(--dv-floating-box-shadow); |
| 736 | + /* GPU optimizations for floating group movement */ |
| 737 | + will-change: transform, opacity; |
| 738 | + transform: translate3d(0, 0, 0); |
| 739 | + backface-visibility: hidden; |
726 | 740 | } |
727 | 741 | .dv-resize-container.dv-hidden { |
728 | 742 | display: none; |
729 | 743 | } |
730 | 744 | .dv-resize-container.dv-resize-container-dragging { |
731 | 745 | opacity: 0.5; |
| 746 | + /* Enhanced GPU acceleration during drag */ |
| 747 | + will-change: transform, opacity; |
732 | 748 | } |
733 | 749 | .dv-resize-container .dv-resize-handle-top { |
734 | 750 | height: 4px; |
|
806 | 822 | --dv-overlay-z-index: var(--dv-overlay-z-index, 999); |
807 | 823 | position: absolute; |
808 | 824 | z-index: 1; |
| 825 | + width: 100%; |
809 | 826 | height: 100%; |
| 827 | + contain: layout paint; |
| 828 | + isolation: isolate; |
| 829 | + /* GPU optimizations */ |
| 830 | + will-change: transform; |
| 831 | + transform: translate3d(0, 0, 0); |
| 832 | + backface-visibility: hidden; |
810 | 833 | } |
811 | 834 | .dv-render-overlay.dv-render-overlay-float { |
812 | 835 | z-index: calc(var(--dv-overlay-z-index) - 1); |
|
821 | 844 | width: 100%; |
822 | 845 | } |
823 | 846 | .dv-pane-container.dv-animated .dv-view { |
824 | | - transition-duration: 0.15s; |
825 | | - transition-timing-function: ease-out; |
| 847 | + /* GPU optimizations for smooth pane animations */ |
| 848 | + will-change: transform; |
| 849 | + transform: translate3d(0, 0, 0); |
| 850 | + backface-visibility: hidden; |
| 851 | + transition: transform 0.15s ease-out; |
826 | 852 | } |
827 | 853 | .dv-pane-container .dv-view { |
828 | 854 | overflow: hidden; |
|
931 | 957 | } |
932 | 958 | .dv-split-view-container.dv-animation .dv-view, |
933 | 959 | .dv-split-view-container.dv-animation .dv-sash { |
934 | | - transition-duration: 0.15s; |
935 | | - transition-timing-function: ease-out; |
| 960 | + /* GPU optimizations for smooth animations */ |
| 961 | + will-change: transform; |
| 962 | + transform: translate3d(0, 0, 0); |
| 963 | + backface-visibility: hidden; |
| 964 | + transition: transform 0.15s ease-out; |
936 | 965 | } |
937 | 966 | .dv-split-view-container.dv-horizontal { |
938 | 967 | height: 100%; |
|
1104 | 1133 | height: 100%; |
1105 | 1134 | overflow: auto; |
1106 | 1135 | scrollbar-width: thin; |
| 1136 | + /* GPU optimizations for smooth scrolling */ |
| 1137 | + will-change: scroll-position; |
| 1138 | + transform: translate3d(0, 0, 0); |
1107 | 1139 | /* Track */ |
1108 | 1140 | /* Handle */ |
1109 | 1141 | } |
|
1184 | 1216 | .dv-tabs-and-actions-container .dv-void-container { |
1185 | 1217 | display: flex; |
1186 | 1218 | flex-grow: 1; |
| 1219 | +} |
| 1220 | +.dv-tabs-and-actions-container .dv-void-container.dv-draggable { |
1187 | 1221 | cursor: grab; |
1188 | 1222 | } |
1189 | 1223 | .dv-tabs-and-actions-container .dv-right-actions-container { |
|
0 commit comments