DC-6313 Version Requirements Updated (#7358)

* updated version requirements

* updated table scroll issue

Author: aidankmcalister

content/200-orm/500-reference/400-system-requirements.mdx

@@ -17,13 +17,10 @@ The latest version of Prisma ORM requires the following software:
 
 | Tool                  | Minimum required version |
 | :-------------------- | :----------------------- |
-| Node.js               | 20.19.0+                 |
+| Node.js               | ^20.19.0, ^22.12.0, or ^24.0.0 |
 | TypeScript (optional) | 5.4+                     |
 | Yarn (optional)       | 1.19.2                   |
 
-
-
-
 - Prisma ORM supports and tests all _Active LTS_ and _Maintenance LTS_ **Node.js** releases. [Releases that are not in these states like _Current_, and also odd-numbered versions](https://nodejs.org/en/about/releases/) probably also work, but are not recommended for production use.
 - **TypeScript** is only required for TypeScript users.
 - When using **Yarn 1**, `1.19.2` is the minimum version compatible with Prisma Client.

src/css/custom.css

@@ -413,7 +413,7 @@ kbd {
 
 .mdx-table {
   margin: 0px 0px 20px;
-  overflow-x: scroll;
+  overflow-x: auto;
 }
 
 table {
@@ -523,7 +523,11 @@ hr {
   position: relative;
 }
 
-.navbar__item.navbar__link:not(.logo-link):not(.navbar-login-btn):is(:hover, :focus-visible)::after {  position: absolute;
+.navbar__item.navbar__link:not(.logo-link):not(.navbar-login-btn):is(
+    :hover,
+    :focus-visible
+  )::after {
+  position: absolute;
   height: 2px;
   width: 100%;
   content: "";
@@ -534,7 +538,6 @@ hr {
   pointer-events: none;
 }
 
-
 .navbar__item {
   padding: 8px;
   border-radius: 8px;
@@ -568,14 +571,14 @@ hr {
   border-color: var(--primary-font-color);
   border-style: solid;
   border-width: 0 0 1.5px 1.5px;
-  content: '';
+  content: "";
   height: 0.4em;
   width: 0.4em;
   display: inline-block;
   margin-left: 8px;
   position: relative;
   top: 50%;
-  transform: translateY(-50%)  rotate(-45deg);
+  transform: translateY(-50%) rotate(-45deg);
   min-width: unset;
   background: transparent;
   filter: unset;
@@ -593,7 +596,10 @@ hr {
 }
 
 .navbar__item.dropdown .dropdown__menu {
-  box-shadow: 0px 18px 42px 0px #172B4D14, 0px 4px 26px 0px #172B4D0D, 0px 0px 46px 0px #172B4D03;
+  box-shadow:
+    0px 18px 42px 0px #172b4d14,
+    0px 4px 26px 0px #172b4d0d,
+    0px 0px 46px 0px #172b4d03;
   padding: 24px;
   margin-top: 32px;
   display: grid;
@@ -628,11 +634,13 @@ hr {
   align-items: center;
 }
 
-.navbar__item.dropdown .dropdown__menu .dropdown__link > span.dropdown__table, span.dropdown__table {
+.navbar__item.dropdown .dropdown__menu .dropdown__link > span.dropdown__table,
+span.dropdown__table {
   display: inline-flex;
   flex-direction: column;
 }
-.navbar__item.dropdown .dropdown__menu .dropdown__link > span.dropdown__table > span, span.dropdown__table > span {
+.navbar__item.dropdown .dropdown__menu .dropdown__link > span.dropdown__table > span,
+span.dropdown__table > span {
   color: var(--tertiary-font-color);
   /* TEXT/Body */
   font-family: Inter;
@@ -642,7 +650,8 @@ hr {
   line-height: 140%; /* 22.4px */
 }
 
-.navbar__item.dropdown .dropdown__menu .dropdown__link > .dropdown__icon, .dropdown__icon {
+.navbar__item.dropdown .dropdown__menu .dropdown__link > .dropdown__icon,
+.dropdown__icon {
   width: 48px;
   height: 48px;
   display: flex;
@@ -657,7 +666,8 @@ hr {
   gap: 8px;
   margin-left: auto;
 }
-.dropdown__link--active, .dropdown__link--active:hover {
+.dropdown__link--active,
+.dropdown__link--active:hover {
   color: var(--primary-font-color);
 }
 
@@ -762,12 +772,14 @@ hr {
   .menu__link--sublist-caret:after {
     transform: rotate(135deg);
   }
-  .navbar-sidebar__items:not(.navbar-sidebar__items--show-secondary) .menu__link--active, .navbar-sidebar__items:not(.navbar-sidebar__items--show-secondary) .menu__link:hover {
+  .navbar-sidebar__items:not(.navbar-sidebar__items--show-secondary) .menu__link--active,
+  .navbar-sidebar__items:not(.navbar-sidebar__items--show-secondary) .menu__link:hover {
     background: var(--surface-brand-grey);
-
   }
 
-  .navbar-sidebar__items:not(.navbar-sidebar__items--show-secondary) .menu__list > li:not(:last-child){
+  .navbar-sidebar__items:not(.navbar-sidebar__items--show-secondary)
+    .menu__list
+    > li:not(:last-child) {
     margin-bottom: 8px;
   }
 }
@@ -788,7 +800,6 @@ hr {
   cursor: pointer;
 }
 
-
 .logo-link:hover {
   transform: translateY(-2px);
   color: var(--main-font-color);
@@ -803,7 +814,7 @@ hr {
     transform: translateY(-50%);
   }
   .logo-link::before {
-    content: "/"
+    content: "/";
   }
   .logo-link:hover {
     transform: translateY(-60%);
@@ -812,7 +823,6 @@ hr {
   .navbar__items--midle {
     height: fit-content;
   }
-  
 }
 
 .navbar__logo {
@@ -1182,7 +1192,11 @@ body:has(.navbar-sidebar--show) > div:first-of-type {
 .mantine-Stack-root {
   gap: 0;
 }
-.beta-badge, .feature-badge, .new-badge, .preview-badge, .early-access-badge {
+.beta-badge,
+.feature-badge,
+.new-badge,
+.preview-badge,
+.early-access-badge {
   position: relative;
 }
 .beta-badge::after {
@@ -1377,7 +1391,7 @@ body:has(.navbar-sidebar--show) > div:first-of-type {
 }
 
 .markdown > header {
-  margin-bottom: calc(var(--ifm-h1-vertical-rhythm-bottom)* var(--ifm-leading));
+  margin-bottom: calc(var(--ifm-h1-vertical-rhythm-bottom) * var(--ifm-leading));
 }
 
 .tech-select__single-value a {
@@ -1575,7 +1589,7 @@ article h6 {
 }
 
 .language-terminal code > .token-line {
-  padding: 0 0 0 calc(var(--ifm-pre-padding) * 2) !important
+  padding: 0 0 0 calc(var(--ifm-pre-padding) * 2) !important;
 }
 
 code {
@@ -1612,7 +1626,7 @@ pre > code {
 }
 
 @media (max-width: 996px) {
-  .menu__link.indigo, 
+  .menu__link.indigo,
   .menu__link.teal {
     gap: 16px;
   }
@@ -1830,9 +1844,14 @@ kbd.DocSearch-Commands-Key {
 }
 
 /* Make category labels with normal weight class have normal font weight and size */
-.theme-doc-sidebar-item-category.sidebar-item-normal-weight > .menu__list-item-collapsible > .menu__link,
-.theme-doc-sidebar-item-category .sidebar-item-normal-weight > .menu__list-item-collapsible > .menu__link {
+.theme-doc-sidebar-item-category.sidebar-item-normal-weight
+  > .menu__list-item-collapsible
+  > .menu__link,
+.theme-doc-sidebar-item-category
+  .sidebar-item-normal-weight
+  > .menu__list-item-collapsible
+  > .menu__link {
   font-weight: normal !important;
   font-size: 14px !important;
   line-height: 1.25 !important;
-}
+}