Adde open beta stuff

website/docs/JoiningOpenBeta.mdx

@@ -0,0 +1,50 @@
+---
+id: open-beta
+title: How to join Open Beta
+sidebar_label: How to join Open Beta
+---
+
+# How to join Open Beta
+
+First of all, thank you for your interest in testing PixiEditor 2.0! We are excited to have you on board.
+
+:::warning
+Remember! The Open Beta is a pre-release version of PixiEditor 2.0. It may contain serious bugs, crashes, and other issues. Please make sure to back up your work before using it.
+:::
+
+Before you get started, here are a few things you should know:
+
+- Open Beta is available for Windows only.
+- PixiEditor 2.0 drops support for 32-bit systems. If you are using a 32-bit system, you will not be able to run the Open Beta.
+
+:::note
+    We strongly recommend joining [PixiEditor Forum](https://forum.pixieditor.net) and [Discord](https://discord.gg/qSRMYmq) to report bugs, share feedback, and discuss the Open Beta with other testers.
+:::
+
+There are 2 ways to join the Open Beta:
+
+## Steam
+
+1. Go to the [PixiEditor 2.0 Steam page](https://store.steampowered.com/app/2218560/PixiEditor__Pixel_Art_Editor/) and add the app to your library with "Free" button.
+2. Install the app from your library.
+3. Right click on the app in your library and select "Properties".
+
+![Steam Properties](/img/properties.png)
+
+4. Go to the "Betas" tab and select "beta-2.0" from the dropdown menu.
+
+![Steam Beta](/img/beta.png)
+
+5. Wait for the app to update and enjoy the Open Beta!
+
+## Standalone Development Channel
+
+1. Run PixiEditor (Make sure it's not from Steam or Microsoft Store, it must be downloaded from [pixieditor.net](https://pixieditor.net).
+2. Open File -> Settings -> General.
+3. Choose "Development" from the "Channel" dropdown menu.
+
+![Development Channel](/img/channel.png)
+
+## Microsoft Store
+
+Unfortunately, beta versions are not available on the Microsoft Store. If you want to join the Open Beta, please use the Steam or Standalone Development Channel.

website/docusaurus.config.js

@@ -60,6 +60,7 @@ module.exports =
       },
       items: [
         {to: 'docs/introduction', label: 'Docs', position: 'left'},
+        {href: 'https://forum.pixieditor.net', label: 'Forum', position: 'left'},
         {to: 'help', label: 'Help', position: 'left'},
         {
           to: 'download',
@@ -102,13 +103,17 @@ module.exports =
         {
           title: "Community",
           items: [
+            {
+               label: "Forum",
+               href: "https://forum.pixieditor.net"
+            },
             {
               label: "Reddit",
               href: "https://www.reddit.com/r/PixiEditor/"
             },
             {
-              label: "Twitter",
-              href: "https://twitter.com/PixiEditor"
+              label: "Twitter/X",
+              href: "https://x.com/PixiEditor"
             },
             {
               label: "Discord",
@@ -127,6 +132,14 @@ module.exports =
         {
           title: "More",
           items: [
+            {
+              label: "2.0 Waitlist",
+              to: "v2"
+            },
+            {
+              label: "Color Picker",
+              to: "colorpicker"
+            },
             {
               label: "Donate",
               href: "https://opencollective.com/pixieditor"

website/sidebars.json

@@ -1,6 +1,7 @@
 {
   "docs": {
     "Getting Started 🏠": ["introduction"],
+    "Open Beta 🚀": ["open-beta"],
     "Usage 🎮": ["shortcuts"],
     "Contributing 💻": [
       "start-here",

website/src/css/help.css

@@ -1,5 +1,10 @@
-.supportItem{
-    min-width: 30%;
+.supportItemsGrid{
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    margin-top: 50px;
+    gap: 50px;
 }
 
 .supportItem-title{
@@ -37,14 +42,6 @@
     width: 150px;
 }
 
-.supportItemsGrid{
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    margin-top: 50px;
-}
-
 @media only screen and (max-width: 700px) {
 
     .supportItemsGrid{

website/src/pages/help.tsx

@@ -51,6 +51,12 @@ function Help(props) {
       image: '/img/book.svg',
       imageLink: `${docUrl("introduction")}`
     },
+    {
+        content: `Check out <a href="https://forum.pixieditor.net">PixiEditor Forum</a> for help and support.`,
+        title: 'Forum',
+        image: '/img/forum.svg',
+        imageLink: "https://forum.pixieditor.net"
+    },
     {
       content: `Ask questions about the documentation and project on our <a href="https://discord.gg/qSRMYmq">Discord.</a>`,
       title: 'Join the community',

website/src/pages/index.tsx

@@ -157,6 +157,11 @@ class Index extends React.Component {
                   name="discord"
                   href="https://discord.gg/DwaXAuXVzv"
                   imgsrc="/img/Discord-Clyde.svg"
+                />
+                   <SocialMedia
+                  name="forum"
+                  href="https://forum.pixieditor.net"
+                  imgsrc="/img/forum.svg"
                 />
                 <SocialMedia
                   name="steam"

website/src/pages/v2.tsx

@@ -200,6 +200,7 @@ class V2WishlistRegistration extends React.Component {
               allowFullScreen
             ></iframe>
             <div className="buttons v2">
+              <a className="download-button" style={{width: "auto", marginBottom: 40, paddingLeft: 45, paddingRight: 45}} href="/docs/open-beta">Open beta available now</a>
               <WishlistForm id="agree1" />
               <div className="donate-btn" style={{ marginTop: 35 }}>
                 <div className="btn-label">Support our work</div>
@@ -212,6 +213,11 @@ class V2WishlistRegistration extends React.Component {
                   name="discord"
                   href="https://discord.gg/DwaXAuXVzv"
                   imgsrc="/img/Discord-Clyde.svg"
+                />
+                  <SocialMedia
+                  name="forum"
+                  href="https://forum.pixieditor.net"
+                  imgsrc="/img/forum.svg"
                 />
                 <SocialMedia
                   name="steam"