From 880a2ccde11e0f1568894b8f671051ec7efa6ddd Mon Sep 17 00:00:00 2001 From: Sean Gallen Date: Wed, 9 Oct 2024 07:10:36 -0500 Subject: [PATCH] Fix missing CSS and a broken link in the Vanilla JS application tutorial (#949) * add missing css for bounding box and removed duplicate style * fix a broken link --- docs/source/tutorials/vanilla-js.md | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/docs/source/tutorials/vanilla-js.md b/docs/source/tutorials/vanilla-js.md index 976f79d44..7bc503006 100644 --- a/docs/source/tutorials/vanilla-js.md +++ b/docs/source/tutorials/vanilla-js.md @@ -57,7 +57,6 @@ body { .custom-file-upload { display: flex; align-items: center; - cursor: pointer; gap: 10px; border: 2px solid black; padding: 8px 16px; @@ -124,7 +123,7 @@ const status = document.getElementById("status"); ## Step 3: Create an object detection pipeline -We’re finally ready to create our object detection pipeline! As a reminder, a [pipeline](./pipelines). is a high-level interface provided by the library to perform a specific task. In our case, we will instantiate an object detection pipeline with the `pipeline()` helper function. +We’re finally ready to create our object detection pipeline! As a reminder, a [pipeline](../pipelines). is a high-level interface provided by the library to perform a specific task. In our case, we will instantiate an object detection pipeline with the `pipeline()` helper function. Since this can take some time (especially the first time when we have to download the ~40MB model), we first update the `status` paragraph so that the user knows that we’re about to load the model. @@ -269,14 +268,19 @@ The bounding box and label span also need some styling, so add the following to ```css .bounding-box { - position: absolute; - box-sizing: border-box; + position: absolute; + box-sizing: border-box; + border-width: 2px; + border-style: solid; } .bounding-box-label { - position: absolute; - color: white; - font-size: 12px; + color: white; + position: absolute; + font-size: 12px; + margin-top: -16px; + margin-left: -2px; + padding: 1px; } ```