Details

    • Sub-task
    • Status: Closed
    • Minor
    • Resolution: Cannot Reproduce
    • Upcoming Branch
    • Upcoming Branch
    • themes/helveticus
    • None

    Description

      See screenshot.

      Catalog --> Categories --> ProductAssocs

      The layout is spoiled because css class tooltip is defined. Helveticus theme uses this class to add css class "has-tooltip" to parent. The stylesheet definition of this class makes it look like it shows in the screenshot.

      I dont understand the current implementation of tooltips with helveticus theme.

       

      ProductAssocs:

       <div>
                              <span class="label">${uiLabelMap.ProductProductId}</span>
                              <@htmlTemplate.lookupField formName="addProductCategoryMemberForm" name="productId" id="productId" fieldFormName="LookupProduct"/>
                              <br/>
                              <span class="label">${uiLabelMap.CommonFromDate}</span>
                              <@htmlTemplate.renderDateTimeField name="fromDate" event="" action="" className="" alert="" title="Format: yyyy-MM-dd HH:mm:ss.SSS" value="" size="25" maxlength="30" id="fromDate1" dateType="date" shortDateInput=false timeDropdownParamName="" defaultDateTimeString="" localizedIconTitle="" timeDropdown="" timeHourName="" classString="" hour1="" hour2="" timeMinutesName="" minutes="" isTwelveHour="" ampmName="" amSelected="" pmSelected="" compositeType="" formName=""/>
                              <span class="tooltip">${uiLabelMap.CommonRequired}</span>
                                <br />
                                <span class="label">${uiLabelMap.CommonComments}</span> <textarea name="comments" rows="2" cols="40"></textarea>
                                <input type="submit" value="${uiLabelMap.CommonAdd}" />
                          </div>

      ProductStore:

       

      <tr>
      <td class="label">
      <label for="EditProductStore_payToPartyId" title="Bitte beachten Sie, dass dies mit der organizationPartyId ĂĽbereinstimmt, zu denen die Hauptbuch Transaktionen ĂĽbermittelt werden." id="EditProductStore_payToPartyId_title">Zahlung an Akteur ID</label>  </td>
      <td>
      <!-- @renderLookupField -->
      <span class="field-lookup">
          <div id="3_lookupId_EditProductStore_payToPartyId_auto"></div><input type="text" name="payToPartyId" value="Company" size="25" id="3_lookupId_EditProductStore_payToPartyId" data-lookup-ajax-enabled="true" data-lookup-presentation="layer" data-lookup-request-url="LookupPartyName" data-lookup-form-name="EditProductStore" data-lookup-optional-target="" data-lookup-width="640" data-lookup-height="500" data-lookup-position="topleft" data-lookup-modal="true" data-lookup-show-description="true" data-lookup-default-minlength="2" data-lookup-default-delay="300" data-lookup-args="" data-lookup-ajax-url="EditProductStore_payToPartyId,https://localhost:8443/catalog/control/LookupPartyName,ajaxLookup=Y&amp;searchValueFieldName=payToPartyId" class="ui-autocomplete-input" autocomplete="off">  <a href="javascript:void(0);" id="3_lookupId_button"></a><span id="3_lookupId_EditProductStore_payToPartyId_lookupDescription" class="tooltip"><p>
      </td>
      </tr>
      

      Is there a working exampe that I can use as reference.

      Shoud a tooltip be displayed below as in productstore example?

      Attachments

        1. image-2024-11-07-16-39-36-666.png
          5 kB
          Florian Motteau
        2. image-2022-06-13-13-38-58-628.png
          11 kB
          Ingo Wolfmayr
        3. image-2022-06-13-12-21-34-819.png
          12 kB
          Ingo Wolfmayr
        4. image-2022-06-13-12-20-42-426.png
          10 kB
          Ingo Wolfmayr

        Activity

          jleroux Jacques Le Roux added a comment - - edited

          Hi Ingo,

          Is this not related to OFBIZ-12615?

          jleroux Jacques Le Roux added a comment - - edited Hi Ingo, Is this not related to OFBIZ-12615 ?
          iwolf Ingo Wolfmayr added a comment -

          jleroux yes and no In this screen its a tooltip for "commonRequired" info. Which is normaly display with an asterisk.

          On the other hand the tooltip as displayed on the company screen could be confusing, as it is not a tooltip.

          There is a section in helveticus theme .css & .js that handles the tooltip class. I am not quite sure how the templates should be set up as I do not know how it should look like in the end.

          1. Common required: display with asterisk
          2. Infotext (Your Company Name here): display below , smaller font, italic style.
          3. Tooltip ??

           

          iwolf Ingo Wolfmayr added a comment - jleroux yes and no In this screen its a tooltip for "commonRequired" info. Which is normaly display with an asterisk. On the other hand the tooltip as displayed on the company screen could be confusing, as it is not a tooltip. There is a section in helveticus theme .css & .js that handles the tooltip class. I am not quite sure how the templates should be set up as I do not know how it should look like in the end. Common required: display with asterisk Infotext (Your Company Name here): display below , smaller font, italic style. Tooltip ??  

          Here is another example copied from the duplicate OFBIZ-12398. Not sure it's related to Ingo's discovery.

          Have a look at https://demo-trunk.ofbiz.apache.org/catalog/control/EditProductAssoc?productId=GZ-BASKET

          Here is an example:

          jleroux Jacques Le Roux added a comment - Here is another example copied from the duplicate OFBIZ-12398 . Not sure it's related to Ingo's discovery. Have a look at https://demo-trunk.ofbiz.apache.org/catalog/control/EditProductAssoc?productId=GZ-BASKET Here is an example:
          FloMo Florian Motteau added a comment - - edited

          jleroux this issue is caused by the way Helveticus handles tooltips. This form is written in FTL, and differs from what is generated by the form engine, causing this glitch.

          Fixed in https://github.com/apache/ofbiz-framework/pull/851

          FloMo Florian Motteau added a comment - - edited jleroux this issue is caused by the way Helveticus handles tooltips. This form is written in FTL, and differs from what is generated by the form engine, causing this glitch. Fixed in https://github.com/apache/ofbiz-framework/pull/851

          Hi Florian,

          I don't reproduce at  https://demo-trunk.ofbiz.apache.org/catalog/control/EditProductAssoc?productId=GZ-BASKET so this seems already handled w/o PR851 and we can close as not reproductible, right?

          jleroux Jacques Le Roux added a comment - Hi Florian, I don't reproduce at   https://demo-trunk.ofbiz.apache.org/catalog/control/EditProductAssoc?productId=GZ-BASKET so this seems already handled w/o PR851 and we can close as not reproductible, right?

          Hi jleroux , indeed I did not reproduce the "GZ-BASKET glitch", but PR851 fixes this situation :

          So yes I guess we can close this. Thanks for the review !

          FloMo Florian Motteau added a comment - Hi jleroux , indeed I did not reproduce the "GZ-BASKET glitch", but PR851 fixes this situation : So yes I guess we can close this. Thanks for the review !

          It works also in 24.09

          jleroux Jacques Le Roux added a comment - It works also in 24.09

          Commit 2113d2163637544ce159be2b9085a1539387c537 in ofbiz-framework's branch refs/heads/trunk from Florian Motteau
          [ https://gitbox.apache.org/repos/asf?p=ofbiz-framework.git;h=2113d21636 ]

          Fixed: Fix tooltips display and styles leaks (OFBIZ-12730) (#851)

          Use natives browser tooltips instead of handmade tooltips.
          Fixes at least one glitch (OFBIZ-12730) due to styles leaking.
          Removes the global "transition: .2s" which leads to
          animate every single element modification (causes OFBIZ-13104,
          and possibly other problems/lagging).
          Only apply these transitions to buttons to keep a nice effect
          on hover. We may have to add other selectors if needed.

          OFBIZ-12638
          OFBIZ-12730
          OFBIZ-13104

          jira-bot ASF subversion and git services added a comment - Commit 2113d2163637544ce159be2b9085a1539387c537 in ofbiz-framework's branch refs/heads/trunk from Florian Motteau [ https://gitbox.apache.org/repos/asf?p=ofbiz-framework.git;h=2113d21636 ] Fixed: Fix tooltips display and styles leaks ( OFBIZ-12730 ) (#851) Use natives browser tooltips instead of handmade tooltips. Fixes at least one glitch ( OFBIZ-12730 ) due to styles leaking. Removes the global "transition: .2s" which leads to animate every single element modification (causes OFBIZ-13104 , and possibly other problems/lagging). Only apply these transitions to buttons to keep a nice effect on hover. We may have to add other selectors if needed. OFBIZ-12638 OFBIZ-12730 OFBIZ-13104

          Commit 0ec108698fe7e0a9a96e9a01683360259605f371 in ofbiz-framework's branch refs/heads/release24.09 from Florian Motteau
          [ https://gitbox.apache.org/repos/asf?p=ofbiz-framework.git;h=0ec108698f ]

          Fixed: Fix tooltips display and styles leaks (OFBIZ-12730) (#851)

          Use natives browser tooltips instead of handmade tooltips.
          Fixes at least one glitch (OFBIZ-12730) due to styles leaking.
          Removes the global "transition: .2s" which leads to
          animate every single element modification (causes OFBIZ-13104,
          and possibly other problems/lagging).
          Only apply these transitions to buttons to keep a nice effect
          on hover. We may have to add other selectors if needed.

          OFBIZ-12638
          OFBIZ-12730
          OFBIZ-13104

          jira-bot ASF subversion and git services added a comment - Commit 0ec108698fe7e0a9a96e9a01683360259605f371 in ofbiz-framework's branch refs/heads/release24.09 from Florian Motteau [ https://gitbox.apache.org/repos/asf?p=ofbiz-framework.git;h=0ec108698f ] Fixed: Fix tooltips display and styles leaks ( OFBIZ-12730 ) (#851) Use natives browser tooltips instead of handmade tooltips. Fixes at least one glitch ( OFBIZ-12730 ) due to styles leaking. Removes the global "transition: .2s" which leads to animate every single element modification (causes OFBIZ-13104 , and possibly other problems/lagging). Only apply these transitions to buttons to keep a nice effect on hover. We may have to add other selectors if needed. OFBIZ-12638 OFBIZ-12730 OFBIZ-13104

          People

            jleroux Jacques Le Roux
            iwolf Ingo Wolfmayr
            Votes:
            0 Vote for this issue
            Watchers:
            4 Start watching this issue

            Dates

              Created:
              Updated:
              Resolved: