@social-mail/social-mail-hosted-web 1.2.18 → 1.2.21

package/src/pages/home/HomePage.local.less

@@ -0,0 +1,77 @@
+.social-mail-site-home-page {
+    & > [data-page-element=title], & > [data-page-element=icon], & > [data-page-element=action-bar] {
+        display: none;
+    }
+
+    & .center {
+        text-align: center;
+    }
+
+    & .heading {
+        font-size: 2em;
+        text-align: center;
+    }
+
+    & .spacer {
+        width: 1px;
+        height: 50px;
+    }
+
+    & .space {
+        padding: 30px;
+        margin: 50px;
+        display: flex;
+        gap: 30px;
+        flex-direction: column;
+    }
+
+    & .description {
+        font-size: 1.2em;
+    }
+
+    & .feature-list {
+        display: flex;
+        flex-direction: column;
+        gap: 20px;
+        padding: 10px;
+        align-items: stretch;
+        & > div {
+            display: flex;
+            flex-direction: row;
+            gap: 20px;
+            align-items: center;
+            font-size: 1.3em;
+            & > i {
+                min-width: 40px;
+                text-align: center;
+                color: #ff98ff;
+                font-size: 1.4em;
+            }
+        }
+    }
+
+    & .table {
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-evenly;
+        & > .box {
+            padding: 20px;
+            margin: 10px;
+            & > header {
+                margin:-20px;
+                padding: 20px;
+                margin-bottom: 0;
+            }
+            & > div {
+                font-size: 0.8em;
+            }
+            & i {
+                min-width: 30px;
+            }
+        }
+        & > * {
+            width: 270px;
+        }
+    }
+
+}

package/src/pages/home/HomePage.tsx

@@ -1,99 +1,20 @@
 import XNode from "@web-atoms/core/dist/core/XNode";
 import { UMD } from "@web-atoms/core/dist/core/types";
-import styled from "@web-atoms/core/dist/style/styled";
 import { ContentPage } from "@web-atoms/web-controls/dist/mobile-app/MobileApp";
-import AppCommands from "../../commands/AppCommands";
 import AppBar from "../../controls/basic/AppBar";
 import Spacer from "../../controls/basic/Spacer";
-import Box from "../../controls/basic/Box";
 import SubHeading from "../../controls/basic/SubHeading";
 import FeatureList, { Feature } from "../../controls/basic/FeatureList";
 import PriceGrid from "../../controls/basic/PriceGrid";
 import { ContentFolder } from "../../common/ContentFolder";
 import Banner from "../../controls/basic/Banner";
 import Heading from "../../controls/basic/Heading";
+import "./HomePage.local.less";
 
 const logo = UMD.resolvePath("@social-mail/social-mail-hosted-web/images/logo-plain.svg");
 
 
-const css = styled.css `
-
-    & > [data-page-element=title], & > [data-page-element=icon], & > [data-page-element=action-bar] {
-        display: none;
-    }
-
-    & .center {
-        text-align: center;
-    }
-
-    & .heading {
-        font-size: 2em;
-        text-align: center;
-    }
-
-    & .spacer {
-        width: 1px;
-        height: 50px;
-    }
-
-    & .space {
-        padding: 30px;
-        margin: 50px;
-        display: flex;
-        gap: 30px;
-        flex-direction: column;
-    }
-
-    & .description {
-        font-size: 1.2em;
-    }
-
-    & .feature-list {
-        display: flex;
-        flex-direction: column;
-        gap: 20px;
-        padding: 10px;
-        align-items: stretch;
-        & > div {
-            display: flex;
-            flex-direction: row;
-            gap: 20px;
-            align-items: center;
-            font-size: 1.3em;
-            & > i {
-                min-width: 40px;
-                text-align: center;
-                color: #ff98ff;
-                font-size: 1.4em;
-            }
-        }
-    }
-
-    & .table {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: space-evenly;
-        & > .box {
-            padding: 20px;
-            margin: 10px;
-            & > header {
-                margin:-20px;
-                padding: 20px;
-                margin-bottom: 0;
-            }
-            & > div {
-                font-size: 0.8em;
-            }
-            & i {
-                min-width: 30px;
-            }
-        }
-        & > * {
-            width: 270px;
-        }
-    }
-
-`.installLocal();
+const css = "social-mail-site-home-page";
 
 export default class HomePage extends ContentPage {
 

package/src/pages/terms/Terms.local.less

@@ -0,0 +1,13 @@
+.social-mail-site-terms {
+    white-space: break-spaces;
+    overflow-x: hidden;
+    background-color: white;
+    color: black;
+    padding: 10px;
+    border-radius: 10px;
+    opacity: 0.75;
+    & pre {
+        overflow-x: hidden;
+        white-space: break-spaces;
+    }
+}

package/src/pages/terms/Terms.tsx

@@ -1,19 +1,6 @@
 import XNode from "@web-atoms/core/dist/core/XNode";
-import styled from "@web-atoms/core/dist/style/styled";
-
-const css = styled.css `
-    white-space: break-spaces;
-    overflow-x: hidden;
-    background-color: white;
-    color: black;
-    padding: 10px;
-    border-radius: 10px;
-    opacity: 0.75;
-    & pre {
-        overflow-x: hidden;
-        white-space: break-spaces;
-    }
-`.installLocal();
+import "./Terms.local.less";
+const css = "social-mail-site-terms";
 
 export default function Terms() {
     return <div class={css}>
@@ -21,7 +8,7 @@ export default function Terms() {
         <pre>
 
             <h4>YOUR CONTENT</h4>
-            <p>Allthough, your emails are private to you and from our perspective, since you are hosting your private information on our server (servers that are part of Social Mail Network).
+            <p>All though, your emails are private to you and from our perspective, since you are hosting your private information on our server (servers that are part of Social Mail Network).
                 These terms are applicable to the user as we are liable for the content hosted on our network. These terms are not applicable for self hosted servers, you can
                 purchase Social Mail License and everything is private within your control.
             </p>
@@ -29,7 +16,7 @@ export default function Terms() {
             <h4>ACCESSING SITE</h4>
             <p>Some information on the Site can be viewed by all visitors to our Site, without registration. If you wish to access specific Services, you must register and set up a profile.</p>
 
-            <h4>ACCOUNT INTERGRITY AND AUTHENTIC IDENTITY</h4>
+            <h4>ACCOUNT INTEGRITY AND AUTHENTIC IDENTITY</h4>
             <p>We may seek further information about an account in certain circumstances, as outlined below, before taking actions ranging from temporarily restricting accounts to permanently disabling them.
                 <ol type="a">
                     <li>The accounts misrepresented their identity in the following ways:</li>

package/src/pages/users/signup/SignupPage.local.less

@@ -0,0 +1,30 @@
+.social-mail-site-sign-up-page {
+    & [data-page-element=content] {
+        & > * {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            justify-items: center;
+            & > * {
+                padding: 10px;
+                border-radius: 10px;
+                border: solid 1px white;
+                background: #00000050;
+                & input {
+                    background: transparent;
+                    border: none;
+                    outline: none;
+                    border-bottom: solid 1px white;
+                    &:focus {
+                        border-bottom: solid 1px white;
+                    }
+                }
+                & [data-suggestion-popup=suggestion-popup] {
+                    & input {
+                        color: black;
+                    }
+                }
+            }
+        }
+    }
+}

package/src/pages/users/signup/SignupPage.tsx

@@ -6,43 +6,14 @@ import { CountrySelect, formatForCountry, isdForCountry } from "../../../control
 import MaskedInput from "@web-atoms/web-controls/dist/basic/MaskedInput";
 import FetchBuilder from "@web-atoms/core/dist/services/FetchBuilder";
 import Action from "@web-atoms/core/dist/view-model/Action";
-import styled from "@web-atoms/core/dist/style/styled";
-import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl";
 import Pack from "@web-atoms/core/dist/Pack";
 import { ContentPage } from "@web-atoms/web-controls/dist/mobile-app/MobileApp";
 import PageNavigator from "@web-atoms/web-controls/dist/PageNavigator";
 import TermsPage from "../../terms/TermsPage";
 
-const css = styled.css `
-    & [data-page-element=content] {
-        & > * {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            justify-items: center;
-            & > * {
-                padding: 10px;
-                border-radius: 10px;
-                border: solid 1px white;
-                background: #00000050;
-                & input {
-                    background: transparent;
-                    border: none;
-                    outline: none;
-                    border-bottom: solid 1px white;
-                    &:focus {
-                        border-bottom: solid 1px white;
-                    }
-                }
-                & [data-suggestion-popup=suggestion-popup] {
-                    & input {
-                        color: black;
-                    }
-                }
-            }
-        }
-    }
-`.installLocal();
+import "./SignupPage.local.less";
+
+const css = "social-mail-site-sign-up-page";
 
 interface IVerification {
     id?: string;
@@ -89,7 +60,7 @@ export default class SignupPage extends ContentPage {
 
         this.title = "Social Mail Signup";
 
-        const { id } = await FetchBuilder.put("/api/users/captcha").responseAsJson<{ id }>();
+        const { id } = await FetchBuilder.put("/api/users/captcha").asJson<{ id }>();
 
         this.model.captcha.id = id;
 
@@ -206,7 +177,7 @@ export default class SignupPage extends ContentPage {
             captcha = {} as IVerification
         } = await FetchBuilder.post("/api/users/signup")
             .jsonBody(model)
-            .responseAsJson<any>();
+            .asJson<any>();
 
         if (userID) {
             location.href = "/";

package/src/style/GlobalStyle.global.less

@@ -0,0 +1,97 @@
+:root {
+    --primary-color: #294D4A;
+    --accent-color: #ff6733;
+    --accent2-color: #ff673375;
+    --lighter-accent-color: #e6e6fa60;
+    --light-accent-color: #f2e5fa;
+    --accent-text-color: white;
+    --background-color: #f1f1f160;  
+    --window-background: #50505025;  
+    --media-bg-color: #9F33FF0F;
+    --font-size-small: 0.8125em;
+
+    --hover-color: #b8b88b20;
+    --hover-text-color: CanvasText;
+    --selection-color: #b8b88b60;
+    --selection-text-color: CanvasText;
+    --spacing: 10px;
+    --spacing-medium: 15px;
+    --spacing-large: 20px;
+}
+
+html, body {
+    margin:0;
+    color-scheme: dark;
+}
+
+* {
+    scrollbar-width: 5px;
+    scrollbar-color: var(--accent-color) white;
+
+    &::-webkit-scrollbar {
+        width: 5px;
+    }
+    &::-webkit-scrollbar-track {
+    background: white;
+    }
+    &::-webkit-scrollbar-thumb {
+        background-color: white;
+        border-radius: 20px;
+        border: 3px solid var(--accent-color);
+    }
+}
+
+body {
+
+    background-image: url("../../images/bg.png");
+    background-attachment: scroll, local;
+    background-repeat: repeat;
+    background-clip: border-box;
+    background-image: linear-gradient(19deg, #000000 45%, #B721FF 100%);
+    font-family: trebuchet ms, "Source Sans Pro";
+    font-size: 16px;
+    width: 100vw;
+
+    & * {
+        font-family: trebuchet ms, "Source Sans Pro";
+        box-sizing: border-box;
+    }
+
+    &::placeholder {
+        font-size: smaller;
+    }
+
+    & ul {
+        padding-inline-start: 15px;
+    }
+
+    & input[type=search] {
+        border: none;
+        outline: none;
+        border-radius: 9999px;
+        padding-right: 10px;
+        padding-left: 25px;
+        background: canvas url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat 5px center;
+    }
+}
+
+[data-popup-window=popup-window] {
+    background-color: #FFFFFF20;
+    backdrop-filter: blur(11px) saturate(180%);
+}
+
+[data-layout=command-row] {
+    background-color: #FFFFFF20;
+}
+
+div[data-desktop-app=desktop-app] {
+    width: 100vw;
+}
+
+div[data-base-page] {
+    & > [data-page-element=action-bar] {
+        background-color: #000000;
+        background-image: linear-gradient(19deg, #000000 0%, #B721FF 100%);
+
+    }
+}

package/src/style/GlobalStyle.ts

@@ -3,13 +3,12 @@ import { UMD } from "@web-atoms/core/dist/core/types";
 
 import "@web-atoms/core/dist/core/AtomList";
 
-import "./OverrideAppStyle";
-
 export const ___UMD = UMD;
 
-import styled from "@web-atoms/core/dist/style/styled";
 import "@web-atoms/data-styles/data-styles";
 
+import "./GlobalStyle.global.less";
+
 const bg = UMD.resolvePath("@social-mail/social-mail-hosted-web/images/bg.png");
 
 // Add Font awesome
@@ -32,86 +31,6 @@ function addLinkTag(href, integrity?, rel = "stylesheet") {
 }
 
 addLinkTag("https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap");
-addLinkTag("https://npm-git.azureedge.net/npm/package/@c8private/fa-icons@6.4.2/css/all.min.css");
+addLinkTag("https://dtzkc6yot8xw8.cloudfront.net/npm/package/@c8private/fa-icons@6.7.1/css/all.min.css");
 addLinkTag("https://cdn.jsdelivr.net/npm/file-icon-vectors@1.0.0/dist/file-icon-vivid.min.css");
 
-    styled.css `
-
-:root {
-    --primary-color: #294D4A;
-    --accent-color: #ff6733;
-    --accent2-color: #ff673375;
-    --lighter-accent-color: #e6e6fa60;
-    --light-accent-color: #f2e5fa;
-    --accent-text-color: white;
-    --background-color: #f1f1f160;  
-    --window-background: #50505025;  
-    --media-bg-color: #9F33FF0F;
-    --font-size-small: 0.8125em;
-
-    --hover-color: #b8b88b20;
-    --hover-text-color: CanvasText;
-    --selection-color: #b8b88b60;
-    --selection-text-color: CanvasText;
-    --spacing: 10px;
-    --spacing-medium: 15px;
-    --spacing-large: 20px;
-}
-
-html, body {
-    margin:0;
-    color-scheme: dark;
-}
-
-* {
-    scrollbar-width: 5px;
-    scrollbar-color: var(--accent-color) white;
-
-    &::-webkit-scrollbar {
-        width: 5px;
-    }
-    &::-webkit-scrollbar-track {
-    background: white;
-    }
-    &::-webkit-scrollbar-thumb {
-        background-color: white;
-        border-radius: 20px;
-        border: 3px solid var(--accent-color);
-    }
-}
-
-body {
-
-    background-image: url("${bg}");
-    background-attachment: scroll, local;
-    background-repeat: repeat;
-    background-clip: border-box;
-    background-image: linear-gradient(19deg, #000000 45%, #B721FF 100%);
-    font-family: trebuchet ms, "Source Sans Pro";
-    font-size: 16px;
-    width: 100vw;
-
-    & * {
-        font-family: trebuchet ms, "Source Sans Pro";
-        box-sizing: border-box;
-    }
-
-    &::placeholder {
-        font-size: smaller;
-    }
-
-    & ul {
-        padding-inline-start: 15px;
-    }
-
-    & input[type=search] {
-        border: none;
-        outline: none;
-        border-radius: 9999px;
-        padding-right: 10px;
-        padding-left: 25px;
-        background: canvas url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat 5px center;
-    }
-}
-
-`.withId("global-styles").withOrder("medium").installGlobal();

package/dist/style/OverrideAppStyle.js

@@ -1,43 +0,0 @@
-System.register(["@web-atoms/core/dist/style/styled"], function (_export, _context) {
-  "use strict";
-
-  var styled;
-  return {
-    setters: [function (_webAtomsCoreDistStyleStyled) {
-      styled = _webAtomsCoreDistStyleStyled.default;
-    }],
-    execute: function () {
-      styled.css`
-
-    [data-popup-window=popup-window] {
-        background-color: #FFFFFF20;
-        backdrop-filter: blur(11px) saturate(180%);
-    }
-
-    [data-layout=command-row] {
-        background-color: #FFFFFF20;
-    }
-
-    div[data-desktop-app=desktop-app] {
-        width: 100vw;
-    }
-
-    div[data-base-page] {
-        & > [data-page-element=action-bar] {
-            background-color: #000000;
-            background-image: linear-gradient(19deg, #000000 0%, #B721FF 100%);
-
-        }
-    }
-
-    /* div[data-base-page=base-page] {
-        & > [data-page-element=title] {
-            overflow-y: visible;
-        }
-    } */
-
-`.withId("default-app-style").withOrder("medium").installGlobal();
-    }
-  };
-});
-//# sourceMappingURL=OverrideAppStyle.js.map

package/dist/style/OverrideAppStyle.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["styled","_webAtomsCoreDistStyleStyled","default","execute","css","withId","withOrder","installGlobal"],"sources":["../../src/style/OverrideAppStyle.ts"],"sourcesContent":[null],"mappings":";;;;;;MAAOA,MAAM,GAAAC,4BAAA,CAAAC,OAAA;IAAA;IAAAC,OAAA,WAAAA,CAAA;MAETH,MAAM,CAACI,GAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6Bd,CAACC,MAAM,CAAC,mBAAmB,CAAC,CAACC,SAAS,CAAC,QAAQ,CAAC,CAACC,aAAa,EAAE;IAAC;EAAA;AAAA","ignoreList":[]}

package/node_modules/@web-atoms/font-awesome/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2020 Web Atoms
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/node_modules/@web-atoms/font-awesome/README.md

@@ -1,2 +0,0 @@
-# font-awesome
-Font awesome Unicode set for use in WebAtoms