adam/vscode-front-matter
1
0 Fork 0
mirror of https://github.com/estruyf/vscode-front-matter.git synced 2026-11-03 09:02:19 +01:00
Code Issues 77 Packages Projects Releases Wiki Activity

Enhancement: In data, provide extra space between objects #573

New Issue
Closed
opened 2026-10-05 02:53:49 +02:00 by adam · 5 comments
adam commented 2026-10-05 02:53:49 +02:00
Owner
Copy link
Copy source

When specifying multiple objects within frontMatter.data.files array, it can be difficult to tell the objects apart. I'd treat the object titles either with a different font color and/or font size to help distinguish them apart.

At the very least, please provide extra margin between the objects.

Screenshot 2023-12-05 at 3 04 27 PM
When specifying multiple objects within `frontMatter.data.files` array, it can be difficult to tell the objects apart. I'd treat the object titles either with a different font color and/or font size to help distinguish them apart. At the very least, please provide extra margin between the objects. <img width="1270" alt="Screenshot 2023-12-05 at 3 04 27 PM" src="https://github.com/estruyf/vscode-front-matter/assets/930713/de006e9b-c01d-4d71-b543-ebafcf5b7400"> <!-- github-sync-id:2027052161 -->
adam closed this issue 2026-10-05 02:53:49 +02:00
adam commented 2026-10-05 02:53:50 +02:00
Author
Owner
Copy link
Copy source

Thanks @djmtype, for the suggestion!

Thanks @djmtype, for the suggestion! <!-- github-comment-id:1842768962 -->
adam commented 2026-10-05 02:53:51 +02:00
Author
Owner
Copy link
Copy source

@estruyf Without adding any additional markup, I think you want to target .autoform form > .fields > div > label:first-of-type? Although, I don't know if this will wrongfully impact other use cases.

For example:

/* Adds primary color to each parent object label */

.autoform form > .fields > div > label:first-of-type {
  color: var(--primary-color);
}

/* Adds space and border between nested objects except for the first object */

.autoform form > .fields > div:not(:first-child) > label:first-of-type {
  margin-block-start: 2rem;
  border-block-start: 1px solid;
  padding-block-start: 2rem;
}


<!-- github-comment-id:1843072137 -->
@estruyf Without adding any additional markup, I think you want to target `.autoform form > .fields > div > label:first-of-type`? Although, I don't know if this will wrongfully impact other use cases. For example: ```css /* Adds primary color to each parent object label */ .autoform form > .fields > div > label:first-of-type { color: var(--primary-color); } /* Adds space and border between nested objects except for the first object */ .autoform form > .fields > div:not(:first-child) > label:first-of-type { margin-block-start: 2rem; border-block-start: 1px solid; padding-block-start: 2rem; } <!-- github-comment-id:1843072137 -->
adam commented 2026-10-05 02:53:51 +02:00
Author
Owner
Copy link
Copy source

@djmtype would you be able to provide a sample configuration so that I can reproduce it?

@djmtype would you be able to provide a sample configuration so that I can reproduce it? <!-- github-comment-id:1846842242 -->
adam commented 2026-10-05 02:53:52 +02:00
Author
Owner
Copy link
Copy source
"frontMatter.data.files": [
    {
      "id": "config",
      "title": "Configuration",
      "file": "[[workspace]]/src/data/config.json",
      "fileType": "json",
      "labelField": "name",
      "singleEntry": true,
      "schema": {
        "title": "Configuration",
        "type": "object",
        "properties": {
          "site": {
            "type": "object",
            "title": "Site",
            "required": [
              "title",
              "url",
              "language"
            ],
            "properties": {
              "title": {
                "type": "string",
                "title": "Title"
              },
              "tagline": {
                "type": "string",
                "title": "Tagline"
              },
              "url": {
                "type": "string",
                "title": "URL"
              },
              "description": {
                "type": "string",
                "title": "Description",
                "multiline": true
              },
              "language": {
                "type": "string",
                "title": "Language"
              },
              "country": {
                "type": "string",
                "title": "Country"
              },
              "favicon": {
                "type": "string",
                "title": "Favicon"
              }
            }
          },
          "metadata": {
            "type": "object",
            "title": "Metadata",
            "required": [
              "ogImage",
              "ogImageAlt"
            ],
            "properties": {
              "ogTitle": {
                "type": "string",
                "title": "OpenGraph Title"
              },
              "ogDescription": {
                "type": "string",
                "title": "OpenGraph Description",
                "multiline": true
              },
              "ogImage": {
                "type": "string",
                "title": "OpenGraph Image"
              },
              "ogImageAlt": {
                "type": "string",
                "title": "OpenGraph Image Alt Text"
              }
            }
          },
          "logo": {
            "type": "object",
            "title": "Logo",
            "properties": {
              "image": {
                "type": "string",
                "title": "Image"
              },
              "width": {
                "type": "number",
                "title": "Width"
              },
              "height": {
                "type": "number",
                "title": "Height"
              }
            }
          },

          "blog": {
            "type": "object",
            "title": "Blog",
            "properties": {
              "title": {
                "type": "string",
                "title": "Title"
              },
              "description": {
                "type": "string",
                "title": "Description",
                "multiline": true
              }
            }
          }
        }
      }
    }
]
```json "frontMatter.data.files": [ { "id": "config", "title": "Configuration", "file": "[[workspace]]/src/data/config.json", "fileType": "json", "labelField": "name", "singleEntry": true, "schema": { "title": "Configuration", "type": "object", "properties": { "site": { "type": "object", "title": "Site", "required": [ "title", "url", "language" ], "properties": { "title": { "type": "string", "title": "Title" }, "tagline": { "type": "string", "title": "Tagline" }, "url": { "type": "string", "title": "URL" }, "description": { "type": "string", "title": "Description", "multiline": true }, "language": { "type": "string", "title": "Language" }, "country": { "type": "string", "title": "Country" }, "favicon": { "type": "string", "title": "Favicon" } } }, "metadata": { "type": "object", "title": "Metadata", "required": [ "ogImage", "ogImageAlt" ], "properties": { "ogTitle": { "type": "string", "title": "OpenGraph Title" }, "ogDescription": { "type": "string", "title": "OpenGraph Description", "multiline": true }, "ogImage": { "type": "string", "title": "OpenGraph Image" }, "ogImageAlt": { "type": "string", "title": "OpenGraph Image Alt Text" } } }, "logo": { "type": "object", "title": "Logo", "properties": { "image": { "type": "string", "title": "Image" }, "width": { "type": "number", "title": "Width" }, "height": { "type": "number", "title": "Height" } } }, "blog": { "type": "object", "title": "Blog", "properties": { "title": { "type": "string", "title": "Title" }, "description": { "type": "string", "title": "Description", "multiline": true } } } } } } ] ``` <!-- github-comment-id:1847308331 -->
adam commented 2026-10-05 02:53:53 +02:00
Author
Owner
Copy link
Copy source

Thanks @djmtype, I have included your fix into the 9.4.0 which should go out later today.

Thanks @djmtype, I have included your fix into the 9.4.0 which should go out later today. <!-- github-comment-id:1851525485 -->
Sign in to join this conversation.
No Branch/Tag Specified
Labels
No items
No labels
Milestone
No items
No Milestone
Projects
Clear projects
No projects
Assignees
Clear assignees
adam (Adam Wojcieszonek)
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: adam/vscode-front-matter#573