Merge pull request #93 from protegeproject/143-question-mark-icon-for…

…-logical-definitions-and-necessary-conditions-should-be-at-the-end fixed who-icatx/icatx-project#143
protegeproject · Jan 6, 2025 · dd09b96 · dd09b96
2 parents a9066b5 + f4f3838
commit dd09b96
Showing 1 changed file with 35 additions and 16 deletions.
diff --git a/...tanford/bmir/protege/web/client/logicaldefinition/LogicalDefinitionPortletViewImpl.ui.xml b/...tanford/bmir/protege/web/client/logicaldefinition/LogicalDefinitionPortletViewImpl.ui.xml
@@ -1,5 +1,4 @@
 <ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
-             xmlns:wp='urn:import:edu.stanford.bmir.protege.web.client.frame'
              xmlns:g='urn:import:com.google.gwt.user.client.ui'>
     <ui:with field="wp" type="edu.stanford.bmir.protege.web.resources.WebProtegeClientBundle"/>
 
@@ -8,19 +7,21 @@
             display: flex;
             flex-direction: column;
         }
+
         .card {
             border-radius: 5px;
-            -webkit-box-shadow: 0 0 40px 0 rgba(0,0,0,.15);
-            box-shadow: 0 0 40px 0 rgba(0,0,0,.15);
+            -webkit-box-shadow: 0 0 40px 0 rgba(0, 0, 0, .15);
+            box-shadow: 0 0 40px 0 rgba(0, 0, 0, .15);
             margin: 5px;
             border-collapse: collapse;
             padding: 10px;
-            position: relative!important;
+            position: relative !important;
             height: 100%;
             display: flex;
             flex-direction: column;
 
         }
+
         .cardLabel {
             font-weight: bold;
             padding-bottom: 5px;
@@ -30,13 +31,15 @@
             font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
             color: literal("var(--primary--color)");
             align-items: center;
-            z-index : 1;
+            z-index: 1;
             background-color: literal("var(--primary--background-color)");
         }
+
         .rowWrapper {
             display: flex;
             justify-content: flex-start;
         }
+
         .label {
             font-size: 13px;
             white-space: nowrap;
@@ -50,9 +53,10 @@
             display: flex;
             justify-content: end;
             width: 97%;
-            margin:15px;
+            margin: 15px;
             padding: 3px;
         }
+
         .editValuesButton {
             background-color: #186cd4;
             border: none;
@@ -70,6 +74,7 @@
         .editValuesButton:hover {
             background-color: #1252a1;
         }
+
         .cancelButton {
             background-color: #F7F7F7;
             border: none;
@@ -83,6 +88,7 @@
             cursor: pointer;
             border-radius: 8px;
         }
+
         .cancelButton:hover {
             background-color: #E3E3E3;
         }
@@ -91,27 +97,37 @@
             width: 25px;
             height: 25px;
         }
-        .cardLabelWrapper{
+
+        .cardLabelWrapper {
             padding-right: 5px;
         }
 
+        .helpIconHolder {
+            flex-grow: 1;
+            flex-shrink: 1;
+            display: flex;
+            flex-direction: row;
+            justify-content: flex-end;
+        }
+
         .helpIcon {
             justify-self: flex-end;
-            width: 1.3em;
-            height: 1.3em;
-            margin-right: 5px;
+            width: 1.7em;
+            height: 1.7em;
         }
     </ui:style>
     <g:HTMLPanel ui:field="paneContainer" addStyleNames="{style.mainContent}">
         <g:HTMLPanel addStyleNames="{style.card}">
             <div class="{style.cardLabel}">
-                <g:HTMLPanel ui:field="logicalDefinitionsTooltip"  addStyleNames="{wp.style.helpIcon} {style.helpIcon}">
-
-                </g:HTMLPanel>
                 <div class="{style.cardLabelWrapper}">
                     Logical Definitions
                 </div>
                 <g:Button addStyleNames="{style.addDefinitionsButton}" ui:field="addDefinitionButton"/>
+                <g:HTMLPanel addStyleNames="{style.helpIconHolder}">
+                    <g:HTMLPanel ui:field="logicalDefinitionsTooltip"
+                                 addStyleNames="{wp.style.helpIcon} {style.helpIcon}">
+                    </g:HTMLPanel>
+                </g:HTMLPanel>
             </div>
 
             <g:HTMLPanel ui:field="definitions">
@@ -120,14 +136,17 @@
 
         </g:HTMLPanel>
 
-        <g:HTMLPanel ui:field="necessaryConditionsContainer"  addStyleNames="{style.card}">
+        <g:HTMLPanel ui:field="necessaryConditionsContainer" addStyleNames="{style.card}">
             <div class="{style.cardLabel}">
-                <g:HTMLPanel ui:field="necessaryConditionsTooltip" addStyleNames="{wp.style.helpIcon} {style.helpIcon}">
 
-                </g:HTMLPanel>
                 <div class="{style.cardLabelWrapper}">
                     Necessary Conditions
                 </div>
+                <g:HTMLPanel addStyleNames="{style.helpIconHolder}">
+                    <g:HTMLPanel ui:field="necessaryConditionsTooltip"
+                                 addStyleNames="{wp.style.helpIcon} {style.helpIcon}">
+                    </g:HTMLPanel>
+                </g:HTMLPanel>
             </div>
 
         </g:HTMLPanel>