wip #2934 @5

diff --git a/package.json b/package.json
index 45196e727bfd40104670fe54f24335278f367610..3d2a206303451801e8ca8adbd28ceca038924c9e 100644 (file)
--- a/package.json
+++ b/package.json
@@ -33,7 +33,5 @@
         "vue-slide-up-down": "^1.7.2",
         "vue-template-compiler": "^2.6.10"
     },
-    "dependencies": {
-        "tooltip.js": "^1.3.2"
-    }
+    "dependencies": {}
 }

diff --git a/public/_modules/product-detail-page/index.html b/public/_modules/product-detail-page/index.html
index 5a9157a02d2d1e1fc99b72918eeb30fcf5a86df7..318dee9ad2bbe34ad9c7be434fd2dae883c08a7c 100644 (file)
--- a/public/_modules/product-detail-page/index.html
+++ b/public/_modules/product-detail-page/index.html
@@ -112,10 +112,6 @@
                 <div class="breadcrumbs-item"><a href="https://staging.pm-instrumentation.com">Accueil</a></div>
                 <div class="breadcrumbs-item"><a>Produits</a></div>
                 <div class="breadcrumbs-item"><a>Capteurs</a></div>
-                <div class="breadcrumbs-item"><a href="https://staging.pm-instrumentation.com/force">Force</a></div>
-                <div class="active"><a
-                        href="https://staging.pm-instrumentation.com/capteur-de-force-3-axes-de-50-n-a-5kn">Capteur de
-                    force 3 axes de 50 N à 5kN</a></div>
             </div>
         </div>
     </section>
@@ -172,170 +168,7 @@ ajustez les quantités et obtenez un devis." class="ml-4 question-tooltip">
                     </div>
                 </div>
             </div>
-            <div class="tabs mb-3v mode-tabs" style="">
-                <ul role="tablist" class="tabs-list">
-                    <li role="presentation" class="tab-wrapper"><a aria-controls="#description" href="#description"
-                                                                   role="tab" class="tab-title">
-                        Description
-                    </a>
-                        <div class="accordion-content" style="display: none;">
-                            <div class="markdown"><p>The 3-axis force sensor K3D120 is suitable for measuring force in
-                                three mutually perpendicular axes. It is ready for 50N to 5kN in all three axes and can
-                                optionally be manufactured in other measurement ranges. The force sensor is made of
-                                high-strength aluminium alloy up to the 1kN measurement range. From 1kN onwards, the
-                                force sensor is made from the material stainless steel 1.4542 (option "VA"). It stands
-                                out due to its particularly compact structure, with an area of 120mm x 120mm and a low
-                                total height of just 30mm. Example application areas include force measurement in
-                                production processes, force control in handling machines, force measurement in assembly
-                                processes, and three-dimensional load measurement.</p></div>
-                        </div>
-                    </li>
-                    <li role="presentation" class="tab-wrapper is-active"><a aria-controls="#specifications"
-                                                                             href="#specifications" role="tab"
-                                                                             class="tab-title" aria-selected="true">
-                        Spécifications
-                    </a>
-                        <div class="accordion-content" style="display: none;">
-                            <dl>
-                                <div>
-                                    <dt>Type de capteur</dt>
-                                    <dd>Capteur galette</dd>
-                                </div>
-                                <div>
-                                    <dt>Direction de mesure</dt>
-                                    <dd>Traction</dd>
-                                </div>
-                                <div>
-                                    <dt>Signal de sortie</dt>
-                                    <dd>0-10 VDC</dd>
-                                </div>
-                                <div>
-                                    <dt>Température de fonctionnement</dt>
-                                    <dd> à °C</dd>
-                                </div>
-                                <div>
-                                    <dt>Gamme de compensation en température</dt>
-                                    <dd> à °C</dd>
-                                </div>
-                                <div>
-                                    <dt>Tension d'alimentation</dt>
-                                    <dd> à V</dd>
-                                </div>
-                                <div>
-                                    <dt>Classe de Protection</dt>
-                                    <dd>IP40</dd>
-                                </div>
-                                <div>
-                                    <dt>Boitier</dt>
-                                    <dd>Plastique</dd>
-                                </div>
-                            </dl>
-                        </div>
-                    </li>
-                    <li role="presentation" class="tab-wrapper"><a aria-controls="#documents" href="#documents"
-                                                                   role="tab" class="tab-title">
-                        Documents
-                    </a>
-                        <div class="accordion-content" style="display: none;">
-                            <ul>
-                                <li><a href="/storage/116/Datasheet_K3D120_pmi_EN.pdf" target="_blank"
-                                       class="flex items-center text-grey-dark hover:text-blue"><img
-                                        src="https://staging.pm-instrumentation.com/images/product-details/icon-tech.svg"
-                                        alt="" class="mr-4 mb-2">
-                                    Fiche technique
-                                </a></li>
-                                <li><a href="/storage/117/k3d120_000_montagehinweis.pdf" target="_blank"
-                                       class="flex items-center text-grey-dark hover:text-blue"><img
-                                        src="https://staging.pm-instrumentation.com/images/product-details/icon-tech.svg"
-                                        alt="" class="mr-4 mb-2">
-                                    Documentation
-                                </a></li>
-                            </ul>
-                        </div>
-                    </li>
-                    <li role="presentation" class="tab-wrapper"><a aria-controls="#dimensions" href="#dimensions"
-                                                                   role="tab" class="tab-title">
-                        Dimensions
-                    </a>
-                        <div class="accordion-content" style="display: none;">
-                            <div class="markdown"><p>120 mm x 120 mm x 30 mm</p>
-                                <p>Internal thread 4 x M6 x 1 Depth 12 mm</p></div>
-                        </div>
-                    </li>
-                </ul>
-                <div class="tabs-content" style="">
-                    <section data-id="description" role="tabpanel" class="tabs-content-panel" style="display: none;"
-                             aria-hidden="true">
-                        <div class="markdown"><p>The 3-axis force sensor K3D120 is suitable for measuring force in three
-                            mutually perpendicular axes. It is ready for 50N to 5kN in all three axes and can optionally
-                            be manufactured in other measurement ranges. The force sensor is made of high-strength
-                            aluminium alloy up to the 1kN measurement range. From 1kN onwards, the force sensor is made
-                            from the material stainless steel 1.4542 (option "VA"). It stands out due to its
-                            particularly compact structure, with an area of 120mm x 120mm and a low total height of just
-                            30mm. Example application areas include force measurement in production processes, force
-                            control in handling machines, force measurement in assembly processes, and three-dimensional
-                            load measurement.</p></div>
-                    </section>
-                    <section data-id="specifications" role="tabpanel" class="tabs-content-panel" style="">
-                        <dl>
-                            <div>
-                                <dt>Type de capteur</dt>
-                                <dd>Capteur galette</dd>
-                            </div>
-                            <div>
-                                <dt>Direction de mesure</dt>
-                                <dd>Traction</dd>
-                            </div>
-                            <div>
-                                <dt>Signal de sortie</dt>
-                                <dd>0-10 VDC</dd>
-                            </div>
-                            <div>
-                                <dt>Température de fonctionnement</dt>
-                                <dd> à °C</dd>
-                            </div>
-                            <div>
-                                <dt>Gamme de compensation en température</dt>
-                                <dd> à °C</dd>
-                            </div>
-                            <div>
-                                <dt>Tension d'alimentation</dt>
-                                <dd> à V</dd>
-                            </div>
-                            <div>
-                                <dt>Classe de Protection</dt>
-                                <dd>IP40</dd>
-                            </div>
-                            <div>
-                                <dt>Boitier</dt>
-                                <dd>Plastique</dd>
-                            </div>
-                        </dl>
-                    </section>
-                    <section data-id="documents" role="tabpanel" class="tabs-content-panel" style="display: none;"
-                             aria-hidden="true">
-                        <ul>
-                            <li><a href="/storage/116/Datasheet_K3D120_pmi_EN.pdf" target="_blank"
-                                   class="flex items-center text-grey-dark hover:text-blue"><img
-                                    src="https://staging.pm-instrumentation.com/images/product-details/icon-tech.svg"
-                                    alt="" class="mr-4 mb-2">
-                                Fiche technique
-                            </a></li>
-                            <li><a href="/storage/117/k3d120_000_montagehinweis.pdf" target="_blank"
-                                   class="flex items-center text-grey-dark hover:text-blue"><img
-                                    src="https://staging.pm-instrumentation.com/images/product-details/icon-tech.svg"
-                                    alt="" class="mr-4 mb-2">
-                                Documentation
-                            </a></li>
-                        </ul>
-                    </section>
-                    <section data-id="dimensions" role="tabpanel" class="tabs-content-panel" style="display: none;"
-                             aria-hidden="true">
-                        <div class="markdown"><p>120 mm x 120 mm x 30 mm</p>
-                            <p>Internal thread 4 x M6 x 1 Depth 12 mm</p></div>
-                    </section>
-                </div>
-            </div>
+
         </div>
     </main>
     <div class="contact-shortcut flex flex-col z-30 xs:hidden"><a href="tel:0146919332"

diff --git a/public/_modules/product-detail-page/main.js b/public/_modules/product-detail-page/main.js
index 27bf957de2baaa7a3cb02f25bd7e49a5cc979cdb..417a78b7406590e2f41c1301314cff49f61553b4 100644 (file)
--- a/public/_modules/product-detail-page/main.js
+++ b/public/_modules/product-detail-page/main.js
@@ -8,4 +8,9 @@ tippy('.question-tooltip', {
     flipBehavior: ["top", "bottom"],
     theme: 'custom',
     placement: 'top',
+    trigger: 'click', // remove click trigger to hover
+
+    // onCreate: data => {
+    //     data.styles: 'margin: 0 20px';
+    // },
 });

diff --git a/public/_modules/product-detail-page/style.styl b/public/_modules/product-detail-page/style.styl
index 978e04e560712a69c81ca5003a9e92dbe50ca292..61cd2c95880a0f8c1dab1b1d8c1363636da5ae0c 100644 (file)
--- a/public/_modules/product-detail-page/style.styl
+++ b/public/_modules/product-detail-page/style.styl
@@ -1,19 +1,19 @@
 
 .question-tooltip
-  align-self center
-  border-radius 50%
-  border 1.5px solid #6B7287
-  width 25px
-  height 25px
-  display flex
-  justify-content center
-  align-items center
+  align-self: center
+  border-radius: 50%
+  border: 1.5px solid #6B7287
+  width: 25px
+  height: 25px
+  display: flex
+  justify-content: center
+  align-items: center
   color: #6B7287
   font-weight: 600
   cursor: pointer
 
 .tippy-tooltip
-  max-width 380px!important
+  max-width: 380px!important
 .tippy-tooltip.custom-theme
   background-color: #6B7287;
   color: white;
@@ -23,4 +23,4 @@
   border-top-color: #6B7287;
 
 .tippy-tooltip.custom-theme[x-placement^='bottom'] .tippy-arrow
-  border-bottom-color: #6B7287;
+  border-bottom-color: #6B7287;
\ No newline at end of file

diff --git a/yarn.lock b/yarn.lock
index bc46435d00b57fdbed0ef0f5970303b36657665b..0f907d062f03b77aa705a2e130533cb3eb7c0323 100644 (file)
--- a/yarn.lock
+++ b/yarn.lock
@@ -5228,7 +5228,7 @@ pkg-dir@^3.0.0:
   dependencies:
     find-up "^3.0.0"
 
-popper.js@^1.0.2, popper.js@^1.12:
+popper.js@^1.12:
   version "1.15.0"
   resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.15.0.tgz#5560b99bbad7647e9faa475c6b8056621f5a4ff2"
   integrity sha512-w010cY1oCUmI+9KwwlWki+r5jxKfTFDVoadl7MSrIujHU5MJ5OR6HTDj6Xo8aoR/QsA56x8jKjA59qGH4ELtrA==
@@ -6999,13 +6999,6 @@ toidentifier@1.0.0:
   resolved "https://registry.yarnpkg.com/toidentifier/-/toidentifier-1.0.0.tgz#7e1be3470f1e77948bc43d94a3c8f4d7752ba553"
   integrity sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==
 
-tooltip.js@^1.3.2:
-  version "1.3.2"
-  resolved "https://registry.yarnpkg.com/tooltip.js/-/tooltip.js-1.3.2.tgz#ccfe450ffd7332ce5f254033778649526c1db542"
-  integrity sha512-DeDr9JxYx/lSvQ53ZCRFLxXrmrSyU3fLz6k+ITUTw69AIYtpWij/NmOJQscJ7BwY5lcEwWJWSfqqQWVvTMYZiw==
-  dependencies:
-    popper.js "^1.0.2"
-
 trim-right@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/trim-right/-/trim-right-1.0.1.tgz#cb2e1203067e0c8de1f614094b9fe45704ea6003"