Fix markdown table rendering in preview mode

[Copilot]

Markdown tables using the minimal |---|---| separator (no spaces) misrender in several preview environments. Switching to | --- | --- | ensures consistent rendering across GitHub and other standard parsers.

Changes

• .github/copilot-instructions.md (new): Adds VS Code Copilot agent configuration docs with the correctly formatted three-column table
• README.md: Updates the Usage table separator from |---|---| → | --- | --- |

Before / After

- | Action | How |- |---|---|+ | Action | How |+ | --- | --- |

Original prompt

The markdown table shown below does not resemble the expected layout in preview mode. Columns are not aligned, and the table appears disorganized, making it hard to read.

Expected Behavior:

The table should render properly with the columns aligned to clearly show the corresponding headers and content.

Actual Behavior:

The table displayed in preview mode has misaligned columns.

Screenshot:

Steps to Reproduce:

1. Add the following markdown content to a file:

| Line | What it means | Why it matters |
|---|---|---|
| `description:` | A label so VS Code knows what this file does | Copilot reads this to understand the agent's role |
| `applyTo: '**'` | Apply this persona to **every file** (`**` = wildcard = all files) | Without this, the reviewer only works on specific files |

2. Preview it using GitHub or any markdown editor with preview mode.
3. Observe that the columns are misaligned or not rendered correctly.

Additional Information:

This impacts the readability of the documentation in the repository, affecting both contributors and reviewers.

The following is the prior conversation context from the user's chat exploration (may be truncated):

User: [problem]: i don't understand where to put an issue in github not sure the pull request is the right place?

[issue found attached as image ] : i.e. tables are not resembling in the preview-mode

Assistant: To address your question about where to put the issue and whether a pull request (PR) is the right place:

1. Issues and what they are for:
   Issues in GitHub are meant to track bugs, enhancements, or questions related to the project. In your case, since you are highlighting a problem with how the tables don't resemble what you expect in preview-mode, it makes sense to create a GitHub issue. Be sure to clearly describe the problem and include the image as a reference. You can also tag the issue appropriately to provide more context (e.g., using labels like bug or documentation if applicable).

2. Pull Requests vs. Issues:

   • A pull request is for submitting changes you have made to the codebase to be reviewed and potentially merged into the main branch.
   • An issue is the correct starting point for reporting possible problems or suggesting improvements. Team members can then decide whether to address the issue via a pull request.

If you'd like, I can help you draft a clear and concise issue for your repository's problem, or guide you through creating it. Let me know!

User: so where to put it

Assistant: To address the issue with the incorrect table formatting in preview mode, you should:

1. Put this in the "Issues" section of your GitHub repository.

   • Navigate to your repository on GitHub: https://github.com/cloakedbyte/draftlocal.
   • Click on the "Issues" tab.
   • Click the green "New issue" button.
   • Give your issue a meaningful title, such as: "Markdown table formatting issue in preview mode."
   • Write a description of the issue, briefly explaining the problem. You can attach the image from your screenshot as a reference to the issue.

   Example issue content:

   **Issue Description:**
   The markdown table shown below does not resemble the expected layout in preview mode. Columns are not aligned, and the table appears disorganized, making it hard to read.
   **Expected Behavior:**
   The table should render properly with the columns aligned to clearly show the corresponding headers and content.
   **Actual Behavior:**
   The table displayed in preview mode has misaligned columns.
   **Screenshot:**
   ![image](screenshot.png) <-- Upload the provided image here.
   **Steps to Reproduce:**
   1. Add the following markdown content to a file:
   

   Line	What it means	Why it matters
   description:	A label so VS Code knows what this file does	Copilot reads this to understand the agent's role
   applyTo: '**'	Apply this persona to every file (** = wildcard = all files)	Without this, the reviewer only works on specific files

   2. Preview it using GitHub or any markdown editor with preview mode.
   3. Observe that the columns are misaligned or not rendered correctly.
   **Additional Information:**
   This impacts the readability of the documentation in the repository, affecting both contributors and reviewers.
   

If you'd like, I can create this issue for you. Let me know!

User: create the above issue in my github repo

Assistant: The issue has been successfully created in your GitHub repository cloakedbyte/draftlocal. You can access it in the "Issues" section of your repository on GitHub. Let me know if there's anything else you'd like to adjust or check!

This pull request was created from Copilot chat.