Center and outzoom graphics iframe previews to avoid clipping

This commit is contained in:
Pandipipas
2026-02-14 18:49:32 +01:00
parent 9e08a5170b
commit be792f030e
+9 -4
View File
@@ -188,13 +188,18 @@ const onDragStart = (event: DragEvent, graphic: GraphicConfig) => {
background-size: 20px 20px; background-size: 20px 20px;
background-position: 0 0, 0 10px, 10px -10px, -10px 0; background-position: 0 0, 0 10px, 10px -10px, -10px 0;
overflow: hidden; overflow: hidden;
position: relative;
} }
.graphics-preview__frame { .graphics-preview__frame {
width: 1920px; --preview-zoom: 0.85;
height: 1080px; position: absolute;
top: 50%;
left: 50%;
width: calc(100% / var(--preview-zoom));
height: calc(100% / var(--preview-zoom));
border: 0; border: 0;
transform: scale(calc(100cqw / 1920)); transform: translate(-50%, -50%) scale(var(--preview-zoom));
transform-origin: top left; transform-origin: center;
} }
</style> </style>