cy.prompt docs (#6270)

* docs: begin writing cy.prompt docs

* Iterate on wording

* lint

* Fix links + improve TOC

* Fix some css warnings

* update dynamic variable examples

* lint fix

* update areas based on feedback

* lint

* Add more examples to prompt docs

* lint fix

* Add Gherkin examples

* lint fix

* Add another Gherkin example

* lint fix

* update some styles to make more space in UI

* Update yields of prompt

* Update language support

* Remove trigger from officially supported 'things to do'

* lint

* Add not.exist assertions not being supported

* expand documented assertion types

* Updates for placeholders

* update docs

* add to TOC

* fix loop example.

* Update docs/api/commands/prompt.mdx

Co-authored-by: Mike McCready <[email protected]>

* Update docs/api/commands/prompt.mdx

Co-authored-by: Mike McCready <[email protected]>

* Some wording updates

* Update docs/api/commands/prompt.mdx

Co-authored-by: Mike McCready <[email protected]>

* lint

* fix broken links

---------

Co-authored-by: Mike McCready <[email protected]>

Author: jennifer-shehane

docs/api/commands/prompt.mdx

@@ -140,6 +140,7 @@ Cypress has a variety of additional commands to help write tests.
 | [`.origin()`](/api/commands/origin)                                 | Visit multiple domains of different origin in a single test.                                                                                                                    |
 | [`.pause()`](/api/commands/pause)                                   | Pause test execution, allowing interaction with the application under test before resuming.                                                                                     |
 | [`.press()`](/api/commands/press)                                   | Trigger native key events in your application to simulate real user keyboard interactions.                                                                                      |
+| [`.prompt()`](/api/commands/prompt)                                 | Use natural language to generate Cypress tests with AI.                                                                                                                         |
 | [`.readFile()`](/api/commands/readfile)                             | Read a file from disk.                                                                                                                                                          |
 | [`.reload()`](/api/commands/reload)                                 | Reload the page.                                                                                                                                                                |
 | [`.request()`](/api/commands/request)                               | Make an HTTP request.                                                                                                                                                           |

docs/api/table-of-contents.mdx

@@ -1,10 +1,10 @@
 .docsImage {
-  margin-bottom: 1rem;
+  margin-bottom: 2rem;
   box-shadow: 0 2px 10px 1px rgba(0, 0, 0, 0.26);
 }
 
 .noBorder {
-  margin-bottom: 1rem;
+  margin-bottom: 2rem;
   box-shadow: none;
 }
 

src/components/docs-image/style.module.css

@@ -1,5 +1,5 @@
 .docsVideo {
-  margin-bottom: 1.4rem;
+  margin-bottom: 2rem;
 }
 
 .docsVideo video {

src/components/video-local/style.module.css

@@ -122,7 +122,8 @@
   --ifm-heading-font-family: Poppins;
   --ifm-heading-font-weight: var(--ifm-font-weight-bold);
   --ifm-line-height-base: 1.6;
-  --ifm-heading-color: theme(colors.gray.1000) --ifm-code-font-size: 95%;
+  --ifm-heading-color: theme(colors.gray.1000);
+  --ifm-code-font-size: 95%;
   --ifm-pre-line-height: 1.5em;
 
   --ifm-code-background-color: #282a36;
@@ -293,6 +294,18 @@ html[data-theme='dark'] {
   }
 }
 
+.alert.alert--secondary {
+  background-color: var(--ifm-color-indigo-50);
+  color: var(--ifm-color-indigo-1000);
+  --ifm-alert-border-color: var(--ifm-color-indigo-400);
+
+  [data-theme='dark'] & {
+    background-color: var(--ifm-color-indigo-1000);
+    color: var(--ifm-color-indigo-50);
+    --ifm-alert-border-color: var(--ifm-color-indigo-800);
+  }
+}
+
 div[class^='announcementBar'] {
   font-size: 1rem;
   font-weight: var(--ifm-font-weight-semibold);

src/css/custom.scss

@@ -6,7 +6,7 @@
   overflow: hidden;
   max-width: 100%;
   height: auto;
-  margin-bottom: 1rem;
+  margin-bottom: 2rem;
   box-shadow: 0 0 3px rgb(0 0 0 / 30%);
   border: 1px solid var(--ifm-toc-border-color);
 }

src/css/embeds.scss

@@ -73,7 +73,7 @@ div.markdown {
     &.border-indigo-500 {
       html[data-theme='dark'] & {
           color: var(--ifm-color-jade-100);
-          border-color:var(--ifm-color-jade-100);
+          border-color: var(--ifm-color-jade-100);
       }
     }
 
@@ -102,6 +102,10 @@ div.markdown {
     }
   }
 
+  .alert {
+    margin-bottom: 2rem;
+  }
+
   .alert,
   & {
     // add border bottom to code tags that are in a link

src/css/markdown.scss

@@ -32,10 +32,11 @@
 
 .table-of-contents .table-of-contents__link--active {
   @apply text-indigo-500;
+  font-weight: 700;
+  
   html[data-theme='dark'] & {
     @apply text-indigo-300;
   }
-  font-weight: 700;
 }
 
 .table-of-contents__left-border {