diff --git a/docs/_drafts/usage.md b/docs/usage.md
similarity index 95%
rename from docs/_drafts/usage.md
rename to docs/usage.md
index afda198a..f9c95734 100644
--- a/docs/_drafts/usage.md
+++ b/docs/usage.md
@@ -6,6 +6,6 @@ nav_order: 1
 has_children: true
 ---
 
-# Usage
+## Usage
 
 ehmmm, help needed here :smile: feel free to send a PR => [here](https://framagit.org/les/gancio/tree/master/docs)
diff --git a/static/gancio-events.es.js b/static/gancio-events.es.js
index 6e319f41..07cbc0d9 100644
--- a/static/gancio-events.es.js
+++ b/static/gancio-events.es.js
@@ -806,7 +806,7 @@ function instance($$self, $$props, $$invalidate) {
 class GancioEvent extends SvelteElement {
   constructor(options) {
     super();
-    this.shadowRoot.innerHTML = `<style>.card{display:block;font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;box-shadow:0 4px 8px 0 rgba(0,0,0,0.2);transition:0.3s;border-radius:5px;max-width:500px;text-decoration:none;color:white;background-color:#1e1e1e;overflow:hidden}img{border-radius:5px 5px 0 0;min-height:160px;width:100%;object-fit:cover;object-position:top}.card:hover .container{padding-left:20px}.card:hover{box-shadow:0 8px 16px 0 rgba(0,0,0,0.2)}.container{transition:padding-left .2s;padding:16px}.place{font-weight:600;color:#ff6e40}</style>`;
+    this.shadowRoot.innerHTML = `<style>.card{display:block;font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;box-shadow:0 4px 8px 0 rgba(0,0,0,0.2);transition:0.3s;border-radius:5px;max-width:500px;text-decoration:none;color:white;background-color:#1e1e1e;overflow:hidden}img{border-radius:5px 5px 0 0;max-height:250px;min-height:160px;width:100%;object-fit:cover;object-position:top}.card:hover .container{padding-left:20px}.card:hover{box-shadow:0 8px 16px 0 rgba(0,0,0,0.2)}.container{transition:padding-left .2s;padding:16px}.place{font-weight:600;color:#ff6e40}</style>`;
     init(this, {
       target: this.shadowRoot,
       props: attribute_to_object(this.attributes),
diff --git a/webcomponents/src/GancioEvent.svelte b/webcomponents/src/GancioEvent.svelte
index 6e34bcbc..08ec4bbf 100644
--- a/webcomponents/src/GancioEvent.svelte
+++ b/webcomponents/src/GancioEvent.svelte
@@ -75,6 +75,7 @@
 /* Add rounded corners to the top left and the top right corner of the image */
 img {
   border-radius: 5px 5px 0 0;
+  max-height: 250px;
   min-height: 160px;
   width: 100%;
   object-fit: cover;