@social-mail/social-mail-client 1.2.39 → 1.2.40

package/content/templates/plain/index.html

@@ -12,45 +12,48 @@
         </style>
     </head>
     <body>
-        <section>
-            <div
-                styler-layout="floating-nav-bar"
-                styler-background-color="header"
-                styler-color="header"
-                styler-backdrop-filter="blur"
-                styler-box-shadow="default"
-                styler-align-self="stretch">
-                <h1>Social Mail</h1>
-                <div styler-element="navbar">
-                    <input type="checkbox" styler-element="drawer">
-                    <nav>
-                        <a>Home</a>
-                        <a>Features</a>
-                    </nav>
-                </div>
-            </div>
-            <div styler-layout="block" styler-display="flex" styler-flex-direction="column" styler-align-items="center">
-                <div
-                    styler-layout="column"
-                    styler-max-width="rel-size-x-l">Social media features on email, Social Mail. Social Mail consists of
-                    an email server and a client, which lets you communicate with others over email,
-                    however we have incorporated features such as like, comment, follow (subscribe) etc.
-                </div>
-                <div
-                    styler-layout="column"
-                    styler-max-width="rel-size-x-l">Most social networks want you to signup, and they track your every activity,
-                    so does all chat apps. With Social Mail, you don't need to visit anyone's website, nor can they track,
-                    you just send each other emails.
-                </div>
-                <div
-                    styler-layout="column"
-                    styler-max-width="rel-size-x-l">
-                    Like, Comment, Follow ....
-                </div>
-            </div>
-                    <div styler-layout="column">
-                <p>Simple Web Site</p>
+        <div
+            styler-layout="floating-nav-bar"
+            styler-background-color="header"
+            styler-color="header"
+            styler-backdrop-filter="blur"
+            styler-box-shadow="default"
+            styler-colors="primary">
+            <h1>Social Mail</h1>
+            <div styler-element="navbar">
+                <input type="checkbox" styler-element="drawer">
+                <nav>
+                    <a>Home</a>
+                    <a>Features</a>
+                </nav>
             </div>
+        </div>
+        <section styler-layout="card" styler-colors="primary">
+            <h4 styler-element="accent">Demo 1</h4>
+            <section styler-element="surface">This is a demo 2.</section>
+        </section>
+        <section styler-layout="columns-3">
+            <section>
+                <section styler-layout="card" styler-colors="primary">
+                    <h4 styler-element="accent">Address</h4>
+                    <section styler-element="surface">404 Not Found,<div>HTTP/1.1 Protocol</div>
+                    </section>
+                </section>
+            </section>
+            <section>
+                <section styler-layout="card" styler-colors="secondary">
+                    <h4 styler-element="accent">Another Address</h4>
+                    <section styler-element="surface">No where to be found<div>This is another demo.</div>
+                    </section>
+                </section>
+            </section>
+            <section>
+                <section styler-layout="card" styler-colors="tertiary">
+                    <h4 styler-element="accent">Color does not match</h4>
+                    <section styler-element="surface">Something is wrong&nbsp;<div>With this as well</div>
+                    </section>
+                </section>
+            </section>
         </section>
     </body>
 </html>

package/content/templates/plain/styles/vars.css

@@ -0,0 +1,67 @@
+* {
+    --size-tiny: 2px;
+--size-small: 5px;
+--size-smaller: 7px;
+--size-default: 10px;
+--size-larger: 15px;
+--size-large: 20px;
+--rel-size-x-s: 20rem;
+--rel-size-small: 24rem;
+--rel-size-medium: 28rem;
+--rel-size-large: 32rem;
+--rel-size-x-l: 36rem;
+--rel-size2-x-l: 42rem;
+--rel-size3-x-l: 48rem;
+--rel-size4-x-l: 56rem;
+--rel-size5-x-l: 64rem;
+--rel-size6-x-l: 72rem;
+--rel-size7-x-l: 80rem;
+--rel-size-full: 100%;
+--rel-size-prose: 65ch;
+--default-color: canvas;
+--default-text-color: canvastext;
+--border-color: lightgray;
+--header-color: #0571ff30;
+--header-text-color: ;
+--accent-color: blue;
+--accent-text-color: white;
+--note-color: #ffffe0;
+--note-text-color: ;
+--warning-color: #FFC107;
+--warning-text-color: darkgray;
+--selection-color: highlight;
+--selection-text-color: highlightText;
+--hover-color: #A0A0A010;
+--hover-text-color: CanvasText;
+--stop-color: red;
+--stop-text-color: white;
+--go-color: green;
+--go-text-color: white;
+--accept-color: blue;
+--accept-text-color: white;
+--reject-color: red;
+--reject-text-color: white;
+--font-size-small: 0.8125em;
+--command-bg-color: #F0F0F0;
+--menu-bg-color: #808080;
+--menu-color: #F0F0F0;
+--link-color: blue;
+--primary-background: #b372dd50;
+--primary-color: gray;
+--primary-accent: #6145a9c9;
+--primary-accent-text: white;
+--primary-surface: #FFFFFFA0;
+--primary-surface-text: gray;
+--secondary-background: #00808050;
+--secondary-color: gray;
+--secondary-accent: #9ec93ca8;
+--secondary-accent-text: white;
+--secondary-surface: #FFFFFFA0;
+--secondary-surface-text: gray;
+--tertiary-background: #cfa55c87;
+--tertiary-color: gray;
+--tertiary-accent: #e17b42cf;
+--tertiary-accent-text: white;
+--tertiary-surface: #FFFFFFA0;
+--tertiary-surface-text: gray;
+}

package/dist/admin/AdminAppIndex.pack.js

@@ -35426,10 +35426,10 @@ System.register(["tslib", "@web-atoms/core/dist/core/InjectProperty", "@web-atom
 
     AmdLoader.instance.setup("@social-mail/social-mail-client/dist/common/pages/websites/manage/ManageWebSitePage");
 
-System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/view-model/Action", "@web-atoms/core/dist/core/types"], function (_export, _context) {
+System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "@web-atoms/core/dist/core/XNode", "@web-atoms/core/dist/view-model/Action", "@web-atoms/core/dist/core/types", "@web-atoms/core/dist/services/FetchBuilder"], function (_export, _context) {
   "use strict";
 
-  var __awaiter, __decorate, __metadata, PopupWindowPage, XNode, Action, UMD, ChooseWebSiteTemplatePage;
+  var __awaiter, __decorate, __metadata, PopupWindowPage, XNode, Action, UMD, FetchBuilder, ChooseWebSiteTemplatePage;
   _export("default", void 0);
   return {
     setters: [function (_tslib) {
@@ -35444,6 +35444,8 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
       Action = _webAtomsCoreDistViewModelAction.default;
     }, function (_webAtomsCoreDistCoreTypes) {
       UMD = _webAtomsCoreDistCoreTypes.UMD;
+    }, function (_webAtomsCoreDistServicesFetchBuilder) {
+      FetchBuilder = _webAtomsCoreDistServicesFetchBuilder.default;
     }],
     execute: function () {
       _export("default", ChooseWebSiteTemplatePage = class ChooseWebSiteTemplatePage extends PopupWindowPage {
@@ -35457,14 +35459,15 @@ System.register(["tslib", "@web-atoms/web-controls/dist/mobile-app/MobileApp", "
         }
         createTemplate() {
           return __awaiter(this, void 0, void 0, function* () {
-            const path = UMD.resolvePath("@social-mail/social-mail-client/content/templates/plain/index.html");
-            const rs = yield fetch(path);
-            const text = yield rs.text();
-            yield this.upload("index.html", text);
+            const template = "plain";
+            yield this.upload("index.html", template);
+            yield this.upload("styles/vars.css", template);
           });
         }
-        upload(fileName, content) {
+        upload(fileName, template) {
           return __awaiter(this, void 0, void 0, function* () {
+            const path = UMD.resolvePath(`@social-mail/social-mail-client/content/templates/${template}/${fileName}`);
+            const content = yield FetchBuilder.get(path).responseAsText();
             const url = `/api/upload?parentID=${this.parameters.appFileID}`;
             const body = new FormData();
             body.append(fileName, new Blob([content], {