Skip to Content

Changes for page DEMO server

Last modified by Iaroslav Platonov on 2026/06/09 11:30
From version 7.1
edited by Lana
on 2026/02/18 09:19
Change comment: There is no comment for this version
To version 20.1
edited by Iaroslav Platonov
on 2026/06/09 11:30
Change comment: There is no comment for this version

Summary

Details

Page properties
Author
... ... @@ -1,1 +1,1 @@
1 -XWiki.Lana
1 +XWiki.Iaroslav
Content
... ... @@ -1,14 +1,137 @@
1 -This section documents the configuration and structure of the CENTO demo server environments.
1 +{{html clean="false"}}
2 +<style>
3 +/* Hub page — CENTO design system */
4 +.hub-wrap { font-family:inherit; max-width:860px; }
2 2  
3 -It describes the available dashboards, system layouts, and configured scenarios used to demonstrate platform functionality. Each page defines the configuration parameters, metering setup, reporting logic, events, and control elements implemented in the corresponding demo environment.
6 +/* Header */
7 +.hub-head { padding:32px 0 24px 0; border-bottom:1px solid #E8E8E8; margin-bottom:32px; }
8 +.hub-head p { font-size:.95em; color:#555; margin:0; line-height:1.65; max-width:680px; }
4 4  
5 -[[image:Screenshot 2026-02-18 at 05.33.32.png||height="669" width="1456"]]
10 +/* About block */
11 +.hub-about {
12 + background:#f5f5f5; border:1px solid #E8E8E8; border-radius:8px;
13 + padding:18px 22px; margin-bottom:32px;
14 + font-size:.9em; line-height:1.7; color:#333;
15 +}
16 +.hub-about ul { margin:8px 0 0 0; padding-left:20px; }
17 +.hub-about li { margin-bottom:4px; }
6 6  
7 -{{box style="background:#BADCFD;border-radius:16px;padding:20px;"}}
8 -=== DEMO server ===
9 -{{children reference="DEMO server" depth="1"/}}
10 -{{/box}}
11 -)))
12 - (((
13 - )))
14 -
19 +/* Section label */
20 +.hub-section-label {
21 + font-size:.72em; font-weight:700; text-transform:uppercase;
22 + letter-spacing:.08em; color:#888;
23 + margin:0 0 14px 0; padding-bottom:8px;
24 + border-bottom:2px solid #E8E8E8;
25 +}
26 +
27 +/* Demo card */
28 +.demo-card {
29 + border:1px solid #E8E8E8; border-radius:8px;
30 + overflow:hidden; margin-bottom:12px;
31 + transition:border-color .15s, box-shadow .15s;
32 +}
33 +.demo-card:hover {
34 + border-color:#b3d4ee;
35 + box-shadow:0 2px 10px rgba(0,90,180,.10);
36 +}
37 +.demo-card-head {
38 + display:flex; align-items:center; gap:16px;
39 + padding:16px 20px; background:#fff;
40 +}
41 +.demo-icon {
42 + width:42px; height:42px; border-radius:8px;
43 + background:#deeaf7; display:flex; align-items:center; justify-content:center;
44 + flex-shrink:0;
45 +}
46 +.demo-icon svg { color:#005AB4; }
47 +.demo-card-title { font-size:1em; font-weight:700; color:#005AB4; margin:0 0 3px 0; }
48 +.demo-card-desc { font-size:.83em; color:#555; margin:0; line-height:1.5; }
49 +.demo-card-body {
50 + border-top:1px solid #E8E8E8;
51 + padding:14px 20px;
52 + background:#fafbff;
53 +}
54 +.demo-tag-row { display:flex; flex-wrap:wrap; gap:6px; }
55 +.demo-tag {
56 + font-size:.7em; font-weight:600; padding:2px 9px;
57 + border-radius:10px; white-space:nowrap;
58 + background:#e1f1f9; color:#003d80; border:1px solid #b3d4ee;
59 +}
60 +.demo-tag.green { background:#dcfce7; color:#15803d; border-color:#86efac; }
61 +.demo-tag.orange { background:#ffedd5; color:#c2410c; border-color:#fdba74; }
62 +.demo-tag.gray { background:#f1f5f9; color:#475569; border-color:#cbd5e1; }
63 +
64 +/* Child pages link */
65 +.demo-card-link {
66 + display:flex; align-items:center; gap:8px;
67 + padding:12px 20px; border-top:1px solid #E8E8E8;
68 + background:#f5f5f5; font-size:.82em; color:#555;
69 +}
70 +.demo-card-link a { color:#005AB4; font-weight:600; }
71 +
72 +/* Info callout */
73 +.note-info {
74 + background:#e1f1f9 !important; border:1px solid #b3d4ee !important;
75 + border-left:4px solid #005AB4 !important; border-radius:6px;
76 + padding:12px 16px; margin:24px 0 0 0;
77 +}
78 +.note-hd { font-weight:700; font-size:.85em; display:flex; align-items:center; gap:5px; margin-bottom:5px; color:#003d80 !important; }
79 +.note-body { font-size:.875em; color:#222 !important; line-height:1.65; }
80 +</style>
81 +
82 +<div class="hub-wrap">
83 +
84 + <!-- NOTE: No <h1> — XWiki renders the page title natively -->
85 +
86 + <div class="hub-head">
87 + <p>This section documents the configuration and structure of the CENTO demo server environments. It describes the available dashboards, system layouts, and configured scenarios used to demonstrate platform functionality.</p>
88 + </div>
89 +
90 + <div class="hub-about">
91 + Each page in this section defines the following for the corresponding demo environment:
92 + <ul>
93 + <li>Configuration parameters and system layout</li>
94 + <li>Metering setup and data collection</li>
95 + <li>Reporting logic and flexible report templates</li>
96 + <li>Events, thresholds, and notification rules</li>
97 + <li>Control and remote control elements</li>
98 + </ul>
99 + </div>
100 +
101 + <div class="hub-section-label">Demo environments</div>
102 +
103 + <div class="demo-card">
104 + <div class="demo-card-head">
105 + <div class="demo-icon">
106 + <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
107 + <rect x="2" y="3" width="20" height="14" rx="2"/><path d="M8 21h8M12 17v4"/>
108 + </svg>
109 + </div>
110 + <div>
111 + <p class="demo-card-title">DEMO server</p>
112 + <p class="demo-card-desc">Live demonstration environment showcasing CENTO platform functionality — mimics, monitoring, reports, events, and control.</p>
113 + </div>
114 + </div>
115 + <div class="demo-card-body">
116 + <div class="demo-tag-row">
117 + <span class="demo-tag">Mimic diagrams</span>
118 + <span class="demo-tag">Metering &amp; analysis</span>
119 + <span class="demo-tag">Flexible reports</span>
120 + <span class="demo-tag green">Events &amp; notifications</span>
121 + <span class="demo-tag orange">Remote control</span>
122 + <span class="demo-tag gray">Digital twin</span>
123 + </div>
124 + </div>
125 + <div class="demo-card-link">
126 + &#127760; <a href="https://centosoftware.com/demo/" target="_blank">centosoftware.com/demo</a> &mdash; open the live demo environment
127 + </div>
128 + </div>
129 +
130 + <div class="note-info">
131 + <div class="note-hd"><span>&#8505;</span> Note</div>
132 + <div class="note-body">The demo server is a shared read-only environment intended for evaluation and demonstration purposes. Data is periodically reset. For configuration details of a specific demo scenario, refer to the child pages in this section.</div>
133 + </div>
134 +
135 +</div>
136 +{{/html}}
137 +