docs: improve organization of the security "cheat sheet" table

IntelliTect · Dec 19, 2023 · 9380bdb · 9380bdb
1 parent e298ffa
commit 9380bdb
Show file tree

Hide file tree

Showing 5 changed files with 326 additions and 91 deletions.
diff --git a/docs/.vitepress/theme/style.scss b/docs/.vitepress/theme/style.scss
@@ -210,4 +210,17 @@ td:has(> div[class*=language-]:only-child:not(.line-numbers-mode)) {
 }
 html:not(.dark) .dark-only {
   display: none !important;
+}
+
+// Improve information density in tables, e.g. on the security overview page.
+table td {
+  li, ul {
+    margin: 0px !important
+  }
+  p {
+    margin: 0px !important
+  }
+  > ul {
+    padding-left: 1rem !important;
+  }
 }
diff --git a/docs/stacks/vue/coalesce-vue-vuetify/components/c-display.md b/docs/stacks/vue/coalesce-vue-vuetify/components/c-display.md
@@ -78,5 +78,5 @@ For properties and other values annotated with [DataTypeAttribute], the followin
 * `DataType.EmailAddress`: Renders as a clickable `mailto` link.
 * `DataType.PhoneNumber`: Renders as a clickable `tel` link.
 * `DataType.ImageUrl`: Renders as an `img` element.
-* `"Color"`: Renders a colored dot next to the value, interpreting the field value as a 7-character HTML hex color code..
+* `"Color"`: Renders a colored dot next to the value, interpreting the field value as a 7-character HTML hex color code.
 
diff --git a/docs/stacks/vue/coalesce-vue-vuetify/components/c-select.md b/docs/stacks/vue/coalesce-vue-vuetify/components/c-select.md
@@ -149,7 +149,7 @@ createMethods = {
 
 ## Slots
 
-`#item="{ item, search }"` - Slot used to customize the text of both items inside the list, as well as the text of selected items. By default, items are rendered with [c-display](/stacks/vue/coalesce-vue-vuetify/components/c-display.md). Slot is passed a parameter `item` containing a [model instance](/stacks/vue/layers/models.md), and `search` containing the current search query..
+`#item="{ item, search }"` - Slot used to customize the text of both items inside the list, as well as the text of selected items. By default, items are rendered with [c-display](/stacks/vue/coalesce-vue-vuetify/components/c-display.md). Slot is passed a parameter `item` containing a [model instance](/stacks/vue/layers/models.md), and `search` containing the current search query.
 
 `#list-item="{ item, search }"` - Slot used to customize the text of items inside the list. If not provided, falls back to the `item` slot.
 

diff --git a/docs/stacks/vue/vue2-to-vue3.md b/docs/stacks/vue/vue2-to-vue3.md
@@ -281,7 +281,7 @@ export default class MyComponent extends Vue {
   public checked = false;
 
   public items = [
-    { name: "Foo", checked: false, }
+    { name: "Foo", checked: false, },
     { name: "Bar", checked: true, }
   ]
 }
@@ -303,8 +303,8 @@ const person = new PersonViewModel();
 const checked = ref(false);
 
 const items = reactive([
-  { name: "Foo", checked: false, }
-  { name: "Foo", checked: true, }
+  { name: "Foo", checked: false, },
+  { name: "Bar", checked: true, }
 ])
 </script>
 ```