Remove wrapper class

koddsson · koddsson · commit 6d3856c8c39b · 2021-04-08T14:54:59.000+01:00
diff --git a/examples/index.html b/examples/index.html
@@ -2,9 +2,6 @@
 <html lang="en">
 <head>
   <style>
-    .wrapper {
-      margin: 30px auto;
-    }
     .loading {
       background: #f0f0f0;
       text-align: center;
@@ -18,7 +15,7 @@
   <title>image-crop-element demo</title>
 </head>
 <body>
-  <image-crop src="./ams.jpg" class="wrapper" tabindex="0">
+  <image-crop src="./ams.jpg" tabindex="0">
     <div data-loading-slot class="loading">loading</div>
     <input type="text" data-image-crop-input="x" name="x" size="4" aria-label="x">
     <input type="text" data-image-crop-input="y" name="y" size="4" aria-label="y">
diff --git a/src/index.ts b/src/index.ts
@@ -269,6 +269,7 @@ class ImageCropElement extends HTMLElement {
   :host .se { bottom: 0; right: 0; cursor: nwse-resize; }
   :host .sw { bottom: 0; left: 0; cursor: nesw-resize; }
 </style>
+<slot></slot>
 <div class="crop-wrapper">
   <img width="100%" class="crop-image" alt="">
   <div class="crop-container">
@@ -281,7 +282,6 @@ class ImageCropElement extends HTMLElement {
     </div>
   </div>
 </div>
-<slot></slot>
 `
 
     const box = shadowRoot.querySelector('[data-crop-box]')
