MID-8685 improved styles for metrics widget, wip

Evolveum · Mar 28, 2023 · d018419 · d018419
1 parent a5b9dd8
commit d018419
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 13 deletions.
diff --git a/gui/admin-gui/src/frontend/scss/midpoint.scss b/gui/admin-gui/src/frontend/scss/midpoint.scss
@@ -1829,3 +1829,13 @@ th.debug-list-buttons {
     }
   }
 }
+
+.metric-widget {
+  background-color: $white;
+}
+
+@include dark-mode() {
+  .metric-widget {
+    background-color: $dark;
+  }
+}
diff --git a/gui/admin-gui/src/main/java/com/evolveum/midpoint/gui/api/util/WebComponentUtil.java b/gui/admin-gui/src/main/java/com/evolveum/midpoint/gui/api/util/WebComponentUtil.java
@@ -34,6 +34,8 @@
 
 import com.evolveum.midpoint.gui.impl.page.admin.user.PageUserHistory;
 
+import com.evolveum.midpoint.web.security.MidPointAuthWebSession;
+
 import org.apache.commons.collections4.CollectionUtils;
 import org.apache.commons.lang3.BooleanUtils;
 import org.apache.commons.lang3.StringUtils;
@@ -5771,4 +5773,9 @@ public static boolean isEnabledExperimentalFeatures() {
 
         return profile != null && BooleanUtils.isTrue(profile.isEnableExperimentalFeatures());
     }
+
+    public static boolean isDarkModeEnabled() {
+        MidPointAuthWebSession session = MidPointAuthWebSession.get();
+        return session.getSessionStorage().getMode() == SessionStorage.Mode.DARK;
+    }
 }
diff --git a/...n/java/com/evolveum/midpoint/gui/impl/page/admin/simulation/widget/MetricWidgetPanel.html b/...n/java/com/evolveum/midpoint/gui/impl/page/admin/simulation/widget/MetricWidgetPanel.html
@@ -27,9 +27,9 @@ <h3 class="mb-0" wicket:id="value"/>
             </div>
         </div>
     </div>
-    <a class="rounded-bottom text-center p-1" wicket:id="moreInfo">
-        <span class="text-white"><wicket:message key="MetricWidgetPanel.open"/></span>
-        <i class="ml-1 fa-solid fa-circle-arrow-right text-white"></i>
+    <a class="rounded-bottom text-center p-1 border-top" wicket:id="moreInfo">
+        <span><wicket:message key="MetricWidgetPanel.open"/></span>
+        <i class="ml-1 fa-solid fa-circle-arrow-right"></i>
     </a>
 </wicket:panel>
 </body>

diff --git a/...n/java/com/evolveum/midpoint/gui/impl/page/admin/simulation/widget/MetricWidgetPanel.java b/...n/java/com/evolveum/midpoint/gui/impl/page/admin/simulation/widget/MetricWidgetPanel.java
@@ -34,7 +34,7 @@
 import com.evolveum.midpoint.gui.api.component.BadgePanel;
 import com.evolveum.midpoint.gui.api.page.PageBase;
 import com.evolveum.midpoint.gui.api.util.GuiDisplayTypeUtil;
-import com.evolveum.midpoint.gui.api.util.WebComponentUtil;
+import com.evolveum.midpoint.gui.api.util.LocalizationUtil;
 import com.evolveum.midpoint.gui.api.util.WebModelServiceUtils;
 import com.evolveum.midpoint.gui.impl.component.data.column.CompositedIconPanel;
 import com.evolveum.midpoint.gui.impl.component.icon.CompositedIcon;
@@ -222,20 +222,21 @@ private ObjectFilter createObjectFilter(CollectionRefSpecificationType collectio
     }
 
     private void initLayout() {
-        add(AttributeModifier.prepend("class", "d-flex flex-column border rounded bg-white"));
+        add(AttributeModifier.prepend("class", "metric-widget d-flex flex-column border rounded"));
 
         IModel<String> titleModel = () -> {
             DisplayType display = getModelObject().getDisplay();
-            return display != null ? WebComponentUtil.getTranslatedPolyString(display.getLabel()) : null;
+            return display != null ? LocalizationUtil.translatePolyString(display.getLabel()) : null;
         };
 
         Label title = new Label(ID_TITLE, titleModel);
         title.add(AttributeAppender.append("title", titleModel));
         add(title);
 
+        // todo implement properly and make visible
         BadgePanel trendBadge = new BadgePanel(ID_TREND_BADGE, () -> {
             Badge badge = new Badge();
-            badge.setCssClass("badge badge-success trend trend-success");   // todo implement properly and make visible
+            badge.setCssClass("badge badge-success trend trend-success");
             badge.setIconCssClass("fa-solid fa-arrow-trend-up mr-1");
             badge.setText("+3,14%");
             return badge;
@@ -251,7 +252,7 @@ private void initLayout() {
         Label valueDescription = new Label(ID_VALUE_DESCRIPTION, createDescriptionModel());
         add(valueDescription);
 
-        IModel<CompositedIcon> iconModel = () -> createIcon();
+        IModel<CompositedIcon> iconModel = this::createIcon;
 
         CompositedIconPanel icon = new CompositedIconPanel(ID_ICON, iconModel);
         icon.add(new VisibleBehaviour(() -> isIconVisible(iconModel)));
@@ -262,14 +263,14 @@ private void initLayout() {
         chartContainer.setOutputMarkupId(true);
         add(chartContainer);
 
-        AjaxLink moreInfo = new AjaxLink<>(ID_MORE_INFO) {
+        AjaxLink<Void> moreInfo = new AjaxLink<>(ID_MORE_INFO) {
             @Override
             public void onClick(AjaxRequestTarget target) {
                 onMoreInfoPerformed(target);
             }
         };
-        moreInfo.add(new VisibleBehaviour(() -> isMoreInfoVisible()));
-        moreInfo.add(AttributeAppender.append("class", () -> hasZeroValue(valueModel) ? "bg-secondary" : "bg-primary"));
+        moreInfo.add(new VisibleBehaviour(this::isMoreInfoVisible));
+        moreInfo.add(AttributeAppender.append("class", () -> hasZeroValue(valueModel) ? "text-secondary" : "text-primary"));
         add(moreInfo);
     }
 
@@ -314,7 +315,7 @@ private IModel<String> createDescriptionModel() {
         return () -> {
             DisplayType display = getModelObject().getDisplay();
             if (display != null && display.getTooltip() != null) {
-                return WebComponentUtil.getTranslatedPolyString(display.getTooltip());
+                return LocalizationUtil.translatePolyString(display.getTooltip());
             }
 
             MarkType mark = markModel.getObject();
@@ -324,7 +325,7 @@ private IModel<String> createDescriptionModel() {
 
             display = mark.getDisplay();
 
-            return WebComponentUtil.getTranslatedPolyString(display.getTooltip());
+            return LocalizationUtil.translatePolyString(display.getTooltip());
         };
     }