User guide (#3060)

* user guide

* user guide additions

* light mode images added

* minor edits

* Delete packages/twenty-server/.local-storage/attachment/bd373039-67f7-4da3-ac86-3710d0b8c70d.svg

* Optimize image size

---------

Co-authored-by: Félix Malfait <felix@twenty.com>
Co-authored-by: Félix Malfait <felix.malfait@gmail.com>

packages/twenty-docs/docs/user-guide/basics/custom objects.mdx

@@ -5,6 +5,8 @@ sidebar_custom_props:
   icon: TbAugmentedReality
 ---
 
+import ThemedImage from '@theme/ThemedImage';
+
 Objects are structures that allow you to store data (records, attributes, and values) specific to an organization. Twenty provides both standard and custom objects.
 
 Standard objects are in-built objects with a set of attributes available for all users. All workspaces come with three standard objects by default: People, Companies, and Opportunities. Standard objects have standard fields that are also available for all Twenty users, like Account Owner and URL.
@@ -19,13 +21,12 @@ To create a new custom object:
 2. Under Workspace, go to Data model. Here you'll be able to see an overview of all your existing Standard and Custom objects (both active and disabled).
 <br/>
 
-<div style={{textAlign: 'center'}}>
+
-    <img src="/img/user-guide/view-all-objects.png" alt="View all objects" />
+<ThemedImage sources={{light: "/img/user-guide/view-all-objects-light.png", dark:"/img/user-guide/view-all-objects-dark.png"}} style={{width:'100%', maxWidth:'800px'}}/>
-</div>
 
 <br/>
 
-3. Click on `+ New object` at the top, then choose Custom as the object type. Enter the name (both singular and plural) and description for your custom object and hit Save (at the top right). Using Listing as an example of custom object, the singular would be "listing" and the plural would be "listings" along with a description like "Listings that hosts created to showcase their property." 
+3. Click on `+ New object` at the top, then choose Custom as the object type. Enter the name (both singular and plural), choose an icon, and add a description for your custom object and hit Save (at the top right). Using Listing as an example of custom object, the singular would be "listing" and the plural would be "listings" along with a description like "Listings that hosts created to showcase their property." 
 
 <br/>
 
@@ -35,7 +36,7 @@ To create a new custom object:
 
 <br/>
 
-4. Once you create your custom object, you'll be able to manage it. You can edit the name and description, view the different fields, and add more fields.
+4. Once you create your custom object, you'll be able to manage it. You can edit the name, icon and description, view the different fields, and add more fields.
 
 <div style={{textAlign: 'center'}}>
     <img src="/img/user-guide/manage-custom-object.png" alt="Create custom object" />

packages/twenty-docs/docs/user-guide/basics/notes.mdx

@@ -0,0 +1,30 @@
+---
+title: Notes
+sidebar_position: 1
+sidebar_custom_props:
+  icon: TbNote
+---
+
+import ThemedImage from '@theme/ThemedImage';
+
+Easily create a note to keep track of important information. 
+
+## Create Notes 
+
+To attach a note to the record, go to the <b>Notes</b> tab of a record page and click on `+ New Note`. You can also format, comment, and upload images to your notes.   
+
+<ThemedImage sources={{light: "/img/user-guide/create-new-note-light.png", dark:"/img/user-guide/create-new-note-dark.png"}} style={{width:'100%', maxWidth:'800px'}}/>
+
+## Format Notes 
+
+You can format your notes right from the editor. Use markdown syntax, press the `/` key or click on the `+` icon on the editor to see the different block options, such as headings, tables, and lists. You can also attach images to your note. 
+
+Highlight the text to see more formatting options like bold, italics, and alignment options. 
+
+You can also change the background color and text color of each block to highlight important things in your note. To do so, hover over the block you want to format and click on the `⋮⋮` icon besides the `+` icon. Click on <b>Colors</b> to open up all color options for both the text and the background.  
+
+## Delete Notes
+
+To delete a note, open it and click on the trashcan icon on the upper right of the screen. This will permanently delete your note. 
+
+

packages/twenty-docs/docs/user-guide/basics/opportunities.mdx

@@ -0,0 +1,50 @@
+---
+title: Opportunities
+sidebar_position: 1
+sidebar_custom_props:
+  icon: TbTargetArrow
+---
+
+import ThemedImage from '@theme/ThemedImage';
+
+All opportunities are presented in a Kanban board, where each column represents the stage of your workflow and each card represents a record. For each card, you can list the amount, close date, probability, and the point of contact. You can also move each card between stages as it goes through your workflow. 
+
+<ThemedImage sources={{light: "/img/user-guide/all-opportunities-light.png", dark:"/img/user-guide/all-opportunities-dark.png"}} style={{width:'100%', maxWidth:'800px'}}/>
+
+## Add and delete stages
+
+You can add as many stages as you'd like to perfectly capture your entire workflow. To add a new stage, click on <b>Options</b> on the top right, choose <b>Stages</b>, and then click on `+ Add stage`. Name your stage and hit `Enter` to create it. Click on the name of the stage and then on on edit to change the stage's name and color.
+
+To delete a stage, click on the stage name or on the `⋮` icon that appears when you hover over a stage. Click on edit to open the menu and click on <b>Delete</b> at the bottom to permanently delete a stage. 
+
+## Filter, update, and sort views 
+
+It's easy to add filters and update your view to focus on only the most important things. To add a filter:
+- Click <b>Filter</b> on the top right of the opportunities board and select the field you want to filter by (Amount, Close date, Company, Creation Date, Person, Pipeline Step, and Point of Contact).
+- Select the filter's condition (is/is not, greater than/lesser than) and then choose the value of the field you want to filter by.
+- You can either create a new view or update your current view with the filter in place. 
+- You can also add another filter by following the same steps or clicking on the `+ Add filter` button on top of the columns. 
+- To remove a filter condition, simply click on the <b>X</b> next to the attribute you used to filter the records. 
+
+<ThemedImage sources={{light: "/img/user-guide/filter-opportunities-light.png", dark:"/img/user-guide/filter-opportunities-dark.png"}} style={{width:'100%', maxWidth:'800px'}}/>
+
+<br/>
+
+You can also sort your records by Close date, Creation date, and Probability. To do so:
+- Click on <b>Sort</b> on the top right. 
+- Choose Ascending or Descending, and then the field you want to sort the records by. 
+- You can then update your view or create a new one with the sort filter in place. 
+
+## Display fields 
+
+You can configure your kanban board to display some fields and hide others. By default, the Amount, Close date, Probability, and Point of Contact are all visible. To hide a field, click on <b>Options</b> on the top right, then on <b>Fields</b> to bring up the list of options. Hover over the field you want to hide to bring up the `-` button. Click on it to hide the field.  
+
+You can also rearrange the order of fields by holding down the field name and dragging it to where you want it. 
+
+<ThemedImage sources={{light: "/img/user-guide/display-fields-light.png", dark:"/img/user-guide/display-fields-dark.png"}} style={{width:'100%', maxWidth:'800px'}}/>
+
+<br/>
+
+You can also hide all the fields, and get an overview of all the opportunities at a glance. To do so, click on <b>Options</b> on the top right and turn on the toggle in front of the <b>Compact view</b> option. 
+
+<ThemedImage sources={{light: "/img/user-guide/compact-opportunities-view-light.png", dark:"/img/user-guide/compact-opportunities-view-dark.png"}} style={{width:'100%', maxWidth:'800px'}}/>

packages/twenty-docs/docs/user-guide/basics/tasks.mdx

@@ -0,0 +1,18 @@
+---
+title: Tasks
+sidebar_position: 1
+sidebar_custom_props:
+  icon: TbChecklist
+---
+
+import ThemedImage from '@theme/ThemedImage';
+
+You can find all the tasks from across your workspace in the <b>Tasks</b> window in your sidebar. You can also find a dedicated tab for Tasks on each record so you can add and edit tasks directly from each record. Alternatively, you can click on the `+` button on the top right of each record page and then click on <b>Task</b> to create a new task. 
+
+<ThemedImage sources={{light: "/img/user-guide/create-new-task-light.png", dark:"/img/user-guide/create-new-task-dark.png"}} style={{width:'100%', maxWidth:'800px'}}/>
+
+## Tasks page
+
+Switch between upcoming and completed tasks to get an overview of what's pending and what's already been done. 
+
+You can also see the tasks assigned to others by changing the assignee from the top right of the Tasks page, and edit each task to update the content, due dates, and assignee. You can also comment on each task. 

packages/twenty-docs/docs/user-guide/others/glossary.mdx

@@ -15,6 +15,9 @@ A `Pipeline` is a way to track a business process. Pipelines are present within
 - A **module** contains the logic for a certain business process (for example: sales, recruiting).
 - **Stages** map the steps in your process (for example: new, ongoing, won, lost).
 
+### Views 
+With views, you can customize how your records are displayed. You can have different filters and sort settings for each view. 
+
 ### Workspace
-A `Workspace` typically represents a company using Twenty.  
+A `Workspace` typically represents a company using Twenty. It holds all the records and data that you and your team members add to Twenty.   
-It has a single domain name, which is typically the domain name your company uses for employee email addresses.
+It has a single domain name, which is typically the domain name your company uses for employee email addresses.

packages/twenty-docs/docs/user-guide/others/tips.mdx

@@ -0,0 +1,39 @@
+---
+title: Tips 
+sidebar_position: 1
+sidebar_custom_props:
+  icon: TbInfoCircle
+---
+
+## Update workspace name & logo
+
+Workspace admins can edit its name and logo in settings. 
+
+- From the sidebar, go to <b>Settings</b>. 
+- Under <b>Workspace</b>, go to <b>General</b>.
+- Edit the name and logo. Your changes will be saved automatically. 
+
+## Enable dark mode 
+
+Not a fan of light mode? Easily switch to dark mode with these steps:
+
+- From the sidebar, go to <b>Settings</b>. 
+- Under <b>User</b>, go to <b>Appearance</b>.
+- Select <b>Dark</b>. Your changes will be saved automatically. 
+
+## Account settings 
+
+Configure your user account and set your preferences. 
+
+- From the sidebar, go to <b>Settings</b>. 
+- Under <b>User</b>, go to <b>Profile</b> to edit your name and profile picture. You can upload PNGs, GIFs, and JPEGs.
+- Manage your accounts and configure your email and calendar settings in <b>Accounts</b>. 
+- Your changes will be saved automatically. 
+
+## Invite & manage members
+
+Admins can easily invite new members any time. 
+
+- From the sidebar, go to <b>Settings</b>. 
+- Under <b>Workspace</b>, go to <b>Members</b>.
+- Use the invite link to add more members to your workspace or simply delete existing ones. 

packages/twenty-docs/docs/user-guide/user-guide.mdx

@@ -8,12 +8,12 @@ sidebar_custom_props:
   isSidebarRoot: true
 ---
 
+import ThemedImage from '@theme/ThemedImage';
+
 # Welcome to Twenty's User Guide
 
 The purpose of this user guide is to help you learn how you can use Twenty to build the CRM you want. 
 
-This quick-start guide walks you through the basics.
-
 ## Quick Search 
 
 You'll see a search bar at the top of your sidebar. You can also bring up the command bar with the `cmd`/`ctrl` + `k` shortcut to navigate through your workspace, and find people, companies, notes, and more. 
@@ -22,7 +22,7 @@ The command bar also supports other shortcuts for navigation.
 
 ## Create Pre-filtered Views 
 
-Twenty allows you to add filters to see data that meets certain criteria and hides the rest. 
+Twenty allows you to add filters to see data that meets certain criteria and hides the rest. You can apply multiple filters at once.
 
 To create a filter in your workspace, click Filter at the top right and select the attribute you'd like to filter your records by. Create your filter and then save changes in a new view by clicking `+ Create view`. 
 
@@ -32,6 +32,30 @@ The filtered view is now available to your whole team.
 
 You can also add more stages to the opportunities board. 
 
-On the Opportunities page, click on Options, Stages, then `+ Add Stage`.
+On the <b>Opportunities</b> page, click on <b>Options</b>, <b>Stages</b>, then `+ Add Stage`.
 
-You can also edit the stage by clicking on the name. 
+You can also edit the stage by clicking on the name. 
+
+## Create Notes and Tasks For Each Record
+
+You can attach notes and tasks to each record. With Notes, you can keep a record of any observations, comments, and interactions, and keep track of all items that require action with Tasks. 
+
+There are multiple ways to create notes and tasks. Learn more about [Notes](./basics/notes.mdx) and [Tasks](./basics/tasks.mdx). 
+
+## Upload Files For Each Record 
+
+You can also upload and attach files for each record. To do so, expand a record, and head over to the <b>Files</b> tab. You'll then see the `+ Add file` button. 
+
+<ThemedImage sources={{light: "../img/user-guide/attach-files-to-records-light.png", dark:"../img/user-guide/attach-files-to-records-dark.png"}} style={{width:'100%', maxWidth:'800px'}}/>
+
+## Add Records To Favorites
+
+You can add records to your favorites for quick access. To do so, expand the record you want to add, and click on the heart icon on the top right. You'll now be able to see your favorite records in your sidebar right above your workspace. 
+
+<ThemedImage sources={{light: "../img/user-guide/view-favorite-records-light.png", dark:"../img/user-guide/view-favorite-records-dark.png"}} style={{width:'100%', maxWidth:'800px'}}/>
+
+## Import data
+
+You can easily import People and Companies data into Twenty from other apps using a .csv, .xslx, or .xsl file. In the <b>Companies</b> or <b>People</b> page, click on <b>Options</b> and then on <b>Import</b>. 
+
+Upload your file, match the columns, and validate the data to import it. 

packages/twenty-docs/src/theme/icons.js

@@ -62,6 +62,9 @@ export {
   TbSelect,
   TbToggleRight,
   TbTextPlus,
+  TbTargetArrow,
+  TbNote,
+  TbInfoCircle,
   TbLink,
   TbNavigation,
   TbMenu,

packages/twenty-docs/static/img/discord-icon.svg

@@ -1,8 +1 @@
-<?xml version="1.0" encoding="UTF-8"?>
+<svg height="800" preserveAspectRatio="xMidYMid" viewBox="0 -28.5 256 256" width="800" xmlns="http://www.w3.org/2000/svg"><path d="m216.856339 16.5966031c-16.571337-7.75331645-34.290195-13.3881043-52.814775-16.5966031-2.275041 4.11318106-4.93294 9.64549908-6.765465 14.0464379-19.692104-2.9614483-39.203132-2.9614483-58.5330827 0-1.8321746-4.40093882-4.5504325-9.93325684-6.8458268-14.0464379-18.5445827 3.2084988-36.2837946 8.86399117-52.8551312 16.6376612-33.42453537 50.5088528-42.4853774 99.7631518-37.95494761 148.3180598 22.16890891 16.555194 43.65325271 26.611976 64.77502181 33.192855 5.2150826-7.17745 9.8662303-14.807241 13.8730814-22.848315-7.6311949-2.899686-14.9402415-6.478059-21.8464273-10.632298 1.8321746-1.357374 3.6243438-2.776511 5.3558032-4.236706 42.1228202 19.70193 87.8903382 19.70193 129.5099332 0 1.751813 1.460195 3.543631 2.879332 5.355803 4.236706-6.926539 4.174593-14.255589 7.752966-21.886784 10.653002 4.006851 8.02037 8.637996 15.670866 13.873082 22.847965 21.142122-6.580879 42.646399-16.637311 64.815325-33.213209 5.315798-56.28752-9.080862-105.0894778-38.05561-148.3591179zm-131.3824638 118.4982869c-12.6448471 0-23.0146535-11.804735-23.0146535-26.179989 0-14.3752538 10.1483733-26.2003423 23.0146535-26.2003423 12.8666312 0 23.2360868 11.804384 23.0146538 26.2003423.020002 14.375254-10.1480226 26.179989-23.0146538 26.179989zm85.0513618 0c-12.644847 0-23.014653-11.804735-23.014653-26.179989 0-14.3752538 10.148022-26.2003423 23.014653-26.2003423 12.866281 0 23.236087 11.804384 23.014654 26.2003423 0 14.375254-10.148373 26.179989-23.014654 26.179989z" fill="#5865f2"/></svg>
-<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
-<svg width="800px" height="800px" viewBox="0 -28.5 256 256" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
-    <g>
-        <path d="M216.856339,16.5966031 C200.285002,8.84328665 182.566144,3.2084988 164.041564,0 C161.766523,4.11318106 159.108624,9.64549908 157.276099,14.0464379 C137.583995,11.0849896 118.072967,11.0849896 98.7430163,14.0464379 C96.9108417,9.64549908 94.1925838,4.11318106 91.8971895,0 C73.3526068,3.2084988 55.6133949,8.86399117 39.0420583,16.6376612 C5.61752293,67.146514 -3.4433191,116.400813 1.08711069,164.955721 C23.2560196,181.510915 44.7403634,191.567697 65.8621325,198.148576 C71.0772151,190.971126 75.7283628,183.341335 79.7352139,175.300261 C72.104019,172.400575 64.7949724,168.822202 57.8887866,164.667963 C59.7209612,163.310589 61.5131304,161.891452 63.2445898,160.431257 C105.36741,180.133187 151.134928,180.133187 192.754523,160.431257 C194.506336,161.891452 196.298154,163.310589 198.110326,164.667963 C191.183787,168.842556 183.854737,172.420929 176.223542,175.320965 C180.230393,183.341335 184.861538,190.991831 190.096624,198.16893 C211.238746,191.588051 232.743023,181.531619 254.911949,164.955721 C260.227747,108.668201 245.831087,59.8662432 216.856339,16.5966031 Z M85.4738752,135.09489 C72.8290281,135.09489 62.4592217,123.290155 62.4592217,108.914901 C62.4592217,94.5396472 72.607595,82.7145587 85.4738752,82.7145587 C98.3405064,82.7145587 108.709962,94.5189427 108.488529,108.914901 C108.508531,123.290155 98.3405064,135.09489 85.4738752,135.09489 Z M170.525237,135.09489 C157.88039,135.09489 147.510584,123.290155 147.510584,108.914901 C147.510584,94.5396472 157.658606,82.7145587 170.525237,82.7145587 C183.391518,82.7145587 193.761324,94.5189427 193.539891,108.914901 C193.539891,123.290155 183.391518,135.09489 170.525237,135.09489 Z" fill="#5865F2" fill-rule="nonzero">
-
-</path>
-    </g>

packages/twenty-docs/static/img/logo-square-dark-no-radius.svg

@@ -1,13 +1 @@
-<?xml version="1.0" encoding="UTF-8"?>
+<svg fill="none" viewBox="0 0 136 136" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><path d="m0 0h136v136h-136z"/></clipPath><g clip-path="url(#a)"><path d="m136 .00002289h-136l.00014448 136h136v-136zm-108.73 50.64c0-7.43 6.03-13.46 13.46-13.46h25.91c.38 0 .73.23.89.58s.09.76-.17 1.05l-5.68 6.17c-.99 1.07-2.38 1.69-3.84 1.69h-17.04c-2.23 0-4.04 1.81-4.04 4.04v10.18c0 1.31-1.06 2.37-2.37 2.37h-4.74c-1.31 0-2.37-1.06-2.37-2.37v-10.25zm80.61 34.72c0 7.43-6.03 13.46-13.46 13.46h-11.01c-7.43 0-13.46-6.0299-13.46-13.46v-19.27c0-1.31.49-2.57 1.38-3.54l6.42-6.97c.27-.29.69-.39 1.07-.25.37.15.62.4999.62.8999v29.07c0 2.23 1.81 4.04 4.04 4.04h10.88c2.23 0 4.04-1.81 4.04-4.04v-34.59c0-2.23-1.81-4.04-4.04-4.04h-12.65c-1.45 0-2.83.61-3.82 1.67l-37.73 41h22.67c1.31 0 2.37 1.06 2.37 2.37v4.74c0 1.31-1.06 2.3699-2.37 2.3699h-30.55c-2.77 0-5.02-2.2499-5.02-5.0199v-2.5101c0-1.26.47-2.4699 1.33-3.3999l42.3-45.95c2.8-3.04 6.73-4.76 10.86-4.76h12.66c7.43 0 13.46 6.03 13.46 13.46v34.72h.01z" fill="#000"/><g fill="#fff"><path d="m27.27 50.64c0-7.43 6.03-13.46 13.46-13.46h25.91c.38 0 .73.23.89.58s.09.76-.17 1.05l-5.68 6.17c-.99 1.07-2.38 1.69-3.84 1.69h-17.04c-2.23 0-4.04 1.81-4.04 4.04v10.18c0 1.31-1.06 2.37-2.37 2.37h-4.74c-1.31 0-2.37-1.06-2.37-2.37v-10.25z"/><path d="m107.88 85.36c0 7.43-6.03 13.46-13.46 13.46h-11.01c-7.43 0-13.46-6.0299-13.46-13.46v-19.27c0-1.31.49-2.57 1.38-3.54l6.42-6.97c.27-.29.69-.39 1.07-.25.37.15.62.4999.62.8999v29.07c0 2.23 1.81 4.04 4.04 4.04h10.88c2.23 0 4.04-1.81 4.04-4.04v-34.59c0-2.23-1.81-4.04-4.04-4.04h-12.65c-1.45 0-2.83.61-3.82 1.67l-37.73 41h22.67c1.31 0 2.37 1.06 2.37 2.37v4.74c0 1.31-1.06 2.3699-2.37 2.3699h-30.55c-2.77 0-5.02-2.2499-5.02-5.0199v-2.5101c0-1.26.47-2.4699 1.33-3.3999l42.3-45.95c2.8-3.04 6.73-4.76 10.86-4.76h12.66c7.43 0 13.46 6.03 13.46 13.46v34.72h.01z"/></g></g></svg>
-<svg fill="none" viewBox="0 0 136 136" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#a)">
-<path d="m136 2.2888e-5h-136l1.4448e-4 136h136v-136zm-108.73 50.64c0-7.43 6.03-13.46 13.46-13.46h25.91c0.38 0 0.73 0.23 0.89 0.58s0.09 0.76-0.17 1.05l-5.68 6.17c-0.99 1.07-2.38 1.69-3.84 1.69h-17.04c-2.23 0-4.04 1.81-4.04 4.04v10.18c0 1.31-1.06 2.37-2.37 2.37h-4.74c-1.31 0-2.37-1.06-2.37-2.37v-10.25h-0.01zm80.61 34.72c0 7.43-6.03 13.46-13.46 13.46h-11.01c-7.43 0-13.46-6.0299-13.46-13.46v-19.27c0-1.31 0.49-2.57 1.38-3.54l6.42-6.97c0.27-0.29 0.69-0.39 1.07-0.25 0.37 0.15 0.62 0.4999 0.62 0.8999v29.07c0 2.23 1.81 4.04 4.04 4.04h10.88c2.23 0 4.04-1.81 4.04-4.04v-34.59c0-2.23-1.81-4.04-4.04-4.04h-12.65c-1.45 0-2.83 0.61-3.82 1.67l-37.73 41h22.67c1.31 0 2.37 1.06 2.37 2.37v4.74c0 1.31-1.06 2.3699-2.37 2.3699h-30.55c-2.77 0-5.02-2.2499-5.02-5.0199v-2.5101c0-1.26 0.47-2.4699 1.33-3.3999l42.3-45.95c2.8-3.04 6.73-4.76 10.86-4.76h12.66c7.43 0 13.46 6.03 13.46 13.46v34.72h0.01z" fill="#000"/>
-<path d="m27.27 50.64c0-7.43 6.03-13.46 13.46-13.46h25.91c0.38 0 0.73 0.23 0.89 0.58s0.09 0.76-0.17 1.05l-5.68 6.17c-0.99 1.07-2.38 1.69-3.84 1.69h-17.04c-2.23 0-4.04 1.81-4.04 4.04v10.18c0 1.31-1.06 2.37-2.37 2.37h-4.74c-1.31 0-2.37-1.06-2.37-2.37v-10.25h-0.01z" fill="#fff"/>
-<path d="m107.88 85.36c0 7.43-6.03 13.46-13.46 13.46h-11.01c-7.43 0-13.46-6.0299-13.46-13.46v-19.27c0-1.31 0.49-2.57 1.38-3.54l6.42-6.97c0.27-0.29 0.69-0.39 1.07-0.25 0.37 0.15 0.62 0.4999 0.62 0.8999v29.07c0 2.23 1.81 4.04 4.04 4.04h10.88c2.23 0 4.04-1.81 4.04-4.04v-34.59c0-2.23-1.81-4.04-4.04-4.04h-12.65c-1.45 0-2.83 0.61-3.82 1.67l-37.73 41h22.67c1.31 0 2.37 1.06 2.37 2.37v4.74c0 1.31-1.06 2.3699-2.37 2.3699h-30.55c-2.77 0-5.02-2.2499-5.02-5.0199v-2.5101c0-1.26 0.47-2.4699 1.33-3.3999l42.3-45.95c2.8-3.04 6.73-4.76 10.86-4.76h12.66c7.43 0 13.46 6.03 13.46 13.46v34.72h0.01z" fill="#fff"/>
-</g>
-<defs>
-<clipPath id="a">
-<rect width="136" height="136" fill="#fff"/>
-</clipPath>
-</defs>
-</svg>

packages/twenty-docs/static/img/logo-square-dark.svg

@@ -1,12 +1 @@
-<svg width="136" height="136" viewBox="0 0 136 136" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg fill="none" height="136" viewBox="0 0 136 136" width="136" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><rect height="136" rx="16" width="136"/></clipPath><g clip-path="url(#a)"><path d="m136 .00002289h-136l.00014448 135.99997711h135.99985552zm-108.73 50.64007711c0-7.43 6.03-13.46 13.46-13.46h25.91c.38 0 .73.23.89.58s.09.76-.17 1.05l-5.68 6.17c-.99 1.07-2.38 1.69-3.84 1.69h-17.04c-2.23 0-4.04 1.81-4.04 4.04v10.18c0 1.31-1.06 2.37-2.37 2.37h-4.74c-1.31 0-2.37-1.06-2.37-2.37v-10.25zm80.61 34.72c0 7.43-6.03 13.4599-13.46 13.4599h-11.01c-7.43 0-13.46-6.0299-13.46-13.4599v-19.27c0-1.31.49-2.57 1.38-3.54l6.42-6.97c.27-.29.69-.39 1.07-.25.37.15.62.4999.62.8999v29.0701c0 2.23 1.81 4.04 4.04 4.04h10.88c2.23 0 4.04-1.81 4.04-4.04v-34.59c0-2.23-1.81-4.04-4.04-4.04h-12.65c-1.45 0-2.83.61-3.82 1.67l-37.73 41h22.67c1.31 0 2.37 1.06 2.37 2.37v4.74c0 1.31-1.06 2.3699-2.37 2.3699h-30.55c-2.77 0-5.02-2.2499-5.02-5.0199v-2.5101c0-1.26.47-2.4699 1.33-3.3999l42.3-45.95c2.8-3.04 6.73-4.76 10.86-4.76h12.66c7.43 0 13.46 6.03 13.46 13.46v34.72z" fill="#000"/><g fill="#fff"><path d="m27.27 50.6401c0-7.43 6.03-13.46 13.46-13.46h25.91c.38 0 .73.23.89.58s.09.76-.17 1.05l-5.68 6.17c-.99 1.07-2.38 1.69-3.84 1.69h-17.04c-2.23 0-4.04 1.81-4.04 4.04v10.18c0 1.31-1.06 2.37-2.37 2.37h-4.74c-1.31 0-2.37-1.06-2.37-2.37v-10.25z"/><path d="m107.88 85.3601c0 7.43-6.03 13.4599-13.46 13.4599h-11.01c-7.43 0-13.46-6.0299-13.46-13.4599v-19.27c0-1.31.49-2.57 1.38-3.54l6.42-6.97c.27-.29.69-.39 1.07-.25.37.15.62.4999.62.8999v29.0701c0 2.23 1.81 4.04 4.04 4.04h10.88c2.23 0 4.04-1.81 4.04-4.04v-34.59c0-2.23-1.81-4.04-4.04-4.04h-12.65c-1.45 0-2.83.61-3.82 1.67l-37.73 41h22.67c1.31 0 2.37 1.06 2.37 2.37v4.74c0 1.31-1.06 2.3699-2.37 2.3699h-30.55c-2.77 0-5.02-2.2499-5.02-5.0199v-2.5101c0-1.26.47-2.4699 1.33-3.3999l42.3-45.95c2.8-3.04 6.73-4.76 10.86-4.76h12.66c7.43 0 13.46 6.03 13.46 13.46v34.72z"/></g></g></svg>
-<g clip-path="url(#clip0_2343_96406)">
-<path d="M136 2.28882e-05H0L0.000144482 136H136V2.28882e-05ZM27.27 50.6401C27.27 43.2101 33.3 37.1801 40.73 37.1801H66.64C67.02 37.1801 67.37 37.4101 67.53 37.7601C67.69 38.1101 67.62 38.5201 67.36 38.8101L61.68 44.9801C60.69 46.0501 59.3 46.6701 57.84 46.6701H40.8C38.57 46.6701 36.76 48.4801 36.76 50.7101V60.8901C36.76 62.2001 35.7 63.2601 34.39 63.2601H29.65C28.34 63.2601 27.28 62.2001 27.28 60.8901V50.6401H27.27ZM107.88 85.3601C107.88 92.7901 101.85 98.82 94.42 98.82H83.41C75.98 98.82 69.95 92.7901 69.95 85.3601V66.0901C69.95 64.7801 70.44 63.5201 71.33 62.5501L77.75 55.5801C78.02 55.2901 78.44 55.1901 78.82 55.3301C79.19 55.4801 79.44 55.83 79.44 56.23V85.3001C79.44 87.5301 81.25 89.3401 83.48 89.3401H94.36C96.59 89.3401 98.4 87.5301 98.4 85.3001V50.7101C98.4 48.4801 96.59 46.6701 94.36 46.6701H81.71C80.26 46.6701 78.88 47.2801 77.89 48.3401L40.16 89.3401H62.83C64.14 89.3401 65.2 90.4001 65.2 91.7101V96.4501C65.2 97.7601 64.14 98.82 62.83 98.82H32.28C29.51 98.82 27.26 96.5701 27.26 93.8001V91.29C27.26 90.03 27.73 88.8201 28.59 87.8901L70.89 41.9401C73.69 38.9001 77.62 37.1801 81.75 37.1801H94.41C101.84 37.1801 107.87 43.2101 107.87 50.6401V85.3601H107.88Z" fill="black"/>
-<path d="M27.27 50.6401C27.27 43.2101 33.3 37.1801 40.73 37.1801H66.64C67.02 37.1801 67.37 37.4101 67.53 37.7601C67.69 38.1101 67.62 38.5201 67.36 38.8101L61.68 44.9801C60.69 46.0501 59.3 46.6701 57.84 46.6701H40.8C38.57 46.6701 36.76 48.4801 36.76 50.7101V60.8901C36.76 62.2001 35.7 63.2601 34.39 63.2601H29.65C28.34 63.2601 27.28 62.2001 27.28 60.8901V50.6401H27.27Z" fill="white"/>
-<path d="M107.88 85.3601C107.88 92.7901 101.85 98.82 94.42 98.82H83.41C75.98 98.82 69.95 92.7901 69.95 85.3601V66.0901C69.95 64.7801 70.44 63.5201 71.33 62.5501L77.75 55.5801C78.02 55.2901 78.44 55.1901 78.82 55.3301C79.19 55.4801 79.44 55.83 79.44 56.23V85.3001C79.44 87.5301 81.25 89.3401 83.48 89.3401H94.36C96.59 89.3401 98.4 87.5301 98.4 85.3001V50.7101C98.4 48.4801 96.59 46.6701 94.36 46.6701H81.71C80.26 46.6701 78.88 47.2801 77.89 48.3401L40.16 89.3401H62.83C64.14 89.3401 65.2 90.4001 65.2 91.7101V96.4501C65.2 97.7601 64.14 98.82 62.83 98.82H32.28C29.51 98.82 27.26 96.5701 27.26 93.8001V91.29C27.26 90.03 27.73 88.8201 28.59 87.8901L70.89 41.9401C73.69 38.9001 77.62 37.1801 81.75 37.1801H94.41C101.84 37.1801 107.87 43.2101 107.87 50.6401V85.3601H107.88Z" fill="white"/>
-</g>
-<defs>
-<clipPath id="clip0_2343_96406">
-<rect width="136" height="136" rx="16" fill="white"/>
-</clipPath>
-</defs>
-</svg>

packages/twenty-docs/static/img/logo-square-light.svg

@@ -1,11 +1 @@
-<svg width="136" height="136" viewBox="0 0 136 136" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg fill="none" height="136" viewBox="0 0 136 136" width="136" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><rect height="136" rx="18" width="136"/></clipPath><g clip-path="url(#a)"><rect fill="#000" height="136" rx="18" width="136"/><path d="m118.83 0h-101.66c-9.48 0-17.17 7.69-17.17 17.17v101.66c0 9.48 7.69 17.17 17.17 17.17h101.66c9.48 0 17.17-7.69 17.17-17.17v-101.66c0-9.48-7.69-17.17-17.17-17.17zm-91.56 50.64c0-7.43 6.03-13.46 13.46-13.46h25.91c.38 0 .73.23.89.58s.09.76-.17 1.05l-5.68 6.17c-.99 1.07-2.38 1.69-3.84 1.69h-17.04c-2.23 0-4.04 1.81-4.04 4.04v10.18c0 1.31-1.06 2.37-2.37 2.37h-4.74c-1.31 0-2.37-1.06-2.37-2.37v-10.25zm80.61 34.72c0 7.43-6.03 13.46-13.46 13.46h-11.01c-7.43 0-13.46-6.03-13.46-13.46v-19.27c0-1.31.49-2.57 1.38-3.54l6.42-6.97c.27-.29.69-.39 1.07-.25.37.15.62.5.62.9v29.07c0 2.23 1.81 4.04 4.04 4.04h10.88c2.23 0 4.04-1.81 4.04-4.04v-34.59c0-2.23-1.81-4.04-4.04-4.04h-12.65c-1.45 0-2.83.61-3.82 1.67l-37.73 41h22.67c1.31 0 2.37 1.06 2.37 2.37v4.74c0 1.31-1.06 2.37-2.37 2.37h-30.55c-2.77 0-5.02-2.25-5.02-5.02v-2.51c0-1.26.47-2.47 1.33-3.4l42.3-45.95c2.8-3.04 6.73-4.76 10.86-4.76h12.66c7.43 0 13.46 6.03 13.46 13.46v34.72z" fill="#fff"/></g></svg>
-<g clip-path="url(#clip0_2343_96409)">
-<rect width="136" height="136" rx="18" fill="black"/>
-<path d="M118.83 0H17.17C7.69 0 0 7.69 0 17.17V118.83C0 128.31 7.69 136 17.17 136H118.83C128.31 136 136 128.31 136 118.83V17.17C136 7.69 128.31 0 118.83 0ZM27.27 50.64C27.27 43.21 33.3 37.18 40.73 37.18H66.64C67.02 37.18 67.37 37.41 67.53 37.76C67.69 38.11 67.62 38.52 67.36 38.81L61.68 44.98C60.69 46.05 59.3 46.67 57.84 46.67H40.8C38.57 46.67 36.76 48.48 36.76 50.71V60.89C36.76 62.2 35.7 63.26 34.39 63.26H29.65C28.34 63.26 27.28 62.2 27.28 60.89V50.64H27.27ZM107.88 85.36C107.88 92.79 101.85 98.82 94.42 98.82H83.41C75.98 98.82 69.95 92.79 69.95 85.36V66.09C69.95 64.78 70.44 63.52 71.33 62.55L77.75 55.58C78.02 55.29 78.44 55.19 78.82 55.33C79.19 55.48 79.44 55.83 79.44 56.23V85.3C79.44 87.53 81.25 89.34 83.48 89.34H94.36C96.59 89.34 98.4 87.53 98.4 85.3V50.71C98.4 48.48 96.59 46.67 94.36 46.67H81.71C80.26 46.67 78.88 47.28 77.89 48.34L40.16 89.34H62.83C64.14 89.34 65.2 90.4 65.2 91.71V96.45C65.2 97.76 64.14 98.82 62.83 98.82H32.28C29.51 98.82 27.26 96.57 27.26 93.8V91.29C27.26 90.03 27.73 88.82 28.59 87.89L70.89 41.94C73.69 38.9 77.62 37.18 81.75 37.18H94.41C101.84 37.18 107.87 43.21 107.87 50.64V85.36H107.88Z" fill="white"/>
-</g>
-<defs>
-<clipPath id="clip0_2343_96409">
-<rect width="136" height="136" rx="18" fill="white"/>
-</clipPath>
-</defs>
-</svg>