Skip to content

Commit

Permalink
Docusaurus: fix:DA-256 table icons darkmode (#5840)
Browse files Browse the repository at this point in the history
* update color of icons on table

* update missing classname for table icons
update kbd elements color for darkmode
  • Loading branch information
carlagn authored Apr 9, 2024
1 parent df56550 commit 79fac44
Show file tree
Hide file tree
Showing 2 changed files with 20 additions and 18 deletions.
33 changes: 15 additions & 18 deletions content/200-orm/400-tools/06-prisma-studio.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -62,13 +62,13 @@ The table below lists all data types and their identifying icon.

| Field data type | Description |
| :-------------------------------------------------------------------------------: | ------------------------------------ |
| <StudioStringSvg width="10px" alt="String type"/> | Text |
| <StudioNumberSvg width="10px" alt="Number type"/> | Integer |
| <StudioDatetimeSvg width="10px" alt="Datetime type"/> | Date-time<br /><br /> |
| <StudioBooleanSvg width="10px" alt="Boolean type"/> | Boolean<br /> |
| <StudioEnumSvg width="10px" alt="Enum type"/> | Pre-defined list of values (`enum` data type) |
| <StudioArraySvg width="10px" alt="Array type"/> | List of related records from another model |
| <StudioObjectSvg width="10px" alt="Object type"/> | The `{}` symbol can refer to one of the two types of fields.<br /><br /> • Relation field<br />• JSON field |
| <StudioStringSvg width="10px" alt="String type" className="table-icon"/> | Text |
| <StudioNumberSvg width="10px" alt="Number type" className="table-icon"/> | Integer |
| <StudioDatetimeSvg width="10px" alt="Datetime type" className="table-icon"/> | Date-time<br /><br /> |
| <StudioBooleanSvg width="10px" alt="Boolean type" className="table-icon"/> | Boolean<br /> |
| <StudioEnumSvg width="10px" alt="Enum type" className="table-icon"/> | Pre-defined list of values (`enum` data type) |
| <StudioArraySvg width="10px" alt="Array type" className="table-icon"/> | List of related records from another model |
| <StudioObjectSvg width="10px" alt="Object type" className="table-icon"/> | The `{}` symbol can refer to one of the two types of fields.<br /><br /> • Relation field<br />• JSON field |

### Keyboard shortcuts in models

Expand Down Expand Up @@ -119,13 +119,13 @@ To paste in another cell, first double-click the cell to enter edit mode, and th

| Field data type | Description |
| :-------------------------------------------------------------------------------: | ------------------ |
| <StudioStringSvg width="10px" alt="String type"/> | Text |
| <StudioNumberSvg width="10px" alt="Number type"/> | Integer<br /><br />If such a field has `autoincrement()` pre-filled, do not edit the cell and do not add a number manually. |
| <StudioDatetimeSvg width="10px" alt="Datetime type"/> | Date-time<br /><br />Date-time fields contain a long string of numbers, letters, and others. As a best practice, copy the value of another date-time cell and modify it as necessary before pasting in the field. |
| <StudioBooleanSvg width="10px" alt="Boolean type"/> | Boolean<br /><br />Select `true` or `false`. |
| <StudioEnumSvg width="10px" alt="Enum type"/> | Pre-defined list<br /><br />Double-click a cell in the field and select one of the pre-defined options. |
| <StudioArraySvg width="10px" alt="Array type"/> | List of related records from another model<br /><br />It typically refers to a list of records that exist in another model in the database. If you are adding a new record and records from the related model do not yet exist, you do not need to enter anything in the current model. |
| <StudioObjectSvg width="10px" alt="Object type"/> | The `{}` symbol can refer to one of the two types of fields.<br /><br /> • Relation field<br />• JSON field<br /><br />**Relation with a model defined separately in the database**<br /><br />Typically, you need to select the same value as any of the previous records<br />Click the name of the model to see the list of values which you can then select for the related field.<br /><br />**JSON field**<br /><br /> Double-click the field to edit the JSON data. As a best practice, validate the edited JSON data in a validator and paste it back in the cell. |
| <StudioStringSvg width="10px" alt="String type" className="table-icon"/> | Text |
| <StudioNumberSvg width="10px" alt="Number type" className="table-icon"/> | Integer<br /><br />If such a field has `autoincrement()` pre-filled, do not edit the cell and do not add a number manually. |
| <StudioDatetimeSvg width="10px" alt="Datetime type" className="table-icon"/> | Date-time<br /><br />Date-time fields contain a long string of numbers, letters, and others. As a best practice, copy the value of another date-time cell and modify it as necessary before pasting in the field. |
| <StudioBooleanSvg width="10px" alt="Boolean type" className="table-icon"/> | Boolean<br /><br />Select `true` or `false`. |
| <StudioEnumSvg width="10px" alt="Enum type" className="table-icon"/> | Pre-defined list<br /><br />Double-click a cell in the field and select one of the pre-defined options. |
| <StudioArraySvg width="10px" alt="Array type" className="table-icon"/> | List of related records from another model<br /><br />It typically refers to a list of records that exist in another model in the database. If you are adding a new record and records from the related model do not yet exist, you do not need to enter anything in the current model. |
| <StudioObjectSvg width="10px" alt="Object type" className="table-icon"/> | The `{}` symbol can refer to one of the two types of fields.<br /><br /> • Relation field<br />• JSON field<br /><br />**Relation with a model defined separately in the database**<br /><br />Typically, you need to select the same value as any of the previous records<br />Click the name of the model to see the list of values which you can then select for the related field.<br /><br />**JSON field**<br /><br /> Double-click the field to edit the JSON data. As a best practice, validate the edited JSON data in a validator and paste it back in the cell. |

3. (Optional) If you are unhappy with your changes, click **Discard changes** and start over.
4. Click **Save 1 change**.
Expand Down Expand Up @@ -172,10 +172,7 @@ When you add multiple conditions, Prisma Studio filters the results so that all
1. Click **Filters** to open the **Filters** menu.

<Admonition>

**Note**<br /><br />
Click **Filters** again if you want to hide the menu.

</Admonition>

2. Click **Add a new filter**.
Expand Down Expand Up @@ -282,7 +279,7 @@ The first click sorts the data in ascending order, the second - in descending or

Caching issues may cause Prisma Studio to use an older version of the query engine. You may see the following error:

```
```terminal wrap
Error in request: PrismaClientKnownRequestError: Failed to validate the query Error occurred during query validation & transformation
```

Expand Down
5 changes: 5 additions & 0 deletions src/css/custom.css
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,10 @@ details > summary::before {
--docusaurus-details-decoration-color: var(--ifm-alert-border-color) !important;
}

.table-icon path {
fill: var(--main-font-color);
}

main {
padding-top: 64px;
padding-left: 16px;
Expand Down Expand Up @@ -367,6 +371,7 @@ li {

kbd {
background: var(--white-color);
color: var(--gray-800);
box-shadow: 0px 1px 1px rgba(47, 55, 71, 0.6), 0px 1px 4px rgba(47, 55, 71, 0.2);
border-bottom: 1px solid rgba(47, 55, 71, 0.2);
border-radius: 4px;
Expand Down

0 comments on commit 79fac44

Please sign in to comment.