diff --git a/src/webapp/src/components/seatplan/editor/window.vue b/src/webapp/src/components/seatplan/editor/window.vue
index 161de7f..9383750 100644
--- a/src/webapp/src/components/seatplan/editor/window.vue
+++ b/src/webapp/src/components/seatplan/editor/window.vue
@@ -16,8 +16,10 @@
                     v-model:active="draggable.active" v-model:draggable="draggable.draggable" :resizable="draggable.resizable" :parent="true" @activated="activateComponent( draggable.id );"
                     @drag-end="saveHistory();" @resize-end="saveHistory();" @contextmenu="( e ) => { e.preventDefault(); }" class="draggable-box">
                     <circularSeatplanComponent v-if="draggable.shape == 'circular' && draggable.type == 'seat'" :scale-factor="scaleFactor" :w="draggable.w" :h="draggable.h" :origin="draggable.origin" :starting-row="draggable.startingRow"></circularSeatplanComponent>
-                    <trapezoidSeatplanComponent v-if="draggable.shape == 'trapezoid' && draggable.type == 'seat'" :scale-factor="scaleFactor" :w="draggable.w" :h="draggable.h" :origin="draggable.origin" :starting-row="draggable.startingRow"></trapezoidSeatplanComponent>
-                    <rectangularSeatplanComponent v-if="draggable.shape == 'rectangular' && draggable.type == 'seat'" :scale-factor="scaleFactor" :w="draggable.w" :h="draggable.h" :origin="draggable.origin"></rectangularSeatplanComponent>
+                    <trapezoidSeatplanComponent v-else-if="draggable.shape == 'trapezoid' && draggable.type == 'seat'" :scale-factor="scaleFactor" :w="draggable.w" :h="draggable.h" :origin="draggable.origin" :starting-row="draggable.startingRow"></trapezoidSeatplanComponent>
+                    <rectangularSeatplanComponent v-else-if="draggable.shape == 'rectangular' && draggable.type == 'seat'" :scale-factor="scaleFactor" :w="draggable.w" :h="draggable.h" :origin="draggable.origin"></rectangularSeatplanComponent>
+                    <stagesSeatplanComponent v-else-if="draggable.type == 'stage'" :origin="draggable.origin" :shape="draggable.shape"></stagesSeatplanComponent>
+                    <standingSeatplanComponent v-else-if="draggable.type == 'stage'" :origin="draggable.origin" :shape="draggable.shape"></standingSeatplanComponent>
                 </Vue3DraggableResizable>
             </div>
         </div>
diff --git a/src/webapp/src/components/seatplan/seatplanComponents/stage/stages.vue b/src/webapp/src/components/seatplan/seatplanComponents/stage/stages.vue
index a79958e..95fa83a 100644
--- a/src/webapp/src/components/seatplan/seatplanComponents/stage/stages.vue
+++ b/src/webapp/src/components/seatplan/seatplanComponents/stage/stages.vue
@@ -8,15 +8,36 @@
 -->
 
 <template>
-    <div id="stages">
-        <div id="rectangular" v-if="origin == 'rectangular'"></div>
-        <div id="trapezoid" v-if="origin == 'trapezoid'"></div>
-        <div id="circular" v-if="origin == 'circular'"></div>
+    <div id="stages" class="stages">
+        <div id="rectangular" v-if="shape == 'rectangular'" class="stages"></div>
+        <div id="trapezoid" v-else-if="shape == 'trapezoid'" class="stages"><div id="trapezoid-ingredient"></div></div>
+        <div id="circular" v-else-if="shape == 'circular'" class="stages">Stage</div>
     </div>
 </template>
 
 <style scoped>
+.stages {
+    height: 100%;
+    width: 100%;
+}
 
+#rectangular {
+    border: solid black 2px;
+}
+
+#trapezoid {
+    overflow: hidden;
+}
+
+#trapezoid-ingredient {
+    border: solid black 2px;
+    rotate: 45deg;
+    height: 100vw;
+    width: 100vw;
+    position: relative;
+    top: 29vh;
+    right: 120vh;
+}
 </style>
 
 <script>
@@ -27,7 +48,7 @@ export default {
             type: Number,
             "default": 1,
         },
-        origin: {
+        shape: {
             type: String,
             "default": "rectangular",
         },
diff --git a/src/webapp/src/components/seatplan/seatplanComponents/stand/standing.vue b/src/webapp/src/components/seatplan/seatplanComponents/stand/standing.vue
index a573171..c063721 100644
--- a/src/webapp/src/components/seatplan/seatplanComponents/stand/standing.vue
+++ b/src/webapp/src/components/seatplan/seatplanComponents/stand/standing.vue
@@ -9,9 +9,9 @@
 
 <template>
     <div id="stages">
-        <div id="rectangular" v-if="origin == 'rectangular'"></div>
-        <div id="trapezoid" v-if="origin == 'trapezoid'"></div>
-        <div id="circular" v-if="origin == 'circular'"></div>
+        <div id="rectangular" v-if="shape == 'rectangular'"></div>
+        <div id="trapezoid" v-if="shape == 'trapezoid'"></div>
+        <div id="circular" v-if="orishapegin == 'circular'"></div>
     </div>
 </template>
 
@@ -27,7 +27,7 @@ export default {
             type: Number,
             "default": 1,
         },
-        origin: {
+        shape: {
             type: String,
             "default": "rectangular",
         },