UI changes

docs/concepts/env_vars.md

@@ -56,12 +56,12 @@ All apps are preset with the following variables:
 There are two ways to set up variables:
 #### Key-Value Editor:
 
-<img src="/img/vars/kv_editor.png" width="650px"/>
+<img src="/img/vars/kv_editor.png" width="800px"/>
 
 > Add the variable name and value with *+ Add Variable*, then *Save*
 
 #### Bulk Editor:
-<img src="/img/vars/bulk_editor.png" width="650px"/>
+<img src="/img/vars/bulk_editor.png" width="800px"/>
 
 > A text editor that allows you to work on multiple variables at once in a similar syntax to `.env` files with the exceptions:
 > - Comments are not supported

docs/overview/build.md

@@ -63,7 +63,7 @@ By default, the build process and the above lifecycle scripts:
 
 It is possible to customize this process with _Advanced Build Options_:
 - at the time of first deployment, in the _Advanced_ dropdown
-  - <img src="/img/build-options/advancedWNode.png" width="350px"/>
+  - <img src="/img/build-options/advancedWNode.png" width="600px"/>
 - in  _Environments_ tab > _Build Options_ of an app's dashboard
   - <img src="/img/build-options/buildwithnode2.png" width="650px"/>
 
@@ -113,7 +113,7 @@ This video will give you an example of how to deploy a static site without a bac
 
 #### **Runtime**
 Newly deployed Cyclic apps will use Node.js v18.12.1 by default. If you are using a framework or library that requires an older version of Node.js to function properly, you may adjust it here.
-<img src="/img/build-options/runtime.png" width="350px"/>
+<img src="/img/build-options/runtime.png" width="500px"/>
 
 
 

docusaurus.config.js

@@ -17,6 +17,16 @@ const config = {
   projectName: 'docs', // Usually your repo name.
   trailingSlash: false, // https://docusaurus.io/docs/deployment#deploying-to-github-pages
   plugins: [
+    async function myPlugin(context, options) {
+      return {
+        name: 'docusaurus-tailwindcss',
+        configurePostCss(postcssOptions) {
+          postcssOptions.plugins.push(require('tailwindcss'))
+          postcssOptions.plugins.push(require('autoprefixer'))
+          return postcssOptions
+        }
+      }
+    },
     require.resolve('docusaurus-lunr-search'),
     './src/plugins/analytics/index.js',
     [
@@ -76,7 +86,7 @@ const config = {
         style: 'dark',
         logo: {
           alt: 'Cyclic Logo',
-          src: 'img/logo-light.png',
+          src: 'img/cyclic-logo.svg',
           href: 'https://app.cyclic.sh/',
           target: '_self',
         },
@@ -100,47 +110,47 @@ const config = {
 
         ],
       },
-      footer: {
-        style: 'dark',
-        links: [
-          {
-            title: 'Cyclic',
-            items: [
-              {
-                label: 'Home - www.cyclic.sh',
-                href: 'https://www.cyclic.sh/',
-              },
-              {
-                label: 'App - app.cyclic.sh',
-                href: 'https://app.cyclic.sh/',
-              },
-            ],
-          },
-          {
-            title: 'Community',
-            items: [
-              {
-                label: 'Discord',
-                href: 'https://discord.gg/huhcqxXCbE',
-              },
-              {
-                label: 'Twitter',
-                href: 'https://twitter.com/cyclicsoftware',
-              },
-            ],
-          },
-          {
-            title: 'More',
-            items: [
-              {
-                label: 'GitHub',
-                href: 'https://github.com/cyclic-software/docs',
-              },
-            ],
-          },
-        ],
-        copyright: `Copyright © ${new Date().getFullYear()} Cyclic Software, Inc.`,
-      },
+      // footer: {
+      //   style: 'dark',
+      //   links: [
+      //     {
+      //       title: 'Cyclic',
+      //       items: [
+      //         {
+      //           label: 'Home - www.cyclic.sh',
+      //           href: 'https://www.cyclic.sh/',
+      //         },
+      //         {
+      //           label: 'App - app.cyclic.sh',
+      //           href: 'https://app.cyclic.sh/',
+      //         },
+      //       ],
+      //     },
+      //     {
+      //       title: 'Community',
+      //       items: [
+      //         {
+      //           label: 'Discord',
+      //           href: 'https://discord.gg/huhcqxXCbE',
+      //         },
+      //         {
+      //           label: 'Twitter',
+      //           href: 'https://twitter.com/cyclicsoftware',
+      //         },
+      //       ],
+      //     },
+      //     {
+      //       title: 'More',
+      //       items: [
+      //         {
+      //           label: 'GitHub',
+      //           href: 'https://github.com/cyclic-software/docs',
+      //         },
+      //       ],
+      //     },
+      //   ],
+      //   copyright: `Copyright © ${new Date().getFullYear()} Cyclic Software, Inc.`,
+      // },
       prism: {
         theme: lightCodeTheme,
         darkTheme: darkCodeTheme,