@@ -152,13 +153,13 @@ WS(Request& context)
if(ws_is_binary())
{
ws_send_to(
- ws_connection_id(),
+ context.params["WS_CONNECTION_ID"],
json_encode(chat_event(context, "notice", "Binary messages are not handled by this demo"))
);
return;
}
- DTree payload = json_decode(ws_message());
+ DTree payload = json_decode(context.in);
String type = clean_chat_field(payload["type"].to_string(), 24);
String name = clean_chat_field(payload["name"].to_string(), 32);
String body = clean_chat_field(payload["body"].to_string(), 500);
@@ -190,6 +191,6 @@ WS(Request& context)
if(type != "")
{
context.connection["last_type"] = type;
- ws_send_to(ws_connection_id(), json_encode(chat_event(context, "notice", "Unknown message type: " + type)));
+ ws_send_to(context.params["WS_CONNECTION_ID"], json_encode(chat_event(context, "notice", "Unknown message type: " + type)));
}
}
diff --git a/site/doc/pages/0_DTree.txt b/site/doc/pages/0_DTree.txt
index 09929d7..8cc2e01 100644
--- a/site/doc/pages/0_DTree.txt
+++ b/site/doc/pages/0_DTree.txt
@@ -28,9 +28,8 @@ Map-shaped `DTree` values can also represent list-like data when their keys are
You will encounter `DTree` throughout the runtime, especially in:
-- `context.var`
- `context.cfg`
-- `context.call`
+- `context.props`
- `context.connection`
- `json_decode()` results
- `unit_call()` return values
@@ -107,7 +106,7 @@ For non-map values, `each()` still invokes the callback once:
- `key` is an empty string
```cpp
-context.var["items"].each([&](DTree item, String key) {
+context.connection["items"].each([&](DTree item, String key) {
print(key, ": ", item.to_string(), "\n");
});
```
@@ -119,7 +118,7 @@ String theme = context.cfg.get_by_path("theme/key").to_string();
u64 compiled_mtime = unit_info("test/hello.uce")["compiled_mtime"].to_u64();
-bool dark_mode = context.call["dark_mode"].to_bool();
+bool dark_mode = context.props["dark_mode"].to_bool();
if(DTree* user = payload.key("user")) {
print(user->to_json());
diff --git a/site/doc/pages/0_Request.txt b/site/doc/pages/0_Request.txt
index ed678c0..9b1f0fe 100644
--- a/site/doc/pages/0_Request.txt
+++ b/site/doc/pages/0_Request.txt
@@ -8,7 +8,7 @@ Request& context;
>types
:content
-`Request& context` is the request-local state object passed into UCE handlers. It carries incoming request data, response state, runtime metadata, and helper trees such as `context.cfg`, `context.var`, and `context.call`.
+`Request& context` is the request-local state object passed into UCE handlers. It carries incoming request data, response state, runtime metadata, and helper trees such as `context.cfg`, `context.props`, and `context.connection`.
## Core Fields
@@ -20,9 +20,8 @@ Request& context;
- `StringMap session`: current session data
- `String session_id`: session cookie ID
- `String session_name`: session cookie name
-- `DTree var`: user-defined request-local data
- `DTree cfg`: request-local configuration tree
-- `DTree call`: invocation or message-local structured data
+- `DTree call`: invocation-local structured data for helpers such as component and unit calls
- `DTree connection`: broker-owned WebSocket connection state that persists across `WS(Request& context)` calls for the same socket
- `std::vector
uploaded_files`: files uploaded in the current request
- `StringMap header`: headers to send back to the browser
@@ -45,7 +44,9 @@ Request& context;
## Common Usage Notes
- `context.cfg` is the usual place for structured configuration. Use `context.cfg.get_by_path("path/to/value")` for deep reads.
-- `context.call` carries invocation data for component calls, unit calls, and WebSocket messages.
+- `context.props` carries invocation data for component calls and unit calls.
+- `context.in` carries the current request body, and for `WS(Request& context)` it is the current WebSocket message payload.
+- `context.params["WS_..."]` exposes the current WebSocket message metadata directly on the request parameter map.
- `context.connection` is only meaningful for WebSocket traffic and persists for the lifetime of the connection.
`unit_render(String file_name, [Request& context])` invokes another UCE file using the current or supplied request context.
diff --git a/site/doc/pages/1_COMPONENT.txt b/site/doc/pages/1_COMPONENT.txt
index e191feb..0e22964 100644
--- a/site/doc/pages/1_COMPONENT.txt
+++ b/site/doc/pages/1_COMPONENT.txt
@@ -25,7 +25,7 @@ This keeps page rendering and component rendering separate:
A file intended only for component reuse can define `COMPONENT()` without defining `RENDER()`.
-Inside component handlers, props arrive through `context.call`.
+Inside component handlers, props arrive through `context.props`.
When you call `component(":NAME", props, context)` or `component_render(":NAME", props, context)`, the runtime resolves `:NAME` against the current `.uce` file instead of requiring the file name again.
@@ -34,12 +34,12 @@ When you call `component(":NAME", props, context)` or `component_render(":NAME",
```cpp
COMPONENT(Request& context)
{
- <>
+ <>
}
COMPONENT:BODY(Request& context)
{
- <>
+ <>
}
```
diff --git a/site/doc/pages/1_RENDER.txt b/site/doc/pages/1_RENDER.txt
index 5d12b69..4889ce3 100644
--- a/site/doc/pages/1_RENDER.txt
+++ b/site/doc/pages/1_RENDER.txt
@@ -18,9 +18,9 @@ The default page entrypoint is always the plain `RENDER(Request& context)` handl
Reusable component handlers now live on `COMPONENT(Request& context)` and `COMPONENT:NAME(Request& context)`. The component helpers call those handlers, not `RENDER()`.
-The request environment is passed explicitly through `context`, including params, cookies, post data, session state, headers, uploaded files, and the current `context.call` tree.
+The request environment is passed explicitly through `context`, including params, cookies, post data, session state, headers, uploaded files, and the current `context.props` tree.
-For a normal direct page request, `context.call` starts empty.
+For a normal direct page request, `context.props` starts empty.
If the page is invoked from another UCE file via `unit_render(file_name, context)`, the callee receives that same `context`.
diff --git a/site/doc/pages/1_WS.txt b/site/doc/pages/1_WS.txt
index e9667b0..92ba960 100644
--- a/site/doc/pages/1_WS.txt
+++ b/site/doc/pages/1_WS.txt
@@ -12,7 +12,7 @@ Defines the WebSocket message handler for the current `.ws.uce` page.
The same page may expose both `RENDER(Request& context)` and `WS(Request& context)`. `RENDER(Request& context)` serves the initial HTTP response, while `WS(Request& context)` is called whenever a complete WebSocket message arrives for that page.
-UCE reassembles fragmented messages before calling `WS(Request& context)`. Text and binary frames are both delivered. Use `context.call`, `context.connection`, `ws_opcode()`, and `ws_is_binary()` to inspect the current message.
+UCE reassembles fragmented messages before calling `WS(Request& context)`. Text and binary frames are both delivered. The current payload is available directly on `context.in`, message metadata is mirrored into `context.params["WS_..."]`, and connection-local state lives on `context.connection`.
## Connection State
@@ -20,13 +20,21 @@ UCE reassembles fragmented messages before calling `WS(Request& context)`. Text
## Message Data
-The current message data is available in `context.call`:
+The current message payload is available as:
-- `context.call["message"]`: current message payload
-- `context.call["connection_id"]`: sender connection ID
-- `context.call["scope"]`: current endpoint scope
-- `context.call["opcode"]`: WebSocket opcode of the current message
-- `context.call["document_uri"]`: request URI of the current endpoint
+- `context.in`: current WebSocket payload
+- `context.params["WS_MESSAGE"]`: same payload mirrored into the parameter map
+
+The current message metadata is available as:
+
+- `context.params["WS_CONNECTION_ID"]`: sender connection ID
+- `context.params["WS_SCOPE"]`: current endpoint scope
+- `context.params["WS_CONNECTION_COUNT"]`: number of currently connected clients in that scope
+- `context.params["WS_OPCODE"]`: WebSocket opcode of the current message
+- `context.params["WS_MESSAGE_TYPE"]`: `TEXT` or `BINARY`
+- `context.params["WS_DOCUMENT_URI"]`: request URI of the current endpoint
+
+Helper wrappers such as `ws_message()`, `ws_connection_id()`, `ws_scope()`, `ws_connection_count()`, `ws_opcode()`, and `ws_is_binary()` are still available when that reads better for the handler.
## Related Concepts
diff --git a/site/doc/pages/3_C++ Preprocessor.txt b/site/doc/pages/3_C++ Preprocessor.txt
index 58b3110..fa428e9 100644
--- a/site/doc/pages/3_C++ Preprocessor.txt
+++ b/site/doc/pages/3_C++ Preprocessor.txt
@@ -88,7 +88,7 @@ Literal output with trusted unescaped markup:
```cpp
RENDER(Request& context)
{
- <>
+ <>
}
```
@@ -96,7 +96,7 @@ Roughly becomes:
```cpp
print(R"()");
-print(component("components/card", context.call, context));
+print(component("components/card", context.props, context));
print(R"(
)");
```
diff --git a/site/doc/pages/component.txt b/site/doc/pages/component.txt
index 142805e..349a080 100644
--- a/site/doc/pages/component.txt
+++ b/site/doc/pages/component.txt
@@ -9,7 +9,7 @@ Renders another `.uce` file as a component and returns the captured output as a
`component()` resolves the target file relative to the current page and also tries the `components/` prefix automatically, mirroring the shorthand used by the starter example project.
-Component props are passed in `context.call`.
+Component props are passed in `context.props`.
Because `` HTML-escapes its value, embed component markup with ``, `print(component(...))`, or use `component_render(...)` for direct output.
diff --git a/site/doc/pages/component_render.txt b/site/doc/pages/component_render.txt
index 58356c6..dfc06ca 100644
--- a/site/doc/pages/component_render.txt
+++ b/site/doc/pages/component_render.txt
@@ -9,7 +9,7 @@ Renders another `.uce` file as a component and writes the result directly to the
This is the direct-output counterpart to `component()`.
-Component props are passed through `context.call`, and `name:COMPONENTFUNC` may be used to select a named handler exported by `COMPONENT:COMPONENTFUNC(Request& context)`.
+Component props are passed through `context.props`, and `name:COMPONENTFUNC` may be used to select a named handler exported by `COMPONENT:COMPONENTFUNC(Request& context)`.
When `name` starts with `:`, the runtime resolves that named handler against the current `.uce` file.
diff --git a/site/doc/pages/markdown_to_html.txt b/site/doc/pages/markdown_to_html.txt
index 8e22426..df6c9d3 100644
--- a/site/doc/pages/markdown_to_html.txt
+++ b/site/doc/pages/markdown_to_html.txt
@@ -70,22 +70,22 @@ options["components"]["node.directive"] = "components/markdown/directive";
If both an exact directive hook and a generic `node.directive` hook exist, the exact directive hook wins.
-When a markdown hook component is called, its props arrive in `context.call`.
+When a markdown hook component is called, its props arrive in `context.props`.
Useful fields include:
-- `context.call["hook"]` for the matched hook key such as `:::warning` or `node.code_block`
-- `context.call["target"]` for the resolved component target name
-- `context.call["default_html"]` for the renderer output without the hook
-- `context.call["children_html"]` for already-rendered child HTML
-- `context.call["node"]` for the full AST node
-- `context.call["type"]` for the node type
-- `context.call["name"]` for the directive name when applicable
-- `context.call["argument"]` for directive remainder after the name
-- `context.call["text"]` for source text used by nodes such as `code_block`
-- `context.call["lang"]` for fenced code language
-- `context.call["href"]`, `context.call["src"]`, and `context.call["title"]`
-- `context.call["options"]` for the full markdown options tree
+- `context.props["hook"]` for the matched hook key such as `:::warning` or `node.code_block`
+- `context.props["target"]` for the resolved component target name
+- `context.props["default_html"]` for the renderer output without the hook
+- `context.props["children_html"]` for already-rendered child HTML
+- `context.props["node"]` for the full AST node
+- `context.props["type"]` for the node type
+- `context.props["name"]` for the directive name when applicable
+- `context.props["argument"]` for directive remainder after the name
+- `context.props["text"]` for source text used by nodes such as `code_block`
+- `context.props["lang"]` for fenced code language
+- `context.props["href"]`, `context.props["src"]`, and `context.props["title"]`
+- `context.props["options"]` for the full markdown options tree
Directive blocks use this form:
diff --git a/site/examples/uce-starter/components/auth/oauth-client.uce b/site/examples/uce-starter/components/auth/oauth-client.uce
index 7439a78..557c1cc 100644
--- a/site/examples/uce-starter/components/auth/oauth-client.uce
+++ b/site/examples/uce-starter/components/auth/oauth-client.uce
@@ -2,11 +2,11 @@
COMPONENT(Request& context)
{
- String title = first(context.call["title"].to_string(), "Sign in with OAuth");
- String subtitle = first(context.call["subtitle"].to_string(), "Choose your preferred authentication method");
- String callback_url = first(context.call["callback_url"].to_string(), starter_link("auth/callback", context));
+ String title = first(context.props["title"].to_string(), "Sign in with OAuth");
+ String subtitle = first(context.props["subtitle"].to_string(), "Choose your preferred authentication method");
+ String callback_url = first(context.props["callback_url"].to_string(), starter_link("auth/callback", context));
- DTree services = context.call["services"];
+ DTree services = context.props["services"];
if(services.get_type_name() != "array" || services["google"]["name"].to_string() == "")
{
services["google"]["name"] = "Google";
@@ -41,7 +41,7 @@ COMPONENT(Request& context)
-
@@ -139,7 +139,7 @@ COMPONENT:TIMESERIES_CHART(Request& context)
yAxisLeftFormat: ,
yAxisRightFormat:
});
- chart.setData(, );
+ chart.setData(, );
window[] = chart;
}());
@@ -151,17 +151,17 @@ COMPONENT:SORTABLE_TABLE(Request& context)
starter_register_js("js/u-format.js", context);
starter_register_js("js/u-sortable-table.js", context);
- String table_id = first(context.call["id"].to_string(), "sortable-table-" + std::to_string((u64)time()));
- String title = context.call["title"].to_string();
- String subtitle = context.call["subtitle"].to_string();
- String empty_label = first(context.call["empty_label"].to_string(), "No data available");
+ String table_id = first(context.props["id"].to_string(), "sortable-table-" + std::to_string((u64)time()));
+ String title = context.props["title"].to_string();
+ String subtitle = context.props["subtitle"].to_string();
+ String empty_label = first(context.props["empty_label"].to_string(), "No data available");
DTree init_options;
- init_options["storageKey"] = first(context.call["storage_key"].to_string(), "starter.sort." + table_id);
- if(context.call["sort"]["column"].to_string() != "")
+ init_options["storageKey"] = first(context.props["storage_key"].to_string(), "starter.sort." + table_id);
+ if(context.props["sort"]["column"].to_string() != "")
{
- init_options["initialSort"]["column"] = context.call["sort"]["column"];
- init_options["initialSort"]["direction"] = first(context.call["sort"]["direction"].to_string(), "asc");
+ init_options["initialSort"]["column"] = context.props["sort"]["column"];
+ init_options["initialSort"]["direction"] = first(context.props["sort"]["direction"].to_string(), "asc");
}
<>
@@ -176,7 +176,7 @@ COMPONENT:SORTABLE_TABLE(Request& context)
- >
-
- " class="muted"> " class="muted"> " data-sort-value=""> 0 &&
columns._map.find("0") != columns._map.end() &&
columns["0"]["field"].to_string() != "";
- if(!has_explicit_columns && context.call["items"]["0"].get_type_name() == "array")
+ if(!has_explicit_columns && context.props["items"]["0"].get_type_name() == "array")
{
- context.call["items"]["0"].each([&](DTree value, String key) {
+ context.props["items"]["0"].each([&](DTree value, String key) {
DTree col;
col["field"] = key;
col["headerName"] = key;
@@ -248,7 +248,7 @@ COMPONENT:DATA_TABLE(Request& context)
columns = normalized_columns;
}
- DTree row_data = context.call["items"];
+ DTree row_data = context.props["items"];
if(row_data.get_type_name() != "array")
row_data.set_array();
if(!row_data.is_list())
@@ -264,7 +264,7 @@ COMPONENT:DATA_TABLE(Request& context)
DTree grid_options;
grid_options["pagination"].set_bool(true);
- grid_options["paginationPageSize"] = first(context.call["options"]["paginationPageSize"].to_string(), "20");
+ grid_options["paginationPageSize"] = first(context.props["options"]["paginationPageSize"].to_string(), "20");
grid_options["paginationPageSizeSelector"].set_bool(false);
grid_options["suppressMenuHide"].set_bool(true);
grid_options["animateRows"].set_bool(true);
@@ -275,7 +275,7 @@ COMPONENT:DATA_TABLE(Request& context)
-
; width: 100%; border: 1px solid var(--border); border-radius: 0 0 0.5rem 0.5rem; overflow: hidden;">
+
; width: 100%; border: 1px solid var(--border); border-radius: 0 0 0.5rem 0.5rem; overflow: hidden;">
diff --git a/site/examples/uce-starter/components/gauges/needlegauge.uce b/site/examples/uce-starter/components/gauges/needlegauge.uce
index 25ed3f1..6cdf28b 100644
--- a/site/examples/uce-starter/components/gauges/needlegauge.uce
+++ b/site/examples/uce-starter/components/gauges/needlegauge.uce
@@ -5,15 +5,15 @@ COMPONENT(Request& context)
starter_register_js("components/gauges/common.js", context);
starter_register_css("themes/common/css/gauges.css", context);
- String gauge_id = first(context.call["id"].to_string(), "needlegauge-" + std::to_string((u64)time()));
- String style = context.call["style"].to_string();
- String title = context.call["title"].to_string();
- String subtitle = context.call["subtitle"].to_string();
- f64 size = float_val(first(context.call["size"].to_string(), "200"));
- DTree scale = context.call["scale"];
+ String gauge_id = first(context.props["id"].to_string(), "needlegauge-" + std::to_string((u64)time()));
+ String style = context.props["style"].to_string();
+ String title = context.props["title"].to_string();
+ String subtitle = context.props["subtitle"].to_string();
+ f64 size = float_val(first(context.props["size"].to_string(), "200"));
+ DTree scale = context.props["scale"];
f64 scale_angle_start = float_val(first(scale["angle_start"].to_string(), std::to_string(-gauge_pi())));
f64 scale_angle_end = float_val(first(scale["angle_end"].to_string(), "0"));
- f64 img_height = float_val(first(context.call["img_height"].to_string(), std::to_string(size * std::max(cos(scale_angle_start), cos(scale_angle_end)))));
+ f64 img_height = float_val(first(context.props["img_height"].to_string(), std::to_string(size * std::max(cos(scale_angle_start), cos(scale_angle_end)))));
<>
@@ -24,7 +24,7 @@ COMPONENT(Request& context)
-
-
+
diff --git a/site/examples/uce-starter/components/gauges/progressbar.uce b/site/examples/uce-starter/components/gauges/progressbar.uce
index 1410243..33e95e8 100644
--- a/site/examples/uce-starter/components/gauges/progressbar.uce
+++ b/site/examples/uce-starter/components/gauges/progressbar.uce
@@ -5,18 +5,18 @@ COMPONENT(Request& context)
starter_register_js("components/gauges/common.js", context);
starter_register_css("themes/common/css/gauges.css", context);
- String gauge_id = first(context.call["id"].to_string(), "progressbar-" + std::to_string((u64)time()));
- String style = context.call["style"].to_string();
- String item_style = context.call["item-style"].to_string();
- String label_style = context.call["label-style"].to_string();
- String value_style = context.call["value-style"].to_string();
- String bar_style = context.call["bar-style"].to_string();
- String title = context.call["title"].to_string();
- String subtitle = context.call["subtitle"].to_string();
- String layout = first(context.call["layout"].to_string(), "horizontal");
- String bar_color_default = context.call["bar-color"].to_string();
- DTree scale = context.call["scale"];
- DTree markers = context.call["markers"];
+ String gauge_id = first(context.props["id"].to_string(), "progressbar-" + std::to_string((u64)time()));
+ String style = context.props["style"].to_string();
+ String item_style = context.props["item-style"].to_string();
+ String label_style = context.props["label-style"].to_string();
+ String value_style = context.props["value-style"].to_string();
+ String bar_style = context.props["bar-style"].to_string();
+ String title = context.props["title"].to_string();
+ String subtitle = context.props["subtitle"].to_string();
+ String layout = first(context.props["layout"].to_string(), "horizontal");
+ String bar_color_default = context.props["bar-color"].to_string();
+ DTree scale = context.props["scale"];
+ DTree markers = context.props["markers"];
StringList default_palette;
default_palette.push_back("var(--success, #10b981)");
@@ -35,7 +35,7 @@ COMPONENT(Request& context)
-
- px;">
- px;">
+
-
+
diff --git a/site/examples/uce-starter/components/theme/account_links.uce b/site/examples/uce-starter/components/theme/account_links.uce
index 96018c2..35203ea 100644
--- a/site/examples/uce-starter/components/theme/account_links.uce
+++ b/site/examples/uce-starter/components/theme/account_links.uce
@@ -7,9 +7,9 @@ COMPONENT(Request& context)
DTree user = users.current();
bool signed_in = user["email"].to_string() != "";
String theme_key = context.cfg.get_by_path("theme/key").to_string();
- String wrapper_class = first(context.call["wrapper_class"].to_string(), theme_key == "localfirst" ? "admin-account-card" : "nav-account nav-menu");
- String links_class = first(context.call["links_wrapper_class"].to_string(), theme_key == "localfirst" ? "admin-account-links" : "");
- String name_class = first(context.call["name_class"].to_string(), theme_key == "localfirst" ? "admin-account-name" : "account-name");
+ String wrapper_class = first(context.props["wrapper_class"].to_string(), theme_key == "localfirst" ? "admin-account-card" : "nav-account nav-menu");
+ String links_class = first(context.props["links_wrapper_class"].to_string(), theme_key == "localfirst" ? "admin-account-links" : "");
+ String name_class = first(context.props["name_class"].to_string(), theme_key == "localfirst" ? "admin-account-name" : "account-name");
<>
diff --git a/site/examples/uce-starter/components/theme/footer.uce b/site/examples/uce-starter/components/theme/footer.uce
index 1a81513..46b4e99 100644
--- a/site/examples/uce-starter/components/theme/footer.uce
+++ b/site/examples/uce-starter/components/theme/footer.uce
@@ -8,7 +8,7 @@ COMPONENT(Request& context)
return;
String text = first(context.cfg.get_by_path("theme/footer_text").to_string(), context.cfg.get_by_path("site/name").to_string());
- String inner_class = first(context.call["inner_class"].to_string(), context.cfg.get_by_path("theme/key").to_string() == "portal-light" ? "footer-inner" : "");
+ String inner_class = first(context.props["inner_class"].to_string(), context.cfg.get_by_path("theme/key").to_string() == "portal-light" ? "footer-inner" : "");
<>
diff --git a/site/examples/uce-starter/components/theme/global_controls.uce b/site/examples/uce-starter/components/theme/global_controls.uce
index 9af2162..81c320c 100644
--- a/site/examples/uce-starter/components/theme/global_controls.uce
+++ b/site/examples/uce-starter/components/theme/global_controls.uce
@@ -6,7 +6,7 @@ COMPONENT(Request& context)
if(starter_page_embed_mode(context))
return;
- String cookie_value = context.call["cookie_consent"].to_string();
+ String cookie_value = context.props["cookie_consent"].to_string();
bool cookie_consent = !(cookie_value == "0" || cookie_value == "false" || cookie_value == "FALSE" || cookie_value == "no" || cookie_value == "NO");
<>
diff --git a/site/examples/uce-starter/components/theme/page_shell.uce b/site/examples/uce-starter/components/theme/page_shell.uce
index 890f2c2..43cc9e5 100644
--- a/site/examples/uce-starter/components/theme/page_shell.uce
+++ b/site/examples/uce-starter/components/theme/page_shell.uce
@@ -3,18 +3,18 @@
COMPONENT(Request& context)
{
starter_boot(context);
- if(context.call["main_html"].to_string() != "")
- context.var["starter"]["fragments"]["main"] = context.call["main_html"];
- if(context.call["json"].get_type_name() == "array")
- context.var["starter"]["json"] = context.call["json"];
- if(context.call["page_type"].to_string() != "")
- context.var["starter"]["page_type"] = context.call["page_type"];
- if(context.call["embed_mode"].to_string() != "")
- context.var["starter"]["embed_mode"] = context.call["embed_mode"];
+ if(context.props["main_html"].to_string() != "")
+ context.var["starter"]["fragments"]["main"] = context.props["main_html"];
+ if(context.props["json"].get_type_name() == "array")
+ context.var["starter"]["json"] = context.props["json"];
+ if(context.props["page_type"].to_string() != "")
+ context.var["starter"]["page_type"] = context.props["page_type"];
+ if(context.props["embed_mode"].to_string() != "")
+ context.var["starter"]["embed_mode"] = context.props["embed_mode"];
starter_render_page(context);
}
COMPONENT:HEAD(Request& context)
{
- print(component("head", context.call, context));
+ print(component("head", context.props, context));
}
diff --git a/site/examples/uce-starter/components/theme/standard_nav.uce b/site/examples/uce-starter/components/theme/standard_nav.uce
index 587548a..2ab90ec 100644
--- a/site/examples/uce-starter/components/theme/standard_nav.uce
+++ b/site/examples/uce-starter/components/theme/standard_nav.uce
@@ -3,17 +3,17 @@
COMPONENT(Request& context)
{
starter_boot(context);
- String nav_class = context.call["nav_class"].to_string();
+ String nav_class = context.props["nav_class"].to_string();
if(nav_class == "" && (context.cfg.get_by_path("theme/key").to_string() == "portal-dark" || context.cfg.get_by_path("theme/key").to_string() == "dark" || context.cfg.get_by_path("theme/key").to_string() == "retro-gaming"))
nav_class = "nav-shell";
DTree account_props;
- if(context.call["account_wrapper_class"].to_string() != "")
- account_props["wrapper_class"] = context.call["account_wrapper_class"];
- if(context.call["links_wrapper_class"].to_string() != "")
- account_props["links_wrapper_class"] = context.call["links_wrapper_class"];
- if(context.call["name_class"].to_string() != "")
- account_props["name_class"] = context.call["name_class"];
+ if(context.props["account_wrapper_class"].to_string() != "")
+ account_props["wrapper_class"] = context.props["account_wrapper_class"];
+ if(context.props["links_wrapper_class"].to_string() != "")
+ account_props["links_wrapper_class"] = context.props["links_wrapper_class"];
+ if(context.props["name_class"].to_string() != "")
+ account_props["name_class"] = context.props["name_class"];
<>
>
diff --git a/site/examples/uce-starter/components/workspace/primitives.uce b/site/examples/uce-starter/components/workspace/primitives.uce
index f63a2c3..30fc397 100644
--- a/site/examples/uce-starter/components/workspace/primitives.uce
+++ b/site/examples/uce-starter/components/workspace/primitives.uce
@@ -4,14 +4,14 @@ COMPONENT:APP_FRAME(Request& context)
{
starter_register_css("themes/common/css/workspace.css", context);
starter_register_js("js/u-workspace-shell.js", context);
- String id = context.call["id"].to_string();
- String overlay_id = context.call["overlay_id"].to_string();
- String class_name = context.call["class"].to_string();
+ String id = context.props["id"].to_string();
+ String overlay_id = context.props["overlay_id"].to_string();
+ String class_name = context.props["class"].to_string();
<>
class="ws-app">
-
+
class="ws-sidebar-overlay">
-
+
">
-
">
-
-
-
+
}
@@ -31,18 +31,18 @@ COMPONENT:EMPTY_STATE(Request& context)
COMPONENT:LIST_STATE(Request& context)
{
<>
-
">">
+
">">
}
COMPONENT:MOBILE_BAR(Request& context)
{
<>
-
">
-
class="ws-mobile-toggle" title="Toggle sidebar" type="button">
- ">
+ ">
+ class="ws-mobile-toggle" title="Toggle sidebar" type="button">
+ ">
-
}
@@ -50,12 +50,12 @@ COMPONENT:MOBILE_BAR(Request& context)
COMPONENT:PANEL_HEADER(Request& context)
{
<>
-
-
-
-
-
-
-
+
+
+
+
+
+
diff --git a/site/info/style.css b/site/info/style.css
index 486434d..da04ca3 100644
--- a/site/info/style.css
+++ b/site/info/style.css
@@ -1,3 +1,8 @@
+/* UCE /info/ — modernized editorial theme
+ * Keeps the navy + gold palette and b612 / Input Sans Condensed fonts.
+ * Flat surfaces, hairline rules, numbered sections, typography-forward.
+ */
+
@font-face {
font-family: 'default_sans';
src: url('themes/common/fonts/b612/b612-regular.ttf') format('truetype');
@@ -39,30 +44,31 @@
}
:root {
- --bg: #113399;
- --bg-deep: #0c2370;
- --bg-grad: linear-gradient(160deg, #1d44b5 0%, #113399 42%, #0b225f 100%);
- --surface: rgba(255, 255, 255, 0.065);
- --surface-strong: rgba(255, 255, 255, 0.1);
- --surface-hover: rgba(255, 255, 255, 0.13);
- --surface-inset: rgba(7, 17, 52, 0.8);
- --border: rgba(255, 255, 255, 0.08);
- --border-strong: rgba(255, 255, 255, 0.16);
- --text: #e7edf8;
- --text-dim: rgba(215, 226, 245, 0.72);
- --text-muted: rgba(215, 226, 245, 0.48);
- --accent: #f0c430;
- --accent-soft: rgba(240, 196, 48, 0.12);
- --accent-hover: #ffe07c;
- --shadow-sm: 0 10px 28px rgba(0, 0, 0, 0.18);
- --shadow-md: 0 22px 48px rgba(0, 0, 0, 0.24);
- --shadow-lg: 0 30px 80px rgba(0, 0, 0, 0.34);
- --radius: 16px;
- --radius-lg: 26px;
- --font-sans: 'default_sans', sans-serif;
- --font-mono: 'default_mono', monospace;
- --font-display: 'display_condensed', 'default_sans', sans-serif;
- --ease: cubic-bezier(0.22, 1, 0.36, 1);
+ --navy: #0a1f52;
+ --navy-deep: #06143a;
+ --navy-mid: #113399;
+ --navy-surface: #0d2472;
+ --navy-surface2: #112b82;
+ --navy-edge: #1a3fa8;
+ --ink: #eef2fb;
+ --ink-dim: rgba(228, 236, 250, 0.72);
+ --ink-muted: rgba(228, 236, 250, 0.46);
+ --rule: rgba(255, 255, 255, 0.10);
+ --rule-soft: rgba(255, 255, 255, 0.05);
+ --rule-strong: rgba(255, 255, 255, 0.18);
+ --gold: #f0c430;
+ --gold-hot: #ffe07c;
+ --gold-soft: rgba(240, 196, 48, 0.14);
+ --gold-edge: rgba(240, 196, 48, 0.32);
+ --radius-xs: 3px;
+ --radius-sm: 6px;
+ --radius: 10px;
+ --font-sans: 'default_sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+ --font-mono: 'default_mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
+ --font-display: 'display_condensed', 'default_sans', sans-serif;
+ --ease: cubic-bezier(0.22, 1, 0.36, 1);
+ --content: 1120px;
+ --gutter: clamp(20px, 4vw, 48px);
}
*, *::before, *::after {
@@ -82,18 +88,20 @@ html {
scroll-behavior: smooth;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
+ overflow-x: hidden;
}
body {
- margin: 0;
min-height: 100vh;
- background:
- radial-gradient(circle at top left, rgba(255, 255, 255, 0.08), transparent 32%),
- radial-gradient(circle at 85% 12%, rgba(240, 196, 48, 0.13), transparent 22%),
- var(--bg-grad);
- color: var(--text);
+ background: #113399;
+ background-image:
+ radial-gradient(1100px 520px at 82% -8%, rgba(240, 196, 48, 0.10), transparent 60%),
+ radial-gradient(900px 620px at -5% 12%, rgba(120, 170, 255, 0.10), transparent 58%),
+ linear-gradient(168deg, #1a3daa 0%, #113399 40%, #0d2880 100%);
+ background-attachment: fixed;
+ color: var(--ink);
font-family: var(--font-sans);
- font-size: 1rem;
+ font-size: 0.98rem;
line-height: 1.65;
}
@@ -101,416 +109,569 @@ body::before {
content: '';
position: fixed;
inset: 0;
- background-image:
- linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
- linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
- background-size: 24px 24px;
- opacity: 0.18;
pointer-events: none;
- mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.4), transparent 88%);
+ background-image:
+ linear-gradient(rgba(255, 255, 255, 0.028) 1px, transparent 1px),
+ linear-gradient(90deg, rgba(255, 255, 255, 0.028) 1px, transparent 1px);
+ background-size: 56px 56px;
+ mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), transparent 80%);
+ -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), transparent 80%);
+ z-index: 0;
}
a {
- color: var(--accent);
+ color: var(--gold);
text-decoration: none;
- transition: color 160ms var(--ease), transform 160ms var(--ease), border-color 160ms var(--ease), background 160ms var(--ease);
+ transition: color 140ms var(--ease), border-color 140ms var(--ease), background 140ms var(--ease);
}
-a:hover {
- color: var(--accent-hover);
-}
+a:hover { color: var(--gold-hot); }
-code,
-pre,
+code, pre,
.brand,
.eyebrow,
+.code-lang,
+.topbar nav a,
+.topbar-link,
.link-meta,
.signal-card strong,
-.deploy-card li,
-.topbar nav a {
+summary {
font-family: var(--font-mono);
}
.page-shell {
- width: min(1180px, calc(100% - 32px));
+ width: min(var(--content), calc(100% - 32px));
margin: 0 auto;
- padding: 20px 0 56px;
+ padding: 0 0 96px;
position: relative;
z-index: 1;
}
+/* ---------- Topbar ---------- */
+
.topbar {
position: sticky;
- top: 14px;
+ top: 0;
z-index: 10;
display: flex;
align-items: center;
- gap: 16px;
- padding: 14px 18px;
- margin-bottom: 24px;
- background: rgba(8, 20, 66, 0.7);
- backdrop-filter: blur(16px);
- -webkit-backdrop-filter: blur(16px);
- border: 1px solid var(--border);
- border-radius: 999px;
- box-shadow: var(--shadow-sm);
+ gap: 18px;
+ padding: 18px 0 14px;
+ margin-bottom: 72px;
+ background: transparent;
+ border-bottom: 1px solid var(--rule);
+}
+
+.topbar::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 50%;
+ width: 100vw;
+ transform: translateX(-50%);
+ background: linear-gradient(180deg, rgba(13, 40, 128, 0.92), rgba(13, 40, 128, 0.68));
+ backdrop-filter: saturate(140%) blur(10px);
+ -webkit-backdrop-filter: saturate(140%) blur(10px);
+ border-bottom: 1px solid var(--rule);
+ z-index: -1;
+ pointer-events: none;
}
.brand {
- font-size: 1.05rem;
+ display: inline-flex;
+ align-items: center;
+ gap: 10px;
+ font-family: var(--font-mono);
+ font-size: 0.86rem;
font-weight: 700;
- letter-spacing: 0.08em;
+ letter-spacing: 0.22em;
text-transform: uppercase;
- color: var(--text);
- padding-right: 8px;
+ color: var(--ink);
+}
+
+.brand::before {
+ content: '';
+ width: 10px;
+ height: 10px;
+ background: var(--gold);
+ transform: rotate(45deg);
}
.topbar nav {
display: flex;
flex-wrap: wrap;
- gap: 6px;
+ gap: 2px;
+ margin-left: 8px;
}
-.topbar nav a,
-.topbar-link {
- display: inline-flex;
- align-items: center;
- justify-content: center;
- padding: 8px 12px;
- border-radius: 999px;
- border: 1px solid transparent;
- color: var(--text-dim);
- font-size: 0.88rem;
+.topbar nav a {
+ padding: 6px 10px;
+ color: var(--ink-dim);
+ font-size: 0.82rem;
+ letter-spacing: 0.04em;
+ border-bottom: 1px solid transparent;
}
-.topbar nav a:hover,
-.topbar-link:hover {
- border-color: var(--border-strong);
- background: rgba(255, 255, 255, 0.06);
- color: var(--text);
- transform: translateY(-1px);
+.topbar nav a:hover {
+ color: var(--ink);
+ border-bottom-color: var(--gold);
}
.topbar-link {
margin-left: auto;
- background: var(--accent-soft);
- color: var(--accent);
- border-color: rgba(240, 196, 48, 0.24);
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ padding: 7px 12px 7px 14px;
+ font-family: var(--font-mono);
+ font-size: 0.82rem;
+ font-weight: 700;
+ letter-spacing: 0.06em;
+ color: var(--gold);
+ background: var(--gold-soft);
+ border: 1px solid var(--gold-edge);
+ border-radius: var(--radius-sm);
}
-main {
- display: grid;
- gap: 22px;
+.topbar-link::after {
+ content: '→';
+ color: var(--gold);
+ transition: transform 160ms var(--ease);
}
-.hero-panel,
-.section,
-.page-footer {
- position: relative;
- overflow: hidden;
- background: var(--surface);
- backdrop-filter: blur(18px);
- -webkit-backdrop-filter: blur(18px);
- border: 1px solid var(--border);
- border-radius: var(--radius-lg);
- box-shadow: var(--shadow-sm);
- padding: 28px;
+.topbar-link:hover {
+ color: var(--gold-hot);
+ background: rgba(240, 196, 48, 0.22);
}
-.hero-panel::after,
-.section::after {
- content: '';
- position: absolute;
- inset: auto -10% -40% auto;
- width: 280px;
- height: 280px;
- border-radius: 50%;
- background: radial-gradient(circle, rgba(240, 196, 48, 0.12), transparent 70%);
- pointer-events: none;
+.topbar-link:hover::after { transform: translateX(3px); color: var(--gold-hot); }
+
+/* ---------- Typography ---------- */
+
+h1, h2, h3 {
+ color: var(--ink);
}
-.hero-panel {
- display: grid;
- grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.8fr);
- gap: 24px;
- align-items: start;
- padding: 34px;
- box-shadow: var(--shadow-lg);
+h1 {
+ font-family: var(--font-display);
+ font-size: clamp(2.6rem, 6.4vw, 5.4rem);
+ line-height: 0.98;
+ letter-spacing: -0.025em;
+ text-transform: uppercase;
+ margin-bottom: 26px;
+ max-width: 18ch;
+ text-wrap: balance;
}
-.hero-copy,
-.hero-aside,
-.section-heading,
-.feature-grid,
-.code-grid,
-.link-grid,
-.deploy-grid,
-.manifesto-grid,
-.signal-grid {
- position: relative;
- z-index: 1;
+h2 {
+ font-family: var(--font-display);
+ font-size: clamp(1.75rem, 3vw, 2.5rem);
+ line-height: 1.02;
+ letter-spacing: -0.01em;
+ text-transform: uppercase;
+ margin-bottom: 14px;
+ max-width: 24ch;
+ text-wrap: balance;
}
+h3 {
+ font-family: var(--font-sans);
+ font-size: 1.04rem;
+ font-weight: 700;
+ letter-spacing: -0.005em;
+ line-height: 1.25;
+ margin-bottom: 10px;
+}
+
+p, li, summary {
+ color: var(--ink-dim);
+}
+
+p + p { margin-top: 12px; }
+
+ul { list-style: none; padding-left: 0; }
+
+li + li { margin-top: 8px; }
+
.eyebrow {
display: inline-flex;
align-items: center;
gap: 8px;
- padding: 6px 10px;
- margin-bottom: 14px;
+ padding: 3px 9px 3px 9px;
border-radius: 999px;
- background: rgba(255, 255, 255, 0.08);
- color: var(--accent);
- font-size: 0.74rem;
+ background: var(--gold-soft);
+ color: var(--gold);
+ border: 1px solid var(--gold-edge);
+ font-family: var(--font-mono);
+ font-size: 0.68rem;
font-weight: 700;
- letter-spacing: 0.08em;
- text-transform: uppercase;
-}
-
-h1,
-h2,
-h3 {
- line-height: 1.08;
- letter-spacing: -0.03em;
-}
-
-h1,
-h2 {
- font-family: var(--font-display);
+ letter-spacing: 0.16em;
text-transform: uppercase;
margin-bottom: 16px;
}
-h1 {
- font-size: clamp(3rem, 8vw, 6rem);
- max-width: 10ch;
- text-wrap: balance;
+.eyebrow::before {
+ content: '';
+ width: 5px;
+ height: 5px;
+ background: var(--gold);
+ border-radius: 50%;
}
-h2 {
- font-size: clamp(1.9rem, 3.2vw, 3rem);
- max-width: 14ch;
+/* ---------- Main flow + numbered sections ---------- */
+
+main {
+ display: flex;
+ flex-direction: column;
+ gap: 88px;
+ counter-reset: section;
}
-h3 {
+.section {
+ position: relative;
+ counter-increment: section;
+}
+
+.section > .section-heading::before {
+ content: '§ ' counter(section, decimal-leading-zero);
+ display: block;
font-family: var(--font-mono);
- font-size: 1.08rem;
- margin-bottom: 10px;
+ font-size: 0.74rem;
+ font-weight: 700;
+ letter-spacing: 0.26em;
+ color: var(--gold);
+ margin-bottom: 18px;
+ text-transform: uppercase;
}
-p,
-li,
-summary,
-.code-note,
-.manual-card span,
-.signal-card span,
-.link-card span {
- color: var(--text-dim);
-}
-
-p + p {
- margin-top: 12px;
-}
-
-ul {
- padding-left: 18px;
-}
-
-li + li {
- margin-top: 8px;
-}
-
-.hero-lead,
+.section-heading { margin-bottom: 32px; max-width: 72ch; }
+.section-heading .eyebrow { display: none; }
.section-heading p {
- max-width: 70ch;
- font-size: 1.05rem;
+ color: var(--ink-dim);
+ font-size: 1.02rem;
+ max-width: 66ch;
+ margin-top: 10px;
+}
+
+/* ---------- Hero ---------- */
+
+.hero-panel {
+ display: grid;
+ grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr);
+ gap: 60px;
+ align-items: start;
+ padding: 0;
+ margin-bottom: 16px;
+ counter-increment: none;
+}
+
+.hero-copy .eyebrow { margin-bottom: 20px; }
+
+.hero-copy h1 {
+ background: linear-gradient(180deg, #f6f9ff 0%, #cfdcf6 100%);
+ -webkit-background-clip: text;
+ background-clip: text;
+ color: transparent;
+}
+
+.hero-lead {
+ font-size: 1.1rem;
+ color: var(--ink-dim);
+ max-width: 56ch;
+ margin-bottom: 26px;
}
.hero-actions {
display: flex;
flex-wrap: wrap;
- gap: 12px;
- margin: 26px 0 28px;
+ gap: 10px;
+ margin: 6px 0 36px;
}
.button {
display: inline-flex;
align-items: center;
- justify-content: center;
- padding: 12px 18px;
- border-radius: 999px;
- border: 1px solid var(--border-strong);
+ gap: 8px;
+ padding: 11px 18px;
+ border-radius: var(--radius-sm);
font-family: var(--font-mono);
- font-size: 0.9rem;
+ font-size: 0.88rem;
font-weight: 700;
- letter-spacing: 0.03em;
- text-decoration: none;
- box-shadow: var(--shadow-sm);
+ letter-spacing: 0.02em;
+ border: 1px solid transparent;
+ transition: transform 160ms var(--ease), background 160ms var(--ease), color 160ms var(--ease), border-color 160ms var(--ease);
}
-.button:hover {
- text-decoration: none;
- transform: translateY(-2px);
- box-shadow: var(--shadow-md);
-}
+.button:hover { transform: translateY(-1px); text-decoration: none; }
.button-primary {
- background: var(--accent);
- color: #1a2247;
- border-color: rgba(255, 224, 124, 0.42);
-}
-
-.button-primary:hover {
- color: #1a2247;
- background: var(--accent-hover);
+ background: var(--gold);
+ color: #1a1a1a;
+ border-color: var(--gold);
+ box-shadow: 0 8px 22px rgba(240, 196, 48, 0.22);
}
+.button-primary:hover { background: var(--gold-hot); color: #111; border-color: var(--gold-hot); }
+.button-primary::after { content: '→'; }
.button-secondary {
- background: rgba(255, 255, 255, 0.06);
- color: var(--text);
+ background: transparent;
+ color: var(--ink);
+ border-color: var(--rule-strong);
+}
+.button-secondary:hover { background: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.28); }
+
+/* Hero aside — editorial sidebar with hairline */
+.hero-aside {
+ display: flex;
+ flex-direction: column;
+ gap: 28px;
+ padding: 4px 0 0 28px;
+ border-left: 1px solid var(--rule);
+ align-self: stretch;
}
-.signal-grid,
-.feature-grid,
-.manifesto-grid,
-.link-grid,
-.deploy-grid {
- display: grid;
- gap: 14px;
+.manual-card {
+ padding: 0;
+ background: transparent;
+ border: 0;
}
+.manual-card .eyebrow {
+ margin-bottom: 10px;
+}
+
+.manual-card h2 {
+ font-family: var(--font-sans);
+ text-transform: none;
+ font-size: 1.15rem;
+ letter-spacing: -0.01em;
+ line-height: 1.25;
+ margin-bottom: 14px;
+ max-width: none;
+}
+
+.manual-card ul {
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+}
+
+.manual-card li {
+ color: var(--ink-dim);
+ font-size: 0.93rem;
+ line-height: 1.5;
+ padding-left: 18px;
+ position: relative;
+}
+
+.manual-card li::before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0.68em;
+ width: 8px;
+ height: 1px;
+ background: var(--gold);
+}
+
+.manual-card.compact { padding-top: 18px; border-top: 1px solid var(--rule); }
+.manual-card.compact p { font-size: 0.9rem; }
+.manual-card.compact p + p { margin-top: 6px; }
+
+/* Hero signals row */
.signal-grid {
+ display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
- margin-top: 8px;
+ gap: 0;
+ margin-top: 36px;
+ border-top: 1px solid var(--rule);
+ border-bottom: 1px solid var(--rule);
}
-.feature-grid,
-.link-grid {
- grid-template-columns: repeat(2, minmax(0, 1fr));
- margin-top: 22px;
+.signal-card {
+ padding: 18px 22px 18px 0;
+ background: transparent;
+ border-right: 1px solid var(--rule);
}
+.signal-card:last-child { border-right: 0; }
+.signal-card + .signal-card { padding-left: 22px; }
+
+.signal-card strong {
+ display: block;
+ color: var(--ink);
+ font-size: 0.74rem;
+ font-weight: 700;
+ letter-spacing: 0.14em;
+ text-transform: uppercase;
+ margin-bottom: 6px;
+}
+
+.signal-card span {
+ color: var(--ink-dim);
+ font-size: 0.93rem;
+}
+
+/* ---------- Feature grid (Why) ---------- */
+
+.feature-grid {
+ display: grid;
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ gap: 0;
+ border-top: 1px solid var(--rule);
+}
+
+.feature-card {
+ padding: 26px 28px 26px 0;
+ background: transparent;
+ border: 0;
+ border-bottom: 1px solid var(--rule);
+ border-right: 1px solid var(--rule);
+ position: relative;
+}
+
+.feature-card:nth-child(2n) { padding-right: 0; padding-left: 28px; border-right: 0; }
+.feature-card:nth-last-child(-n+2):not(:nth-last-child(n+3)) { border-bottom: 0; }
+
+.feature-card .eyebrow {
+ background: transparent;
+ border: 0;
+ padding: 0;
+ color: var(--ink-muted);
+ font-size: 0.66rem;
+ letter-spacing: 0.2em;
+ margin-bottom: 10px;
+}
+.feature-card .eyebrow::before { display: none; }
+
+.feature-card h3 {
+ font-size: 1.08rem;
+ margin-bottom: 8px;
+}
+
+.feature-card p { font-size: 0.95rem; }
+
+/* ---------- Manifesto ---------- */
+
.manifesto-grid {
- grid-template-columns: repeat(3, minmax(0, 1fr));
- margin-top: 10px;
-}
-
-.deploy-grid {
- grid-template-columns: repeat(2, minmax(0, 1fr));
- margin-top: 14px;
-}
-
-.signal-card,
-.feature-card,
-.manual-card,
-.manifesto-card,
-.deploy-card,
-.link-card,
-.code-card {
- background: rgba(6, 16, 54, 0.52);
- border: 1px solid var(--border);
- border-radius: var(--radius);
- box-shadow: var(--shadow-sm);
- transition: transform 180ms var(--ease), border-color 180ms var(--ease), background 180ms var(--ease), box-shadow 180ms var(--ease);
-}
-
-.signal-card,
-.feature-card,
-.manual-card,
-.manifesto-card,
-.deploy-card {
- padding: 18px;
-}
-
-.signal-card strong,
-.link-card strong {
- font-size: 0.9rem;
- color: var(--text);
- display: block;
- margin-bottom: 8px;
-}
-
-.feature-card:hover,
-.link-card:hover,
-.code-card:hover,
-.manual-card:hover,
-.manifesto-card:hover,
-.deploy-card:hover,
-.signal-card:hover {
- transform: translateY(-2px);
- border-color: var(--border-strong);
- background: rgba(10, 24, 75, 0.72);
- box-shadow: var(--shadow-md);
-}
-
-.hero-aside {
display: grid;
- gap: 14px;
-}
-
-.manual-card.compact p + p {
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ gap: 20px;
margin-top: 10px;
}
-.section-heading {
- margin-bottom: 8px;
+.manifesto-card {
+ position: relative;
+ padding: 28px 24px 26px;
+ background: rgba(255, 255, 255, 0.05);
+ border: 1px solid var(--rule);
+ border-radius: var(--radius);
}
+.manifesto-card::before {
+ position: absolute;
+ top: 16px;
+ right: 18px;
+ font-family: var(--font-mono);
+ font-size: 1.6rem;
+ font-weight: 700;
+ color: var(--ink-muted);
+ line-height: 1;
+}
+.manifesto-card:nth-child(1)::before { content: '+'; color: #7ce7d5; }
+.manifesto-card:nth-child(2)::before { content: '−'; color: #ff8ea1; }
+.manifesto-card:nth-child(3)::before { content: '='; color: var(--gold); }
+
+.manifesto-card h3 {
+ font-size: 1.06rem;
+ color: var(--ink);
+ margin-bottom: 10px;
+ padding-right: 28px;
+}
+
+.manifesto-card p { font-size: 0.95rem; }
+
.manifesto-card.emphasis {
- background: linear-gradient(180deg, rgba(240, 196, 48, 0.14), rgba(255, 255, 255, 0.06));
- border-color: rgba(240, 196, 48, 0.2);
+ background: linear-gradient(180deg, rgba(240, 196, 48, 0.14), rgba(240, 196, 48, 0.04));
+ border-color: var(--gold-edge);
}
+/* ---------- Examples: code cards ---------- */
+
.code-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
- gap: 16px;
- margin-top: 20px;
+ gap: 20px;
}
.code-card {
- padding: 20px;
+ display: flex;
+ flex-direction: column;
+ background: rgba(255, 255, 255, 0.04);
+ border: 1px solid var(--rule);
+ border-radius: var(--radius);
overflow: hidden;
+ transition: border-color 160ms var(--ease), transform 160ms var(--ease);
}
-.code-card p {
- min-height: 4.6em;
- margin-bottom: 14px;
+.code-card:hover {
+ border-color: var(--gold-edge);
+ transform: translateY(-1px);
+}
+
+.code-card .eyebrow { margin: 22px 22px 12px; }
+.code-card h3 { padding: 0 22px; margin-bottom: 6px; }
+.code-card > p {
+ padding: 0 22px 16px;
+ font-size: 0.94rem;
+ color: var(--ink-dim);
}
.code-toolbar {
display: flex;
- justify-content: flex-end;
- margin-bottom: 8px;
+ align-items: center;
+ justify-content: space-between;
+ padding: 8px 14px;
+ background: rgba(5, 18, 60, 0.85);
+ border-top: 1px solid var(--rule);
+ border-bottom: 1px solid var(--rule);
+}
+
+.code-toolbar::before {
+ content: '';
+ display: inline-flex;
+ width: 46px;
+ height: 10px;
+ background:
+ radial-gradient(circle at 5px 5px, #ff6b6b 4px, transparent 4.3px),
+ radial-gradient(circle at 21px 5px, #f0c430 4px, transparent 4.3px),
+ radial-gradient(circle at 37px 5px, #7ce7d5 4px, transparent 4.3px);
+ opacity: 0.82;
}
.code-lang {
- display: inline-flex;
- align-items: center;
- justify-content: center;
- padding: 4px 8px;
- border-radius: 999px;
- background: rgba(255, 255, 255, 0.08);
- border: 1px solid rgba(255, 255, 255, 0.12);
- font-family: var(--font-mono);
- font-size: 0.68rem;
+ font-size: 0.7rem;
font-weight: 700;
- letter-spacing: 0.08em;
+ letter-spacing: 0.16em;
text-transform: uppercase;
- color: var(--accent);
+ color: var(--ink-muted);
+ padding: 3px 9px;
+ border: 1px solid var(--rule);
+ border-radius: 999px;
+ background: rgba(255, 255, 255, 0.03);
}
.syntax-block {
+ margin: 0;
+ padding: 18px 20px;
+ background: rgba(0, 0, 0, 0.32);
+ border: 0;
+ border-radius: 0;
overflow-x: auto;
- padding: 18px;
- border-radius: 14px;
- border: 1px solid rgba(255, 255, 255, 0.08);
- background:
- linear-gradient(180deg, rgba(3, 9, 31, 0.97), rgba(8, 16, 48, 0.98)),
- radial-gradient(circle at top right, rgba(240, 196, 48, 0.08), transparent 34%);
- box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
- font-size: 0.88rem;
- line-height: 1.6;
- color: #f3f6fc;
+ font-size: 0.84rem;
+ line-height: 1.55;
+ color: #eef2fb;
}
.syntax-code {
@@ -518,226 +679,252 @@ li + li {
white-space: pre;
min-width: max-content;
font-family: var(--font-mono);
- color: #f3f6fc;
+ color: inherit;
tab-size: 2;
-moz-tab-size: 2;
font-variant-ligatures: none;
}
-.tok-comment {
- color: #7f8db7;
- font-style: italic;
-}
-
-.tok-keyword,
-.tok-delimiter {
- color: #ff8ea1;
- font-weight: 700;
-}
-
-.tok-type {
- color: #8bd9ff;
-}
-
-.tok-builtin {
- color: #7ce7d5;
- font-weight: 700;
-}
-
-.tok-call {
- color: #f7d774;
-}
-
-.tok-variable {
- color: #b8a7ff;
-}
-
-.tok-field {
- color: #b6c9ff;
-}
-
-.tok-string {
- color: #8ce6b4;
-}
-
-.tok-number {
- color: #ffbf7a;
-}
-
-.tok-operator,
-.tok-punct {
- color: #d8e1ff;
-}
-
-.tok-ident {
- color: #dfe7fb;
-}
-
-.tok-markup-tag {
- color: #7ee3ff;
- font-weight: 700;
-}
-
-.tok-markup-attr {
- color: #ffd27c;
-}
-
-.tok-markup-text {
- color: #c9d5f4;
-}
-
.code-note {
- margin-top: 12px;
- font-size: 0.92rem;
+ padding: 12px 20px;
+ margin: 0;
+ font-size: 0.86rem;
+ color: var(--ink-muted);
+ border-top: 1px solid var(--rule);
+ background: rgba(255, 255, 255, 0.02);
+}
+
+/* Syntax tokens — tuned for the deep-navy code panel */
+.tok-comment { color: #7a8bb8; font-style: italic; }
+.tok-keyword,
+.tok-delimiter { color: #ff8ea1; font-weight: 700; }
+.tok-type { color: #8bd9ff; }
+.tok-builtin { color: #7ce7d5; font-weight: 700; }
+.tok-call { color: #f7d774; }
+.tok-variable { color: #b8a7ff; }
+.tok-field { color: #b6c9ff; }
+.tok-string { color: #8ce6b4; }
+.tok-number { color: #ffbf7a; }
+.tok-operator,
+.tok-punct { color: #d8e1ff; }
+.tok-ident { color: #dfe7fb; }
+.tok-markup-tag { color: #7ee3ff; font-weight: 700; }
+.tok-markup-attr { color: #ffd27c; }
+.tok-markup-text { color: #c9d5f4; }
+
+/* ---------- Deploy ---------- */
+
+.deploy-grid {
+ display: grid;
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ gap: 0;
+ border-top: 1px solid var(--rule);
+ border-bottom: 1px solid var(--rule);
+}
+
+.deploy-card {
+ padding: 28px 28px 28px 0;
+ background: transparent;
+ border: 0;
+ border-right: 1px solid var(--rule);
+}
+.deploy-card:last-child { padding-right: 0; padding-left: 28px; border-right: 0; }
+
+.deploy-card h3 {
+ font-size: 1.06rem;
+ margin-bottom: 14px;
+}
+
+.deploy-card li {
+ color: var(--ink-dim);
+ font-size: 0.94rem;
+ padding-left: 22px;
+ position: relative;
+ line-height: 1.5;
+}
+
+.deploy-card li::before {
+ content: '›';
+ position: absolute;
+ left: 2px;
+ top: -1px;
+ color: var(--gold);
+ font-weight: 700;
+}
+
+.deploy-card code,
+.deploy-card li { word-break: break-word; }
+
+/* ---------- Link cards (Explore) ---------- */
+
+.link-grid {
+ display: grid;
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ gap: 14px;
}
.link-card {
display: block;
- padding: 20px;
- text-decoration: none;
+ padding: 20px 22px;
+ background: rgba(255, 255, 255, 0.04);
+ border: 1px solid var(--rule);
+ border-radius: var(--radius);
+ color: var(--ink);
+ position: relative;
+ transition: border-color 160ms var(--ease), background 160ms var(--ease), transform 160ms var(--ease);
+}
+
+.link-card::after {
+ content: '→';
+ position: absolute;
+ top: 18px;
+ right: 20px;
+ color: var(--ink-muted);
+ font-family: var(--font-mono);
+ transition: transform 160ms var(--ease), color 160ms var(--ease);
}
.link-card:hover {
- text-decoration: none;
+ border-color: var(--gold-edge);
+ background: rgba(255, 255, 255, 0.08);
+ transform: translateY(-1px);
}
-.link-meta {
- font-size: 0.76rem;
- letter-spacing: 0.08em;
+.link-card:hover::after { color: var(--gold); transform: translateX(3px); }
+
+.link-card .link-meta {
+ display: block;
+ font-size: 0.68rem;
+ letter-spacing: 0.18em;
text-transform: uppercase;
- color: var(--accent);
+ color: var(--ink-muted);
margin-bottom: 10px;
}
-.deployment ul,
-.manual-card ul,
-.deploy-card ul {
- list-style: none;
- padding-left: 0;
+.link-card:hover .link-meta { color: var(--gold); }
+
+.link-card strong {
+ display: block;
+ color: var(--ink);
+ font-size: 1rem;
+ margin-bottom: 6px;
}
-.deployment li,
-.manual-card li,
-.deploy-card li {
- position: relative;
- padding-left: 18px;
+.link-card span {
+ color: var(--ink-dim);
+ font-size: 0.9rem;
+ line-height: 1.5;
}
-.deployment li::before,
-.manual-card li::before,
-.deploy-card li::before {
- content: '+';
- position: absolute;
- left: 0;
- color: var(--accent);
-}
+/* ---------- FAQ ---------- */
-details {
- padding: 18px 20px;
- border: 1px solid var(--border);
+.faq details {
+ padding: 18px 22px;
+ background: rgba(255, 255, 255, 0.04);
+ border: 1px solid var(--rule);
border-radius: var(--radius);
- background: rgba(6, 16, 54, 0.48);
}
-details + details {
- margin-top: 12px;
-}
+.faq details + details { margin-top: 10px; }
-summary {
+.faq summary {
cursor: pointer;
list-style: none;
font-family: var(--font-mono);
- font-size: 0.96rem;
- color: var(--text);
+ font-size: 0.94rem;
+ color: var(--ink);
+ position: relative;
+ padding-right: 28px;
}
-summary::-webkit-details-marker {
- display: none;
+.faq summary::-webkit-details-marker { display: none; }
+
+.faq summary::after {
+ content: '+';
+ position: absolute;
+ right: 0;
+ top: -1px;
+ color: var(--gold);
+ font-size: 1.1rem;
+ font-weight: 700;
+ line-height: 1;
+ transition: transform 160ms var(--ease);
}
-details p {
- margin-top: 12px;
-}
+.faq details[open] summary::after { transform: rotate(45deg); }
+
+.faq details p { margin-top: 12px; color: var(--ink-dim); font-size: 0.96rem; }
+
+/* ---------- Footer ---------- */
.page-footer {
+ margin-top: 24px;
+ padding: 26px 0 0;
+ border-top: 1px solid var(--rule);
display: flex;
+ flex-wrap: wrap;
justify-content: space-between;
- gap: 18px;
align-items: center;
- margin-top: 4px;
- padding-top: 20px;
- padding-bottom: 20px;
- background: rgba(7, 18, 56, 0.64);
- border-radius: 20px;
+ gap: 16px;
}
.page-footer p {
- max-width: 55ch;
- font-size: 0.94rem;
+ max-width: 60ch;
+ font-size: 0.92rem;
+ color: var(--ink-muted);
}
+.page-footer p:last-child {
+ font-family: var(--font-mono);
+ display: inline-flex;
+ gap: 4px;
+ align-items: center;
+}
+
+.page-footer a {
+ color: var(--ink);
+ border-bottom: 1px solid transparent;
+}
+.page-footer a:hover { color: var(--gold); border-bottom-color: var(--gold); }
+
.page-footer span {
- opacity: 0.42;
- padding: 0 8px;
+ color: var(--ink-muted);
+ padding: 0 6px;
}
+/* ---------- Responsive ---------- */
+
@media (max-width: 1024px) {
- .hero-panel,
- .signal-grid,
- .feature-grid,
- .manifesto-grid,
- .code-grid,
- .link-grid,
- .deploy-grid,
- .page-footer {
- grid-template-columns: 1fr;
- }
-
- .hero-panel {
- padding: 28px;
- }
-
- .page-footer {
- display: grid;
- }
+ .hero-panel { grid-template-columns: 1fr; gap: 40px; }
+ .hero-aside { border-left: 0; padding-left: 0; padding-top: 24px; border-top: 1px solid var(--rule); }
+ .manifesto-grid { grid-template-columns: 1fr; }
+ .code-grid { grid-template-columns: 1fr; }
+ .link-grid { grid-template-columns: repeat(2, 1fr); }
+ .deploy-grid { grid-template-columns: 1fr; border-bottom: 0; }
+ .deploy-card { border-right: 0; border-bottom: 1px solid var(--rule); padding: 22px 0; }
+ .deploy-card:last-child { padding-left: 0; border-bottom: 0; }
+ .feature-grid { grid-template-columns: 1fr; }
+ .feature-card { padding: 22px 0 !important; border-right: 0 !important; }
}
-@media (max-width: 760px) {
- .page-shell {
- width: min(100% - 20px, 1180px);
- padding-top: 10px;
- }
+@media (max-width: 720px) {
+ .topbar { flex-wrap: wrap; gap: 10px; padding-top: 14px; }
+ .topbar-link { margin-left: 0; }
+ .signal-grid { grid-template-columns: 1fr; }
+ .signal-card { border-right: 0; border-bottom: 1px solid var(--rule); padding: 16px 0 !important; }
+ .signal-card:last-child { border-bottom: 0; }
+ .link-grid { grid-template-columns: 1fr; }
+ .button { width: 100%; justify-content: center; }
+ main { gap: 64px; }
+ .section > .section-heading::before { margin-bottom: 12px; }
+}
- .topbar {
- border-radius: 24px;
- padding: 14px;
- flex-wrap: wrap;
- }
+/* ---------- Utility ---------- */
- .topbar-link {
- margin-left: 0;
- }
+::selection { background: var(--gold); color: #111; }
- .hero-panel,
- .section,
- .page-footer {
- padding: 22px;
- }
-
- h1 {
- font-size: 2.8rem;
- }
-
- h2 {
- font-size: 2rem;
- }
-
- .button {
- width: 100%;
- }
-
- pre {
- padding: 16px;
- font-size: 0.82rem;
- }
-}
\ No newline at end of file
+:focus-visible {
+ outline: 2px solid var(--gold);
+ outline-offset: 2px;
+ border-radius: var(--radius-xs);
+}
diff --git a/site/info/themes/common/page.json.uce b/site/info/themes/common/page.json.uce
index 975a1a8..fcca43e 100644
--- a/site/info/themes/common/page.json.uce
+++ b/site/info/themes/common/page.json.uce
@@ -5,10 +5,8 @@ COMPONENT(Request& context)
starter_boot(context);
context.header["Content-Type"] = "application/json";
context.header["Cache-Control"] = "no-cache, no-store, must-revalidate";
- if(context.call["json"].get_type_name() == "array")
- print(json_encode(context.call["json"]));
- else if(context.var["starter"]["json"].get_type_name() == "array")
- print(json_encode(context.var["starter"]["json"]));
+ if(context.props["json"].get_type_name() == "array")
+ print(json_encode(context.props["json"]));
else
print(starter_page_main_html(context));
}
diff --git a/site/info/themes/dark/css/style.css b/site/info/themes/dark/css/style.css
deleted file mode 100755
index 0b45533..0000000
--- a/site/info/themes/dark/css/style.css
+++ /dev/null
@@ -1,516 +0,0 @@
-:root {
- /* Dark theme color palette */
- --bg-color: #0f172a;
- --bg-secondary: #1e293b;
- --bg-gradient: linear-gradient(135deg, #1e3a8a 0%, #3730a3 100%);
- --surface: #1e293b;
- --surface-elevated: #334155;
- --surface-hover: #475569;
- --primary: #60a5fa;
- --primary-dark: #3b82f6;
- --primary-light: #93c5fd;
- --secondary: #a78bfa;
- --accent: #22d3ee;
- --text-primary: #f1f5f9;
- --text-secondary: #cbd5e1;
- --text-muted: #94a3b8;
- --border: #334155;
- --border-hover: #475569;
- --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
- --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
- --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
- --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.5), 0 10px 10px -5px rgba(0, 0, 0, 0.4);
- --radius: 8px;
- --radius-md: 8px;
- --radius-lg: 12px;
- --radius-xl: 16px;
- --radius-sm: 4px;
-
- /* Dark theme specific variables */
- --glass-bg: rgba(30, 41, 59, 0.8);
- --glass-border: rgba(148, 163, 184, 0.1);
- --overlay: rgba(0, 0, 0, 0.6);
- --success: #10b981;
- --success-bg: rgba(16, 185, 129, 0.1);
- --success-border: rgba(16, 185, 129, 0.3);
- --success-text: #10b981;
- --warning: #f59e0b;
- --warning-bg: rgba(245, 158, 11, 0.1);
- --warning-border: rgba(245, 158, 11, 0.3);
- --warning-text: #f59e0b;
- --error: #ef4444;
- --error-bg: rgba(239, 68, 68, 0.1);
- --error-border: rgba(239, 68, 68, 0.3);
- --error-text: #ef4444;
- --info: #3b82f6;
- --info-bg: rgba(59, 130, 246, 0.1);
- --info-border: rgba(59, 130, 246, 0.3);
- --info-text: #3b82f6;
-}
-
-* {
- margin: 0;
- padding: 0;
- box-sizing: border-box;
-}
-
-html {
- font-size: 16px;
- scroll-behavior: smooth;
-}
-
-body {
- font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
- font-size: 1rem;
- font-weight: 400;
- line-height: 1.6;
- color: var(--text-primary);
- background: var(--bg-color);
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
-}
-
-/* Links */
-a {
- color: var(--primary);
- text-decoration: none;
- transition: all 0.2s ease;
-}
-
-a:hover {
- color: var(--primary-light);
- text-decoration: underline;
-}
-
-/* Modern Navigation */
-nav {
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- z-index: 1000;
- background: var(--glass-bg);
- backdrop-filter: blur(20px);
- -webkit-backdrop-filter: blur(20px);
- border-bottom: 1px solid var(--border);
- padding: 0 1rem;
- display: flex;
- align-items: center;
- box-shadow: var(--shadow-sm);
- transition: all 0.3s ease;
-}
-
-nav > a,
-.nav-menu a {
- display: inline-flex;
- align-items: center;
- padding: 0.625rem 1rem;
- color: var(--text-primary);
- text-decoration: none;
- font-weight: 500;
- transition: all 0.2s ease;
- position: relative;
- border-radius: var(--radius);
- margin: 0.35rem 0.15rem;
-}
-
-nav > a:first-child,
-.nav-menu > a:first-child {
- font-weight: 700;
- color: var(--primary);
- padding-left: 1.25rem;
- padding-right: 1.25rem;
-}
-
-nav > a:hover,
-.nav-menu a:hover {
- background: var(--surface-hover);
- color: var(--primary);
- text-decoration: none;
-}
-
-nav > a::after,
-.nav-menu a::after {
- content: '';
- position: absolute;
- bottom: 0;
- left: 50%;
- width: 0;
- height: 2px;
- background: var(--primary);
- transition: all 0.3s ease;
- transform: translateX(-50%);
-}
-
-nav > a:hover::after,
-.nav-menu a:hover::after {
- width: 60%;
-}
-
-/* Account area inside the nav */
-.nav-menu {
- display: flex;
- align-items: center;
- gap: 0.25rem;
-}
-
-.nav-account {
- margin-left: auto;
- display: flex;
- align-items: center;
- gap: 0.5rem;
-}
-
-nav.nav-scrolled {
- background: rgba(30, 41, 59, 0.95) !important;
- backdrop-filter: blur(20px) !important;
- -webkit-backdrop-filter: blur(20px) !important;
- box-shadow: var(--shadow-md) !important;
-}
-
-#content {
- margin-top: 5rem;
- min-height: calc(100vh - 10rem);
- padding: 2rem 1rem;
- max-width: 1200px;
- margin-left: auto;
- margin-right: auto;
-}
-
-/* Typography */
-h1, h2, h3, h4, h5, h6 {
- font-weight: 700;
- line-height: 1.2;
- margin-bottom: 1rem;
- color: var(--text-primary);
-}
-
-h1 {
- font-size: 2rem;
- position: relative;
- padding-bottom: 0.75rem;
- margin-bottom: 1.25rem;
-}
-
-h1::before {
- content: '';
- position: absolute;
- bottom: 0;
- left: 0;
- width: 60px;
- height: 3px;
- background: var(--bg-gradient);
- border-radius: 3px;
-}
-
-h2 {
- font-size: 2rem;
-}
-
-h3 {
- font-size: 1.5rem;
-}
-
-/* Modern Cards/Blocks */
-#content > div:not(.ws-app), .block, .card {
- background: var(--surface);
- border: 1px solid var(--border);
- border-radius: var(--radius-lg);
- padding: 1.75rem;
- margin-bottom: 1.5rem;
- box-shadow: var(--shadow-sm);
- transition: border-color 0.25s ease, box-shadow 0.25s ease;
-}
-
-#content > div:not(.ws-app):hover, .block:hover, .card:hover {
- box-shadow: var(--shadow-md);
- border-color: var(--border-hover);
-}
-
-/* Modern Forms */
-form {
- max-width: 600px;
- margin: 0 auto;
-}
-
-form > div {
- display: flex;
- flex-direction: column;
- margin-bottom: 1.5rem;
- gap: 0.5rem;
-}
-
-form > div > label {
- font-weight: 500;
- color: var(--text-secondary);
- font-size: 0.875rem;
- text-transform: uppercase;
- letter-spacing: 0.05em;
- transition: all 0.2s ease;
-}
-
-form > div > input, form > div > textarea, form > div > select {
- padding: 0.75rem 1rem;
- border: 2px solid var(--border);
- border-radius: var(--radius);
- background: var(--bg-secondary);
- color: var(--text-primary);
- font-size: 1rem;
- transition: all 0.2s ease;
-}
-
-form > div > input:focus, form > div > textarea:focus, form > div > select:focus {
- outline: none;
- border-color: var(--primary);
- box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.2);
- background: var(--surface);
-}
-
-/* Enhanced form validation states */
-form > div > input.valid, form > div > textarea.valid {
- border-color: var(--success);
- box-shadow: 0 0 0 3px var(--success-bg);
-}
-
-form > div > input.invalid, form > div > textarea.invalid {
- border-color: var(--error);
- box-shadow: 0 0 0 3px var(--error-bg);
-}
-
-/* Floating label effect */
-form > div.focused > label {
- transform: translateY(-0.5rem) scale(0.85);
- color: var(--primary);
-}
-
-/* Modern Buttons */
-button, .btn, form > div > input[type=submit], input[type="submit"] {
- display: inline-flex;
- align-items: center;
- justify-content: center;
- padding: 0.75rem 1.5rem;
- background: var(--primary);
- color: var(--bg-color);
- border: none;
- border-radius: var(--radius);
- font-weight: 500;
- font-size: 1rem;
- cursor: pointer;
- transition: all 0.2s ease;
- text-decoration: none;
- position: relative;
- overflow: hidden;
-}
-
-button:hover, .btn:hover, form > div > input[type=submit]:hover, input[type="submit"]:hover {
- background: var(--primary-dark);
- transform: translateY(-1px);
- box-shadow: var(--shadow-lg);
-}
-
-button:active, .btn:active {
- transform: translateY(0);
-}
-
-input[type="range"] {
- width: 100%;
- height: 6px;
- background: var(--bg-color);
- outline: none;
- border-radius: 3px;
- -webkit-appearance: none;
- appearance: none;
-}
-
-input[type="range"]::-webkit-slider-thumb {
- -webkit-appearance: none;
- appearance: none;
- width: 20px;
- height: 20px;
- background: var(--primary);
- cursor: pointer;
- border-radius: 50%;
- box-shadow: var(--shadow-sm);
-}
-
-input[type="range"]::-moz-range-thumb {
- width: 20px;
- height: 20px;
- background: var(--primary);
- cursor: pointer;
- border-radius: 50%;
- border: none;
- box-shadow: var(--shadow-sm);
-}
-
-/* Button variants */
-.btn-secondary {
- background: var(--secondary);
-}
-
-.btn-secondary:hover {
- background: #8b5cf6;
-}
-
-.btn-outline {
- background: transparent;
- color: var(--primary);
- border: 2px solid var(--primary);
-}
-
-.btn-outline:hover {
- background: var(--primary);
- color: var(--bg-color);
-}
-
-.btn-large {
- padding: 1rem 2rem;
- font-size: 1.125rem;
-}
-
-/* Utility Classes */
-.banner {
- padding: 1rem 1.5rem;
- background: var(--surface);
- border: 1px solid var(--border);
- border-radius: var(--radius);
- margin-bottom: 1rem;
-}
-
-.banner.success {
- background: var(--success-bg);
- border-color: var(--success-border);
- color: var(--success);
-}
-
-.banner.warning {
- background: var(--warning-bg);
- border-color: var(--warning-border);
- color: var(--warning);
-}
-
-.banner.error {
- background: var(--error-bg);
- border-color: var(--error-border);
- color: var(--error);
-}
-
-.error {
- color: var(--error);
-}
-
-/* Footer */
-footer {
- text-align: center;
- color: var(--text-muted);
- padding: 2rem 1rem;
- margin-top: 4rem;
- border-top: 1px solid var(--border);
- background: var(--surface);
-}
-
-/* Mobile Responsive Design */
-@media (max-width: 768px) {
- nav {
- padding: 0 0.5rem;
- overflow-x: auto;
- white-space: nowrap;
- scrollbar-width: none;
- -ms-overflow-style: none;
- }
-
- nav::-webkit-scrollbar {
- display: none;
- }
-
- nav > a {
- padding: 0.75rem 1rem;
- margin: 0.25rem 0.125rem;
- font-size: 0.875rem;
- display: inline-flex;
- flex-shrink: 0;
- }
-
- #content {
- margin-top: 4rem;
- padding: 1rem 0.5rem;
- }
-
- h1 {
- font-size: 1.875rem;
- padding: 1.5rem;
- }
-
- #content > div, .block, .card {
- padding: 1.5rem;
- margin-bottom: 1rem;
- }
-
- form > div {
- margin-bottom: 1rem;
- }
-
- button, .btn {
- padding: 0.875rem 1.25rem;
- font-size: 0.9rem;
- }
-}
-
-@media (max-width: 480px) {
- nav > a {
- padding: 0.5rem 0.75rem;
- font-size: 0.8rem;
- }
-
- #content {
- padding: 1rem 0.25rem;
- }
-
- h1 {
- font-size: 1.5rem;
- padding: 1rem;
- }
-
- #content > div, .block, .card {
- padding: 1rem;
- border-radius: var(--radius);
- }
-}
-
-/* Smooth scrolling and improved animations */
-* {
- scroll-behavior: smooth;
-}
-
-/* Loading animation for better perceived performance */
-@keyframes pulse {
- 0%, 100% { opacity: 1; }
- 50% { opacity: 0.5; }
-}
-
-.loading {
- animation: pulse 2s ease-in-out infinite;
-}
-
-/* Focus states for accessibility */
-button:focus, .btn:focus, input:focus, textarea:focus, select:focus {
- outline: 2px solid var(--primary);
- outline-offset: 2px;
-}
-
-/* Print styles */
-@media print {
- nav, footer, .cta-section {
- display: none;
- }
-
- #content {
- margin-top: 0;
- }
-
- * {
- background: white !important;
- color: black !important;
- box-shadow: none !important;
- }
-}
diff --git a/site/info/themes/dark/icon.png b/site/info/themes/dark/icon.png
deleted file mode 100755
index 8a42581..0000000
Binary files a/site/info/themes/dark/icon.png and /dev/null differ
diff --git a/site/info/themes/dark/page.html.uce b/site/info/themes/dark/page.html.uce
deleted file mode 100644
index 8645bb0..0000000
--- a/site/info/themes/dark/page.html.uce
+++ /dev/null
@@ -1,31 +0,0 @@
-#load "../../lib/app.uce"
-
-COMPONENT(Request& context)
-{
- starter_boot(context);
- bool embed_mode = starter_page_embed_mode(context);
- String main_html = starter_page_main_html(context);
-
- DTree nav_props;
- nav_props["account_wrapper_class"] = "nav-account nav-menu";
-
- DTree footer_props;
- footer_props["embed_mode"].set_bool(embed_mode);
-
- <>
-
- ">
-
-
-
- >
-
-
- >
-
-
-
-
-