update design and apply color theme

docs/arch.md

@@ -8,11 +8,11 @@ DMS3 software runs on network *endpoint nodes* [^1] and consist of thin decentra
 [^3]: network protocol stack enables an endpoint to interact with peer endpoints and access technological capability without compromising personal security and privacy. The peer-to-peer (p2p) network protocol network implements an overlay network over the Internet reducing network threat footprint.
 [^4]: fault tolerant data services unburden greenfield application developers from the complexities of implementing data scaling, reliability, and availability.
 
-|![Architecture Overview](img/dms3-1.jpg) |
+|![Architecture Overview](img/dms3-2.jpg) |
 |:--:|
 | **Fig. 1: Architecture Overview** |
 
-### DApp
+### DApps
 
 DMS3 provides discovery of, and access to, decentralized applications that run on endpoint nodes. Dapp generated data persists on an endpoint node that runs a dapp.
 
@@ -22,17 +22,25 @@ Dapps may communicate with other compatible dapps via a locally running DMS3 API
 
 The DMS3 API provide a layer of isolation to dapps from the affects of changes in the network layer that implement new capabilities.
 
-### Network Protocol Stack
+### Network Protocol Stacks
 
-The network layer consists of two major subsystems, a permission-less decentralized blockchain network for p2p interactions and a centralized permission-ed network for high performance access to scalable information storage and retrieval providing data protection, reliability and availability.
+The network layer consists of several major subsystems. Permission-less decentralized blockchain networks for p2p services and a centralized permission-ed network for data cloud services providing high performance access to scalable information storage, retrieval, protection, reliability, availability, and distribution services.
 
-#### P2P Protocol Network
+#### Financial Blockchain
 
 A blockchain network similar to Ethereum.
 
-#### PBFT Storage and Retrieval
+#### Information Blockchain
 
-Practical Byzantine Fault Tolerant service implementations of Filesystem and Search Engine services. This network provides data hosting services extending personal compute and storage node capacity via centralized network services that protect personal data and privacy without compromising endpoint control over generated data.
+A blockchain network similar to IPFS.
+
+#### Data Cloud Services
+
+Practical Byzantine Fault Tolerant services. This network provides data storage, retrieval, protection, and distribution services extending personal compute and storage node capacity via centralized network services that protect personal data and privacy without compromising endpoint control over generated data.
+
+#### P2P Network
+
+A permission-less peer-to-peer network providing disintermediated services between network nodes, based on LIBP2P used by other projects including Ethereum and IPFS.
 
 ### Network Topology
 

docs/css/theme_extra.css

+/*
+    this style file was created primarily to apply
+    documentation brand color scheme. the standard
+    MkDocs colors are too bright and harsh on my eyes.
+
+    the color scheme is subject to future redesign.
+*/
+a {
+    color: #3b6018 !important;
+}
+
+.btn-neutral {
+    background-color: #9da396 !important;
+    color: #d8e1cf !important;
+    border-color: #c0c7b8 !important;
+
+}
+
+.hljs, code {
+    background-color: #333333 !important;
+    border-color: #555555 !important;
+}
+
+.wy-nav-content-wrap {
+    background-color: #111111 !important;
+}
+
+.wy-nav-side {
+    background: #1e211c !important;
+}
+
+.wy-side-nav-search {
+    background-color: #2b4016 !important;
+    color: yellow !important;
+}
+
+.wy-side-nav-search > a.icon {
+    color: #cdd0cb !important;
+}
+
+.wy-nav-content {
+    /* background: #222222 !important; */
+    background: #1b1c19 !important;
+    /* color: #777777 !important; */
+    color: #a7aca3 !important;
+}
+
+.wy-menu {
+    background-color: #333333 !important;
+    color: #888888 !important;
+}
+
+.wy-menu-vertical ul.tocbase li a {
+    background-color: #2f302e !important;
+    color: #dbeace !important;
+}
+
+/*
+ * Sphinx doesn't have support for section dividers like we do in
+ * MkDocs, this styles the section titles in the nav
+ *
+ * https://github.com/mkdocs/mkdocs/issues/175
+ */
+.wy-menu-vertical span {
+    line-height: 18px;
+    padding: 0.4045em 1.618em;
+    display: block;
+    position: relative;
+    font-size: 90%;
+    color: #838383;
+}
+
+/*
+ * Long navigations run off the bottom of the screen as the nav
+ * area doesn't scroll.
+ *
+ * https://github.com/mkdocs/mkdocs/pull/202
+ *
+ * Builds upon pull 202 https://github.com/mkdocs/mkdocs/pull/202
+ * to make toc scrollbar end before navigations buttons to not be overlapping.
+ */
+.wy-nav-side {
+    height: calc(100% - 45px);
+    overflow-y: auto;
+    min-height: 0;
+}
+
+.rst-versions{
+    border-top: 0;
+    height: 45px;
+}
+
+@media screen and (max-width: 768px) {
+    .wy-nav-side {
+        height: 100%;
+    }
+}
+
+/*
+ * readthedocs theme hides nav items when the window height is
+ * too small to contain them.
+ *
+ * https://github.com/mkdocs/mkdocs/issues/#348
+ */
+.wy-menu-vertical ul {
+  margin-bottom: 2em;
+}
+
+/*
+ * Wrap inline code samples otherwise they shoot of the side and
+ * can't be read at all.
+ *
+ * https://github.com/mkdocs/mkdocs/issues/313
+ * https://github.com/mkdocs/mkdocs/issues/233
+ * https://github.com/mkdocs/mkdocs/issues/834
+ */
+code {
+    white-space: pre-wrap;
+    word-wrap: break-word;
+    padding: 2px 5px;
+}
+
+/**
+ * Make code blocks display as blocks and give them the appropriate
+ * font size and padding.
+ *
+ * https://github.com/mkdocs/mkdocs/issues/855
+ * https://github.com/mkdocs/mkdocs/issues/834
+ * https://github.com/mkdocs/mkdocs/issues/233
+ */
+pre code {
+  white-space: pre;
+  word-wrap: normal;
+  display: block;
+  padding: 12px;
+  font-size: 12px;
+}
+
+/*
+ * Fix link colors when the link text is inline code.
+ *
+ * https://github.com/mkdocs/mkdocs/issues/718
+ */
+a code {
+    color: #2980B9;
+}
+a:hover code {
+    color: #3091d1;
+}
+a:visited code {
+    color: #9B59B6;
+}
+
+/*
+ * The CSS classes from highlight.js seem to clash with the
+ * ReadTheDocs theme causing some code to be incorrectly made
+ * bold and italic.
+ *
+ * https://github.com/mkdocs/mkdocs/issues/411
+ */
+pre .cs, pre .c {
+    font-weight: inherit;
+    font-style: inherit;
+}
+
+/*
+ * Fix some issues with the theme and non-highlighted code
+ * samples. Without and highlighting styles attached the
+ * formatting is broken.
+ *
+ * https://github.com/mkdocs/mkdocs/issues/319
+ */
+.no-highlight {
+  display: block;
+  padding: 0.5em;
+  color: #333;
+}
+
+
+/*
+ * Additions specific to the search functionality provided by MkDocs
+ */
+
+.search-results article {
+    margin-top: 23px;
+    border-top: 1px solid #E1E4E5;
+    padding-top: 24px;
+}
+
+.search-results article:first-child {
+    border-top: none;
+}
+
+form .search-query {
+    width: 100%;
+    border-radius: 50px;
+    padding: 6px 12px;  /* csslint allow: box-model */
+    border-color: #D1D4D5;
+}
+
+.wy-menu-vertical li ul {
+    display: inherit;
+}
+
+/*
+ * Improve inline code blocks within admonitions.
+ *
+ * https://github.com/mkdocs/mkdocs/issues/656
+ */
+ .admonition code {
+  color: #404040;
+  border: 1px solid #c7c9cb;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  background: #f8fbfd;
+  background: rgba(255, 255, 255, 0.7);
+}
+
+/*
+ * Account for wide tables which go off the side.
+ * Override borders to avoid wierdness on narrow tables.
+ *
+ * https://github.com/mkdocs/mkdocs/issues/834
+ * https://github.com/mkdocs/mkdocs/pull/1034
+ */
+.rst-content .section .docutils {
+    width: 100%;
+    overflow: auto;
+    display: block;
+    border: none;
+}
+
+.rst-content dl:not(.docutils) dt {
+    /* border-top: solid 3px #6ab0de; */
+    border-top: solid 3px #416f16;
+    background: none;
+    /* color: #2980B9; */
+    color: #305012;
+}
+
+td, th {
+   border: 1px solid #e1e4e5 !important; /* csslint allow: important */
+   border-collapse: collapse;
+}
+
+/*
+ * readthedocs-nested overrides
+ *
+*/
+
+/* .wy-menu-vertical li ul {
+  display: none
+} */
+
+/* .wy-menu-vertical li.current ul {
+    display: block;
+} */
+
+/*
+ * Pallet 227 - 201 - 175
+ * e3e3e3 c9c9c9 bdbdbd
+ */
+
+.wy-menu-vertical ul.tocbase ul.current {
+    display: block !important;
+}
+
+.wy-menu-vertical ul.tocbase ul.toc-hidden {
+    display: none !important;
+}
+
+.wy-menu-vertical ul.tocbase li a {
+    position: relative;
+    color: #808080;
+    font-size: 14px;
+    font-weight: 400;
+}
+
+.wy-menu-vertical ul.tocbase li.current.with-children > a {
+    color: #333333;
+    font-weight: bold;
+}
+
+.wy-menu-vertical ul.tocbase span.toctree-expand {
+    position: absolute;
+    top: 6px;
+    margin: 0px;
+    padding: 0px;
+    font-size: 12px !important;
+    font-weight: 400;
+    color: #333333;
+}
+
+.wy-menu-vertical ul.tocbase li.toctree-l2 > a > span.toctree-expand {
+    left: 6px;
+}
+.wy-menu-vertical ul.tocbase li.toctree-l3 > a > span.toctree-expand {
+    left: 16px;
+}
+.wy-menu-vertical ul.tocbase li.toctree-l4 > a > span.toctree-expand {
+    left: 26px;
+}
+.wy-menu-vertical ul.tocbase li.toctree-l5 > a > span.toctree-expand {
+    left: 36px;
+}
+
+.wy-menu-vertical ul.tocbase li.navtree.toctree-l1.inactive > a,
+.wy-menu-vertical ul.tocbase li.navtree.toctree-l2.inactive > a {
+    color: #b3b3b3;
+}
+
+/* Selected top-level heading */
+.wy-menu-vertical .navtree li.toctree-l2.current,
+.wy-menu-vertical .navtree li.toctree-l2.current > a {
+    background: #fcfcfc;
+}
+.wy-menu-vertical .navtree li.toctree-l2.current > a,
+.wy-menu-vertical .navtree li.toctree-l2.current > span {
+    color: #404040 !important;
+}
+
+.wy-menu-vertical .navtree li.toctree-l2.current > a {
+    padding: 6px 0 6px 22px;
+    font-weight: bold;
+}
+
+/* Level 2 heading */
+.wy-menu-vertical ul.navtree.subnav-l1 ul.subnav-l2,
+.wy-menu-vertical ul.navtree.subnav-l1 li.toctree-l2.current li.toctree-l3 > a {
+    background: #e3e3e3;
+}
+
+.wy-menu-vertical ul.subnav-l1 ul.subnav-l2,
+.wy-menu-vertical ul.subnav-l1 li.toctree-l2.current li.toctree-l3 > a {
+    background: #c9c9c9;
+}
+
+.wy-menu-vertical ul.tocbase li.toctree-l2.current li.toctree-l3 > a {
+    padding: 6px 0 6px 32px;
+}
+
+/* Level 3 heading */
+.wy-menu-vertical ul.navtree.subnav-l1 li.toctree-l2.current li.toctree-l3.current > a,
+.wy-menu-vertical ul.navtree.subnav-l1 li.toctree-l3.current li.toctree-l4 > a {
+    background: #c9c9c9;
+}
+.wy-menu-vertical ul.subnav-l1 li.toctree-l2.current li.toctree-l3.current > a,
+.wy-menu-vertical ul.subnav-l1 li.toctree-l3.current li.toctree-l4 > a {
+    background: #bdbdbd;
+}
+.wy-menu-vertical li.toctree-l3.current li.toctree-l4 > a {
+    padding: 6px 0 6px 42px;
+}
+
+/* Level 4 heading */
+.wy-menu-vertical ul.tocbase li.toctree-l3.current li.toctree-l4.current > a,
+.wy-menu-vertical li.toctree-l4.current li.toctree-l5 > a {
+    background: #bdbdbd;
+}
+.wy-menu-vertical li.toctree-l4.current li.toctree-l5 > a {
+    padding: 6px 0 6px 52px;
+}
+
+.wy-menu-vertical ul.navtree.subnav-l1 li.toctree-l2.current li.toctree-l3 > a:hover,
+.wy-menu-vertical ul.subnav-l1 li.toctree-l2.current li.toctree-l3 > a:hover,
+.wy-menu-vertical ul.navtree.subnav-l1 li.toctree-l2.current li.toctree-l3.current > a:hover,
+.wy-menu-vertical ul.tocbase li.toctree-l4 > a:hover,
+.wy-menu-vertical ul.tocbase li.toctree-l4 > a:hover,
+.wy-menu-vertical ul.tocbase li.toctree-l5 > a:hover,
+.wy-menu-vertical ul.tocbase li.toctree-l6 > a:hover,
+.wy-menu-vertical ul.tocbase li.toctree-l7 > a:hover {
+    /* background: #d6d6d6 !important; */
+    background: #484b45 !important;
+}

docs/diagrams.md

@@ -64,3 +64,23 @@ graph TD;
   B-->D;
   C-->D;
 ```
+
+```mermaid
+erDiagram
+    CUSTOMER ||--o{ ORDER : places
+    CUSTOMER {
+        string name
+        string custNumber
+        string sector
+    }
+    ORDER ||--|{ LINE-ITEM : contains
+    ORDER {
+        int orderNumber
+        string deliveryAddress
+    }
+    LINE-ITEM {
+        string productCode
+        int quantity
+        float pricePerUnit
+    }
+```

docs/why.md

@@ -213,3 +213,9 @@ In "An Ugly Truth: Inside Facebook's Battle for Domination," New York Times repo
 The new book explores in-depth the inner workings of the company and its top executives. The word ugly in the title comes from a memo written by one of Facebook's own vice presidents, with Frenkel and Kang’s reporting highlighting that many of the platform’s perceived flaws are deliberate design choices.
 
 “So many of Facebook's problems are built into the way that they do business,” Frenkel says. “The very business model that they're premised on … is to keep you online.”
+
+##### [Apple says it will reject any government demands to use new child sexual abuse image detection system for surveillance](https://www.cnbc.com/2021/08/09/apple-will-reject-demands-to-use-csam-system-for-surveillance-.html)
+
+"Some cryptographers are worried about what could happen if a country such as China were to pass a law saying the system also has to include politically sensitive images. Apple CEO Tim Cook has previously said that the company follows laws in every country where it conducts business."
+
+“It’s truly disappointing that Apple got so hung up on its particular vision of privacy that it ended up betraying the fulcrum of user control: being able to trust that your device is truly yours,” technology commentator Ben Thompson wrote in a newsletter on Monday.

mkdocs.yml

 
 site_name: DMS3 documentation
+site_url: https://dms3.io/
 
 nav:
   - Home: index.md
@@ -11,14 +12,20 @@ nav:
   - Architecture Overview: arch.md
   - High-level Design: design.md
   - Roadmap: roadmap.md
+  - Appendix Notes: notes.md
 #  - Example Math and Diagrams: diagrams.md
-#  - Implementation Notes: notes.md
 
 theme:
 #  name: readthedocs
   name: rtd-dropdown
   custom_dir: docs/
 
+plugins:
+    - search
+    - mermaid2:
+        arguments:
+          theme: 'dark'
+
 markdown_extensions:
   - footnotes
   - pymdownx.arithmatex
@@ -39,11 +46,13 @@ markdown_extensions:
           format: !!python/name:pymdownx.arithmatex.fence_mathjax_format
 
 extra_css:
-#  - https://unpkg.com/mermaid@7.1.2/dist/mermaid.css
+  - 'css/theme_extra.css'
+  - https://unpkg.com/mermaid@7.1.2/dist/mermaid.css
 extra_javascript:
   - 'js/converter.js'
-  - 'js/mermaid.min.js'
-  - 'js/mermaid.min.js.map'
+#  - 'js/mermaid.min.js'
+  - https://unpkg.com/mermaid/dist/mermaid.min.js
+#  - 'js/mermaid.min.js.map'
   - 'https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js'
   - 'https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js.map'
   - 'https://cdnjs.cloudflare.com/ajax/libs/raphael/2.3.0/raphael.min.js'