mirror of
https://gitlab.com/veilid/veilid-dot-com.git
synced 2025-03-12 10:26:36 -04:00
Redesign more or less complete
This commit is contained in:
Alice Rhodes
parent
fd5423203b
commit
f5ef8b0280
79
pages/accessibility/index.md
Normal file
79
pages/accessibility/index.md
Normal file
@ -0,0 +1,79 @@
|
|||||||
|
---
|
||||||
|
title: Accessibility
|
||||||
|
description: An introduction to accessibility concepts and resources
|
||||||
|
section: ""
|
||||||
|
menu:
|
||||||
|
main:
|
||||||
|
weight: 85
|
||||||
|
---
|
||||||
|
|
||||||
|
General accessibility recommendations to keep in mind when designing user interfaces.
|
||||||
|
|
||||||
|
<!-- break -->
|
||||||
|
|
||||||
|
[toc]
|
||||||
|
|
||||||
|
### General Accessibility Concepts
|
||||||
|
|
||||||
|
For the scope of this document, we are referring to the accessibility of websites, documents, and applications.
|
||||||
|
|
||||||
|
### Types of Accessibility Challenges
|
||||||
|
|
||||||
|
Here is a partial list of capabilities to keep in mind when designing:
|
||||||
|
|
||||||
|
**Fine Motor Control** – The dexterity of one's eyes, hands, and fingers for the ability to examine and manipulate objects. In practical terms, is it easy for someone using a touch screen to easily click interactive elements and can folks with fine motor control issues manage to interact with those elements was well.
|
||||||
|
|
||||||
|
**Sightedness** – Levels of blindness, near sightedness, and far sightedness. Low-vision users tend to need high color contrast and larger sized text and elements.
|
||||||
|
|
||||||
|
**Color Vision** – Color blindness changes how people perceive colors which can reduce color contrast and make differentiating color coded items difficult.
|
||||||
|
|
||||||
|
**Cognitive Capabilities** – Memory, train of thought, following instructions, and judgment are cognitive capabilities that most folks take for granted. Various disabilities can affect these as well as situational conditions such as being tired from working late.
|
||||||
|
|
||||||
|
**Hearing** – Hearing difficulties can make audio cues or videos less effective.
|
||||||
|
|
||||||
|
### Accessibility Guidelines
|
||||||
|
|
||||||
|
Here is a partial list of general accessibility goals you should strive for:
|
||||||
|
|
||||||
|
#### Structure
|
||||||
|
|
||||||
|
- Headers are denoted as headers in the mark-up or code
|
||||||
|
- Sections of a page or screen are visually distinct and easy to identify
|
||||||
|
|
||||||
|
#### Navigation
|
||||||
|
|
||||||
|
- Easy to figure out current location
|
||||||
|
- Easy to figure out where you can go
|
||||||
|
- Consistent navigation structures and styling
|
||||||
|
|
||||||
|
#### Interactions
|
||||||
|
|
||||||
|
- Clickable items are styled consistently as clickable
|
||||||
|
- Clickable items have a generous hit-box size
|
||||||
|
- UI elements can be easily manipulated with assistive technology
|
||||||
|
|
||||||
|
#### Typography
|
||||||
|
|
||||||
|
- Adjustable text size
|
||||||
|
- Adjusting the text size does not breaking the layout or usability
|
||||||
|
- Text customization options such as changing fonts
|
||||||
|
|
||||||
|
#### Colors
|
||||||
|
|
||||||
|
- Good color contrast for text to be readable
|
||||||
|
- Use a secondary indicator (shape, size, pattern, etc) rather than color alone
|
||||||
|
|
||||||
|
#### Video
|
||||||
|
|
||||||
|
- For the audio in videos, provide subtitles of the dialog and sounds
|
||||||
|
- A transcript of all the content conveyed in the video helps a wide audiences
|
||||||
|
|
||||||
|
### Additional Reading
|
||||||
|
|
||||||
|
- [Mozilla's Accessibility Reference Pages](https://developer.mozilla.org/en-US/docs/Web/Accessibility)
|
||||||
|
- [Cognitive Accessibility at W3C ](https://www.w3.org/WAI/cognitive/)
|
||||||
|
|
||||||
|
### Usability Tools
|
||||||
|
|
||||||
|
- [Color Contrast Grid](https://contrastgrid.com/)
|
||||||
|
- [WebAIM WAVE](https://wave.webaim.org/)
|
||||||
29
pages/accessibility/translations.md
Normal file
29
pages/accessibility/translations.md
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
---
|
||||||
|
title: Translations
|
||||||
|
description: Help translate documentation and more for the Veilid project
|
||||||
|
section: "Accessibility"
|
||||||
|
---
|
||||||
|
|
||||||
|
|
||||||
|
<div class="row g-5">
|
||||||
|
<div class="col-12 col-md-7">
|
||||||
|
<p>
|
||||||
|
We are very early on in this project and currently only have our text in English.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
We are seeking volunteers to help with this project's translations.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Please join us on our server to talk about how we can expand our reach.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 col-md-5">
|
||||||
|
<h3 class="mt-0 text-center">Help Wanted</h3>
|
||||||
|
<p>
|
||||||
|
<a href="/discord" class="btn btn-primary btn-lg w-100">Veilid Discord</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
70
pages/accessibility/web-text.md
Normal file
70
pages/accessibility/web-text.md
Normal file
@ -0,0 +1,70 @@
|
|||||||
|
---
|
||||||
|
title: Web Text
|
||||||
|
description: How to customize your browser text appearance; based on the WAI customize design document.
|
||||||
|
section: "Accessibility"
|
||||||
|
---
|
||||||
|
|
||||||
|
## Change Text Size with Zoom
|
||||||
|
|
||||||
|
<p>Most web browsers let you increase and decrease the size of text, images, and other web page content with "zoom" features. Some browsers let you choose to zoom only the text size.</p>
|
||||||
|
<p>To change the zoom in most browsers, press the following two keys at the same time:</p>
|
||||||
|
<ul>
|
||||||
|
<li>In Windows, Linux, and Chrome OS:
|
||||||
|
<ul>
|
||||||
|
<li>To zoom bigger: "Ctrl" and "+" keys</li>
|
||||||
|
<li>To zoom smaller: "Ctrl" and "-" keys</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li>Mac OS:
|
||||||
|
<ul>
|
||||||
|
<li>To zoom bigger: "⌘" and "+" keys</li>
|
||||||
|
<li>To zoom smaller: "⌘" and "-" keys</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
Browsers provide specific guidance on different ways to change the page zoom or text-only zoom:
|
||||||
|
|
||||||
|
* [Google Chrome - Change text, image, and video sizes (zoom)](https://support.google.com/chrome/answer/96810)
|
||||||
|
* [Apple Safari - Zoom in on webpages](https://support.apple.com/guide/safari/zoom-in-on-webpages-ibrw1068/mac)
|
||||||
|
* [Mozilla Firefox - Font size and zoom](https://support.mozilla.org/en-US/kb/font-size-and-zoom-increase-size-of-web-pages)
|
||||||
|
* [Opera - Zoom](https://help.opera.com/en/latest/browser-window/#zoom)
|
||||||
|
* [Internet Explorer - Ease of access options](https://support.microsoft.com/en-us/help/17456/windows-internet-explorer-ease-of-access-options)
|
||||||
|
* [Microsoft Edge - Ease of Access in Microsoft Edge](https://support.microsoft.com/en-gb/help/4000734/windows-10-microsoft-edge-ease-of-access)
|
||||||
|
* [Vivaldi - Zooming options in Vivaldi](https://help.vivaldi.com/article/zooming-options-in-vivaldi/)
|
||||||
|
|
||||||
|
## Other Text and Color Changes
|
||||||
|
|
||||||
|
Some browsers provide functionality to set different aspects of font and color in the default view.
|
||||||
|
|
||||||
|
* [Mozilla Firefox - Change the fonts and colors websites use](https://support.mozilla.org/en-US/kb/change-fonts-and-colors-websites-use)
|
||||||
|
* [Opera - Look and feel > Fonts](https://help.opera.com/en/presto/look-and-feel/#fonts)
|
||||||
|
* [Microsoft Internet Explorer - Ease of Access Options](https://support.microsoft.com/en-us/help/17456/windows-internet-explorer-ease-of-access-options)
|
||||||
|
|
||||||
|
Other text and color settings are available in Reader View.
|
||||||
|
|
||||||
|
## Reader View
|
||||||
|
|
||||||
|
Most browsers offer a "Reader View" or "Reading View" that shows just the main content; it gets rid of navigation, ads, etc. Some browsers let you set the text font, text size, text color, background color, and line spacing in Reader View.
|
||||||
|
|
||||||
|
* [Apple Safari - Hide ads when reading articles](https://support.apple.com/en-ca/guide/safari/hide-ads-when-reading-articles-sfri32632/mac)
|
||||||
|
* [Mozilla Firefox - Reader View for clutter-free web pages](https://support.mozilla.org/en-US/kb/firefox-reader-view-clutter-free-web-pages)
|
||||||
|
* [Microsoft Edge - Change font style and size for Reading view in Microsoft Edge](https://support.microsoft.com/en-us/help/4028023/microsoft-edge-change-font-style-and-size-for-reading-view)
|
||||||
|
* [Vivaldi - Reader View](https://help.vivaldi.com/article/reader-view/)
|
||||||
|
|
||||||
|
## Advanced Options
|
||||||
|
|
||||||
|
There are many browser extensions and add-ons that provide additional control over how the browser displays text and other content.
|
||||||
|
|
||||||
|
While most browsers no long support user style sheets, extensions provide similar advanced user control. For example, the Stylus extension is available for several major browsers.
|
||||||
|
|
||||||
|
### Note: No Endorsement
|
||||||
|
|
||||||
|
We do not endorse specific web browsers or extensions and does not recommend one over another.
|
||||||
|
While some common browsers are included in this page, mention of a specific browser does not imply
|
||||||
|
endorsement or recommendation.
|
||||||
|
|
||||||
|
|
||||||
|
### About This Page
|
||||||
|
|
||||||
|
This page is based off the [WAI customize design document](https://github.com/w3c/wai-customize-design/blob/master/index.md).
|
||||||
@ -2,6 +2,9 @@
|
|||||||
title: VeilidChat
|
title: VeilidChat
|
||||||
description: VeilidChat is a proof of concept of the Veilid protocol and framework.
|
description: VeilidChat is a proof of concept of the Veilid protocol and framework.
|
||||||
section: ""
|
section: ""
|
||||||
|
menu:
|
||||||
|
main:
|
||||||
|
weight: 40
|
||||||
---
|
---
|
||||||
|
|
||||||
VeilidChat is a demo of the Veilid framework and protocol working.
|
VeilidChat is a demo of the Veilid framework and protocol working.
|
||||||
|
|||||||
@ -10,13 +10,15 @@ We want to build a community people who want a better way to connect and communi
|
|||||||
|
|
||||||
We want to bring together folks to help build great applications using the Veilid framework.
|
We want to bring together folks to help build great applications using the Veilid framework.
|
||||||
|
|
||||||
<a class="mt-3 btn btn-primary btn-lg" href="/discord">Join Us on Discord</a>
|
|
||||||
|
### Code of Conduct
|
||||||
|
|
||||||
|
Please take a moment to review our [Code of Conduct](/code-of-conduct)
|
||||||
|
|
||||||
|
|
||||||
|
<a class="mt-3 btn btn-primary btn-lg w-100" href="/discord">Join Us on Discord</a>
|
||||||
|
|
||||||
|
|
||||||
### Why Discord?
|
### Why Discord?
|
||||||
|
|
||||||
We're doing what we can with what we have. Since we're not trying to become a tech circlejerk, we have to meet people on their level. So come on in and help us build something better!
|
We're doing what we can with what we have. Since we're not trying to become a tech circlejerk, we have to meet people on their level. So come on in and help us build something better!
|
||||||
|
|
||||||
### Code of Conduct
|
|
||||||
|
|
||||||
Please take a moment to review our [Code of Conduct](/code-of-conduct)
|
|
||||||
@ -1,9 +1,6 @@
|
|||||||
---
|
---
|
||||||
title: Contact Us
|
title: Contact Us
|
||||||
description: How to contact the Veilid project
|
description: How to contact the Veilid project
|
||||||
menu:
|
|
||||||
main:
|
|
||||||
weight: 94
|
|
||||||
---
|
---
|
||||||
|
|
||||||
<p>For app support, please email <a href="mailto:support@veilid.com">support@veilid.com</a></p>
|
<p>For app support, please email <a href="mailto:support@veilid.com">support@veilid.com</a></p>
|
||||||
|
|||||||
@ -7,26 +7,28 @@ menu:
|
|||||||
weight: 80
|
weight: 80
|
||||||
---
|
---
|
||||||
|
|
||||||
### Documentation
|
There are many ways anyone can help with Veilid.
|
||||||
|
|
||||||
We need people to help us write documentation for what is built so far.
|
<!-- Break -->
|
||||||
|
|
||||||
### Translation
|
<div class="row">
|
||||||
|
<div class="col-md-6">
|
||||||
|
<h3>Documentation</h3>
|
||||||
|
<p>We need people to help us <a href="https://discord.com/channels/1077244355439509565/1139733906082513036" title="Link to the documentation channel on Discord">write documentation</a> for what is built so far.</p>
|
||||||
|
<h3>Accessibility</h3>
|
||||||
|
<p>Let's make it easy for anyone to use Veilid Framework or applications built with Veilid Framework. </p>
|
||||||
|
<p>Please help test and <a href="https://discord.com/channels/1077244355439509565/1142263380003004568" title="Link to the accessibility channel on Discord">improve accessibility</a> of Veilid.com, VeilidChat, or other developer's applications.</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6">
|
||||||
|
<h3>Translation</h3>
|
||||||
|
<p>Let us go global. Volunteers can also help Veilid Framework and developers by providing <a href="https://discord.com/channels/1077244355439509565/1140185632845606972" title="Link to the translations channel on Discord">translations for UI elements</a>.</p>
|
||||||
|
<h3>Code</h3>
|
||||||
|
<p>We of course need <a href="/contribute/repositories">help with coding</a>.</p>
|
||||||
|
<h3>Money</h3>
|
||||||
|
<p>Learn how you can <a href="/donate">donate</a> to support Veilid.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
Volunteers can also help Veilid Framework and developers by providing translations for UI elements.
|
|
||||||
|
|
||||||
Let's go global!
|
|
||||||
|
|
||||||
### Accessibility
|
|
||||||
|
|
||||||
Please help test and improve accessibility of Veilid.com, VeilidChat, or other developer's applications.
|
|
||||||
|
|
||||||
Let's make it easy for anyone to use Veilid Framework or applications built with Veilid Framework.
|
|
||||||
|
|
||||||
### Code
|
|
||||||
|
|
||||||
Finally, we of course need help with coding.
|
|
||||||
|
|
||||||
### Money
|
|
||||||
|
|
||||||
Learn how you can [donate](/donate)
|
|
||||||
|
|||||||
@ -5,6 +5,10 @@ section: "Contribute"
|
|||||||
weight: 2
|
weight: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
|
### Code of Conduct
|
||||||
|
|
||||||
|
Please take a moment to review our [Code of Conduct](/code-of-conduct)
|
||||||
|
|
||||||
### Running a Node
|
### Running a Node
|
||||||
|
|
||||||
To install the Veilid node software, please follow the instructions available in the [repository](https://gitlab.com/veilid/veilid/-/blob/main/INSTALL.md).
|
To install the Veilid node software, please follow the instructions available in the [repository](https://gitlab.com/veilid/veilid/-/blob/main/INSTALL.md).
|
||||||
|
|||||||
@ -1,9 +1,6 @@
|
|||||||
---
|
---
|
||||||
title: Events
|
title: Events
|
||||||
description: Events where you can meet-up with the Veilid Framework team
|
description: Events where you can meet-up with the Veilid Framework team
|
||||||
menu:
|
|
||||||
main:
|
|
||||||
weight: 60
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -1,9 +1,6 @@
|
|||||||
---
|
---
|
||||||
title: F.A.Q.
|
title: F.A.Q.
|
||||||
description: Frequently asked questions about Veilid
|
description: Frequently asked questions about Veilid
|
||||||
menu:
|
|
||||||
main:
|
|
||||||
weight: 50
|
|
||||||
---
|
---
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
|
|||||||
167
pages/how-it-works/cryptography.md
Normal file
167
pages/how-it-works/cryptography.md
Normal file
@ -0,0 +1,167 @@
|
|||||||
|
---
|
||||||
|
title: Cryptography
|
||||||
|
description: An overview of the cryptography used in Veilid
|
||||||
|
weight: 23
|
||||||
|
section: "How It Works"
|
||||||
|
---
|
||||||
|
|
||||||
|
|
||||||
|
Strong, appropriate, cryptography choices are essential to the functioning of Veilid.
|
||||||
|
|
||||||
|
Veilid provides applications guarantees about how data is handled on the wire and at rest.
|
||||||
|
|
||||||
|
Cryptosystems were chosen that work well together and provide a balance of speed and cryptographic hardness.
|
||||||
|
|
||||||
|
### Current Cryptography Systems
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<h4>Authentication is Ed25519</h4>
|
||||||
|
Elliptic curve25519 was chosen to provide public/private key authentication and signing capabilities
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Key Exchange is x25519</h4>
|
||||||
|
Curve25519 has a DH function that allows nodes to generate a symmetric key to communicate privately.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Encryption is XChaCha20-Poly1305</h4>
|
||||||
|
ChaCha20 with a 192-bit extended nonce is a fast authenticated stream cipher with associated data (AEAD).
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Message Digest is BLAKE3</h4>
|
||||||
|
BLAKE3 is a extremely fast cryptographic hash that is highly parallelizable and as strong as SHA3-256 and over 17 times faster.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Key Derivation is Argon2</h4>
|
||||||
|
Password hash generation should be slow and resistant to GPU attacks Argon2 was the winner of the 2015 Password Hashing Competition.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
### Upgrading Cryptography Systems
|
||||||
|
|
||||||
|
Nothing lasts forever and cryptography is no exception. As computing power improves and cryptographic attacks evolve, weaknesses in cryptosystems are inevitable.
|
||||||
|
|
||||||
|
Veilid has ensured that upgrading to newer cryptosystems is streamlined and minimally invasive to app developers, and handled transparently at the node level.
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<h4>Multiple Routing Tables</h4>
|
||||||
|
Because changing cryptosystems changes node ids, there will be different distance measurements between nodes, necessitating a separate routing table per cryptosystem. We support this today.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Typed Keys</h4>
|
||||||
|
Cryptographic keys, signatures, and hashes are all tagged with their cryptosystem to ensure that we know exactly how they were generated and how they should be used and persisted.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Migration Support</h4>
|
||||||
|
Reading persisted data will automatically use the correct cryptosystem and will default to always writing it back using the newest/best cryptosystem. This allows for data to be easily migrated just by reading it and writing it back to storage.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Simultaneous Cryptosystems</h4>
|
||||||
|
While transitioning cryptosystems, nodes can respond to other nodes using either the old system or the new one, or both.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
### Secure Storage
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
- Device-level secret storage APIs are available for all platforms
|
||||||
|
- Encrypted table store APIs are exposed to applications to make safe data storage easy
|
||||||
|
- Device data keys can also be password protected
|
||||||
|
- Apps never need to write anything to disk unencrypted
|
||||||
|
|
||||||
|
<div class="row g-3 mx-2 card-set">
|
||||||
|
<div class="col-12 col-md-6">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header text-bg-light">
|
||||||
|
<h4>ProtectedStore</h4>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<p>Device-level Secret Storage</p>
|
||||||
|
<ul>
|
||||||
|
<li>MacOS / iOS Keychain</li>
|
||||||
|
<li>Android Keystore</li>
|
||||||
|
<li>Windows Protected Storage</li>
|
||||||
|
<li>Linux Secret Service</li>
|
||||||
|
</ul>
|
||||||
|
Veilid Maintained Rust Crate: <code>keyring-manager</code>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 col-md-6">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header text-bg-light">
|
||||||
|
<h4>TableStore</h4>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<p>Encrypted Key-Value Database</p>
|
||||||
|
<ul>
|
||||||
|
<li>SQLITE on Native</li>
|
||||||
|
<li>IndexedDB in Browser</li>
|
||||||
|
<li>Device Key can be protected from backup dumping attacks</li>
|
||||||
|
</ul>
|
||||||
|
Veilid Maintained Rust Crate: <code>keyvaluedb</code>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 col-md-6">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header text-bg-light">
|
||||||
|
<h4>RecordStore</h4>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<p>Distributed Hash Table Storage</p>
|
||||||
|
<ul>
|
||||||
|
<li>Encrypted + Authenticated</li>
|
||||||
|
<li>Subkey support</li>
|
||||||
|
<li>LRU distributed cache</li>
|
||||||
|
<li>Per-key multi-writer schemas</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 col-md-6">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header text-bg-light">
|
||||||
|
<h4>BlockStore</h4>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<p>Content-addressable Data Distribution
|
||||||
|
<ul>
|
||||||
|
<li>Take What You Give model</li>
|
||||||
|
<li>Connect and share cloud storage</li>
|
||||||
|
<li>Bittorrent-like sharding</li>
|
||||||
|
</ul>
|
||||||
|
This feature is "coming soon."
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
### On The Wire
|
||||||
|
|
||||||
|
<div class="focus-text">
|
||||||
|
<p>Everything is end-to-end encrypted</p>
|
||||||
|
<p>Data is encrypted at rest and on the wire</p>
|
||||||
|
<p>Your data is protected even if you lose your device</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<h4>All Protocols Same Encryption</h4>
|
||||||
|
Each low-level protocol uses the same message and receipt encapsulation. No protocol is special and all protocols offer the same safety guarantees.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Encrypted And Signed</h4>
|
||||||
|
Messages between nodes are signed by the sender and encrypted for only the receiver. Messages can be relayed without decryption and authentication covers the entire contents including headers.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Everything Is Timestamped</h4>
|
||||||
|
Envelopes include timestamps and unique nonces and reject old or replayed messages.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Node Information Is Signed</h4>
|
||||||
|
When a node publishes routing table entries they are signed. No node can lie about another node's dial info, capabilities, availability, or replay old node info when newer info is available.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
@ -1,13 +0,0 @@
|
|||||||
---
|
|
||||||
title: Veilid Deep-Dive
|
|
||||||
description: An in-depth, technical overview of Veilid Framework
|
|
||||||
section: "Deep Dive"
|
|
||||||
weight: 30
|
|
||||||
---
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
title: An Overview How Veilid Works
|
|
||||||
|
|
||||||
|
|
||||||
description: A high-level, non-technical overview of how Veilid works
|
|
||||||
@ -8,8 +8,10 @@ menu:
|
|||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
|
The framework is conceptually similar to IPFS and Tor, but faster and designed from the ground-up to provide all services over a privately routed network.
|
||||||
|
|
||||||
title: An Overview How Veilid Works
|
The framework enables development of fully-distributed applications without a 'blockchain' or a 'transactional layer' at their base.
|
||||||
|
|
||||||
|
The framework can be included as part of user-facing applications or run as a 'headless node' for power users who wish to help build the network.
|
||||||
|
|
||||||
description: A high-level, non-technical overview of how Veilid works
|
Download the PDF [Slides from Defcon 31](/Launch-Slides-Veilid.pdf)
|
||||||
63
pages/how-it-works/networking.md
Normal file
63
pages/how-it-works/networking.md
Normal file
@ -0,0 +1,63 @@
|
|||||||
|
---
|
||||||
|
title: Networking
|
||||||
|
description: An overview of the networking used in Veilid
|
||||||
|
weight: 22
|
||||||
|
section: "How It Works"
|
||||||
|
---
|
||||||
|
|
||||||
|
<div class="focus-text">
|
||||||
|
<p>All devices are welcome and treated equally</p>
|
||||||
|
<p>You can use the public Veilid Network or build your own</p>
|
||||||
|
<p>Nodes help each other like mutual aid for connectivity</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
All Veilid applications running `veilid-core` are 'nodes', and they are all equal in the eyes of the network. No nodes are 'special'.
|
||||||
|
|
||||||
|
Nodes are only limited by the resources they bring and the configuration of the network they are on.
|
||||||
|
|
||||||
|
DNS is only used one time during ‘bootstrap'; it is not required though.
|
||||||
|
|
||||||
|
SSL is optional and only for HTTPS Websockets for Veilid Webapps.
|
||||||
|
|
||||||
|
### Protocols
|
||||||
|
|
||||||
|
Veilid uses UDP, TCP, and Websockets.
|
||||||
|
|
||||||
|
Low level protocols supported by Veilid are kept simple, to minimize complications. Everything uses framed RPC operations up
|
||||||
|
to 64KB in size. Protocol support is extensible and may add WebRTC and other specialized protocols in the future.
|
||||||
|
|
||||||
|
### Network Topology
|
||||||
|
|
||||||
|
<p><img src="/img/Network-Thumbnail.png" alt="A topology graph for Veilid networks" class="img-fluid"></p>
|
||||||
|
<p>To zoom in on the details, <a href="/img/Network.png">view the full size image directly</a>.</p>
|
||||||
|
|
||||||
|
### Bootstrapping
|
||||||
|
|
||||||
|
Bootstrap nodes not 'special' nodes. Any node can bootstrap a Veilid network. Networks can be 'keyed' to keep nodes off that don't have the key. You can join the ‘big Veilid network' or make your own isolated network.
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<h4>Ask Bootstraps To ‘Find Self'</h4>
|
||||||
|
A single initial DNS TXT record request returns some bootstrap nodes that are known to exist. Those are asked to return nodes that are ‘close' to your own node.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Public Address Detection</h4>
|
||||||
|
Nodes are often behind various forms of NAT. Validating one's own public ‘Dial Info' is essential for publishing one's Node Info and answering Find Node requests.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Relay Configuration</h4>
|
||||||
|
Low-capability network classes may require the use of Inbound or Outbound relays in order to achieve reachability Nodes help each other out to the best of their ability and incur no penalty for not being able to assist other nodes.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Peer Minimum Refresh </h4>
|
||||||
|
Nodes in your routing table are asked to return nodes that are near you as well. Finding nodes close to your own is always harder than finding nodes far away, so we focus on that with our requests.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Network Class Detection</h4>
|
||||||
|
Determining NAT type and what mechanisms can be used to achieve connectivity. Direct connection techniques like reverse connections and UDP hole punching may be inappropriate for some network classes.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Ping Validation</h4>
|
||||||
|
Nodes come and go, change address, and are unreliable. Checking routing table nodes for proof-of-life is done with exponential backoff. Nodes are removed from the routing table on a LIFO basis.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
84
pages/how-it-works/private-routing.md
Normal file
84
pages/how-it-works/private-routing.md
Normal file
@ -0,0 +1,84 @@
|
|||||||
|
---
|
||||||
|
title: Private Routing
|
||||||
|
description: An overview of how private routing works in Veilid
|
||||||
|
weight: 25
|
||||||
|
section: "How It Works"
|
||||||
|
---
|
||||||
|
|
||||||
|
### Private and Safety Routes
|
||||||
|
|
||||||
|
<figure>
|
||||||
|
<img src="/img/private-and-safety-routes.png" alt="a diagram of routes between points a and b" class="img-fluid">
|
||||||
|
<figcaption>
|
||||||
|
Veilid Routes are a combination of source and destination private routing.
|
||||||
|
Because no node can trust any other node to pick the whole route, both source and destination must participate.
|
||||||
|
</figcaption>
|
||||||
|
</figure>
|
||||||
|
|
||||||
|
### Compiled Routes
|
||||||
|
|
||||||
|
<figure>
|
||||||
|
<img src="/img/compiled-routes.png" alt="a diagram of routes between points a and b, shown with components" class="img-fluid">
|
||||||
|
<figcaption>
|
||||||
|
Private Routes are published as a ‘private destination’ and Safety Routes are allocated locally and combined
|
||||||
|
together with a Private Route to form a Compiled Route.
|
||||||
|
</figcaption>
|
||||||
|
</figure>
|
||||||
|
|
||||||
|
### Secure Envelopes
|
||||||
|
|
||||||
|
<figure>
|
||||||
|
<img src="/img/secure-envelopes.png" alt="a diagram how a message is passed from B to A" class="img-fluid">
|
||||||
|
<figcaption>
|
||||||
|
<p>
|
||||||
|
Each node hop only knows about the next one This is similar to onion routing, but assumes that
|
||||||
|
the source is fully in control of the Safety Route and the destination is fully in control of
|
||||||
|
the Private Route.
|
||||||
|
</p>
|
||||||
|
<p>To zoom in on the details, <a href="/img/secure-envelopes.png">view the image directly</a>.</p>
|
||||||
|
</figcaption>
|
||||||
|
</figure>
|
||||||
|
|
||||||
|
|
||||||
|
### Toward The Future
|
||||||
|
|
||||||
|
<div class="focus-text">
|
||||||
|
<p>Private routing is a balance of performance and security</p>
|
||||||
|
<p>Applications can make use of higher node hop counts if they desire</p>
|
||||||
|
<p>Future private routing advancements will be transparent to users</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<h4>Per-Hop Payload Keying</h4>
|
||||||
|
Ensuring that there is nothing common between packets at each hop will reduce the risk of mass data collection
|
||||||
|
being able to deanonymize routes.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Simplify Directionality</h4>
|
||||||
|
Routes are currently bidirectional, but are allocated directionally.
|
||||||
|
We may be able to simplify our allocation mechanism by enforcing bidirectionality.
|
||||||
|
Bidirectional routes are faster, but directional routes could provide more anonymity.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Elimination of Hop Counting</h4>
|
||||||
|
Currently the protocol keeps an internal hop count that is not necessary.
|
||||||
|
Efforts should be made to ensure that individual nodes don’t know how far along in a route they are.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Hop Caching</h4>
|
||||||
|
Route hop NodeInfo could be cached to save on-the-wire size as well as speed things up.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Increasing Hop Count</h4>
|
||||||
|
<p>Currently the default is one hop chosen by the Safety Route, and one hop chosen by the Private Route, which leads to three hops total once compiled.</p>
|
||||||
|
<p>It may be important to increase hop count to 2 for users with critical safety needs and to protect from nation-state-level deanonymization where appropriate.</p>
|
||||||
|
<p>Existing research (on Tor) suggests that our existing hop count should be sufficient and provide comparable anonymity, but this should be revisited.</p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="focus-text">
|
||||||
|
<p>IP Privacy means your location is safe too</p>
|
||||||
|
<p>Users don’t have to do anything to use it</p>
|
||||||
|
<p>No IP address means no tracking, collection, or correlation</p>
|
||||||
|
</div>
|
||||||
85
pages/how-it-works/rpc.md
Normal file
85
pages/how-it-works/rpc.md
Normal file
@ -0,0 +1,85 @@
|
|||||||
|
---
|
||||||
|
title: RPC Protocol
|
||||||
|
description: An overview of the RPC protocol used in Veilid
|
||||||
|
weight: 24
|
||||||
|
section: "How It Works"
|
||||||
|
---
|
||||||
|
|
||||||
|
### RPC Summary
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<h4>Schema Language is Cap'n Proto</h4>
|
||||||
|
<a href="https://capnproto.org/">Cap’n Proto</a> is designed for deserialization speed and schema evolution. Flexible and well supported in Rust.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>RPC is fully in-schema and documented</h4>
|
||||||
|
Both ‘Question/Answer’ and ‘Statement’ RPC modes are supported. All schema fields are documented.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>RPC fully supports Private Routing</h4>
|
||||||
|
All private routing structures are expressed in the RPC schema itself, no magic encrypted blobs.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>Schema Evolution is built-in</h4>
|
||||||
|
Fields can be added and removed with full backward and forward compatibility. New features won’t break older Veilid nodes.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<h4>RPC Schema is cryptography-independent</h4>
|
||||||
|
As cryptosystems change, the language spoken by Veilid nodes remains the same.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
### Distributed Hash Table
|
||||||
|
|
||||||
|
Distributed Hash Tables are a way of storing data in records that have keys that are close to nodes in the network.
|
||||||
|
|
||||||
|
#### DHT Is Just ‘Search’
|
||||||
|
It may look complicated, but all the DHT algorithms out there are just ‘search’ algorithms. Finding data that is stored on some node somewhere out there.
|
||||||
|
|
||||||
|
#### Improving Search
|
||||||
|
We built a better DHT by making both search and data locality more relevant. Veilid synchronizes popular data when nodes come and go from the network.
|
||||||
|
|
||||||
|
<img src="/img/dht-diagram.png" alt="a tree diagram for the search ability" class="img-fluid lightbox">
|
||||||
|
|
||||||
|
Locating a node by its ID. Here the node with the prefix 0011 finds the node with the prefix 1110 by
|
||||||
|
successively learning of and querying closer and closer nodes. The line segment on top represents the
|
||||||
|
space of 160-bit IDs, and shows how the lookups coverge to the target node. Below we illustrate RPC messages
|
||||||
|
made by 1110. The first RPC is to node 101, already known to 1110. Subsequent RPCs are to nodes returned by the
|
||||||
|
previous RPC.
|
||||||
|
|
||||||
|
#### DHT Schema
|
||||||
|
Veilid DHT is built using GetValue and SetValue RPC operations. Nodes can opt out of DHT storage if they do not want to participate.
|
||||||
|
|
||||||
|
Veilid DHT records have schemas that define subkeys that are individually addressable and can have multiple writers.
|
||||||
|
|
||||||
|
DHT record subkeys have sequence numbers and are eventually consistent across multiple writes and background synchronizations.
|
||||||
|
|
||||||
|
<div class="row gx-5 gy-3 mb-3">
|
||||||
|
<div class="col-12 col-lg-6">
|
||||||
|
<figure class="h-100">
|
||||||
|
<img src="/img/dht-dflt-framed.png" alt="a diagram showing key-value pairs" class="img-fluid lightbox">
|
||||||
|
<figcaption>
|
||||||
|
<p>Veilid Default DHT Schema - DFLT</p>
|
||||||
|
<p>To zoom in on the details, <a href="/img/dht-dflt-framed.png">view the image directly</a>.</p>
|
||||||
|
</figcaption>
|
||||||
|
</figure>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 col-lg-6">
|
||||||
|
<figure class="h-100">
|
||||||
|
<img src="/img/dht-smpl.png" alt="a diagram showing key-value pairs, but with more fields" class="img-fluid lightbox">
|
||||||
|
<figcaption>
|
||||||
|
<p>Veild Simple DHT Schema - SMPL</p>
|
||||||
|
<p>To zoom in on the details, <a href="/img/dht-smpl.png">view the image directly</a>.</p>
|
||||||
|
</figcaption>
|
||||||
|
</figure>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="focus-text">
|
||||||
|
<p>The DHT gives you full control over your data</p>
|
||||||
|
<p>Our DHT is not based on a blockchain or a coin </p>
|
||||||
|
<p>Popular data becomes more available automatically </p>
|
||||||
|
</div>
|
||||||
@ -7,20 +7,21 @@ menu:
|
|||||||
weight: 10
|
weight: 10
|
||||||
---
|
---
|
||||||
|
|
||||||
### What is Veilid
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-6">
|
<div class="card">
|
||||||
<video controls class="d-block w-100 my-5">
|
<div class="card-header text-bg-primary">Meet Ellet</div>
|
||||||
|
<video controls>
|
||||||
<source src="/Ellet-intro.mp4" type="video/mp4">
|
<source src="/Ellet-intro.mp4" type="video/mp4">
|
||||||
This browser does not display the video tag.
|
This browser does not display the video tag.
|
||||||
</video>
|
</video>
|
||||||
</div>
|
<div class="card-body">
|
||||||
<div class="col-md-6">
|
<p class="card-text">Ellet gives an introduction for Veilid.</p>
|
||||||
a;lkfja;lsdkfj;a
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
### Website Redesign
|
<h3> How is is Veilid pronounced? </h3>
|
||||||
|
|
||||||
|
Veilid (pronounced Vay-Lid, from 'Valid and Veiled Identification')
|
||||||
|
|
||||||
|
|
||||||
Please have a look around. Some content has changed and some content has moved.
|
|
||||||
@ -1,12 +1,9 @@
|
|||||||
---
|
---
|
||||||
title: About Us
|
title: About Us
|
||||||
description: About the core team and community building Veilid
|
description: About the core team and community building Veilid
|
||||||
menu:
|
|
||||||
main:
|
|
||||||
weight: 80
|
|
||||||
---
|
---
|
||||||
|
|
||||||
Veilid Framework is lead by members of the Veilid Foundation and the core team. Veilid's community of contributors has been fantastic in supporting and contributing to the project.
|
Veilid Framework is lead by members of the [Veilid Foundation](https://veilid.org) and the core team. Veilid's community of contributors has been fantastic in supporting and contributing to the project.
|
||||||
|
|
||||||
<!-- break -->
|
<!-- break -->
|
||||||
|
|
||||||
@ -6,6 +6,24 @@ menu:
|
|||||||
weight: 30
|
weight: 30
|
||||||
---
|
---
|
||||||
|
|
||||||
### For Developers
|
### Veilid For Everyone
|
||||||
|
|
||||||
### For Everyone
|
We built Veilid because when the Internet was young and new, we viewed it as an endless and open realm of possibility.
|
||||||
|
|
||||||
|
Instead, the Internet we know now has been heavily commercialized, with users and their data being the most sought-after commodity. The only ways to opt-out of becoming the product for billionaires to exploit are either too technical for the average user, or to simply not go online.
|
||||||
|
|
||||||
|
We don't believe that is fair; we still haven't given up our dream for the entire Internet to be free and accessible without trading privacy to use it.
|
||||||
|
|
||||||
|
We believe that everyone should be able to forge relationships, learn, create, and build online — without being monetized.
|
||||||
|
|
||||||
|
With Veilid, the user is in control, in a way that is approachable and friendly, regardless of technical ability. We want to give the world the Internet we should have had all along. )
|
||||||
|
|
||||||
|
<a href="/community" class="btn btn-success">Join Our Community</a>
|
||||||
|
|
||||||
|
### Veilid For Developers
|
||||||
|
|
||||||
|
Veilid allows developers to build a distributed, private app. Veilid gives users the privacy to opt out of data collection and online tracking. Veilid is being built with user experience, privacy, and safety as our top priorities. It is open source and available to everyone to use and build upon.
|
||||||
|
|
||||||
|
Veilid goes above and beyond existing privacy technologies and has the potential to completely change the way people use the Internet. Veilid has no profit motive, which puts us in a unique position to promote ideals without the compromise of capitalism.
|
||||||
|
|
||||||
|
<a href="/contribute/repositories/" class="btn btn-success">Code Repositories</a>
|
||||||
11
static/img/Veilid-V-Outlined.svg
Normal file
11
static/img/Veilid-V-Outlined.svg
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<svg width="100%" height="100%" viewBox="0 0 901 901" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:2;">
|
||||||
|
<g>
|
||||||
|
<path d="M305.8,69.8C311.91,67.94 318.94,70.06 323.02,74.98C326.21,78.62 326.85,83.58 328.2,88.05C372.11,246.55 416,405.05 459.93,563.54C479.59,634.49 499.18,705.45 518.92,776.37C520.6,781.38 520.73,787.17 517.8,791.75C515.52,795.7 511.46,798.36 507.09,799.44C464.94,811.15 422.77,822.8 380.61,834.46C376.2,835.62 371.71,837.45 367.07,836.61C360.68,835.59 355.3,830.48 353.82,824.2C289.98,593.76 226.12,363.33 162.28,132.9C161.25,128.98 159.66,125.05 160.17,120.93C160.79,114.43 165.65,108.59 171.97,106.91C216.59,94.58 261.19,82.18 305.8,69.8Z" style="fill:rgb(79,77,157);fill-rule:nonzero;"/>
|
||||||
|
<path d="M518.92,776.37C520.6,781.38 520.73,787.17 517.8,791.75C515.52,795.7 511.46,798.36 507.09,799.44C464.94,811.15 422.77,822.8 380.61,834.46C376.2,835.62 371.71,837.45 367.07,836.61C360.68,835.59 355.3,830.48 353.82,824.2C289.98,593.76 226.12,363.33 162.28,132.9C161.25,128.98 159.66,125.05 160.17,120.93C160.79,114.43 165.65,108.59 171.97,106.91C216.59,94.58 261.19,82.18 305.8,69.8C311.91,67.94 318.94,70.06 323.02,74.98C326.21,78.62 326.85,83.58 328.2,88.05C372.11,246.55 416,405.05 459.93,563.54" style="fill:rgb(79,77,157);fill-opacity:0;fill-rule:nonzero;stroke:white;stroke-width:5px;"/>
|
||||||
|
<path d="M675.98,123.92C683.58,119.46 692.74,115.7 701.6,118.49C713.94,122.49 722.95,132.3 732.76,140.25C735.47,142.57 738.81,143.89 742.15,145.02C742.29,146.65 742.63,148.36 742.07,149.95C683.22,311.96 624.24,473.93 565.49,635.97C567.14,639.32 568.8,642.67 570.46,646.02C555.03,685.68 539.3,725.23 523.79,764.87C522.17,768.7 521.03,772.75 518.92,776.37C499.18,705.45 479.59,634.49 459.93,563.54C471.35,536.95 482.05,510.03 493.19,483.31C493.68,482.14 494.32,480.98 495.59,480.52C500.59,477.84 505.83,475.61 510.71,472.72C513.71,470.37 515.63,466.96 518.13,464.14C520.41,461.07 523.38,458.46 525.12,455.03C525.09,450.31 523.87,445.68 523.82,440.96C525.6,434.76 529.6,429.36 531.47,423.22C530.12,416.69 527.87,410.37 526.31,403.89C525.45,401.14 527.15,398.56 528.01,396.04C529.97,391.7 530.89,386.74 534.2,383.13C537.3,379.28 540.81,375.73 543.6,371.64C546.34,366.2 548.3,360.4 550.9,354.89C551.47,353.17 553.25,352.53 554.67,351.68C559.89,348.93 564.99,345.98 570.19,343.21C571.18,342.55 572.44,342.11 573.08,341.04C576.36,335.28 577.55,328.27 582.5,323.54C586.37,318.65 591.86,314.68 593.56,308.42C594.6,305.24 596.09,302.2 596.78,298.92C594.78,291.13 591.59,283.66 589.32,275.94C588.58,273.69 589.81,271.49 590.41,269.38C591.41,266.72 591.99,263.88 593.42,261.41C597.88,258.1 602.8,255.47 607.42,252.4C610.73,250.46 611.5,246.38 613.3,243.26C615.47,238.19 619.14,233.56 619.34,227.85C619.81,223.25 620.3,218.66 620.82,214.08C621.53,207.31 625.85,201.61 627.3,195.06C625.94,188.52 623.96,182.13 622.43,175.63C621.64,173.28 623.32,171.14 624.15,169.05C625.61,166.24 626.53,163.12 628.41,160.55C632.99,157.9 638.45,156.89 642.7,153.7C652.49,142.47 663.11,131.62 675.98,123.92ZM689.4,134.56C684.09,135.82 680.07,140.2 678.25,145.22C662.71,181.5 647.63,217.98 632.48,254.43C584.55,369.65 537,485.02 489.31,600.33C487.34,604.68 484.5,610.47 488.32,614.65C490.14,616.86 493.14,615.36 494.75,613.71C500.05,608.6 503.87,602.21 508.67,596.66C516.62,587.64 522.78,577.26 528.93,566.99C536.58,553.67 544.33,540.3 549.88,525.93C597.15,407.35 643.9,288.57 690.84,169.85C694.74,159.59 699.16,149.5 702.77,139.14C701.03,133.97 693.95,133.48 689.4,134.56Z" style="fill:rgb(11,11,47);fill-rule:nonzero;"/>
|
||||||
|
<path d="M459.93,563.54C471.35,536.95 482.05,510.03 493.19,483.31C493.68,482.14 494.32,480.98 495.59,480.52C500.59,477.84 505.83,475.61 510.71,472.72C513.71,470.37 515.63,466.96 518.13,464.14C520.41,461.07 523.38,458.46 525.12,455.03C525.09,450.31 523.87,445.68 523.82,440.96C525.6,434.76 529.6,429.36 531.47,423.22C530.12,416.69 527.87,410.37 526.31,403.89C525.45,401.14 527.15,398.56 528.01,396.04C529.97,391.7 530.89,386.74 534.2,383.13C537.3,379.28 540.81,375.73 543.6,371.64C546.34,366.2 548.3,360.4 550.9,354.89C551.47,353.17 553.25,352.53 554.67,351.68C559.89,348.93 564.99,345.98 570.19,343.21C571.18,342.55 572.44,342.11 573.08,341.04C576.36,335.28 577.55,328.27 582.5,323.54C586.37,318.65 591.86,314.68 593.56,308.42C594.6,305.24 596.09,302.2 596.78,298.92C594.78,291.13 591.59,283.66 589.32,275.94C588.58,273.69 589.81,271.49 590.41,269.38C591.41,266.72 591.99,263.88 593.42,261.41C597.88,258.1 602.8,255.47 607.42,252.4C610.73,250.46 611.5,246.38 613.3,243.26C615.47,238.19 619.14,233.56 619.34,227.85C619.81,223.25 620.3,218.66 620.82,214.08C621.53,207.31 625.85,201.61 627.3,195.06C625.94,188.52 623.96,182.13 622.43,175.63C621.64,173.28 623.32,171.14 624.15,169.05C625.61,166.24 626.53,163.12 628.41,160.55C632.99,157.9 638.45,156.89 642.7,153.7C652.49,142.47 663.11,131.62 675.98,123.92C683.58,119.46 692.74,115.7 701.6,118.49C713.94,122.49 722.95,132.3 732.76,140.25C735.47,142.57 738.81,143.89 742.15,145.02C742.29,146.65 742.63,148.36 742.07,149.95C683.22,311.96 624.24,473.93 565.49,635.97C567.14,639.32 568.8,642.67 570.46,646.02C555.03,685.68 539.3,725.23 523.79,764.87C522.17,768.7 521.03,772.75 518.92,776.37M689.4,134.56C684.09,135.82 680.07,140.2 678.25,145.22C662.71,181.5 647.63,217.98 632.48,254.43C584.55,369.65 537,485.02 489.31,600.33C487.34,604.68 484.5,610.47 488.32,614.65C490.14,616.86 493.14,615.36 494.75,613.71C500.05,608.6 503.87,602.21 508.67,596.66C516.62,587.64 522.78,577.26 528.93,566.99C536.58,553.67 544.33,540.3 549.88,525.93C597.15,407.35 643.9,288.57 690.84,169.85C694.74,159.59 699.16,149.5 702.77,139.14C701.03,133.97 693.95,133.48 689.4,134.56Z" style="fill-opacity:0;fill-rule:nonzero;stroke:white;stroke-width:5px;"/>
|
||||||
|
<path d="M689.4,134.56C693.95,133.48 701.03,133.97 702.77,139.14C699.16,149.5 694.74,159.59 690.84,169.85C643.9,288.57 597.15,407.35 549.88,525.93C544.33,540.3 536.58,553.67 528.93,566.99C522.78,577.26 516.62,587.64 508.67,596.66C503.87,602.21 500.05,608.6 494.75,613.71C493.14,615.36 490.14,616.86 488.32,614.65C484.5,610.47 487.34,604.68 489.31,600.33C537,485.02 584.55,369.65 632.48,254.43C647.63,217.98 662.71,181.5 678.25,145.22C680.07,140.2 684.09,135.82 689.4,134.56Z" style="fill:white;fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 6.4 KiB |
@ -34,7 +34,7 @@ $info: #0d6efd;
|
|||||||
@import "bootstrap/breadcrumb";
|
@import "bootstrap/breadcrumb";
|
||||||
@import "bootstrap/pagination";
|
@import "bootstrap/pagination";
|
||||||
/* @import "bootstrap/badge"; */
|
/* @import "bootstrap/badge"; */
|
||||||
/* @import "bootstrap/alert"; */
|
@import "bootstrap/alert";
|
||||||
/* @import "bootstrap/progress"; */
|
/* @import "bootstrap/progress"; */
|
||||||
@import "bootstrap/list-group";
|
@import "bootstrap/list-group";
|
||||||
/* @import "bootstrap/close"; */
|
/* @import "bootstrap/close"; */
|
||||||
@ -68,14 +68,6 @@ ul, ol {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
body > footer {
|
|
||||||
clear: both;
|
|
||||||
margin-top: 2rem;
|
|
||||||
background-color: $primary;
|
|
||||||
padding: 1rem;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3, h4, h5, h6 {
|
h3, h4, h5, h6 {
|
||||||
margin-top: 2rem;
|
margin-top: 2rem;
|
||||||
}
|
}
|
||||||
@ -86,6 +78,19 @@ p:last-child {
|
|||||||
|
|
||||||
/* Class Rules */
|
/* Class Rules */
|
||||||
|
|
||||||
|
.card-header {
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h2.more-pages {
|
||||||
|
margin: 2rem 0 1rem 0;
|
||||||
|
padding: 1rem;
|
||||||
|
color: white;
|
||||||
|
background-color: $primary;
|
||||||
|
}
|
||||||
|
|
||||||
.padded-box {
|
.padded-box {
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
background-color: #8e009733;
|
background-color: #8e009733;
|
||||||
@ -125,14 +130,61 @@ p:last-child {
|
|||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ID Rules */
|
/* Specific Rules */
|
||||||
|
|
||||||
|
body > header {
|
||||||
|
padding: 1px;
|
||||||
|
background-color: tint-color($secondary, 50%);
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
|
||||||
|
.list-inline li {
|
||||||
|
padding: 0 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.links {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#header-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
#site-logo {
|
#site-logo {
|
||||||
margin: 2rem 0;
|
margin: 1rem 0;
|
||||||
img {
|
img {
|
||||||
display: block;
|
display: block;
|
||||||
max-height: 10vh;
|
max-height: 5vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
body > main {
|
||||||
|
padding-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
body > footer {
|
||||||
|
clear: both;
|
||||||
|
margin-top: 2rem;
|
||||||
|
background-color: $primary;
|
||||||
|
padding: 1rem;
|
||||||
|
padding-top: 2rem;
|
||||||
|
color: white;
|
||||||
|
h4 {
|
||||||
|
font-size: 1rem;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
ul {
|
||||||
|
margin: 1rem 0;
|
||||||
|
}
|
||||||
|
a:visited, a:active, a:hover, a:link {
|
||||||
|
color: white;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -167,4 +219,8 @@ p:last-child {
|
|||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer-logo {
|
||||||
|
height: 150px;
|
||||||
}
|
}
|
||||||
@ -22,7 +22,7 @@
|
|||||||
</section>
|
</section>
|
||||||
{%- endif ~%}
|
{%- endif ~%}
|
||||||
{%- if pages|length ~%}
|
{%- if pages|length ~%}
|
||||||
<h2 class="mt-4 mb-1">More Pages</h2>
|
<h2 class="more-pages">More Pages</h2>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{%- for p in pages ~%}
|
{%- for p in pages ~%}
|
||||||
<article class="list-page-article">
|
<article class="list-page-article">
|
||||||
|
|||||||
@ -10,34 +10,29 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
<header>
|
||||||
<div class="container">
|
<div class="container" id="header-content">
|
||||||
{%- block header ~%}
|
{%- block header ~%}
|
||||||
<div class="row g-5">
|
|
||||||
<div class="col-md-3">
|
|
||||||
{%- if page.type == 'homepage' ~%}
|
{%- if page.type == 'homepage' ~%}
|
||||||
<h1 id="site-logo"><img src="/img/Veilid.svg" alt="Veilid Framework Logo" title="{{ site.title }}"></h1>
|
<h1 id="site-logo"><img src="/img/Veilid.svg" alt="Veilid Logo" title="{{ site.title }}"></h1>
|
||||||
{%- else ~%}
|
{%- else ~%}
|
||||||
<h1 id="site-logo"><a href="/"><img src="/img/Veilid.svg" alt="Veilid Framework Logo" title="{{ site.title }}"></a></h1>
|
<h1 id="site-logo"><a href="/"><img src="/img/Veilid.svg" alt="Veilid Logo" title="{{ site.title }}"></a></h1>
|
||||||
{%- endif ~%}
|
{%- endif ~%}
|
||||||
</div>
|
<div class="links">
|
||||||
<div class="col-md-9">
|
<ul class="list-inline no-comma m-0">
|
||||||
<nav id="header-menu">
|
<li class="list-inline-item"><a href="#content">Skip to Content</a></li>
|
||||||
<ol>
|
<li class="list-inline-item"><a href="/web-text"><img src="/img/fonts.svg" alt="Icon for Font Size" class="d-inline"><span class="d-none d-md-inline">Customize Text</span></a></li>
|
||||||
<li><a href="/chat" class="btn btn-primary">VeilidChat</a></li>
|
<li class="list-inline-item"><a href="/translations"><img src="/img/translate.svg" alt="Icon for Translations" class="d-inline"><span class="d-none d-md-inline">Translations</span></a></li>
|
||||||
<li><a href="/contribute/repositories/" class="btn btn-secondary">Code</a></li>
|
</ul>
|
||||||
<li><a href="/press" class="btn btn-secondary">Press</a></li>
|
</div>
|
||||||
<li><a href="/donate" class="btn btn-success">Donate</a></li>
|
|
||||||
</ol>
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{%- endblock header ~%}
|
{%- endblock header ~%}
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-9 order-md-2">
|
<div class="col-md-9 order-md-2" id="content">
|
||||||
{% if page.type != 'homepage' %}
|
{% if page.type != 'homepage' %}
|
||||||
{{ include('partials/breadcrumbs.html.twig', with_context = true) }}
|
{{ include('partials/breadcrumbs.html.twig', with_context = true) }}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
@ -57,7 +52,36 @@
|
|||||||
<footer>
|
<footer>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
{%- block footer ~%}
|
{%- block footer ~%}
|
||||||
© 2025 Veilid Framework
|
<div class="row">
|
||||||
|
<div class="col-md-4 col-lg-3">
|
||||||
|
<h4>More Information</h4>
|
||||||
|
<ul>
|
||||||
|
<li><a href="/who-built-veilid">About Us</a></li>
|
||||||
|
<li><a href="/faq">Frequently Asked Questions</a></li>
|
||||||
|
<li><a href="/events">Events</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-4 col-lg-3">
|
||||||
|
<h4>Veilid on Social Media</h4>
|
||||||
|
<ul>
|
||||||
|
<li><a href="https://twitter.com/cdc_pulpit">cDc on Twitter</a></li>
|
||||||
|
<li><a href="https://twitter.com/VeilidNetwork">Veilid on Twitter</a></li>
|
||||||
|
<li><a href="https://bsky.app/profile/cultdeadcow.bsky.social">Veilid on BlueSky</a></li>
|
||||||
|
<li><a href="https://hackers.town/@veilidnetwork">Veilid on Fedi</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-4 col-lg-3">
|
||||||
|
<h4>Contact Us</h4>
|
||||||
|
<ul>
|
||||||
|
<li>For app support, please email <a href="mailto:support@veilid.com">support@veilid.com</a></li>
|
||||||
|
<li><a href="/press">Press</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="col-lg-3 text-center">
|
||||||
|
<p><img src="/img/Veilid-V-Outlined.svg" id="footer-logo"></p>
|
||||||
|
<p>© 2025 Veilid Framework</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{%- endblock footer ~%}
|
{%- endblock footer ~%}
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|||||||
@ -3,7 +3,7 @@
|
|||||||
<ol class="nav nav-underline flex-column">
|
<ol class="nav nav-underline flex-column">
|
||||||
{%- for item in site.menus[menu]|sort_by_weight ~%}
|
{%- for item in site.menus[menu]|sort_by_weight ~%}
|
||||||
{% set this_url = url(item.url) %}
|
{% set this_url = url(item.url) %}
|
||||||
{% if loop.index == 1 or "chat" in this_url %}
|
{% if loop.index == 1 %}
|
||||||
{% else %}
|
{% else %}
|
||||||
{% set active_link = (this_url in here) %}
|
{% set active_link = (this_url in here) %}
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user