feat: improve ui appearance of stored object

assets/gui/css/alas.css

@@ -442,10 +442,13 @@ pre.rich-traceback-code {
 
 [id^="pywebio-scope-dashboard-value-"] {
     display: flex;
-    align-items: flex-end;
+    align-items: baseline;
     height: 1.5rem;
 }
 
+[id^="pywebio-scope-arg_stored-stored-value-"] p {
+    margin-bottom: 0;
+}
 
 #pywebio-scope-log {
     line-height: 1.2;

module/webui/widgets.py

@@ -1,4 +1,3 @@
-import copy
 import json
 import random
 import string
@@ -325,11 +324,17 @@ def put_arg_input(kwargs: T_Output_Kwargs) -> Output:
     )
 
 
-def product_stored_row(kwargs: T_Output_Kwargs, key, value):
-    kwargs = copy.copy(kwargs)
-    kwargs["name"] += f'_{key}'
-    kwargs["value"] = value
-    return put_input(**kwargs).style("--input--")
+def product_stored_row(key, value):
+    if key[-1].isdigit():
+        # quest1, quest2, quest3
+        return [put_text(value).style("--dashboard-time--")]
+    else:
+        # calyx, relic
+        # 3 (relic)
+        return [
+            put_text(value).style("--dashboard-value--"),
+            put_text(f" ({key})").style("--dashboard-time--"),
+        ]
 
 
 def put_arg_stored(kwargs: T_Output_Kwargs) -> Output:
@@ -337,11 +342,32 @@ def put_arg_stored(kwargs: T_Output_Kwargs) -> Output:
     kwargs["disabled"] = True
 
     values = kwargs.pop("value", {})
+    value = values.pop("value", "")
+    total = values.pop("total", "")
     time_ = values.pop("time", "")
 
-    rows = [product_stored_row(kwargs, key, value) for key, value in values.items() if value]
+    if value != "" and total != "":
+        rows = [put_scope(f"dashboard-value-{name}", [
+            put_text(value).style("--dashboard-value--"),
+            put_text(f" / {total}").style("--dashboard-time--"),
+        ])]
+    elif value != "":
+        rows = [put_scope(f"dashboard-value-{name}", [
+            put_text(value).style("--dashboard-value--")
+        ])]
+    else:
+        rows = []
+    if values:
+        rows += [
+            put_scope(f"dashboard-value-{name}-{key}", product_stored_row(key, value))
+            for key, value in values.items() if value != ""
+        ]
+
     if time_:
-        rows += [product_stored_row(kwargs, "time", time_)]
+        rows.append(
+            put_text(time_).style("--dashboard-time--")
+        )
+
     return put_scope(
         f"arg_container-stored-{name}",
         [